优化巡检管理显示及数据处理

zhang_12370

2 天以前 26e0f4997558b60eda9dcb8979b777b47b31675e

 src/views/inspectionManagement/index.vue

@@ -56,7 +56,26 @@
                  @edit="handleAdd"
                  @viewFile="viewFile"
                  v-if="tabName === 'task'"
          ></ETable>
          >
          <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>
          </ETable>
          <el-table ref="table" :data="tableData" height="480" v-loading="tableLoading" border v-else style="width: 100%;height: calc(100vh - 25em)">
            <el-table-column label="序号" type="index" width="60" align="center" />
            <el-table-column prop="deviceName" label="设备名称" :show-overflow-tooltip="true">
@@ -80,10 +99,10 @@
        </div>
        <pagination
            v-if="total>0"
            :page-num="pageNum"
            :page-size="pageSize"
            :page="pageNum"
            :limit="pageSize"
            :total="total"
            @pagination="handleQuery"
            @pagination="handlePagination"
            :layout="'total, prev, pager, next, jumper'"
        />
      </div>
@@ -162,7 +181,7 @@
  { prop: "taskName", label: "巡检任务名称", minWidth: 160 },
  { prop: "inspectionLocation", label: "地点", minWidth: 120 },
  { prop: "remarks", label: "备注", minWidth: 150 },
  { prop: "inspector", label: "执行巡检人", minWidth: 150 },
  { prop: "inspector", label: "执行巡检人", minWidth: 150, slot: "inspector" },
  {
    prop: "frequencyType",
    label: "频次",
@@ -240,7 +259,12 @@
  pageSize.value = 10;
  getList();
};

// 分页处理
const handlePagination = (val) => {
   pageNum.value = val.page;
   pageSize.value = val.limit;
   getList();
};
// 获取列表数据
const getList = () => {
  tableLoading.value = true;
@@ -264,7 +288,27 @@
  }
  
  apiCall.then(res => {
    tableData.value = res.data.records || [];
    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;
@@ -329,5 +373,19 @@
</script>

<style scoped>
.person-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.person-tag {
  margin-right: 4px;
  margin-bottom: 2px;
}

.no-data {
  color: #909399;
  font-size: 14px;
}
</style>