feat: 设备巡检任务添加启用/停用

gongchunyi

8 天以前 aeabb6a019fbb7e60bd3b6c8cf3e4081abdff80c

feat: 设备巡检任务添加启用/停用

 src/components/PIMTable/PIMTable.vue

@@ -146,7 +146,7 @@
              @click.stop="o.clickFun(scope.row)"
              :key="key"
            >
              {{ o.name }}
              {{ typeof o.name === 'function' ? o.name(scope.row) : o.name }}
            </el-button>
            <el-upload
              :action="
@@ -426,12 +426,13 @@
};

const getOperationColor = (operation, row) => {
  const colorValue = typeof operation?.color === 'function' ? operation.color(row) : operation?.color;
  const baseColor =
    operation?.name === "删除" || operation?.name === "delete"
      ? "#D93025"
      : operation?.name === "详情"
      ? "#67C23A"
      : operation?.color || "var(--el-color-primary)";
      : colorValue || "var(--el-color-primary)";

  if (isOperationDisabled(operation, row)) {
    return fadeColor(baseColor, 0.35);

 src/views/equipmentManagement/inspectionManagement/components/formDia.vue

@@ -30,6 +30,17 @@
              <el-input v-model="form.remarks" placeholder="请输入备注" type="textarea" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="任务状态" prop="isActive">
              <el-switch
                v-model="form.isActive"
                :active-value="1"
                :inactive-value="0"
                active-text="启用"
                inactive-text="停用"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
@@ -122,7 +133,8 @@
    frequencyType: '',
    frequencyDetail: '',
    week: '',
    time: ''
    time: '',
    isActive: 1  // 默认启用
  },
    rules: {
        taskId: [{ required: true, message: "请选择设备", trigger: "change" },],
@@ -217,8 +229,20 @@
  await loadDeviceName();
  
  if (type === 'edit' && row) {
    form.value = {...row}
    form.value.inspector = form.value.inspectorIds.split(',').map(Number)
    form.value = {
      ...data.form,  // 先复制默认表单
      ...row,        // 再覆盖 row 中的值
    }
    // 确保 inspectorIds 存在才进行 split
    if (form.value.inspectorIds) {
      form.value.inspector = form.value.inspectorIds.split(',').map(Number)
    } else {
      form.value.inspector = []
    }
    // 确保 isActive 有值，默认启用
    if (form.value.isActive === undefined || form.value.isActive === null) {
      form.value.isActive = 1
    }

    if (row.frequencyDetail) {
      if (row.frequencyType === 'WEEKLY') {
@@ -263,7 +287,8 @@
    frequencyType: '',
    frequencyDetail: '',
    week: '',
    time: ''
    time: '',
    isActive: 1  // 默认启用
  }
}

@@ -272,8 +297,11 @@
  proxy.$refs["formRef"].validate(async valid => {
    if (valid) {
      try {
        form.value.inspectorIds = form.value.inspector.join(',')
        delete form.value.inspector
        // 确保 inspector 是数组才进行 join
        if (form.value.inspector && Array.isArray(form.value.inspector)) {
          form.value.inspectorIds = form.value.inspector.join(',')
          delete form.value.inspector
        }
        
        if (form.value.frequencyType === 'WEEKLY') {
          let frequencyDetail = ''

 src/views/equipmentManagement/inspectionManagement/index.vue

@@ -55,8 +55,6 @@
                  :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"
@@ -69,6 +67,10 @@
              <span v-else
                    class="no-data">--</span>
            </div>
          </template>
          <template #statusRef="{ row }">
            <el-tag v-if="row.isActive === true || row.isActive === 1" type="success">启用</el-tag>
            <el-tag v-else type="danger">停用</el-tag>
          </template>
        </PIMTable>
      </div>
@@ -83,6 +85,7 @@
  import { Delete, Plus } from "@element-plus/icons-vue";
  import { onMounted, ref, reactive, getCurrentInstance, nextTick } from "vue";
  import { ElMessageBox } from "element-plus";
  import dayjs from "dayjs";

  // 组件引入
  import PIMTable from "@/components/PIMTable/PIMTable.vue";
@@ -94,6 +97,7 @@
    delTimingTask,
    inspectionTaskList,
    timingTaskList,
    addOrEditTimingTask,
  } from "@/api/inspectionManagement/index.js";

  // 全局变量
@@ -132,12 +136,6 @@
      prop: "frequencyType",
      label: "频次",
      minWidth: 150,
      // formatter: (_, __, val) => ({
      //   DAILY: "每日",
      //   WEEKLY: "每周",
      //   MONTHLY: "每月",
      //   QUARTERLY: "季度"
      // }[val] || "")
      formatData: params => {
        return params === "DAILY"
          ? "每日"
@@ -175,38 +173,55 @@
      },
    },
    { prop: "registrant", label: "登记人", minWidth: 100 },
    { prop: "createTime", label: "登记日期", minWidth: 100 },
    { prop: "createTime", label: "登记日期", minWidth: 120, formatData: (cell) => cell ? dayjs(cell).format("YYYY-MM-DD HH:MM:ss") : "-" },
  ]);

  const statusColumn = {
    prop: "isActive",
    label: "任务状态",
    minWidth: 100,
    align: "center",
    dataType: "slot",
    slot: "statusRef",
  };

  // 操作列配置
  const getOperationColumn = operations => {
    if (!operations || operations.length === 0) return null;

    const operationList = operations
      .map(op => {
        switch (op) {
          case "edit":
            return {
              name: "编辑",
              clickFun: handleAdd,
              color: "#409EFF",
            };
          case "viewFile":
            return {
              name: "查看附件",
              clickFun: viewFile,
              color: "#67C23A",
            };
          case "toggleActive":
            return {
              name: (row) => row.isActive === true || row.isActive === 1 ? "停用" : "启用",
              clickFun: handleToggleActive,
              color: (row) => row.isActive === true || row.isActive === 1 ? "#F56C6C" : "#67C23A",
            };
          default:
            return null;
        }
      })
      .filter(Boolean);

    const operationConfig = {
      label: "操作",
      width: 130,
      width: 200,
      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),
      operation: operationList,
    };

    return operationConfig;
@@ -219,12 +234,13 @@
  // 单选变化
  const radioChange = value => {
    if (value === "taskManage") {
      const operationColumn = getOperationColumn(["edit"]);
      const operationColumn = getOperationColumn(["edit", "toggleActive"]);
      tableColumns.value = [
        ...columns.value,
        statusColumn,
        ...(operationColumn ? [operationColumn] : []),
      ];
      operationsArr.value = ["edit"];
      operationsArr.value = ["edit", "toggleActive"];
    } else if (value === "task") {
      const operationColumn = getOperationColumn(["viewFile"]);
      tableColumns.value = [
@@ -346,6 +362,35 @@
      .catch(() => {});
  };

  // 启用/停用切换
  const handleToggleActive = async (row) => {
    const newStatus = row.isActive === true || row.isActive === 1 ? 0 : 1;
    const actionText = newStatus === 1 ? "启用" : "停用";

    try {
      await proxy.$modal.confirm(`是否确认${actionText}该任务？`)
    } catch {
      return
    }

    try {
      await addOrEditTimingTask({
        id: row.id,
        taskId: row.taskId,
        taskName: row.taskName,
        inspectorIds: row.inspectorIds,
        remarks: row.remarks,
        frequencyType: row.frequencyType,
        frequencyDetail: row.frequencyDetail,
        isActive: newStatus,
      })
      proxy.$modal.msgSuccess(`${actionText}成功`)
      handleQuery()
    } catch (error) {
      console.error(`${actionText}失败:`, error)
    }
  };

  // 多选变更
  const handleSelectionChange = selection => {
    selectedRows.value = selection;