1.军泰伟业代码初始化

gaoluyang

6 小时以前 076bb96b437258f0e8cdbe184040e1e302b60d4b

 src/views/equipmentManagement/inspectionManagement/index.vue

@@ -1,80 +1,78 @@
<template>
  <div class="app-container">
    <el-form :inline="true" :model="queryParams" class="search-form">
      <el-form-item label="搜索">
        <el-input
            v-model="queryParams.searchAll"
            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)' }"
          >
          <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>
        <pagination
            v-if="total>0"
            :page="pageNum"
            :limit="pageSize"
            :total="total"
            @pagination="handlePagination"
            :layout="'total, prev, pager, next, jumper'"
        />
      </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.searchAll"
               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>
</template>

<script setup>
@@ -90,9 +88,9 @@

// 接口引入
import {
  delTimingTask,
  inspectionTaskList,
  timingTaskList
   delTimingTask,
   inspectionTaskList,
   timingTaskList
} from "@/api/inspectionManagement/index.js";

// 全局变量
@@ -102,14 +100,14 @@

// 查询参数
const queryParams = reactive({
  searchAll: "",
   searchAll: "",
});

// 单选框配置
const activeRadio = ref("taskManage");
const radios = reactive([
  { name: "taskManage", label: "定时任务管理" },
  { name: "task", label: "定时任务记录" },
   { name: "taskManage", label: "定时任务管理" },
   { name: "task", label: "定时任务记录" },
]);

// 表格数据
@@ -124,234 +122,233 @@

// 列配置
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,
    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 },
   { 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: "dateStr", 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 handlePagination = (val) => {
   pageNum.value = val.page;
   pageSize.value = val.size;
const pagination = (obj) => {
   pageNum.value = obj.page;
   pageSize.value = obj.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>