﻿﻿﻿﻿﻿﻿﻿﻿<template>
  <a-modal title="添加督查对象" :open="dialogFormVisible" @ok="saveChange" @cancel="() => { dialogFormVisible = false, type = undefined }" width="80%">
    <a-layout>
      <a-layout-sider width="200px" style="border:1px solid #d5d5ff; background: #fff;">
        <p style="font-weight:bolder;background-color:#d5d5ff;padding:3px;margin: 0;">
          <a-icon type="share-alt" />所属机构
        </p>
        <provTreeListCounty @provTreeSelectChange="provTreeSelectChange" style="max-height:485px;"></provTreeListCounty>
      </a-layout-sider>
      <a-layout-content style="border:1px solid #d5d5ff;margin-left:5px;padding:0px;">
        <p style="font-weight:bolder;background-color:#d5d5ff;padding:3px;margin: 0;">督查对象</p>
        <div style="padding:10px">
          <a-form layout="inline">
            <a-form-item label="名称">
              <a-input v-model:value="searchNameOfSzName" placeholder="请输入名称" allow-clear />
            </a-form-item>
            <a-form-item label="督查类别">
              <a-select v-model:value="type" placeholder="督查类别" allow-clear style="width: 150px">
                <a-select-option v-for="item in commonType" :key="item.dictTypeNum" :value="item.dictTypeNum">{{ item.nm }}</a-select-option>
              </a-select>
            </a-form-item>
            <a-form-item>
              <a-button type="primary" @click="searchData">查询</a-button>
            </a-form-item>
          </a-form>
          <a-table
            :row-selection="{
              selectedRowKeys: selectedRowKeys,
              onChange: handleSelectionChange
            }"
            :columns="columns"
            :data-source="currentShowList"
            @change="handleCurrentChange"
            :loading="loading"
            rowKey="index"
            :pagination="{
              current: pageIndex,
              total,
              defaultPageSize: pageSize,
              showTotal: (total) => `共${total}条`,
            }"
            style="width: 100%;"
          >
            <span slot="prjType" slot-scope="" style="display: flex; align-items: center; justify-content: center;">
              <img src="../../assets/images/choucha.png" style="width: 25px;height:20px;float: left;" />
            </span>
          </a-table>
        </div>
      </a-layout-content>
    </a-layout>
  </a-modal>
</template>

<script>
import { h } from 'vue';
import request from '@/utils/gw_ajax_request';
import provTreeListCounty from '@/widgets/provTreeList_county.vue';
export default {
  props: ['dczId'],
  data() {
    return {
      dialogFormVisible: false,
      type: undefined,
      commonType: [],
      searchNameOfSzName: '',
      searchProvTreeListCode: '', // 选中树节点的adCode
      pageIndex: 1,
      pageSize: 10,
      total: 0,
      currentShowList: [],
      columns: [
        {
          title: '序号',
          dataIndex: 'index',
          align: 'center',
          ellipsis: true,
        },
        {
          title: '对象名称',
          dataIndex: 'nm',
          align: 'center',
          ellipsis: true,
        },
        {
          title: '行政区划',
          dataIndex: 'adName',
          align: 'center',
          ellipsis: true,
        },
        {
          title: '督查类别',
          dataIndex: 'type',
          align: 'center',
          ellipsis: true,
        },
        {
          title: '督查分类',
          dataIndex: 'prjType',
          align: 'center',
          ellipsis: true,
        },
        {
          title: '位置',
          dataIndex: 'loc',
          align: 'center',
          ellipsis: true,
        },
      ],
      selectedRowKeys: [],
      multipleSelection: [],
      loading: false,
    };
  },
  components: {
    provTreeListCounty,
  },
  created() {
    this.getCommonDict();
  },
  computed: {
    userId: () =>
      localStorage.getItem('persId')
        ? localStorage.getItem('persId')
        : '1098101939614724096',
  },
  methods: {
    getCommonDict() {
      const params = {
        type: 'province',
        displayStat: '0',
      };
      request
        .post('/bis/insp/BisInspProblemRelation/getCountyDcList', params)
        .then((res) => {
          if (res.success) {
            this.commonType = res.data;
            this.columns.forEach((item) => {
              if (item.title == '督查类别') {
                item.customRender = (value, row, index) => {
                  let name = '';
                  this.commonType.forEach((item) => {
                    if (item.dictTypeNum == row.type) {
                      name = item.nm;
                    }
                  });
                  return h('span', null, name);
                };
              }
            });
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((err) => {
          this.$message.error('请求错误' + err.message);
        });
    },
    provTreeSelectChange(params) {
      this.searchProvTreeListCode = params.code;
      this.getTableData();
    },
    saveChange() {
      this.selectedRowKeys = [];
      this.addObjectChange();
    },
    showDialog() {
      this.dialogFormVisible = true;
      this.getTableData();
    },
    getTableData() {
      this.loading = true;
      const params = {
        inspGroupId: this.dczId,
        adCode: this.searchProvTreeListCode,
        objType: this.type,
        ownerOfc: 'province',
        nm: this.searchNameOfSzName,
        pageNum: this.pageIndex,
        pageSize: this.pageSize,
      };
      request
        .post('/att/gnrl/base/getCountyQueryPageList', params)
        .then((res) => {
          if (res.success) {
            this.loading = false;
            this.currentShowList = res.data.list;
            this.currentShowList.forEach((element, index) => {
              element['index'] =
                this.pageSize * (this.pageIndex - 1) + index + 1;
            });
            this.total = res.data.total;
          } else {
            this.$message.error(res.message);
          }
        });
    },
    handleSelectionChange(val, row) {
      this.selectedRowKeys = val;
      this.multipleSelection = row;
    },
    handleCurrentChange(val) {
      this.pageIndex = val.current;
      this.getTableData();
    },
    searchData() {
      this.pageIndex = 1;
      this.getTableData();
    },
    addObjectChange() {
      var objArr = [];
      const length = this.multipleSelection.length;
      for (let i = 0; i < length; i++) {
        var obj = {};
        obj['code'] = this.multipleSelection[i].code;
        obj['name'] = this.multipleSelection[i].nm;
        obj['objId'] = this.multipleSelection[i].objId;
        obj['ptype'] = '111';
        obj['type'] = this.multipleSelection[i].type;
        obj['ownerOfc'] = this.multipleSelection[i].prjType;
        obj['objAdCode'] = this.multipleSelection[i].adCode;
        objArr.push(obj);
      }
      request
        .post('/supervision/plan/insertSupervisionObj', {
          persid: this.userId,
          nm: '',
          id: this.dczId,
          persAllAreaDtoList: [],
          persAllDtoList: [],
          persAllObjDtoList: objArr,
        })
        .then((response) => {
          if (response.success == true) {
            this.dialogFormVisible = false;
            this.$message.success('添加成功');
            this.$emit('addSuccess');
          }
        });
    },
  },
  watch: {
    dczId: function (n, o) {
      this.searchProvTreeListCode = '';
    },
  },
};
</script>

<style lang='less' scoped>
:deep(.ant-table-pagination) {
  float: left;
}
:deep(.ant-table-thead > tr > th),
:deep(.ant-table-tbody > tr > td) {
  padding: 0;
  height: 36px;
}
:deep(form .ant-select) {
  width: 28%;
}
:deep(.ant-form-item) {
  margin-bottom: 10px;
}
</style>
