<template>
  <div >
        <div >
          <el-input
            v-model="listQuery.search"
            placeholder="输入名称进行搜索"
            style="width: 200px;"
            class="filter-item"
            @keyup.enter.native="handleFilter"
          />
                <el-button
        class="filter-item"
        type="primary"
        icon="el-icon-refresh-left"
        @click="resetFilter"
      >刷新重置</el-button>
        </div>
        <el-table
          :data="tableData.results"
          style="width: 100%;margin-top:10px;"
          border
          fit
          v-loading="listLoading"
          highlight-current-row
          max-height="600"
          row-key="id"
          default-expand-all
          :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
          @row-dblclick="handleChose2"
        >
          <el-table-column type="index" width="100" :index="indexMethod"></el-table-column>
          <el-table-column label="单位名称">
            <template slot-scope="scope">{{ scope.row.name }}</template>
          </el-table-column>
          <el-table-column label="所在地区">
        <template slot-scope="scope" v-if="scope.row.geo">
          <span v-if="scope.row.geo.pname">{{ scope.row.geo.pname }}</span>
          <span v-if="scope.row.geo.cityname"
            >/{{ scope.row.geo.cityname }}</span
          >
          <span v-if="scope.row.geo.adname">/{{ scope.row.geo.adname }}</span>
        </template>
      </el-table-column>
          <el-table-column align="center" label="操作">
            <template slot-scope="scope">
              <el-button
                type="primary"
                size="small"
                @click="handleChose(scope)"
              >选择</el-button>
            </template>
          </el-table-column>
        </el-table>
    <pagination
      v-show="tableData.count>0"
      :total="tableData.count"
      :page.sync="listQuery.page"
      :limit.sync="listQuery.limit"
      @pagination="getList"
    />
    <el-dialog :visible.sync="dialogVisible" :title="dialogType==='edit'?'编辑单位':'新增单位'" >
      <el-form :model="company" label-width="80px" label-position="right" :rules="rule1" ref="companyForm">
        <el-form-item label="名称" prop="name">
          <el-input v-model="company.name" placeholder="名称" />
        </el-form-item>
      </el-form>
      <div style="text-align:right;">
        <el-button type="danger" @click="dialogVisible=false">取消</el-button>
        <el-button type="primary" @click="confirmCompany('companyForm')">确认</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getCompanyList, createCompany, deleteCompany, updateCompany } from "@/api/crm";
import { deepClone } from "@/utils";
import checkPermission from "@/utils/permission";
import Pagination from "@/components/Pagination"



const defaultCompany = {
        id: "",
        name: "",
      };
const listQuery = {
  page: 1,
  limit: 10,
  search: "",
  perm:'all'
}
export default {
    name:'Companychoose',
  components: { Pagination },
  data() {
    return {
      company: {
        id: "",
        name: "",
      },
      listQuery:listQuery,
      tableData: {count:0},
      listLoading: true,
      dialogVisible: false,
      dialogType: "new",
      rule1: {
        name: [{ required: true, message: "请输入名称", trigger: "blur" }],
        // pid: [{ required: true, message: "请选择上级", trigger: "change" }]
        // password: [
        //   { required: true, message: "请输入密码", trigger: "change" }
        // ],
      },
    };
  },
  computed: {},
  created() {
    this.getList();
  },
  methods: {
    checkPermission,
    getList() {
      this.listLoading = true
      getCompanyList(this.listQuery).then(response => {
        this.tableData = response.data
        this.listLoading = false
      });
    },
    resetFilter() {
      this.listQuery = {
        page: 1,
        limit: 10,
        search: "",
        perm:'all'
      };
      this.getList();
    },
    handleFilter() {
      this.listQuery.page = 1;
      this.getList();
    },
    handleChose(scope) {
      this.$emit('handleChose',scope.row);
    },
    handleChose2(row, column, event){
      this.$emit('handleChose',row);
    },
    indexMethod(index) {
      return (this.listQuery.page-1)*this.listQuery.limit + index + 1;
    }
  }
};

</script>
