From 3cc4abeb92d11d7a8b365928c5aa9452679fe06c Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: 星期一, 19 八月 2024 09:04:50 +0800
Subject: [PATCH] 责任人增加筛选条件

---
 src/views/Admin/contactBook/contactors.vue |  282 ++++++++++++++++++++++++++++++++++++++++++++++++++------
 1 files changed, 250 insertions(+), 32 deletions(-)

diff --git a/src/views/Admin/contactBook/contactors.vue b/src/views/Admin/contactBook/contactors.vue
index 9dc8b3c..c01d159 100644
--- a/src/views/Admin/contactBook/contactors.vue
+++ b/src/views/Admin/contactBook/contactors.vue
@@ -23,18 +23,29 @@
             <a-button type="danger" @click="deliverTask" v-if="!unittype || unittype == 1">下发更新任务</a-button>
           </div>
         </div>
-        <div style="margin: 20px 0">
-          <a-button  type="primary" style="margin-right: 10px" @click="editData('add',{})">新增</a-button>
-          <a-button  type="primary" @click="massImport()">批量导入</a-button>
+        <div style="margin: 20px 0;display: flex;justify-content: space-between">
+          <div style="display: flex;align-items: center">
+            <a-button  type="primary" style="margin-right: 10px" @click="editData('add',{})">新增</a-button>
+            <a-button  type="primary" @click="massImport()">批量导入</a-button>
+          </div>
+          <a-button type="primary" @click="openExport">批量导出</a-button>
         </div>
+        <div style="display: flex;align-items: center;margin-bottom: 15px">
+          <a-input v-model="search.searchParams.name" placeholder="请输入姓名" style="width: 250px;margin-right: 10px"></a-input>
+          <a-input v-model="search.searchParams.phone" placeholder="请输入电话" style="width: 250px;margin-right: 10px"></a-input>
+          <a-input v-model="search.searchParams.company" placeholder="请输入单位" style="width: 250px;margin-right: 10px"></a-input>
+          <a-button  type="primary" style="margin-right: 10px" @click="getUserList()">查询</a-button>
+          <a-button   @click="resetSearch()">重置</a-button>
+        </div>
+
         <div class="table-cont">
-          <a-table :columns="columns" :data-source="tableData" :pagination="pagination" :rowKey="record=>record.id" bordered>
+          <a-table :columns="columns" :data-source="tableData" :pagination="pagination" :rowKey="record=>record.id.toString()" bordered>
             <template #index="text,record,index">
               {{ index + 1 }}
             </template>
-            <template #orgName="text,record,index">
-              {{currentKey.length>0?currentKey[0].split('-')[1]: ''}}
-            </template>
+<!--            <template #orgStructureName="text,record,index">-->
+<!--              {{currentKey.length>0?currentKey[0].split('-')[1]: ''}}-->
+<!--            </template>-->
             <template #orgUserTypes="text,record,index">
               {{record.orgUserTypes?record.orgUserTypes.map(i=>i.typeName + '(' + i.orgUserTags.map(j=>j.tagName).join('/') +')').join(','): ''}}
             </template>
@@ -53,6 +64,45 @@
       </a-col>
       <contactors-mod ref="contactMod" @refresh="getUserList()"></contactors-mod>
     </a-row>
+    <a-modal v-model="visible" title="导入通讯录" ok-text="导入通讯录" :confirmLoading="uploadLoading" cancel-text="取消" @ok="uploadFile" centered :afterClose="clearMod">
+      <a-form-model ref="ruleForm" :label-col="labelCol" :wrapper-col="wrapperCol" :colon="false">
+        <a-form-model-item label="通讯录表格模板" extra="导入通讯录须依据此模板">
+          <a-button type="primary" @click="downloadFile">下载模板</a-button>
+        </a-form-model-item>
+        <a-form-model-item label="通讯录表格文件">
+          <a-upload :file-list="fileList" :remove="handleRemove" :before-upload="beforeUpload" accept=".xlsx,.xls">
+            <a-button> <a-icon type="upload"/> 点击上传 </a-button>
+          </a-upload>
+        </a-form-model-item>
+      </a-form-model>
+    </a-modal>
+    <a-modal v-model="exportDialog" title="导出通讯录" :footer="null" centered :afterClose="closeDialog">
+      <a-form-model ref="ruleForm" :label-col="labelCol" :wrapper-col="wrapperCol" :colon="false">
+        <a-form-model-item label="行政区划" >
+          <a-tree-select
+              v-model="exportAreaId"
+              style="width: 100%"
+              :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+              :tree-data="treeData"
+              placeholder="请选择行政区划"
+              :replaceFields="replaceFields"
+              @change="changeArea"
+          />
+        </a-form-model-item>
+        <div v-if=" json_data.length>0">
+          <download-excel :data="json_data" :fields="json_fields" name="责任人导出.xlsx" style="display: flex;justify-content: flex-end">
+            <a-button type="primary">批量导出</a-button>
+          </download-excel>
+        </div>
+        <div v-else style="text-align: center;color: salmon">暂无人员导出</div>
+
+      </a-form-model>
+    </a-modal>
+    <a-modal v-model="importDialog" title="导入失败列表" :footer="null" centered :afterClose="closeImportDialog">
+      <span style="margin-bottom: 20px;font-size: 16px">{{errorMsg}}</span>
+      <a-table :columns="errColumns" :data-source="errorData"  :rowKey="record=>record.id" bordered :pagination="false" :scroll="{y:'200px'}">
+      </a-table>
+    </a-modal>
   </div>
 </template>
 
@@ -68,7 +118,9 @@
 } from "@/api/contactBook";
 import subMenu from "@/views/Admin/contactBook/subMenu";
 import contactorsMod from "@/views/Admin/components/contactorsMod"
-
+import {getExportData, importUser} from "@/api/user";
+import importNew from "@/assets/importNew.xlsx";
+import JSONBig from 'json-bigint'
 export default {
   name: 'sameLevel',
   components: {
@@ -77,17 +129,25 @@
   },
   data () {
     return {
+      visible: false,
+      uploadLoading: false,
+      fileList: [],
+      labelCol: { span: 8 },
+      wrapperCol: { span: 14 },
+      importNew,
       openKeys: [],
       areaVal: [],
       unittype: null,
       districtId: null,
       currentKey: [],
+      importDialog:false,
       search:{
         pageIndex: 1,
         pageSize: 10,
         searchParams: {
           name: '',
           phone: '',
+          company: '',
           orgStructureId: null
         }
       },
@@ -107,10 +167,8 @@
         },
         {
           title: '所属组织架构',
-          dataIndex: 'orgName',
-          scopedSlots: {
-            customRender: 'orgName'
-          }
+          dataIndex: 'orgStructureName',
+          key: 'orgStructureName'
         },
         {
           title: '所属单位',
@@ -159,21 +217,75 @@
         onChange: ( page, pageSize ) => this.onPageChange(page,pageSize),
         showTotal: total => `共 ${total} 条`
       },
+      paginationErr: {
+        current: 1,
+        defaultCurrent: 1,
+        defaultPageSize: 10,
+        total: 0,
+        onChange: ( page, pageSize ) => this.onPageChangeErr(page,pageSize),
+        showTotal: total => `共 ${total} 条`
+      },
       fieldNames:{
         label: 'name',
         value: 'id',
         children: 'children'
       },
-      currentId: null
+      currentId: null,
+      exportDialog: false,
+      areaId: null,
+      areaData: [],
+      exportAreaId: null,
+      replaceFields: {
+        children:'children',
+        title:'name',
+        key:'id',
+        value: 'code'
+      },
+      json_fields: {
+        'ID': {
+          field: 'id',
+          callback: value => {
+            return '&nbsp;'+value
+          }
+        },
+        '姓名': 'name',
+        '所属当前级别行政区划': 'districtName',
+        '区划编号': 'districtCode',
+        '组织架构': 'orgStructureName',
+        '单位': 'company',
+        '职务': 'post',
+        '电话号码': 'phone',
+        '责任类型': {
+          field: 'orgUserTypes',
+          callback: (value) => {
+            return value?value.map(i=>i.typeName + '(' + i.orgUserTags.map(j=>j.tagName).join('/') +')').join(','): ''
+          }
+        },
+      },
+      json_data: [],
+      errorData: [],
+      errorMsg: '',
+      errColumns:[
+        {
+          title: '姓名',
+          dataIndex: 'name',
+          key: 'name'
+        },
+        {
+          title: '失败原因',
+          dataIndex: 'errorMsg',
+          key: 'errorMsg'
+        },
+      ],
     }
   },
   created() {
     const t = this
     t.unittype = getUserInfo().unittype
     t.districtId = getUserInfo().districtId
+    t.getStructure()
     t.getUserList()
     t.getUpdataData()
-    t.getStructure()
   },
   mounted() {
 
@@ -184,24 +296,104 @@
     }
   },
   methods:{
+    downloadFile(){
+      const link = document.createElement('a')
+      link.href = importNew
+      link.target = '_blank'
+      link.download = '通讯录导入模板.xlsx'
+      link.click()
+    },
+
+    handleRemove(file) {
+      const index = this.fileList.indexOf(file)
+      const newFileList = this.fileList.slice()
+      newFileList.splice(index, 1)
+      this.fileList = newFileList;
+    },
+    beforeUpload(file) {
+      this.fileList = [...this.fileList, file]
+      this.fileList = this.fileList.slice(-1)
+      return false;
+    },
+
+    async uploadFile(){
+      if(!this.currentId || !this.search.searchParams.orgStructureId){
+        this.$message.warning('请先在页面左侧单位架构处选择需要导入人员的单位')
+        return
+      }
+      if(this.fileList.length == 0){
+        this.$message.warning('请先上传通讯录表格');
+        return
+      }else{
+        this.uploadLoading = true
+        const { fileList } = this;
+        const formData = new FormData();
+        fileList.forEach((file) => {
+          formData.append('file', file)
+        })
+        formData.append('districtId', this.currentId)
+        formData.append('orgStructureId', this.search.searchParams.orgStructureId)
+        const res = await importUser(formData)
+        if(res.data.code == 100){
+          this.$message.success(res.data.msg,2);
+          this.fileList = []
+          this.uploadLoading = false
+          this.visible = false
+          await this.getUserList()
+          if(res.data.data && res.data.data.length>0){
+            this.errorMsg = res.data.msg
+            this.errorData = res.data.data
+            this.importDialog = true;
+          }
+        }else{
+          this.$message.warning(res.data.msg);
+          this.uploadLoading = false
+        }
+      }
+    },
+    clearMod(){
+      this.fileList = []
+    },
+    closeDialog(){
+      this.exportAreaId = null;
+      this.json_data = [];
+      this.exportDialog = false;
+    },
+    closeImportDialog(){
+      this.errorMsg = '';
+      this.errorData = [];
+      this.importDialog = false;
+    },
     async getStructure(){
       const t = this
       const res = await getStructure()
       if(res.data.code == 100){
-        t.treeData = res.data.data
-        const firstItem = this.firstIdWithOrgStructures(res.data.data[0])
-        if(firstItem){
-          t.openKeys =  [firstItem.id +'-'+  firstItem.name]
-          t.currentId = firstItem.id
-          t.currentKey = [firstItem.orgStructures[0].id +'-'+  firstItem.orgStructures[0].orgName]
-        }else{
-          t.$message.warning('暂无可操作的单位,请先进入“组织架构维护页面”新建相应的本级单位')
-        }
+        t.treeData = t.filterBranches(res.data.data,['自治区直辖县级行政区划'])
+        // const firstItem = this.firstIdWithOrgStructures(res.data.data[0])
+        // if(firstItem){
+        //   t.openKeys =  [firstItem.id +'-'+  firstItem.name]
+        //   t.currentId = firstItem.id
+        //   t.currentKey = [firstItem.orgStructures[0].id +'-'+  firstItem.orgStructures[0].orgName]
+        // }else{
+        //   t.$message.warning('暂无可操作的单位,请先进入“组织架构维护页面”新建相应的本级单位')
+        // }
       }else{
         t.$message.warning(res.data.msg)
       }
     },
 
+
+    filterBranches(branches, targetNames) {
+      return branches.filter(branch => {
+        if (targetNames.includes(branch.name)) {
+          return false; // 过滤掉当前分支
+        }
+        if (branch.children && branch.children.length > 0) {
+          branch.children = this.filterBranches(branch.children, targetNames);
+        }
+        return true; // 保留当前分支
+      });
+    },
 
     firstIdWithOrgStructures(node) {
       if (node.orgStructures && node.orgStructures.length > 0) {
@@ -229,9 +421,11 @@
       }
     },
 
+    openExport() {
+      this.exportDialog = true
+    },
 
     handleClick(e) {
-      console.log(e)
       this.currentId = e.keyPath[1]?e.keyPath[1].split('-')[0]:e.keyPath[0].split('-')[0]
       this.search = {
         pageIndex: 1,
@@ -239,6 +433,7 @@
         searchParams: {
           name: '',
           phone: '',
+          company: '',
           orgStructureId: null
         }
       }
@@ -261,7 +456,7 @@
     },
 
     massImport(){
-      this.$message.warning('批量导入请联系管理人员')
+      this.visible = true
     },
 
     resetSearch(){
@@ -270,20 +465,31 @@
       t.search = {
         pageIndex: 1,
         pageSize: 10,
+        searchParams: {
+          name: '',
+          phone: '',
+          company: '',
+          orgStructureId: t.search.searchParams.orgStructureId
+        }
       }
       t.getUserList()
     },
 
     editData(type,data){
       const t = this
-      if(type == 'add' && (!t.currentId || !t.currentKey)){
-        t.$message.warning('暂无可操作的单位,请先进入“组织架构维护页面”新建相应的本级单位')
-        return
+      if(type == 'add'){
+        if(!t.currentId || !t.currentKey){
+          t.$message.warning('请先在左侧选择单位再进行新增')
+          return
+        }else {
+          const areaId = t.currentId
+          const orgName = t.currentKey.length>0?t.currentKey[0].split('-')[1]: ''
+          const orgId = t.currentKey.length>0?t.currentKey[0].split('-')[0]: null
+          t.$refs.contactMod.openDialog(type,data,areaId,orgName,orgId)
+        }
+      }else{
+        t.$refs.contactMod.openDialog(type,data,data.districtId,data.orgStructureName,data.orgStructureId)
       }
-      const areaId = t.currentId
-      const orgName = t.currentKey.length>0?t.currentKey[0].split('-')[1]: ''
-      const orgId = t.currentKey.length>0?t.currentKey[0].split('-')[0]: null
-      t.$refs.contactMod.openDialog(type,data,areaId,orgName,orgId)
     },
 
     async delData(row){
@@ -309,6 +515,18 @@
         },
       });
     },
+    changeArea(value){
+      console.log('val',this.exportAreaId)
+      getExportData(this.exportAreaId).then(res => {
+        if(res.data.code == 100){
+          this.json_data = res.data.data
+          console.log('this.json_data',this.json_data)
+        }else{
+          this.$message.warning(res.data.msg);
+        }
+      })
+
+    },
 
     async deliverTask(){
       const t = this

--
Gitblit v1.9.2