Jelajahi Sumber

fix: 人员分组优化修改,批量导入组件逻辑重构

ai0187 3 bulan lalu
induk
melakukan
21aa9d3c2d

+ 22 - 9
src/components/batch-import/BatchImport.vue

@@ -4,7 +4,7 @@
     <el-card class="pop-card">
       <template #header>
         <div style="font-size: 16px; font-weight: 600">批量导入</div>
-        <el-icon :size="18" @click="handleClose" style="cursor: pointer">
+        <el-icon :size="18" @click="handleMainClose" style="cursor: pointer">
           <Close />
         </el-icon>
       </template>
@@ -50,7 +50,7 @@
           <WarnTriangleFilled />
         </el-icon>
         <div class="header-text">导入提示</div>
-        <el-icon class="close-icon" :size="18" @click="handleClose"><Close /></el-icon>
+        <el-icon class="close-icon" :size="18" @click="handleErrorDialogClose"><Close /></el-icon>
       </template>
       <!-- 简单模式或 ImportResponseDataPerson 类型:显示字符串消息 -->
       <div v-if="props.responseType === 'simple' || isPersonResponseType" class="simple-message">
@@ -216,8 +216,10 @@
           simpleMessage.value = message;
           lastResponseData.value = message;
         }
-        // 显示dialog
+        // 显示错误弹窗
         dialogVisibleErr.value = true;
+        // 通知父组件更新数据(但不关闭主弹窗)
+        emit('update', lastResponseData.value);
       } catch (error) {
         ElMessage({
           message: '导入失败',
@@ -243,10 +245,10 @@
         simpleMessage.value = detailedData.message || '导入完成';
         // 保存返回值
         lastResponseData.value = detailedData;
-        // 立即触发 emit,传递完整数据(包括 successMembers)给父组件
-        emit('update', detailedData);
-        // 显示 dialog
+        // 显示错误弹窗
         dialogVisibleErr.value = true;
+        // 触发 update 事件,通知父组件更新数据(但不关闭主弹窗)
+        emit('update', detailedData);
         return;
       } else {
         // 否则是 ImportResponseData 类型(有 successCount, failCount, failInfoList)
@@ -276,6 +278,7 @@
 
     try {
       if (sucCount.value != 0 && errCount.value === 0 && errDetail.value.length === 0) {
+        // 完全成功:通知父组件更新数据,然后关闭弹窗
         ElMessage({
           message: `导入成功!共导入${sucCount.value}条记录`,
           type: 'success',
@@ -283,8 +286,11 @@
         emit('update', detailedData);
         emit('close');
       } else {
-        dialogVisibleErr.value = true; // 显示错误dialog
+        // 有错误:显示错误弹窗,通知父组件更新数据(可选)
+        dialogVisibleErr.value = true;
         errDetail.value = mergeFailReasons(errDetail.value);
+        // 可选:如果父组件需要知道有错误,可以触发 update
+        // emit('update', detailedData);
       }
     } catch (error) {
       ElMessage({
@@ -316,8 +322,15 @@
     isImportDisable.value = true;
   };
 
-  const handleClose = () => {
-    emit('update', lastResponseData.value);
+  // 主弹窗关闭:直接关闭,不触发 update(因为可能没有数据更新)
+  const handleMainClose = () => {
+    emit('close');
+  };
+
+  // 错误弹窗关闭:关闭错误弹窗,并关闭主弹窗
+  const handleErrorDialogClose = () => {
+    dialogVisibleErr.value = false;
+    emit('close');
   };
 </script>
 

+ 7 - 2
src/views/system/person-group/PersonGroup.vue

@@ -64,7 +64,7 @@
         :templateUrl="templateUrl"
         :templateName="'导入创建分组模版'"
         responseType="simple"
-        @close="() => (batchImportVisible = false)"
+        @close="handleClose"
         @update="handleUpdate"
       />
     </div>
@@ -103,10 +103,15 @@
   const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-addUserGroup-template.xlsx');
 
   const handleUpdate = () => {
-    batchImportVisible.value = false;
+    // update 事件只用于更新数据,不关闭弹窗
     queryPersonGroupList();
   };
 
+  const handleClose = () => {
+    // close 事件用于关闭弹窗
+    batchImportVisible.value = false;
+  };
+
   function openEditDrawer(row?: PersonGroupListItem) {
     drawerTitle.value = row ? '编辑人员分组' : '新建人员分组';
     editDrawerInstance.value?.open(row);

+ 0 - 1
src/views/system/person-group/components/PersonGroupEditDrawer.vue

@@ -120,7 +120,6 @@
   const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-groupUserList-template.xlsx');
 
   const handleUpdate = (data?: ImportResponseData | ImportResponseDataPerson | string) => {
-    batchImportVisible.value = false;
     // 处理批量导入返回的 successMembers
     if (data && typeof data === 'object' && 'successMembers' in data) {
       const importData = data as ImportResponseDataPerson;

+ 1 - 1
src/views/system/person-group/components/PersonGroupExhibitionDrawer.vue

@@ -5,8 +5,8 @@
         <el-button class="export-button" type="primary" @click="handleExport">导出分组名单</el-button>
       </div>
       <el-table :data="personList" style="width: 100%" height="600">
-        <el-table-column prop="realname" label="姓名" show-overflow-tooltip />
         <el-table-column prop="staffNo" label="工号" show-overflow-tooltip />
+        <el-table-column prop="realname" label="姓名" show-overflow-tooltip />
         <el-table-column prop="deptName" label="部门" show-overflow-tooltip>
           <template #default="{ row }">
             {{ row.deptName ? row.deptName : '--' }}

+ 7 - 2
src/views/traffic/accident/Accident.vue

@@ -116,7 +116,7 @@
     :importApiUrl="importApiUrl"
     :templateUrl="templateUrl"
     :templateName="'交通事故记录-批量导入模版'"
-    @close="() => (batchImportVisible = false)"
+    @close="handleClose"
     @update="handleUpdate"
   />
 </template>
@@ -294,10 +294,15 @@
   const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-traffic-template.xlsx');
 
   const handleUpdate = () => {
-    batchImportVisible.value = false;
+    // update 事件只用于更新数据,不关闭弹窗
     getTableData();
   };
 
+  const handleClose = () => {
+    // close 事件用于关闭弹窗
+    batchImportVisible.value = false;
+  };
+
   const getTableData = () => {
     tableConfig.loading = true;
     accidentTableQuery.queryParam = {

+ 7 - 2
src/views/traffic/vehicle/Vehicle.vue

@@ -99,7 +99,7 @@
     :importApiUrl="importApiUrl"
     :templateUrl="templateUrl"
     :templateName="'车辆信息管理-批量导入模版'"
-    @close="() => (batchImportVisible = false)"
+    @close="handleClose"
     @update="handleUpdate"
   />
 </template>
@@ -277,10 +277,15 @@
   const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-vehicle-template.xlsx');
 
   const handleUpdate = () => {
-    batchImportVisible.value = false;
+    // update 事件只用于更新数据,不关闭弹窗
     getTableData();
   };
 
+  const handleClose = () => {
+    // close 事件用于关闭弹窗
+    batchImportVisible.value = false;
+  };
+
   const getTableData = () => {
     tableConfig.loading = true;
     vehicleTableQuery.queryParam = {

+ 10 - 6
src/views/traffic/violation/act/Act.vue

@@ -87,8 +87,8 @@
             ref="basicTableRef"
             :tableData="tableData"
             :tableConfig="tableConfig"
-            @update:pageSize="handleSizeChange"
-            @update:pageNumber="handleCurrentChange"
+            @update:page-size="handleSizeChange"
+            @update:page-number="handleCurrentChange"
             @update:selection="handleSelectionChange"
           >
             <template #violateName="scope">
@@ -156,7 +156,7 @@
       :importApiUrl="importApiUrl"
       :templateUrl="templateUrl"
       :templateName="'违规行为记录-批量导入模版'"
-      @close="() => (batchImportVisible = false)"
+      @close="handleClose"
       @update="handleUpdate"
     />
   </div>
@@ -172,7 +172,6 @@
   import { TABLE_OPTIONS, VIOLATION_ACT_TABLE_COLUMNS, VIOLATION_ACT_TABLE_COLUMNS_CHECKONLY } from './configs/tables';
   import {
     ACT_NOTICE_DATA_SOURCE_LABEL,
-    ACT_VIOLATION_TYPE,
     ACT_VIOLATION_TYPE_LABEL,
     ACT_TABLE_SEARCH_OPTIONS,
     ACT_VIOLATION_TYPE_OPTIONS,
@@ -187,7 +186,7 @@
   import { useRouter } from 'vue-router';
   import { openMessageBox } from '@/utils/element-plus/messageBox';
   import type { QueryPageRequest } from '@/types/basic-query';
-  import type { ActTableSearch, ActTableQuery, ActTableData, UpdateActQuery } from './types';
+  import type { ActTableSearch, ActTableQuery, ActTableData } from './types';
   import {
     getActTableList,
     noticeActData,
@@ -348,10 +347,15 @@
   const templateUrl = ref('./skyeye-file-upload/sfysecurity/TEMPLATE/import-violation-template.xlsx');
 
   const handleUpdate = () => {
-    batchImportVisible.value = false;
+    // update 事件只用于更新数据,不关闭弹窗
     getTableData();
   };
 
+  const handleClose = () => {
+    // close 事件用于关闭弹窗
+    batchImportVisible.value = false;
+  };
+
   onMounted(async () => {
     await getTableData();
   });