src/views/equipmentManagement/inspectionManagement/components/formDia.vue
@@ -1,116 +1,102 @@ <template> <div> <el-dialog :title="operationType === 'add' ? '新增巡检任务' : '编辑巡检任务'" v-model="dialogVisitable" width="800px" @close="cancel"> <el-form ref="formRef" :model="form" :rules="rules" label-width="120px"> <el-row> <el-col :span="12"> <el-form-item label="设备名称" prop="taskId"> <el-select v-model="form.taskId" @change="setDeviceModel" filterable> <el-option v-for="(item, index) in deviceOptions" :key="index" :label="item.deviceName" :value="item.id" ></el-option> </el-select> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="巡检人" prop="inspector"> <el-select v-model="form.inspector" filterable default-first-option :reserve-keyword="false" placeholder="请选择" multiple clearable> <el-option v-for="item in userList" :label="item.nickName" :value="item.userId" :key="item.userId"/> </el-select> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> <el-form-item label="备注" prop="remarks"> <el-input v-model="form.remarks" placeholder="请输入备注" type="textarea" /> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="登记时间" prop="dateStr"> <el-date-picker v-model="form.dateStr" type="date" placeholder="选择登记日期" format="YYYY-MM-DD" value-format="YYYY-MM-DD" style="width: 100%" /> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> <el-form-item label="任务频率" prop="frequencyType"> <el-select v-model="form.frequencyType" placeholder="请选择" clearable> <el-option label="每日" value="DAILY"/> <el-option label="每周" value="WEEKLY"/> <el-option label="每月" value="MONTHLY"/> <!-- <el-option label="季度" value="QUARTERLY"/> --> </el-select> </el-form-item> </el-col> <el-col :span="12" v-if="form.frequencyType === 'DAILY' && form.frequencyType"> <el-form-item label="日期" prop="frequencyDetail"> <el-time-picker v-model="form.frequencyDetail" placeholder="选择时间" format="HH:mm" value-format="HH:mm" /> </el-form-item> </el-col> <el-col :span="12" v-if="form.frequencyType === 'WEEKLY' && form.frequencyType"> <el-form-item label="日期" prop="frequencyDetail"> <el-select v-model="form.week" placeholder="请选择" clearable style="width: 50%"> <el-option label="周一" value="MON"/> <el-option label="周二" value="TUE"/> <el-option label="周三" value="WED"/> <el-option label="周四" value="THU"/> <el-option label="周五" value="FRI"/> <el-option label="周六" value="SAT"/> <el-option label="周日" value="SUN"/> </el-select> <el-time-picker v-model="form.time" placeholder="选择时间" format="HH:mm" value-format="HH:mm" style="width: 50%"/> </el-form-item> </el-col> <el-col :span="12" v-if="form.frequencyType === 'MONTHLY' && form.frequencyType"> <el-form-item label="日期" prop="frequencyDetail"> <el-date-picker v-model="form.frequencyDetail" type="datetime" clearable placeholder="选择开始日期" format="DD,HH:mm" value-format="DD,HH:mm" /> </el-form-item> </el-col> <el-col :span="12" v-if="form.frequencyType === 'QUARTERLY' && form.frequencyType"> <el-form-item label="日期" prop="frequencyDetail"> <el-date-picker v-model="form.frequencyDetail" type="datetime" clearable placeholder="选择开始日期" format="MM,DD,HH:mm" value-format="MM,DD,HH:mm" /> </el-form-item> </el-col> </el-row> </el-form> <template #footer> <div class="dialog-footer"> <el-button @click="cancel">取消</el-button> <el-button type="primary" @click="submitForm">保存</el-button> </div> </template> </el-dialog> </div> <div> <el-dialog :title="operationType === 'add' ? '新增巡检任务' : '编辑巡检任务'" v-model="dialogVisitable" width="800px" @close="cancel"> <el-form ref="formRef" :model="form" :rules="rules" label-width="120px"> <el-row> <el-col :span="12"> <el-form-item label="设备名称" prop="taskId"> <el-select v-model="form.taskId" @change="setDeviceModel"> <el-option v-for="(item, index) in deviceOptions" :key="index" :label="item.deviceName" :value="item.id" ></el-option> </el-select> </el-form-item> </el-col> <el-col :span="12"> <el-form-item label="巡检人" prop="inspector"> <el-select v-model="form.inspector" placeholder="请选择" multiple clearable> <el-option v-for="item in userList" :label="item.nickName" :value="item.userId" :key="item.userId"/> </el-select> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> <el-form-item label="备注" prop="remarks"> <el-input v-model="form.remarks" placeholder="请输入备注" type="textarea" /> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="12"> <el-form-item label="任务频率" prop="frequencyType"> <el-select v-model="form.frequencyType" placeholder="请选择" clearable> <el-option label="每日" value="DAILY"/> <el-option label="每周" value="WEEKLY"/> <el-option label="每月" value="MONTHLY"/> <!-- <el-option label="季度" value="QUARTERLY"/> --> </el-select> </el-form-item> </el-col> <el-col :span="12" v-if="form.frequencyType === 'DAILY' && form.frequencyType"> <el-form-item label="日期" prop="frequencyDetail"> <el-time-picker v-model="form.frequencyDetail" placeholder="选择时间" format="HH:mm" value-format="HH:mm" /> </el-form-item> </el-col> <el-col :span="12" v-if="form.frequencyType === 'WEEKLY' && form.frequencyType"> <el-form-item label="日期" prop="frequencyDetail"> <el-select v-model="form.week" placeholder="请选择" clearable style="width: 50%"> <el-option label="周一" value="MON"/> <el-option label="周二" value="TUE"/> <el-option label="周三" value="WED"/> <el-option label="周四" value="THU"/> <el-option label="周五" value="FRI"/> <el-option label="周六" value="SAT"/> <el-option label="周日" value="SUN"/> </el-select> <el-time-picker v-model="form.time" placeholder="选择时间" format="HH:mm" value-format="HH:mm" style="width: 50%"/> </el-form-item> </el-col> <el-col :span="12" v-if="form.frequencyType === 'MONTHLY' && form.frequencyType"> <el-form-item label="日期" prop="frequencyDetail"> <el-date-picker v-model="form.frequencyDetail" type="datetime" clearable placeholder="选择开始日期" format="DD,HH:mm" value-format="DD,HH:mm" /> </el-form-item> </el-col> <el-col :span="12" v-if="form.frequencyType === 'QUARTERLY' && form.frequencyType"> <el-form-item label="日期" prop="frequencyDetail"> <el-date-picker v-model="form.frequencyDetail" type="datetime" clearable placeholder="选择开始日期" format="MM,DD,HH:mm" value-format="MM,DD,HH:mm" /> </el-form-item> </el-col> </el-row> </el-form> <template #footer> <div class="dialog-footer"> <el-button @click="cancel">取消</el-button> <el-button type="primary" @click="submitForm">保存</el-button> </div> </template> </el-dialog> </div> </template> <script setup> @@ -127,27 +113,26 @@ const operationType = ref('add'); const deviceOptions = ref([]); const data = reactive({ form: { taskId: undefined, taskName: undefined, inspector: '', inspectorIds: '', remarks: '', frequencyType: '', frequencyDetail: '', week: '', time: '', dateStr: '' }, form: { taskId: undefined, taskName: undefined, inspector: '', inspectorIds: '', remarks: '', frequencyType: '', frequencyDetail: '', week: '', time: '' }, rules: { taskId: [{ required: true, message: "请选择设备", trigger: "change" },], inspector: [{ required: true, message: "请输入巡检人", trigger: "blur" },], dateStr: [{ required: true, message: "请选择登记时间", trigger: "change" }], frequencyType: [{ required: true, message: "请选择任务频率", trigger: "change" }], frequencyDetail: [ { required: true, message: "请选择日期", { required: true, message: "请选择日期", trigger: "change", validator: (rule, value, callback) => { if (!form.value.frequencyType) { @@ -171,9 +156,9 @@ } ], week: [ { required: true, message: "请选择星期", { required: true, message: "请选择星期", trigger: "change", validator: (rule, value, callback) => { if (form.value.frequencyType === 'WEEKLY' && !value) { @@ -185,9 +170,9 @@ } ], time: [ { required: true, message: "请选择时间", { required: true, message: "请选择时间", trigger: "change", validator: (rule, value, callback) => { if (form.value.frequencyType === 'WEEKLY' && !value) { @@ -204,95 +189,95 @@ const userList = ref([]) const loadDeviceName = async () => { const { data } = await getDeviceLedger(); deviceOptions.value = data; const { data } = await getDeviceLedger(); deviceOptions.value = data; }; const setDeviceModel = (id) => { const option = deviceOptions.value.find((item) => item.id === id); if (option) { form.value.taskName = option.deviceName; } const option = deviceOptions.value.find((item) => item.id === id); if (option) { form.value.taskName = option.deviceName; } } // 打开弹框 const openDialog = async (type, row) => { dialogVisitable.value = true operationType.value = type // 重置表单 resetForm(); // 加载用户列表 userListNoPageByTenantId().then((res) => { userList.value = res.data; }); // 加载设备列表 await loadDeviceName(); if (type === 'edit' && row) { form.value = {...row} form.value.inspector = form.value.inspectorIds.split(',').map(Number) // 如果有设备ID,自动设置设备信息 if (form.value.taskId) { setDeviceModel(form.value.taskId); } } dialogVisitable.value = true operationType.value = type // 重置表单 resetForm(); // 加载用户列表 userListNoPageByTenantId().then((res) => { userList.value = res.data; }); // 加载设备列表 await loadDeviceName(); if (type === 'edit' && row) { form.value = {...row} form.value.inspector = form.value.inspectorIds.split(',').map(Number) // 如果有设备ID,自动设置设备信息 if (form.value.taskId) { setDeviceModel(form.value.taskId); } } } // 关闭对话框 const cancel = () => { resetForm() dialogVisitable.value = false emit('closeDia') resetForm() dialogVisitable.value = false emit('closeDia') } // 重置表单函数 const resetForm = () => { if (proxy.$refs.formRef) { proxy.$refs.formRef.resetFields() } // 重置表单数据确保设备信息正确重置 form.value = { taskId: undefined, taskName: undefined, inspector: '', inspectorIds: '', remarks: '', frequencyType: '', frequencyDetail: '', week: '', time: '' } if (proxy.$refs.formRef) { proxy.$refs.formRef.resetFields() } // 重置表单数据确保设备信息正确重置 form.value = { taskId: undefined, taskName: undefined, inspector: '', inspectorIds: '', remarks: '', frequencyType: '', frequencyDetail: '', week: '', time: '' } } // 提交表单 const submitForm = () => { proxy.$refs["formRef"].validate(async valid => { if (valid) { try { form.value.inspectorIds = form.value.inspector.join(',') delete form.value.inspector if (form.value.frequencyType === 'WEEKLY') { let frequencyDetail = '' frequencyDetail = form.value.week + ',' + form.value.time form.value.frequencyDetail = frequencyDetail } let res = await userStore.getInfo() form.value.registrantId = res.user.userId await addOrEditTimingTask(form.value) cancel() proxy.$modal.msgSuccess('提交成功') } catch (error) { proxy.$modal.msgError('提交失败,请重试') } } }) proxy.$refs["formRef"].validate(async valid => { if (valid) { try { form.value.inspectorIds = form.value.inspector.join(',') delete form.value.inspector if (form.value.frequencyType === 'WEEKLY') { let frequencyDetail = '' frequencyDetail = form.value.week + ',' + form.value.time form.value.frequencyDetail = frequencyDetail } let res = await userStore.getInfo() form.value.registrantId = res.user.userId await addOrEditTimingTask(form.value) cancel() proxy.$modal.msgSuccess('提交成功') } catch (error) { proxy.$modal.msgError('提交失败,请重试') } } }) } defineExpose({ openDialog }) </script> src/views/equipmentManagement/inspectionManagement/components/viewFiles.vue
@@ -32,7 +32,7 @@ <!-- 生产后 --> <div class="form-container"> <div class="title">生产中</div> <div class="title">生产后</div> <!-- 图片列表 --> <div style="display: flex; flex-wrap: wrap;"> @@ -59,7 +59,7 @@ <!-- 生产问题 --> <div class="form-container"> <div class="title">生产后</div> <div class="title">生产问题</div> <!-- 图片列表 --> <div style="display: flex; flex-wrap: wrap;"> @@ -100,7 +100,7 @@ <!-- 视频 --> <div v-else-if="mediaType === 'video'" style="position: relative;"> <Video <video :src="mediaList[currentMediaIndex]" autoplay controls @@ -114,6 +114,7 @@ <script setup> import { ref } from 'vue'; import VueEasyLightbox from 'vue-easy-lightbox'; const { proxy } = getCurrentInstance(); // 控制弹窗显示 const dialogVisitable = ref(false); @@ -133,26 +134,83 @@ const currentMediaIndex = ref(0); const mediaList = ref([]); // 存储当前要查看的媒体列表(含图片和视频对象) const mediaType = ref('image'); // image | video const javaApi = proxy.javaApi; // 处理 URL:将 Windows 路径转换为可访问的 URL function processFileUrl(fileUrl) { if (!fileUrl) return ''; // 如果 URL 是 Windows 路径格式(包含反斜杠),需要转换 if (fileUrl && fileUrl.indexOf('\\') > -1) { // 查找 uploads 关键字的位置,从那里开始提取相对路径 const uploadsIndex = fileUrl.toLowerCase().indexOf('uploads'); if (uploadsIndex > -1) { // 从 uploads 开始提取路径,并将反斜杠替换为正斜杠 const relativePath = fileUrl.substring(uploadsIndex).replace(/\\/g, '/'); fileUrl = '/' + relativePath; } else { // 如果没有找到 uploads,提取最后一个目录和文件名 const parts = fileUrl.split('\\'); const fileName = parts[parts.length - 1]; fileUrl = '/uploads/' + fileName; } } // 确保所有非 http 开头的 URL 都拼接 baseUrl if (fileUrl && !fileUrl.startsWith('http')) { // 确保路径以 / 开头 if (!fileUrl.startsWith('/')) { fileUrl = '/' + fileUrl; } // 拼接 baseUrl fileUrl = javaApi + fileUrl; } return fileUrl; } // 处理每一类数据:分离图片和视频 function processItems(items) { const images = []; const videos = []; // 检查 items 是否存在且为数组 if (!items || !Array.isArray(items)) { return { images, videos }; } items.forEach(item => { if (item.contentType?.startsWith('image/')) { images.push(item.url); } else if (item.contentType?.startsWith('video/')) { videos.push(item.url); if (!item || !item.url) return; // 处理文件 URL const fileUrl = processFileUrl(item.url); // 根据文件扩展名判断是图片还是视频 const urlLower = fileUrl.toLowerCase(); if (urlLower.match(/\.(jpg|jpeg|png|gif|bmp|webp)$/)) { images.push(fileUrl); } else if (urlLower.match(/\.(mp4|avi|mov|wmv|flv|mkv|webm)$/)) { videos.push(fileUrl); } else if (item.contentType) { // 如果有 contentType,使用 contentType 判断 if (item.contentType.startsWith('image/')) { images.push(fileUrl); } else if (item.contentType.startsWith('video/')) { videos.push(fileUrl); } } }); return { images, videos }; } // 打开弹窗并加载数据 const openDialog = async (row) => { const { images: beforeImgs, videos: beforeVids } = processItems(row.beforeProduction); const { images: afterImgs, videos: afterVids } = processItems(row.afterProduction); const { images: issueImgs, videos: issueVids } = processItems(row.productionIssues); // 使用正确的字段名:commonFileListBefore, commonFileListAfter // productionIssues 可能不存在,使用空数组 const { images: beforeImgs, videos: beforeVids } = processItems(row.commonFileListBefore || []); const { images: afterImgs, videos: afterVids } = processItems(row.commonFileListAfter || []); const { images: issueImgs, videos: issueVids } = processItems(row.productionIssues || []); beforeProductionImgs.value = beforeImgs; beforeProductionVideos.value = beforeVids; src/views/equipmentManagement/inspectionManagement/index.vue
@@ -1,78 +1,77 @@ <template> <div class="app-container"> <el-form :inline="true" :model="queryParams" class="search-form"> <el-form-item label="巡检任务名称"> <el-input v-model="queryParams.taskName" placeholder="请输入巡检任务名称" clearable :style="{ width: '100%' }" /> </el-form-item> <el-form-item> <el-button type="primary" @click="handleQuery">查询</el-button> <el-button @click="resetQuery">重置</el-button> </el-form-item> </el-form> <el-card> <div style="display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 10px;"> <el-radio-group v-model="activeRadio" @change="radioChange"> <el-radio-button v-for="tab in radios" :key="tab.name" :label="tab.label" :value="tab.name"/> </el-radio-group> <!-- 操作按钮区 --> <el-space v-if="activeRadio !== 'task'"> <el-button type="primary" :icon="Plus" @click="handleAdd(undefined)">新建</el-button> <el-button type="danger" :icon="Delete" @click="handleDelete">删除</el-button> <el-button @click="handleOut">导出</el-button> </el-space> <el-space v-else> <el-button @click="handleOut">导出</el-button> </el-space> </div> <div> <div> <PIMTable :table-loading="tableLoading" :table-data="tableData" :column="tableColumns" @selection-change="handleSelectionChange" :is-selection="true" :border="true" :table-style="{ width: '100%', height: 'calc(100vh - 23em)' }" :page="{ current: pageNum, size: pageSize, total: total, }" @pagination="pagination" > <template #inspector="{ row }"> <div class="person-tags"> <!-- 调试信息,上线时删除 --> <!-- {{ console.log('inspector data:', row.inspector) }} --> <template v-if="row.inspector && row.inspector.length > 0"> <el-tag v-for="(person, index) in row.inspector" :key="index" size="small" type="primary" class="person-tag" > {{ person }} </el-tag> </template> <span v-else class="no-data">--</span> </div> </template> </PIMTable> </div> </div> </el-card> <form-dia ref="formDia" @closeDia="handleQuery"></form-dia> <view-files ref="viewFiles"></view-files> </div> <div class="app-container"> <el-form :inline="true" :model="queryParams" class="search-form"> <el-form-item label="巡检任务名称"> <el-input v-model="queryParams.taskName" placeholder="请输入巡检任务名称" clearable style="width: 200px " /> </el-form-item> <el-form-item> <el-button type="primary" @click="handleQuery">查询</el-button> <el-button @click="resetQuery">重置</el-button> </el-form-item> </el-form> <el-card> <div style="display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 10px;"> <el-radio-group v-model="activeRadio" @change="radioChange"> <el-radio-button v-for="tab in radios" :key="tab.name" :label="tab.label" :value="tab.name"/> </el-radio-group> <!-- 操作按钮区 --> <el-space v-if="activeRadio !== 'task'"> <el-button type="primary" :icon="Plus" @click="handleAdd(undefined)">新建</el-button> <el-button type="danger" :icon="Delete" @click="handleDelete">删除</el-button> <el-button @click="handleOut">导出</el-button> </el-space> <el-space v-else> <el-button @click="handleOut">导出</el-button> </el-space> </div> <div> <PIMTable :table-loading="tableLoading" :table-data="tableData" :column="tableColumns" @selection-change="handleSelectionChange" @pagination="handlePagination" :is-selection="true" :border="true" :page="{ current: pageNum, size: pageSize, total: total, layout: 'total, sizes, prev, pager, next, jumper' }" :table-style="{ width: '100%', height: 'calc(100vh - 23em)' }" > <template #inspector="{ row }"> <div class="person-tags"> <!-- 调试信息,上线时删除 --> <!-- {{ console.log('inspector data:', row.inspector) }} --> <template v-if="row.inspector && row.inspector.length > 0"> <el-tag v-for="(person, index) in row.inspector" :key="index" size="small" type="primary" class="person-tag" > {{ person }} </el-tag> </template> <span v-else class="no-data">--</span> </div> </template> </PIMTable> </div> </el-card> <form-dia ref="formDia" @closeDia="handleQuery"></form-dia> <view-files ref="viewFiles"></view-files> </div> </template> <script setup> @@ -81,16 +80,15 @@ import { ElMessageBox } from "element-plus"; // 组件引入 import Pagination from "@/components/Pagination/index.vue"; import PIMTable from "@/components/PIMTable/PIMTable.vue"; import FormDia from "@/views/equipmentManagement/inspectionManagement/components/formDia.vue"; import ViewFiles from "@/views/equipmentManagement/inspectionManagement/components/viewFiles.vue"; // 接口引入 import { delTimingTask, inspectionTaskList, timingTaskList delTimingTask, inspectionTaskList, timingTaskList } from "@/api/inspectionManagement/index.js"; // 全局变量 @@ -100,14 +98,14 @@ // 查询参数 const queryParams = reactive({ taskName: "", taskName: "", }); // 单选框配置 const activeRadio = ref("taskManage"); const radios = reactive([ { name: "taskManage", label: "定时任务管理" }, { name: "task", label: "定时任务记录" }, { name: "taskManage", label: "定时任务管理" }, { name: "task", label: "定时任务记录" }, ]); // 表格数据 @@ -122,233 +120,234 @@ // 列配置 const columns = ref([ { prop: "taskName", label: "巡检任务名称", minWidth: 160 }, { prop: "remarks", label: "备注", minWidth: 150 }, { prop: "inspector", label: "执行巡检人", minWidth: 150, slot: "inspector" }, { prop: "frequencyType", label: "频次", minWidth: 150, formatData: (cell) => ({ DAILY: "每日", WEEKLY: "每周", MONTHLY: "每月", QUARTERLY: "季度" }[cell] || "") }, { prop: "frequencyDetail", label: "开始日期与时间", minWidth: 150, formatter: (row, column, cellValue) => { // 先判断是否是字符串 if (typeof cellValue !== 'string') return ''; let val = cellValue; const replacements = { MON: '周一', TUE: '周二', WED: '周三', THU: '周四', FRI: '周五', SAT: '周六', SUN: '周日' }; // 使用正则一次性替换所有匹配项 return val.replace(/MON|TUE|WED|THU|FRI|SAT|SUN/g, match => replacements[match]); } }, { prop: "registrant", label: "登记人", minWidth: 100 }, { prop: "dateStr", label: "登记日期", minWidth: 100 }, { prop: "taskName", label: "巡检任务名称", minWidth: 160 }, { prop: "remarks", label: "备注", minWidth: 150 }, { prop: "inspector", label: "执行巡检人", minWidth: 150, slot: "inspector" }, { prop: "frequencyType", label: "频次", minWidth: 150, formatter: (_, __, val) => ({ DAILY: "每日", WEEKLY: "每周", MONTHLY: "每月", QUARTERLY: "季度" }[val] || "") }, { prop: "frequencyDetail", label: "开始日期与时间", minWidth: 150, formatter: (row, column, cellValue) => { // 先判断是否是字符串 if (typeof cellValue !== 'string') return ''; let val = cellValue; const replacements = { MON: '周一', TUE: '周二', WED: '周三', THU: '周四', FRI: '周五', SAT: '周六', SUN: '周日' }; // 使用正则一次性替换所有匹配项 return val.replace(/MON|TUE|WED|THU|FRI|SAT|SUN/g, match => replacements[match]); } }, { prop: "registrant", label: "登记人", minWidth: 100 }, { prop: "createTime", label: "登记日期", minWidth: 100 }, ]); // 操作列配置 const getOperationColumn = (operations) => { if (!operations || operations.length === 0) return null; const operationConfig = { label: "操作", width: 130, fixed: "right", dataType: "action", operation: operations.map(op => { switch (op) { case 'edit': return { name: "编辑", clickFun: handleAdd, color: "#409EFF" }; case 'viewFile': return { name: "查看附件", clickFun: viewFile, color: "#67C23A" }; default: return null; } }).filter(Boolean) }; return operationConfig; if (!operations || operations.length === 0) return null; const operationConfig = { label: "操作", width: 130, fixed: "right", dataType: "action", operation: operations.map(op => { switch (op) { case 'edit': return { name: "编辑", clickFun: handleAdd, color: "#409EFF" }; case 'viewFile': return { name: "查看附件", clickFun: viewFile, color: "#67C23A" }; default: return null; } }).filter(Boolean) }; return operationConfig; }; onMounted(() => { radioChange('taskManage'); radioChange('taskManage'); }); // 单选变化 const radioChange = (value) => { if (value === "taskManage") { const operationColumn = getOperationColumn(['edit']); tableColumns.value = [...columns.value, ...(operationColumn ? [operationColumn] : [])]; operationsArr.value = ['edit']; } else if (value === "task") { const operationColumn = getOperationColumn(['viewFile']); tableColumns.value = [...columns.value, ...(operationColumn ? [operationColumn] : [])]; operationsArr.value = ['viewFile']; } pageNum.value = 1; pageSize.value = 10; getList(); if (value === "taskManage") { const operationColumn = getOperationColumn(['edit']); tableColumns.value = [...columns.value, ...(operationColumn ? [operationColumn] : [])]; operationsArr.value = ['edit']; } else if (value === "task") { const operationColumn = getOperationColumn(['viewFile']); tableColumns.value = [...columns.value, ...(operationColumn ? [operationColumn] : [])]; operationsArr.value = ['viewFile']; } pageNum.value = 1; pageSize.value = 10; getList(); }; // 查询操作 const handleQuery = () => { pageNum.value = 1; pageSize.value = 10; getList(); pageNum.value = 1; pageSize.value = 10; getList(); }; const pagination = (obj) => { pageNum.value = obj.page; pageSize.value = obj.limit; // 分页处理 const handlePagination = (val) => { pageNum.value = val.page; pageSize.value = val.limit; getList(); }; // 获取列表数据 const getList = () => { tableLoading.value = true; const params = { ...queryParams, size: pageSize.value, current: pageNum.value }; let apiCall; if (activeRadio.value === "task") { apiCall = inspectionTaskList(params); } else { apiCall = timingTaskList(params); } apiCall.then(res => { const rawData = res.data.records || []; // 处理 inspector 字段,将字符串转换为数组(适用于所有情况) tableData.value = rawData.map(item => { const processedItem = { ...item }; // 处理 inspector 字段 if (processedItem.inspector) { if (typeof processedItem.inspector === 'string') { // 字符串按逗号分割 processedItem.inspector = processedItem.inspector.split(',').map(s => s.trim()).filter(s => s); } else if (!Array.isArray(processedItem.inspector)) { // 非数组转为数组 processedItem.inspector = [processedItem.inspector]; } } else { // 空值设为空数组 processedItem.inspector = []; } return processedItem; }); total.value = res.data.total || 0; }).finally(() => { tableLoading.value = false; }); tableLoading.value = true; const params = { ...queryParams, size: pageSize.value, current: pageNum.value }; let apiCall; if (activeRadio.value === "task") { apiCall = inspectionTaskList(params); } else { apiCall = timingTaskList(params); } apiCall.then(res => { const rawData = res.data.records || []; // 处理 inspector 字段,将字符串转换为数组(适用于所有情况) tableData.value = rawData.map(item => { const processedItem = { ...item }; // 处理 inspector 字段 if (processedItem.inspector) { if (typeof processedItem.inspector === 'string') { // 字符串按逗号分割 processedItem.inspector = processedItem.inspector.split(',').map(s => s.trim()).filter(s => s); } else if (!Array.isArray(processedItem.inspector)) { // 非数组转为数组 processedItem.inspector = [processedItem.inspector]; } } else { // 空值设为空数组 processedItem.inspector = []; } return processedItem; }); total.value = res.data.total || 0; }).finally(() => { tableLoading.value = false; }); }; // 重置查询 const resetQuery = () => { for (const key in queryParams) { if (!["pageNum", "pageSize"].includes(key)) { queryParams[key] = ""; } } handleQuery(); for (const key in queryParams) { if (!["pageNum", "pageSize"].includes(key)) { queryParams[key] = ""; } } handleQuery(); }; // 新增 / 编辑 const handleAdd = (row) => { const type = row ? 'edit' : 'add'; nextTick(() => { formDia.value?.openDialog(type, row); }); const type = row ? 'edit' : 'add'; nextTick(() => { formDia.value?.openDialog(type, row); }); }; // 查看附件 const viewFile = (row) => { nextTick(() => { viewFiles.value?.openDialog(row); }); nextTick(() => { viewFiles.value?.openDialog(row); }); }; // 删除操作 const handleDelete = () => { if (!selectedRows.value.length) { proxy.$modal.msgWarning("请选择要删除的数据"); return; } const deleteIds = selectedRows.value.map(item => item.id); proxy.$modal.confirm('是否确认删除所选数据项?').then(() => { return delTimingTask(deleteIds); }).then(() => { proxy.$modal.msgSuccess("删除成功"); handleQuery(); }).catch(() => {}); if (!selectedRows.value.length) { proxy.$modal.msgWarning("请选择要删除的数据"); return; } const deleteIds = selectedRows.value.map(item => item.id); proxy.$modal.confirm('是否确认删除所选数据项?').then(() => { return delTimingTask(deleteIds); }).then(() => { proxy.$modal.msgSuccess("删除成功"); handleQuery(); }).catch(() => {}); }; // 多选变更 const handleSelectionChange = (selection) => { selectedRows.value = selection; selectedRows.value = selection; }; // 导出 const handleOut = () => { ElMessageBox.confirm("选中的内容将被导出,是否确认导出?", "导出", { confirmButtonText: "确认", cancelButtonText: "取消", type: "warning", }) .then(() => { // 根据当前选中的标签页调用不同的导出接口 if (activeRadio.value === "taskManage") { // 定时任务管理 proxy.download("/timingTask/export", {}, "定时任务管理.xlsx"); } else if (activeRadio.value === "task") { // 定时任务记录 proxy.download("/inspectionTask/export", {}, "定时任务记录.xlsx"); } }) .catch(() => { proxy.$modal.msg("已取消"); }); ElMessageBox.confirm("选中的内容将被导出,是否确认导出?", "导出", { confirmButtonText: "确认", cancelButtonText: "取消", type: "warning", }) .then(() => { // 根据当前选中的标签页调用不同的导出接口 if (activeRadio.value === "taskManage") { // 定时任务管理 proxy.download("/timingTask/export", {}, "定时任务管理.xlsx"); } else if (activeRadio.value === "task") { // 定时任务记录 proxy.download("/inspectionTask/export", {}, "定时任务记录.xlsx"); } }) .catch(() => { proxy.$modal.msg("已取消"); }); }; </script> <style scoped> .person-tags { display: flex; flex-wrap: wrap; gap: 4px; display: flex; flex-wrap: wrap; gap: 4px; } .person-tag { margin-right: 4px; margin-bottom: 2px; margin-right: 4px; margin-bottom: 2px; } .no-data { color: #909399; font-size: 14px; color: #909399; font-size: 14px; } </style>