Procházet zdrojové kódy

fix: 车辆信息管理-添加提示语,重新获取数据页数修改

bxy před 7 měsíci
rodič
revize
4e174da49d

+ 1 - 2
src/components/batch-import/BatchImport.vue

@@ -81,7 +81,6 @@
   import type { BatchImportProps, ErrorDetailItem, ImportResponseData } from './types';
 
   const props = withDefaults(defineProps<BatchImportProps>(), {
-    successMessage: '添加成功',
     templateName: '下载模板',
   });
 
@@ -186,7 +185,7 @@
     try {
       if (sucCount.value != 0 && errCount.value === 0 && errDetail.value.length === 0) {
         ElMessage({
-          message: props.successMessage,
+          message: `导入成功!共导入${sucCount.value}条记录`,
           type: 'success',
         });
         emit('update');

+ 0 - 4
src/components/batch-import/types.ts

@@ -18,10 +18,6 @@ export interface BatchImportProps {
    * 模板名称
    */
   templateName: string;
-  /**
-   * 成功消息文本
-   */
-  successMessage?: string;
 }
 
 /**

+ 1 - 20
src/views/traffic/vehicle/Vehicle.vue

@@ -94,18 +94,11 @@
     </div>
   </div>
   <ManageDrawer v-if="drawerVisible" :type="drawerType" :initial-data="initialData" @close="handleCloseDrawer" />
-  <!-- <BatchImport
-    class="batch-import"
-    v-if="showBatchImportPopover"
-    @update="handleUpdateBatchImport"
-    @close="handleCloseBatchImport"
-  /> -->
   <BatchImport
     :visible="batchImportVisible"
     :importApiUrl="importApiUrl"
     :templateUrl="templateUrl"
     :templateName="'车辆信息管理-批量导入模版'"
-    :successMessage="'车辆信息添加成功'"
     @close="() => (batchImportVisible = false)"
     @update="handleUpdate"
   />
@@ -186,16 +179,12 @@
 
   const handleClear = () => {
     searchKeyword.value = '';
-    vehicleTableQuery.pageNumber = 1;
-    vehicleTableQuery.pageSize = 20;
     getTableData();
   };
 
   const handleReset = () => {
     searchSelectedType.value = FIELDTYPE.VEHICLE_NUMBER;
     searchKeyword.value = '';
-    vehicleTableQuery.pageNumber = 1;
-    vehicleTableQuery.pageSize = 20;
     getTableData();
   };
 
@@ -249,8 +238,6 @@
 
   const handleCloseDrawer = () => {
     drawerVisible.value = false;
-    vehicleTableQuery.pageNumber = 1;
-    vehicleTableQuery.pageSize = 20;
     getTableData();
   };
 
@@ -258,8 +245,6 @@
     if (!row.id) return;
     deleteVehicleInfo({ vehicleInfoIds: [row.id] }).then(() => {
       ElMessage.success('删除成功');
-      vehicleTableQuery.pageNumber = 1;
-      vehicleTableQuery.pageSize = 20;
       getTableData();
     });
   };
@@ -281,8 +266,6 @@
     if (!deleteIds.length) return;
     deleteVehicleInfo({ vehicleInfoIds: deleteIds }).then(() => {
       ElMessage.success('批量删除成功');
-      vehicleTableQuery.pageNumber = 1;
-      vehicleTableQuery.pageSize = 20;
       getTableData();
     });
   };
@@ -295,8 +278,6 @@
 
   const handleUpdate = () => {
     batchImportVisible.value = false;
-    vehicleTableQuery.pageNumber = 1;
-    vehicleTableQuery.pageSize = 20;
     getTableData();
   };
 
@@ -319,7 +300,7 @@
       return VEHICLE_LIST_TABLE_COLUMNS;
     } else {
       // 过滤掉操作列
-      return VEHICLE_LIST_TABLE_COLUMNS.filter((column) => column.prop !== 'action');
+      return VEHICLE_LIST_TABLE_COLUMNS.filter((column) => column.prop !== 'action' && column.type !== 'selection');
     }
   };
 

+ 0 - 304
src/views/traffic/vehicle/components/BatchImport.vue

@@ -1,304 +0,0 @@
-<template>
-  <div>
-    <div class="overlay" v-if="cardVisible"></div>
-    <el-card v-if="cardVisible" class="pop-card">
-      <template #header>
-        <div style="font-size: 16px; font-weight: 600">批量导入</div>
-        <el-icon
-          :size="18"
-          @click="
-            () => {
-              emits('close');
-            }
-          "
-          style="cursor: pointer"
-        >
-          <Close />
-        </el-icon>
-      </template>
-      <div class="upload-content">
-        <el-upload
-          ref="upload"
-          style="width: 384px; height: 192px; border-radius: 5px"
-          :headers="getHeaders()"
-          :multiple="false"
-          :limit="1"
-          drag
-          :action="actionUrl"
-          :with-credentials="true"
-          :auto-upload="false"
-          :before-upload="beforeUpload"
-          :on-success="handleUploadSuccess"
-          :on-exceed="handleExceed"
-          :on-change="handleChange"
-          :on-remove="handleRemove"
-        >
-          <el-icon class="el-icon--upload" style="width: 33px; height: 42px; color: #409efc">
-            <Document />
-          </el-icon>
-          <div class="el-upload__text">
-            <div style="font-size: 12px; color: red; margin-bottom: 5px">请下载模板并按要求填写后上传</div>
-            <div style="font-size: 16px">点击或将文件拖拽到这里上传</div>
-            <div style="font-size: 12px; color: rgba(0, 0, 0, 0.45); margin-top: 5px"
-              >文件支持.xlsx .xls格式,仅支持上传一个文件</div
-            >
-          </div>
-        </el-upload>
-        <div style="margin-top: 72px; display: flex; justify-content: flex-end">
-          <el-button @click="handleDownloadTemplate">下载模板</el-button>
-          <el-button type="primary" @click="handleImport" :disabled="isImportDisable">导入</el-button>
-        </div>
-      </div>
-    </el-card>
-
-    <el-dialog
-      v-model="DialogVisibleErr"
-      title="Warning"
-      width="544"
-      align-center
-      @close="
-        () => {
-          emits('update');
-        }
-      "
-    >
-      <template #header>
-        <el-icon :size="24" color="#f2b20a" style="margin: 0 5px 2px">
-          <WarnTriangleFilled />
-        </el-icon>
-        <div class="header-text">导入提示</div>
-      </template>
-      <div class="sum-count">
-        成功导入 <span class="succ-sum">{{ sucCount }}</span> 条, 失败 <span class="err-sum">{{ errCount }}</span> 条
-      </div>
-      <el-table :data="errDetail" style="width: 100%" height="190">
-        <el-table-column prop="rowNum" label="行数" width="100" fixed align="center" />
-        <el-table-column prop="failReason" label="失败原因" show-overflow-tooltip />
-      </el-table>
-      <template #footer>
-        <el-button type="primary" @click="handleErrComfirm"> 确定 </el-button>
-      </template>
-    </el-dialog>
-  </div>
-</template>
-
-<script setup lang="ts">
-  import { computed, ref } from 'vue';
-  import urlJoin from 'url-join';
-  import axios, { AxiosRequestConfig } from 'axios';
-  import { getHeaders } from '@/utils/http/axios';
-  import { genFileId, ElMessage } from 'element-plus';
-  import type { UploadInstance, UploadProps, UploadRawFile } from 'element-plus';
-  import { Close, Document, WarnTriangleFilled } from '@element-plus/icons-vue';
-  import { useGlobSetting } from '@/hooks/setting';
-
-  const emits = defineEmits(['close', 'update']);
-
-  const upload = ref<UploadInstance>();
-  const cardVisible = ref<boolean>(true);
-  const isImportDisable = ref<boolean>(true);
-  const DialogVisibleErr = ref<boolean>(false);
-  const sucCount = ref<number>(0);
-  const errCount = ref<number>(0);
-  const errDetail = ref<{ rowNum: number; failReason: string }[]>([]);
-
-  const { urlPrefix } = useGlobSetting();
-
-  const actionUrl = computed(() => {
-    return urlJoin(urlPrefix, `/vehicleInfo/importVehicleInfo`);
-  });
-
-  // 下载模板
-  const handleDownloadTemplate = async () => {
-    try {
-      const config: AxiosRequestConfig = {
-        headers: getHeaders(),
-        responseType: 'blob',
-      };
-      const response = await axios.get(
-        './skyeye-file-upload/sfysecurity/TEMPLATE/import-vehicle-template.xlsx',
-        config,
-      );
-      const blob = new Blob([response.data], {
-        type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
-      });
-      // 创建下载链接
-      let downloadLink: HTMLAnchorElement | null = document.createElement('a');
-      const url = window.URL.createObjectURL(blob);
-      downloadLink.href = url;
-      downloadLink.download = '车辆信息管理-批量导入模版.xlsx';
-      downloadLink.click();
-      // 移除下载链接
-      window.URL.revokeObjectURL(url);
-      downloadLink = null;
-    } catch (error) {
-      console.error('Error downloading file:', error);
-    }
-  };
-
-  // 导入
-  const handleImport = async () => {
-    upload.value!.submit();
-  };
-
-  // 上传文件之前的钩子,参数为上传的文件。即上传之前验证文件类型/后缀
-  const beforeUpload = (file) => {
-    const isExcel = /\.(xlsx|xls)$/.test(file.name.toLowerCase());
-    if (!isExcel) {
-      // 提示用户选择正确的文件类型
-      ElMessage({
-        message: '仅支持上传.xlsx .xls格式文件',
-        type: 'error',
-      });
-      return false; // 阻止上传
-    }
-    return true; // 允许上传
-  };
-
-  function mergeFailReasons(data) {
-    const grouped = data.reduce((acc, item) => {
-      if (!acc[item.rowNum]) {
-        acc[item.rowNum] = [];
-      }
-      // 避免重复添加
-      if (!acc[item.rowNum].includes(item.failReason)) {
-        acc[item.rowNum].push(item.failReason);
-      }
-      return acc;
-    }, {});
-
-    return Object.entries(grouped).map(([rowNum, reasons]) => ({
-      rowNum: parseInt(rowNum),
-      failReason: (reasons as string[]).join('、'),
-    }));
-  }
-
-  const handleUploadSuccess = (response) => {
-    sucCount.value = response.data.successCount;
-    errCount.value = response.data.failCount;
-    errDetail.value = response.data.failInfoList;
-
-    try {
-      if (sucCount.value != 0 && errCount.value === 0 && errDetail.value.length === 0) {
-        ElMessage({
-          message: '添加成功', // 1.全部添加成功 —— failCount === 0
-          type: 'success',
-        });
-        emits('update');
-      } else {
-        DialogVisibleErr.value = true; // 2.有错误 —— 显示错误dialog
-        errDetail.value = mergeFailReasons(errDetail.value);
-      }
-      cardVisible.value = false;
-    } catch (error) {
-      ElMessage({
-        message: response.message,
-        type: 'error',
-      });
-      emits('update');
-    }
-  };
-
-  const handleErrComfirm = () => {
-    DialogVisibleErr.value = false;
-    emits('update');
-  };
-
-  // 当超出只能上传一个文件的限制时,自动替换上一个文件
-  const handleExceed: UploadProps['onExceed'] = (files) => {
-    upload.value!.clearFiles();
-    const file = files[0] as UploadRawFile;
-    file.uid = genFileId();
-    upload.value!.handleStart(file);
-  };
-
-  const handleChange = () => {
-    isImportDisable.value = false;
-  };
-
-  const handleRemove = () => {
-    isImportDisable.value = true;
-  };
-</script>
-
-<style scoped lang="scss">
-  .overlay {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100vw;
-    height: 100vh;
-    background-color: rgba(0, 0, 0, 0.5);
-    z-index: 999;
-  }
-
-  .pop-card {
-    position: fixed;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    z-index: 1000;
-  }
-
-  .upload-content {
-    margin: 40px 60px 10px 60px;
-  }
-
-  :deep(.el-card) {
-    .el-card__header {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-    }
-  }
-
-  :deep(.el-dialog) {
-    padding: 0px;
-    border-radius: 5px;
-
-    .el-dialog__header {
-      display: flex;
-      align-items: flex-end;
-      height: 70px;
-      padding: 0px 0px 15px 15px;
-      border-bottom: 1px solid #e7e7e7;
-
-      .header-text {
-        font-size: 20px;
-      }
-    }
-
-    .el-dialog__headerbtn {
-      top: 15px;
-      right: 3px;
-
-      .el-dialog__close {
-        font-size: 20px;
-        color: black;
-      }
-    }
-
-    .el-dialog__body {
-      padding: 20px;
-
-      .sum-count {
-        font-size: 20px;
-        display: flex;
-        justify-content: center;
-        margin-bottom: 20px;
-
-        .succ-sum {
-          color: #52c41a;
-        }
-
-        .err-sum {
-          color: #ff4d4f;
-        }
-      }
-    }
-
-    .el-dialog__footer {
-      margin: 0 20px 20px 0;
-    }
-  }
-</style>

+ 6 - 3
src/views/traffic/vehicle/components/ManageDrawer.vue

@@ -33,7 +33,10 @@
         <el-input placeholder="请选择工号,此项自动填充" v-model="formParams.deptName" disabled />
       </el-form-item>
       <el-form-item label="联系方式" prop="phoneNum">
-        <el-input placeholder="请选择工号,此项自动填充" v-model="formParams.phoneNum" />
+        <el-input
+          :placeholder="formParams.staffNo ? '请输入联系方式' : '请选择工号,此项自动填充'"
+          v-model="formParams.phoneNum"
+        />
       </el-form-item>
     </el-form>
     <template #footer>
@@ -86,7 +89,7 @@
   const rules = reactive<FormRules<VehicleInfoStruct>>({
     carNum: [
       { required: true, message: '车牌号不能为空', trigger: 'blur' },
-      { min: 1, max: 8, message: '车牌号格式错误(最长8位)', trigger: 'blur' },
+      { min: 1, max: 8, message: '车牌号格式错误', trigger: 'blur' },
     ],
     staffNo: {
       required: true,
@@ -107,7 +110,7 @@
       { required: true, message: '联系方式不能为空', trigger: 'blur' },
       {
         pattern: /^1\d{10}$/,
-        message: '请输入11位有效的手机号码',
+        message: '联系方式非11位数字',
         trigger: 'blur',
       },
     ],

+ 1 - 1
src/views/traffic/vehicle/config/table.ts

@@ -62,8 +62,8 @@ export const VEHICLE_LIST_TABLE_COLUMNS: TableColumnProps[] = [
     minWidth: '180px',
   },
   {
-    prop: 'action',
     label: '操作',
+    prop: 'action',
     align: 'center',
     slot: 'action',
     fixed: 'right',