feat: 设备保养和巡检优化,项目拆分

gongchunyi

2026-10-16 9fae4a56c15392babde83d68db4073762900082d

 src/views/equipmentManagement/upkeep/index.vue

@@ -1,192 +1,173 @@
<template>
  <div class="app-container">
    <el-tabs v-model="activeTab"
             @tab-change="handleTabChange">
    <el-tabs v-model="activeTab" @tab-change="handleTabChange">
      <!-- 保养任务tab -->
      <el-tab-pane label="保养任务"
                   name="scheduled">
      <el-tab-pane label="保养任务" name="scheduled">
        <div class="search_form">
          <el-form :model="scheduledFilters"
                   :inline="true">
          <el-form :model="scheduledFilters" :inline="true">
            <el-form-item label="任务名称">
              <el-input v-model="scheduledFilters.taskName"
                        style="width: 240px"
                        placeholder="请输入任务名称"
                        clearable
                        :prefix-icon="Search"
                        @change="getScheduledTableData" />
              <el-input
                v-model="scheduledFilters.taskName"
                style="width: 240px"
                placeholder="请输入任务名称"
                clearable
                :prefix-icon="Search"
                @change="getScheduledTableData"
              />
            </el-form-item>
            <el-form-item label="任务状态">
              <el-select v-model="scheduledFilters.status"
                         placeholder="请选择任务状态"
                         clearable
                         style="width: 200px">
                <el-option label="启用"
                           value="1" />
                <el-option label="停用"
                           value="0" />
              <el-select
                v-model="scheduledFilters.status"
                placeholder="请选择任务状态"
                clearable
                style="width: 200px"
              >
                <el-option label="启用" value="1" />
                <el-option label="停用" value="0" />
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                         @click="getScheduledTableData">搜索</el-button>
              <el-button type="primary" @click="getScheduledTableData">搜索</el-button>
              <el-button @click="resetScheduledFilters">重置</el-button>
            </el-form-item>
          </el-form>
        </div>
        <div class="table_list">
          <div class="actions">
            <el-text class="mx-1"
                     size="large">保养任务</el-text>
            <el-text class="mx-1" size="large">保养任务</el-text>
            <div>
              <el-button type="primary"
                         icon="Plus"
                         @click="addScheduledTask">
                新增任务
              </el-button>
              <el-button type="danger"
                         icon="Delete"
                         :disabled="scheduledMultipleList.length <= 0"
                         @click="delScheduledTaskByIds(scheduledMultipleList.map((item) => item.id))">
              <el-button type="primary" icon="Plus" @click="addScheduledTask"> 新增任务 </el-button>
              <el-button
                type="danger"
                icon="Delete"
                :disabled="scheduledMultipleList.length <= 0"
                @click="delScheduledTaskByIds(scheduledMultipleList.map((item) => item.id))"
              >
                批量删除
              </el-button>
            </div>
          </div>
          <PIMTable rowKey="id"
                    isSelection
                    :column="scheduledColumns"
                    :tableData="scheduledDataList"
                    :page="{
          <PIMTable
            rowKey="id"
            isSelection
            :column="scheduledColumns"
            :tableData="scheduledDataList"
            :page="{
              current: scheduledPagination.currentPage,
              size: scheduledPagination.pageSize,
              total: scheduledPagination.total,
            }"
                    @selection-change="handleScheduledSelectionChange"
                    @pagination="changeScheduledPage">
            @selection-change="handleScheduledSelectionChange"
            @pagination="changeScheduledPage"
          >
            <template #isActiveRef="{ row }">
              <el-tag v-if="row.isActive === 1"
                      type="success">开启</el-tag>
              <el-tag v-else
                      type="info">关闭</el-tag>
              <el-tag v-if="row.isActive === 1" type="success">开启</el-tag>
              <el-tag v-else type="info">关闭</el-tag>
            </template>
            <template #statusRef="{ row }">
              <el-tag v-if="row.status === 1"
                      type="success">启用</el-tag>
              <el-tag v-if="row.status === 0"
                      type="danger">停用</el-tag>
              <el-tag v-if="row.status === 1" type="success">启用</el-tag>
              <el-tag v-if="row.status === 0" type="danger">停用</el-tag>
            </template>
            <template #operation="{ row }">
              <el-button type="primary"
                         link
                         @click="handleDetail(row)">
                详情
              </el-button>
              <el-button type="primary"
                         link
                         @click="editScheduledTask(row)">
                编辑
              </el-button>
              <el-button type="danger"
                         link
                         @click="delScheduledTaskByIds(row.id)">
              <el-button type="primary" link @click="handleDetail(row)"> 详情 </el-button>
              <el-button type="primary" link @click="editScheduledTask(row)"> 编辑 </el-button>
              <el-button type="danger" link @click="delScheduledTaskByIds(row.id)">
                删除
              </el-button>
            </template>
          </PIMTable>
        </div>
      </el-tab-pane>
      <el-tab-pane label="保养内容" name="items">
        <ItemManager />
      </el-tab-pane>
      <!-- 保养记录tab（原设备保养页面） -->
      <el-tab-pane label="保养记录"
                   name="record">
      <el-tab-pane label="保养记录" name="record">
        <div class="search_form">
          <el-form :model="filters"
                   :inline="true">
          <el-form :model="filters" :inline="true">
            <el-form-item label="设备名称">
              <el-input v-model="filters.deviceName"
                        style="width: 240px"
                        placeholder="请输入设备名称"
                        clearable
                        :prefix-icon="Search"
                        @change="getTableData" />
              <el-input
                v-model="filters.deviceName"
                style="width: 240px"
                placeholder="请输入设备名称"
                clearable
                :prefix-icon="Search"
                @change="getTableData"
              />
            </el-form-item>
            <el-form-item label="计划保养日期">
              <el-date-picker v-model="filters.maintenancePlanTime"
                              type="date"
                              placeholder="请选择计划保养日期"
                              size="default"
                              @change="(date) => handleDateChange(date,2)" />
              <el-date-picker
                v-model="filters.maintenancePlanTime"
                type="date"
                placeholder="请选择计划保养日期"
                size="default"
                @change="(date) => handleDateChange(date, 2)"
              />
            </el-form-item>
            <el-form-item label="实际保养日期">
              <el-date-picker v-model="filters.maintenanceActuallyTime"
                              type="date"
                              placeholder="请选择实际保养日期"
                              size="default"
                              @change="(date) => handleDateChange(date,1)" />
              <el-date-picker
                v-model="filters.maintenanceActuallyTime"
                type="date"
                placeholder="请选择实际保养日期"
                size="default"
                @change="(date) => handleDateChange(date, 1)"
              />
            </el-form-item>
            <el-form-item label="实际保养人">
              <el-input v-model="filters.maintenanceActuallyName"
                        style="width: 240px"
                        placeholder="请输入实际保养人"
                        clearable
                        :prefix-icon="Search"
                        @change="getTableData" />
              <el-input
                v-model="filters.maintenanceActuallyName"
                style="width: 240px"
                placeholder="请输入实际保养人"
                clearable
                :prefix-icon="Search"
                @change="getTableData"
              />
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                         @click="getTableData">搜索</el-button>
              <el-button type="primary" @click="getTableData">搜索</el-button>
              <el-button @click="resetFilters">重置</el-button>
            </el-form-item>
          </el-form>
        </div>
        <div class="table_list">
          <div class="actions">
            <el-text class="mx-1"
                     size="large">保养记录</el-text>
            <el-text class="mx-1" size="large">保养记录</el-text>
            <div>
              <el-button type="success"
                         icon="Van"
                         @click="addPlan">
                新增计划
              </el-button>
              <el-button @click="handleOut">
                导出
              </el-button>
              <el-button type="danger"
                         icon="Delete"
                         :disabled="multipleList.length <= 0 || hasFinishedStatus"
                         @click="delRepairByIds(multipleList.map((item) => item.id))">
              <el-button type="success" icon="Van" @click="addPlan"> 新增计划 </el-button>
              <el-button @click="handleOut"> 导出 </el-button>
              <el-button
                type="danger"
                icon="Delete"
                :disabled="multipleList.length <= 0 || hasFinishedStatus"
                @click="delRepairByIds(multipleList.map((item) => item.id))"
              >
                批量删除
              </el-button>
            </div>
          </div>
          <PIMTable rowKey="id"
                    isSelection
                    :column="columns"
                    :tableData="dataList"
                    :page="{
          current: pagination.currentPage,
          size: pagination.pageSize,
          total: pagination.total,
        }"
                    @selection-change="handleSelectionChange"
                    @pagination="changePage">
          <PIMTable
            rowKey="id"
            isSelection
            :column="columns"
            :tableData="dataList"
            :page="{
              current: pagination.currentPage,
              size: pagination.pageSize,
              total: pagination.total,
            }"
            @selection-change="handleSelectionChange"
            @pagination="changePage"
          >
            <template #maintenanceResultRef="{ row }">
              <div>{{ row.maintenanceResult || '-' }}</div>
              <div>{{ row.maintenanceResult || "-" }}</div>
            </template>
            <template #statusRef="{ row }">
              <el-tag v-if="row.status === 2"
                      type="danger">失败</el-tag>
              <el-tag v-if="row.status === 1"
                      type="success">完结</el-tag>
              <el-tag v-if="row.status === 0"
                      type="warning">待保养</el-tag>
              <el-tag v-if="row.status === 2" type="danger">失败</el-tag>
              <el-tag v-if="row.status === 1" type="success">完结</el-tag>
              <el-tag v-if="row.status === 0" type="warning">待保养</el-tag>
            </template>
            <template #operation="{ row }">
              <el-button type="primary"
                         link
                         @click="handleRecordDetail(row)">
                详情
              </el-button>
              <el-button type="primary" link @click="handleRecordDetail(row)"> 详情 </el-button>
              <!-- 这个功能跟新增保养功能一模一样，有啥意义？ -->
              <!-- <el-button
              type="primary"
@@ -195,509 +176,475 @@
          >
            新增保养
          </el-button> -->
              <el-button type="primary"
                         link
                         :disabled="row.status === 1"
                         @click="editPlan(row.id)">
              <el-button type="primary" link :disabled="row.status === 1" @click="editPlan(row.id)">
                编辑
              </el-button>
              <el-button type="success"
                         link
                         :disabled="row.status === 1"
                         @click="addMaintain(row)">
              <el-button type="success" link :disabled="row.status === 1" @click="addMaintain(row)">
                保养
              </el-button>
              <el-button type="danger"
                         link
                         :disabled="row.status === 1"
                         @click="delRepairByIds(row.id)">
              <el-button
                type="danger"
                link
                :disabled="row.status === 1"
                @click="delRepairByIds(row.id)"
              >
                删除
              </el-button>
              <el-button type="primary"
                         link
                         @click="openFileDialog(row)">
                附件
              </el-button>
              <el-button type="primary" link @click="openFileDialog(row)"> 附件 </el-button>
            </template>
          </PIMTable>
        </div>
      </el-tab-pane>
    </el-tabs>
    <PlanModal ref="planModalRef"
               @ok="getTableData" />
    <MaintenanceModal ref="maintainModalRef"
                      @ok="getTableData" />
    <FormDia ref="formDiaRef"
             @closeDia="getScheduledTableData" />
    <PlanModal ref="planModalRef" @ok="getTableData" />
    <MaintenanceModal ref="maintainModalRef" @ok="getTableData" />
    <FormDia ref="formDiaRef" @closeDia="getScheduledTableData" />
    <DetailDia ref="detailDiaRef" />
    <RecordDetailDia ref="recordDetailDiaRef" />
    <FileList v-if="fileDialogVisible"
              v-model:visible="fileDialogVisible"
              :record-type="'device_maintenance'"
              :record-id="currentMaintenanceTaskId" />
    <FileList
      v-if="fileDialogVisible"
      v-model:visible="fileDialogVisible"
      :record-type="'device_maintenance'"
      :record-id="currentMaintenanceTaskId"
    />
  </div>
</template>

<script setup>
  import {
    ref,
    onMounted,
    reactive,
    getCurrentInstance,
    nextTick,
    computed,
    defineAsyncComponent,
  } from "vue";
  import { Search } from "@element-plus/icons-vue";
  import { ElMessage, ElMessageBox } from "element-plus";
  import PlanModal from "./Form/PlanModal.vue";
  import MaintenanceModal from "./Form/MaintenanceModal.vue";
  import FormDia from "./Form/formDia.vue";
  import DetailDia from "./Form/detailDia.vue";
  import RecordDetailDia from "./Form/RecordDetailDia.vue";
  import {
    getUpkeepPage,
    delUpkeep,
    deviceMaintenanceTaskList,
    deviceMaintenanceTaskDel,
  } from "@/api/equipmentManagement/upkeep";
  import dayjs from "dayjs";
import {
  ref,
  onMounted,
  reactive,
  getCurrentInstance,
  nextTick,
  computed,
  defineAsyncComponent,
} from "vue";
import { Search } from "@element-plus/icons-vue";
import { ElMessage, ElMessageBox } from "element-plus";
import PlanModal from "./Form/PlanModal.vue";
import MaintenanceModal from "./Form/MaintenanceModal.vue";
import FormDia from "./Form/formDia.vue";
import DetailDia from "./Form/detailDia.vue";
import RecordDetailDia from "./Form/RecordDetailDia.vue";
import ItemManager from "./Form/ItemManager.vue";
import {
  getUpkeepPage,
  delUpkeep,
  deviceMaintenanceTaskList,
  deviceMaintenanceTaskDel,
} from "@/api/equipmentManagement/upkeep";
import dayjs from "dayjs";

  const { proxy } = getCurrentInstance();
  const FileList = defineAsyncComponent(() =>
    import("@/components/Dialog/FileList.vue")
  );
const { proxy } = getCurrentInstance();
const FileList = defineAsyncComponent(() => import("@/components/Dialog/FileList.vue"));

  // Tab相关
  const activeTab = ref("scheduled");
// Tab相关
const activeTab = ref("scheduled");

  // 计划弹窗控制器
  const planModalRef = ref();
  // 保养弹窗控制器
  const maintainModalRef = ref();
  // 定时任务弹窗控制器
  const formDiaRef = ref();
  // 定时任务详情弹窗控制器
  const detailDiaRef = ref();
  // 保养记录详情弹窗控制器
  const recordDetailDiaRef = ref();
  // 附件弹窗
  const fileListDialogRef = ref(null);
  const fileDialogVisible = ref(false);
  const currentMaintenanceTaskId = ref(null);
// 计划弹窗控制器
const planModalRef = ref();
// 保养弹窗控制器
const maintainModalRef = ref();
// 定时任务弹窗控制器
const formDiaRef = ref();
// 定时任务详情弹窗控制器
const detailDiaRef = ref();
// 保养记录详情弹窗控制器
const recordDetailDiaRef = ref();
// 附件弹窗
const fileListDialogRef = ref(null);
const fileDialogVisible = ref(false);
const currentMaintenanceTaskId = ref(null);

  // 保养记录tab（原设备保养页面）相关变量
  const filters = reactive({
    deviceName: "",
    maintenancePlanTime: "",
    maintenanceActuallyTime: "",
    maintenanceActuallyName: "",
  });
// 保养记录tab（原设备保养页面）相关变量
const filters = reactive({
  deviceName: "",
  maintenancePlanTime: "",
  maintenanceActuallyTime: "",
  maintenanceActuallyName: "",
});

  const dataList = ref([]);
  const pagination = ref({
    currentPage: 1,
    pageSize: 10,
    total: 0,
  });
  const multipleList = ref([]);
const dataList = ref([]);
const pagination = ref({
  currentPage: 1,
  pageSize: 10,
  total: 0,
});
const multipleList = ref([]);

  // 保养任务tab相关变量
  const scheduledFilters = reactive({
    taskName: "",
    status: "",
  });
// 保养任务tab相关变量
const scheduledFilters = reactive({
  taskName: "",
  status: "",
});

  const scheduledDataList = ref([]);
  const scheduledPagination = reactive({
    currentPage: 1,
    pageSize: 10,
    total: 0,
  });
  const scheduledMultipleList = ref([]);
const scheduledDataList = ref([]);
const scheduledPagination = reactive({
  currentPage: 1,
  pageSize: 10,
  total: 0,
});
const scheduledMultipleList = ref([]);

  // 保养任务表格列配置
  const scheduledColumns = ref([
    { prop: "taskName", label: "设备名称" },
    {
      label: "规格型号",
      prop: "deviceModel",
    },
    {
      label: "保养项目",
      prop: "machineryCategory",
      minWidth: 120,
      formatData: cell => cell || "--",
    },
    {
      prop: "frequencyType",
      label: "频次",
      minWidth: 80,
      // PIMTable 使用的是 formatData，而不是 Element-Plus 的 formatter
      formatData: cell =>
        ({
          DAILY: "每日",
          WEEKLY: "每周",
          MONTHLY: "每月",
          QUARTERLY: "季度",
        }[cell] || ""),
    },
    {
      prop: "frequencyDetail",
      label: "开始日期与时间",
      minWidth: 130,
      // 同样改用 formatData，PIMTable 内部会把单元格值传进来
      formatData: cell => {
        if (typeof cell !== "string") return "";
        let val = cell;
        const replacements = {
          MON: "周一",
          TUE: "周二",
          WED: "周三",
          THU: "周四",
          FRI: "周五",
          SAT: "周六",
          SUN: "周日",
        };
        // 使用正则一次性替换所有匹配项
        return val.replace(
          /MON|TUE|WED|THU|FRI|SAT|SUN/g,
          match => replacements[match]
        );
      },
    },
    {
      prop: "isActive",
      label: "定时任务",
      dataType: "slot",
      slot: "isActiveRef",
      align: "center",
      minWidth: 100,
    },
    { prop: "maintenancePerson", label: "保养人", minWidth: 100 },
    { prop: "registrant", label: "登记人", minWidth: 100 },
    {
      prop: "registrationDate",
      label: "登记日期",
      minWidth: 100,
      formatData: cell =>
        cell ? dayjs(cell).format("YYYY-MM-DD") : "-",
    },
    {
      fixed: "right",
      label: "操作",
      dataType: "slot",
      slot: "operation",
      align: "center",
      width: "160px",
    },
  ]);

  // 保养记录表格列配置（原设备保养表格列）
  const columns = ref([
    {
      label: "设备名称",
      align: "center",
      prop: "deviceName",
    },
    {
      label: "规格型号",
      align: "center",
      prop: "deviceModel",
    },
    {
      label: "计划保养日期",
      align: "center",
      prop: "maintenancePlanTime",
      formatData: cell => {
        return cell == null ? "-" : dayjs(cell).format("YYYY-MM-DD");
      },
    },
    {
      label: "录入人",
      align: "center",
      prop: "createUserName",
    },
    {
      label: "保养项目",
      align: "center",
      prop: "machineryCategory",
      formatData: cell => cell || "--",
    },
    // {
    //   label: "录入日期",
    //   align: "center",
    //   prop: "createTime",
    //   formatData: (cell) => dayjs(cell).format("YYYY-MM-DD HH:mm:ss"),
    //   width: 200,
    // },
    {
      label: "实际保养人",
      align: "center",
      prop: "maintenanceActuallyName",
    },
    {
      label: "实际保养日期",
      align: "center",
      prop: "maintenanceActuallyTime",
      formatData: cell =>
        cell ? dayjs(cell).format("YYYY-MM-DD") : "-",
    },
    {
      label: "保养结果",
      align: "center",
      prop: "maintenanceResult",
      dataType: "slot",
      slot: "maintenanceResultRef",
    },
    {
      label: "状态",
      align: "center",
      prop: "status",
      dataType: "slot",
      slot: "statusRef",
    },
    {
      fixed: "right",
      label: "操作",
      dataType: "slot",
      slot: "operation",
      align: "center",
      width: "250px",
    },
  ]);

  // Tab切换处理
  const handleTabChange = tabName => {
    if (tabName === "record") {
      getTableData();
    } else if (tabName === "scheduled") {
      getScheduledTableData();
    }
  };

  // 保养任务相关方法
  const getScheduledTableData = async () => {
    try {
      const params = {
        current: scheduledPagination.currentPage,
        size: scheduledPagination.pageSize,
        taskName: scheduledFilters.taskName || undefined,
        status: scheduledFilters.status || undefined,
// 保养任务表格列配置
const scheduledColumns = ref([
  { prop: "taskName", label: "设备名称" },
  {
    label: "规格型号",
    prop: "deviceModel",
  },
  {
    prop: "frequencyType",
    label: "频次",
    minWidth: 80,
    // PIMTable 使用的是 formatData，而不是 Element-Plus 的 formatter
    formatData: (cell) =>
      ({
        DAILY: "每日",
        WEEKLY: "每周",
        MONTHLY: "每月",
        QUARTERLY: "季度",
      }[cell] || ""),
  },
  {
    prop: "frequencyDetail",
    label: "开始日期与时间",
    minWidth: 130,
    // 同样改用 formatData，PIMTable 内部会把单元格值传进来
    formatData: (cell) => {
      if (typeof cell !== "string") return "";
      let val = cell;
      const replacements = {
        MON: "周一",
        TUE: "周二",
        WED: "周三",
        THU: "周四",
        FRI: "周五",
        SAT: "周六",
        SUN: "周日",
      };
      const { code, data } = await deviceMaintenanceTaskList(params);
      if (code === 200) {
        scheduledDataList.value = data?.records || [];
        scheduledPagination.total = data?.total || 0;
      }
    } catch (error) {
      ElMessage.error("获取定时任务列表失败");
      // 使用正则一次性替换所有匹配项
      return val.replace(/MON|TUE|WED|THU|FRI|SAT|SUN/g, (match) => replacements[match]);
    },
  },
  {
    prop: "isActive",
    label: "定时任务",
    dataType: "slot",
    slot: "isActiveRef",
    align: "center",
    minWidth: 100,
  },
  { prop: "maintenancePerson", label: "保养人", minWidth: 100 },
  { prop: "registrant", label: "登记人", minWidth: 100 },
  {
    prop: "registrationDate",
    label: "登记日期",
    minWidth: 100,
    formatData: (cell) => (cell ? dayjs(cell).format("YYYY-MM-DD") : "-"),
  },
  {
    fixed: "right",
    label: "操作",
    dataType: "slot",
    slot: "operation",
    align: "center",
    width: "160px",
  },
]);

// 保养记录表格列配置（原设备保养表格列）
const columns = ref([
  {
    label: "设备名称",
    align: "center",
    prop: "deviceName",
  },
  {
    label: "规格型号",
    align: "center",
    prop: "deviceModel",
  },
  {
    label: "计划保养日期",
    align: "center",
    prop: "maintenancePlanTime",
    formatData: (cell) => {
      return cell == null ? "-" : dayjs(cell).format("YYYY-MM-DD");
    },
  },
  {
    label: "录入人",
    align: "center",
    prop: "createUserName",
  },
  // {
  //   label: "录入日期",
  //   align: "center",
  //   prop: "createTime",
  //   formatData: (cell) => dayjs(cell).format("YYYY-MM-DD HH:mm:ss"),
  //   width: 200,
  // },
  {
    label: "实际保养人",
    align: "center",
    prop: "maintenanceActuallyName",
  },
  {
    label: "实际保养日期",
    align: "center",
    prop: "maintenanceActuallyTime",
    formatData: (cell) => (cell ? dayjs(cell).format("YYYY-MM-DD") : "-"),
  },
  {
    label: "保养结果",
    align: "center",
    prop: "maintenanceResult",
    dataType: "slot",
    slot: "maintenanceResultRef",
  },
  {
    label: "状态",
    align: "center",
    prop: "status",
    dataType: "slot",
    slot: "statusRef",
  },
  {
    fixed: "right",
    label: "操作",
    dataType: "slot",
    slot: "operation",
    align: "center",
    width: "250px",
  },
]);

// Tab切换处理
const handleTabChange = (tabName) => {
  if (tabName === "record") {
    getTableData();
  } else if (tabName === "scheduled") {
    getScheduledTableData();
  }
};

// 保养任务相关方法
const getScheduledTableData = async () => {
  try {
    const params = {
      current: scheduledPagination.currentPage,
      size: scheduledPagination.pageSize,
      taskName: scheduledFilters.taskName || undefined,
      status: scheduledFilters.status || undefined,
    };
    const { code, data } = await deviceMaintenanceTaskList(params);
    if (code === 200) {
      scheduledDataList.value = data?.records || [];
      scheduledPagination.total = data?.total || 0;
    }
  };
  } catch (error) {
    ElMessage.error("获取定时任务列表失败");
  }
};

  const resetScheduledFilters = () => {
    scheduledFilters.taskName = "";
    scheduledFilters.status = "";
    getScheduledTableData();
  };
const resetScheduledFilters = () => {
  scheduledFilters.taskName = "";
  scheduledFilters.status = "";
  getScheduledTableData();
};

  const handleScheduledSelectionChange = selection => {
    scheduledMultipleList.value = selection;
  };
const handleScheduledSelectionChange = (selection) => {
  scheduledMultipleList.value = selection;
};

  const changeScheduledPage = page => {
    scheduledPagination.currentPage = page.page;
    scheduledPagination.pageSize = page.limit;
    getScheduledTableData();
  };
const changeScheduledPage = (page) => {
  scheduledPagination.currentPage = page.page;
  scheduledPagination.pageSize = page.limit;
  getScheduledTableData();
};

  const addScheduledTask = () => {
const addScheduledTask = () => {
  nextTick(() => {
    formDiaRef.value?.openDialog("add");
  });
};

const editScheduledTask = (row) => {
  if (row) {
    nextTick(() => {
      formDiaRef.value?.openDialog("add");
      formDiaRef.value?.openDialog("edit", row);
    });
  };
  }
};

  const editScheduledTask = row => {
    if (row) {
      nextTick(() => {
        formDiaRef.value?.openDialog("edit", row);
      });
const handleDetail = (row) => {
  if (row) {
    nextTick(() => {
      detailDiaRef.value?.openDialog(row);
    });
  }
};

const delScheduledTaskByIds = async (ids) => {
  try {
    await ElMessageBox.confirm("确定删除选中的定时任务吗？", "提示", {
      type: "warning",
    });
    const payload = Array.isArray(ids) ? ids : [ids];
    await deviceMaintenanceTaskDel(payload);
    ElMessage.success("删除定时任务成功");
    getScheduledTableData();
  } catch (error) {
    // 用户取消删除
  }
};

const handleScheduledOut = () => {
  ElMessage.info("导出定时任务功能待实现");
};

// 保养记录相关方法（原设备保养页面方法）
const getTableData = async () => {
  try {
    const params = {
      current: pagination.value.currentPage,
      size: pagination.value.pageSize,
      deviceName: filters.deviceName || undefined,
      maintenancePlanTime: filters.maintenancePlanTime
        ? dayjs(filters.maintenancePlanTime).format("YYYY-MM-DD")
        : undefined,
      maintenanceActuallyTime: filters.maintenanceActuallyTime
        ? dayjs(filters.maintenanceActuallyTime).format("YYYY-MM-DD")
        : undefined,
      maintenanceActuallyName: filters.maintenanceActuallyName || undefined,
    };

    const { code, data } = await getUpkeepPage(params);
    if (code === 200) {
      dataList.value = data.records;
      pagination.value.total = data.total;
    }
  };
  } catch (error) {
    console.log(error);
  }
};

  const handleDetail = row => {
    if (row) {
      nextTick(() => {
        detailDiaRef.value?.openDialog(row);
      });
    }
  };
const resetFilters = () => {
  filters.deviceName = "";
  filters.maintenancePlanTime = "";
  filters.maintenanceActuallyTime = "";
  filters.maintenanceActuallyName = "";
  getTableData();
};

  const delScheduledTaskByIds = async ids => {
    try {
      await ElMessageBox.confirm("确定删除选中的定时任务吗？", "提示", {
        type: "warning",
      });
      const payload = Array.isArray(ids) ? ids : [ids];
      await deviceMaintenanceTaskDel(payload);
      ElMessage.success("删除定时任务成功");
      getScheduledTableData();
    } catch (error) {
      // 用户取消删除
    }
  };
const handleSelectionChange = (selection) => {
  multipleList.value = selection;
};

  const handleScheduledOut = () => {
    ElMessage.info("导出定时任务功能待实现");
  };
// 检查选中的记录中是否有完结状态的
const hasFinishedStatus = computed(() => {
  return multipleList.value.some((item) => item.status === 1);
});

  // 保养记录相关方法（原设备保养页面方法）
  const getTableData = async () => {
    try {
      const params = {
        current: pagination.value.currentPage,
        size: pagination.value.pageSize,
        deviceName: filters.deviceName || undefined,
        maintenancePlanTime: filters.maintenancePlanTime
          ? dayjs(filters.maintenancePlanTime).format("YYYY-MM-DD")
          : undefined,
        maintenanceActuallyTime: filters.maintenanceActuallyTime
          ? dayjs(filters.maintenanceActuallyTime).format("YYYY-MM-DD")
          : undefined,
        maintenanceActuallyName: filters.maintenanceActuallyName || undefined,
      };
const changePage = (page) => {
  pagination.value.currentPage = page.page;
  pagination.value.pageSize = page.limit;
  getTableData();
};

      const { code, data } = await getUpkeepPage(params);
      if (code === 200) {
        dataList.value = data.records;
        pagination.value.total = data.total;
      }
    } catch (error) {
      console.log(error);
    }
  };
const addMaintain = (row) => {
  maintainModalRef.value.open(row.id, row);
};

  const resetFilters = () => {
    filters.deviceName = "";
    filters.maintenancePlanTime = "";
    filters.maintenanceActuallyTime = "";
    filters.maintenanceActuallyName = "";
    getTableData();
  };
const handleRecordDetail = (row) => {
  if (row) {
    nextTick(() => {
      recordDetailDiaRef.value?.openDialog(row);
    });
  }
};

  const handleSelectionChange = selection => {
    multipleList.value = selection;
  };
const addPlan = () => {
  planModalRef.value.openModal();
};

  // 检查选中的记录中是否有完结状态的
  const hasFinishedStatus = computed(() => {
    return multipleList.value.some(item => item.status === 1);
  });
const editPlan = (id) => {
  planModalRef.value.openEdit(id);
};

  const changePage = page => {
    pagination.value.currentPage = page.page;
    pagination.value.pageSize = page.limit;
    getTableData();
  };
const delRepairByIds = async (ids) => {
  // 检查是否有完结状态的记录
  const hasFinished = multipleList.value.some((item) => item.status === 1);
  if (hasFinished) {
    ElMessage.warning("不能删除状态为完结的记录");
    return;
  }

  const addMaintain = row => {
    maintainModalRef.value.open(row.id, row);
  };

  const handleRecordDetail = row => {
    if (row) {
      nextTick(() => {
        recordDetailDiaRef.value?.openDialog(row);
      });
    }
  };

  const addPlan = () => {
    planModalRef.value.openModal();
  };

  const editPlan = id => {
    planModalRef.value.openEdit(id);
  };

  const delRepairByIds = async ids => {
    // 检查是否有完结状态的记录
    const hasFinished = multipleList.value.some(item => item.status === 1);
    if (hasFinished) {
      ElMessage.warning("不能删除状态为完结的记录");
      return;
    }

    try {
      await ElMessageBox.confirm("确认删除保养数据, 此操作不可逆?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      });

      const { code } = await delUpkeep(ids);
      if (code === 200) {
        ElMessage.success("删除成功");
        getTableData();
      }
    } catch (error) {
      // 用户取消删除
    }
  };

  const handleOut = () => {
    ElMessageBox.confirm("选中的内容将被导出，是否确认导出？", "导出", {
      confirmButtonText: "确认",
  try {
    await ElMessageBox.confirm("确认删除保养数据, 此操作不可逆?", "警告", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(() => {
        proxy.download("/device/maintenance/export", {}, "设备保养.xlsx");
      })
      .catch(() => {
        ElMessage.info("已取消");
      });
  };
    });

  const handleDateChange = (date, type) => {
    if (type === 1) {
      filters.maintenanceActuallyTime = date
        ? dayjs(date).format("YYYY-MM-DD")
        : "";
    } else {
      filters.maintenancePlanTime = date ? dayjs(date).format("YYYY-MM-DD") : "";
    }
    getTableData();
  };

  // 打开附件弹窗
  const openFileDialog = async row => {
    currentMaintenanceTaskId.value = row.id;
    fileDialogVisible.value = true;
  };

  onMounted(() => {
    // 根据默认激活的 Tab 调用对应的查询接口
    if (activeTab.value === "scheduled") {
      getScheduledTableData();
    } else {
    const { code } = await delUpkeep(ids);
    if (code === 200) {
      ElMessage.success("删除成功");
      getTableData();
    }
  });
  } catch (error) {
    // 用户取消删除
  }
};

const handleOut = () => {
  ElMessageBox.confirm("选中的内容将被导出，是否确认导出？", "导出", {
    confirmButtonText: "确认",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(() => {
      proxy.download("/device/maintenance/export", {}, "设备保养.xlsx");
    })
    .catch(() => {
      ElMessage.info("已取消");
    });
};

const handleDateChange = (date, type) => {
  if (type === 1) {
    filters.maintenanceActuallyTime = date ? dayjs(date).format("YYYY-MM-DD") : "";
  } else {
    filters.maintenancePlanTime = date ? dayjs(date).format("YYYY-MM-DD") : "";
  }
  getTableData();
};

// 打开附件弹窗
const openFileDialog = async (row) => {
  currentMaintenanceTaskId.value = row.id;
  fileDialogVisible.value = true;
};

onMounted(() => {
  // 根据默认激活的 Tab 调用对应的查询接口
  if (activeTab.value === "scheduled") {
    getScheduledTableData();
  } else {
    getTableData();
  }
});
</script>

<style lang="scss" scoped>
  .table_list {
    margin-top: unset;
  }
  .actions {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
  }
.table_list {
  margin-top: unset;
}
.actions {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}
</style>