pqs-9100_client/frontend/src/views/home/components/table.vue

<template>
  <div class="table_info">
    <!-- :request-api="getTableList" -->
    <ProTable
      ref="proTable"
      :columns="columns"
      :data='deviceData'
      :init-param="initParam"
      :data-callback="dataCallback"
      @drag-sort="sortTable"
      :default-sort="{ prop: 'check_State', order: 'ascending' }"
      :stripe="true"
      :pagination = "false"
      :key="tableKey"
      @selection-change='handleSelectionChange'
    >
    <!-- :height="tableHeight" -->
      <!-- 表格 header 按钮 -->
      <template #tableHeader="scope">
        <el-form :model="form" :inline="true">
          <el-form-item label="关键字">
            <el-input v-model="form.search" placeholder="请输入设备名称、类型"></el-input>
          </el-form-item>
          <el-form-item label="检测状态" v-if="form.activeTabs != 3 && form.activeTabs != 5">
            <el-select v-model="form.checkStatus" clearable>
              <el-option
                v-for="(item, index) in checkResultList"
                :label="item.label"
                :value="item.value"
                :disabled="item.disabled"
                :key="index"
                v-show="shouldShowOption(item)"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="检测结果">
            <el-select v-model="form.checkResult" clearable>
              <el-option
                v-for="(item, index) in checkResultList"
                :label="item.label"
                :value="item.value"
                :disabled="item.disabled"
                :key="index"
                v-show="shouldShowOption(item)"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="报告状态" v-if="form.activeTabs != 0 && form.activeTabs != 4">
            <el-select v-model="form.checkReportStatus" clearable>
              <el-option
                v-for="(item, index) in checkReportStatusList"
                :label="item.label"
                :value="item.value"
                :disabled="item.disabled"
                :key="index"
                v-show="shouldShowOption(item)"
              ></el-option>
            </el-select>
          </el-form-item>
          <!-- <el-form-item label="检测结果">
            <el-select v-model="form.checkResult" clearable>
              <el-option
                v-for="(item, index) in checkResultList"
                :label="item.label"
                :value="item.value"
                :disabled="item.disabled"
                :key="index"
              ></el-option>
            </el-select>
          </el-form-item> -->
          <el-form-item>
            <el-button type="primary" :icon="Search" @click="handleSearch"
              >查询</el-button
            >
            <el-button :icon="Delete" @click="handleRefresh"
              >重置</el-button
            >

            <!-- :disabled='!scope.isSelected' -->
            <el-button
              type="primary"
              :icon="Clock"
              @click="handleTest('手动检测')"
              v-if="form.activeTabs === 0"
              >手动检测</el-button
            >

            <!-- :disabled='!scope.isSelected' -->
            <el-button
              type="primary"
              :icon="ChatLineRound"
              @click="handleTest('自动检测')"
              v-if="form.activeTabs === 0"
              >自动检测</el-button
            >
            <el-button type="primary" :icon="ChatLineSquare" @click="handleTest('不合格项复检')" v-if="form.activeTabs === 2"
              >不合格项复检</el-button
            >
            <el-button type="primary" :icon="ChatDotSquare" @click="handleTest('全部复检')" v-if="form.activeTabs === 2"
              >全部复检</el-button
            >

            <!-- :disabled='!scope.isSelected' -->
            <el-button type="primary" :icon="Download"   @click="handleTest('批量下载')" v-if="form.activeTabs === 3"
              >报告下载</el-button
            >
            <!-- :disabled='!scope.isSelected' -->
            <el-button type="primary" :icon="Postcard"   @click="handleTest('批量生成')" v-if="form.activeTabs === 3"
              >报告生成</el-button
            >

            <!-- :disabled="!scope.isSelected || scope.selectedList.filter((item) => item.check_State === '检测完成').length === 0" -->
            <el-button type="primary" :icon="Notebook"  @click="handleTest('批量归档')" v-if="form.activeTabs === 0"
              >归档</el-button
            >
            <el-button type="primary" :icon="CirclePlus" @click="addDevice('设备新增')" v-if="form.activeTabs === 0"
              >设备新增</el-button
            >
            
          </el-form-item>
        </el-form>
      </template>
      <!-- 表格操作 -->
      <template #operation="scope">
        <el-button
        type="primary"
          link
          :icon="View"
          @click="openDrawer('查看', scope.row)"
          v-if="form.activeTabs === 3 && form.activeChildTabs === 1"
          >查看</el-button
        >
        <div class='cn-render-buttons' v-if="form.activeTabs === 3 && form.activeChildTabs === 0">
          <el-dropdown trigger='click'>
            <el-button link type='primary' :icon="Download" class='table-operate'>
              <div class='table-operate-text'>报告下载</div>
            </el-button>
            <template #dropdown>
              <el-dropdown-menu>
                <el-dropdown-item>Q/GDW 10650.2-2021 报告</el-dropdown-item>
                <el-dropdown-item>Q/GDW 1650.2-2016 报告</el-dropdown-item>
                <el-dropdown-item>GBT 19862-2016 报告</el-dropdown-item>
              </el-dropdown-menu>
            </template>
          </el-dropdown>
        </div>

        <el-button
        type="primary"
          link
          :icon="Postcard"
          @click="openDrawer('生成', scope.row)"
          v-if="form.activeTabs === 3"
          >报告生成</el-button
        >
        <!-- <el-button
        type="primary"
          link
          :icon="View"
          @click="openDrawer('数据查看', scope.row)"
          v-if="form.activeTabs === 4"
          >数据查看</el-button
        > -->
        <el-button
        :type="scope.row.check_State === '检测完成' ? 'primary' : 'info'"
          link
          :icon="Notebook"
          @click="openDrawer('归档', scope.row)"
          v-if="form.activeTabs === 0"
          :disabled = "scope.row.check_State != '检测完成'"
          >归档</el-button
        >
        <el-button
        type="primary"
          link
          :icon="PieChart"
          @click="openDrawer('检测数据查询', scope.row)"
          v-if="form.activeTabs === 5"
          >检测数据查询</el-button
        >
        <el-button
        type="primary"
          link
          :icon="Switch"
          @click="openDrawer('误差体系更换', scope.row)"
          v-if="form.activeTabs === 5"
          >误差体系更换</el-button
        >
        <!-- <el-button
          dictType="primary"
          link
          :icon="Delete"
          @click="deleteAccount(scope.row)"
          >删除</el-button
        > -->
      </template>
    </ProTable>

    <!-- 检测过程对话框 -->
    <testPopup     
      :visible="dialogFormVisible"
      :formData="dialogForm"
       :dialogTitle="dialogTitle"
      @update:visible="dialogFormVisible = $event"
    />

    <reportPopup
      :visible="reportDialogVisible"
      @update:visible="reportDialogVisible = $event"
    ></reportPopup>

    <dataCheckPopup
      :visible="dataCheckDialogVisible"
      @update:visible="dataCheckDialogVisible = $event"
    ></dataCheckPopup>

    <dataCheckChangeErrSysPopup
    :visible="dataCheckChangeErrSysDialogVisible"
      @update:visible="dataCheckChangeErrSysDialogVisible = $event"
      ></dataCheckChangeErrSysPopup>

      <matchPopup
      :visible="matchDialogVisible"
      @update:visible="matchDialogVisible = $event"
      ></matchPopup>
  </div>
</template>

<script setup lang="tsx" name="useProTable">
import { useRouter } from "vue-router";
import type { Device } from '@/api/device/interface/device'
import { useHandleData } from "@/hooks/useHandleData";
import { ElMessage, ElMessageBox, ElLoading} from "element-plus";
import ProTable from "@/components/ProTable/index.vue";
import { type ProTableInstance, type ColumnProps } from '@/components/ProTable/interface'
import {
  Search,View,Delete,Download,EditPen,Clock,ChatLineRound,ChatLineSquare,ChatDotSquare,Postcard,Notebook,Switch,PieChart,CirclePlus
} from "@element-plus/icons-vue";
import { getPlanList } from "@/api/plan/planList";
import deviceDataList from '@/api/device/device/deviceData'
import testPopup from "./testPopup.vue";
import reportPopup from "./reportPopup.vue";
import dataCheckPopup from "./dataCheckPopup.vue";
import dataCheckChangeErrSysPopup from "./dataCheckChangeErrSysPopup.vue";

import { reactive, ref } from "vue";

let devNum = 0;//当前选取的被检设备数量
let devChannelsNum = 0;//当前选择的被检设备通道总数
let devTestedNum = 0;//当前选择的已完成检测的被检设备数量
const tableKey = ref(0);
const router = useRouter();
const value1 = ref("");
const value2 = ref("");
const tableHeight = ref(0);
const dialogFormVisible = ref(false)
const reportDialogVisible = ref(false)
const dataCheckDialogVisible = ref(false)
const dataCheckChangeErrSysDialogVisible = ref(false)
const matchDialogVisible = ref(false)
const dialogTitle = ref('手动检测')
const dialogForm = ref<any>({
      id: '',
      name: '',
      standard_Name:'',
      standard_Time:'',
      dev_Level:'',
      enable:1,
      state:1,     
});
const shouldShowOption = (item) => {
  console.log(item,12345)
  return !item.disabled; 
};
//console.log(window.innerHeight, "+++++++++");
tableHeight.value = window.innerHeight - 600;
//const deviceData = deviceDataList.plan_devicedata
const deviceData = ref([]);
deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.document_State === "未归档")
const operationShow = ref(false);
const documentStateShow = ref(false);
const checkStateShow = ref(true);
const operationMinWidth = ref(200);
const selectionShow = ref(true);

//下拉框数据
//检测状态数据
let checkStatusList = reactive([
  {
    label: "未检测",
    value: 0,
    disabled: false,
  },
  {
    label: "检测中",
    value: 1,
    disabled: false,
  },
  {
    label: "检测完成",
    value: 2,
    disabled: false,
  },
  {
    label: "归档",
    value: 3,
    disabled: false,
  },
]);
//检测报告状态数据
let checkReportStatusList = reactive([
{
    label: "未检测",
    value: 0,
    disabled: false,
  },
  {
    label: "未生成",
    value: 1,
    disabled: false,
  },
  {
    label: "已生成",
    value: 2,
    disabled: false,
  },
]);
//检测结果数组
let checkResultList = reactive([
  {
    label: "未检测",
    value: 0,
    disabled: false,
  },
  {
    label: "不合格",
    value: 1,
    disabled: false,
  },
  {
    label: "合格",
    value: 2,
    disabled: false,
  },
]);

//查询条件
const form: any = ref({
  activeTabs: 0, //功能选择
  search: "",//搜索内容
  activeChildTabs: 0,//子功能选择
  checkStatus: null, //检测状态
  checkResult: null, //检测结果
  checkReportStatus: null, //检测报告状态
  deviceBindStatus: 0, //绑定状态
  deviceType: 0, //设备类型
  manufacturer: 0, //制造厂商
});
const searchForm = ref({
  intervalType: 0,
  time: ["2024-08-20", "2024-08-27"],
  searchBeginTime: "",
  searchEndTime: "",
  checkStatus: 0,
  checkReportStatus: 0,
  checkResult: 0,
});
// ProTable 实例
const proTable = ref<ProTableInstance>();

// 如果表格需要初始化请求参数，直接定义传给 ProTable (之后每次请求都会自动带上该参数，此参数更改之后也会一直带上，改变此参数会自动刷新表格数据)
const initParam = reactive({ type: 1, pageNum: 1, pageSize: 10 });

// dataCallback 是对于返回的表格数据做处理，如果你后台返回的数据不是 list && total 这些字段，可以在这里进行处理成这些字段
// 或者直接去 hooks/useTable.ts 文件中把字段改为你后端对应的就行
const tableList = ref([]);
const dataCallback = (data: any) => {
  return {
    list: data || data.data || data.list,
    total: data.length || data.total, //total
  };
};
// 如果你想在请求之前对当前请求参数做一些操作，可以自定义如下函数：params 为当前所有的请求参数（包括分页），最后返回请求列表接口
// 默认不做操作就直接在 ProTable 组件上绑定	:requestApi="getUserList"
const getTableList = (params: any) => {
  let newParams = JSON.parse(JSON.stringify(params));
  newParams.createTime && (newParams.startTime = newParams.createTime[0]);
  newParams.createTime && (newParams.endTime = newParams.createTime[1]);
  delete newParams.createTime;
  return getPlanList(newParams);
};

// 表格配置项
const columns = reactive([
    { type: 'selection', fixed: 'left', width: 70, isShow:selectionShow },
    { type: 'index', fixed: 'left', width: 70, label: '序号' },
    {
      prop: 'name',
      label: '设备名称',
      minWidth: 220,
    },
    {
      prop: 'dev_Type',
      label: '设备类型',
      minWidth: 100,
    },
    {
      prop: 'dev_Chns',
      label: '通道数',
      minWidth: 100,
      sortable:true,
    },
    {
      prop: 'reCheck_Num',
      label: '检测次数',
      minWidth: 100,
      sortable:true,
      // <template #header>
      //   <span>检测次数</span>
      //     <el-tooltip content = "最大检测次数为3次，超过会强制归档" placement="top" style="align-items: bottom;">
      //     <el-icon><InfoFilled  /></el-icon>
      //   </el-tooltip>
      // </template>
    },
    {
      prop: 'check_State',
      label: '检测状态',
      minWidth: 100,
      sortable:true,
      isShow:checkStateShow,
    },
    {
      prop: 'check_Result',
      label: '检测结果',
      minWidth: 100,
      sortable:true,
      render: (scope) => {
    if(scope.row.check_Result === '不合格')
    {
      return (
      <el-tag type='danger'>{ scope.row.check_Result }</el-tag>
    )
    }
    else
    {
      return (
        <span>{ scope.row.check_Result }</span>
    )
    }
  },
    },
    {
      prop: 'report_State',
      label: '报告状态',
      minWidth: 100,
      sortable:true,
    },
    {
      prop: 'document_State',
      label: '归档状态',
      minWidth: 100,
      sortable:true,
      isShow: documentStateShow,
    },
    { prop: 'operation', label: '操作', fixed: 'right', minWidth: 200 ,isShow: operationShow},
  ])

// const columns = reactive<ColumnProps<User.ResUserList>[]>([
//   { type: "selection", fixed: "left", width: 70 },
//   {
//     prop: "checkMode",
//     label: "设备序列号",
//     width: 140,
//     render: (scope) => {
//       return scope.row.checkMode == 0
//         ? "设备1"
//         : scope.row.checkMode == 1
//           ? "设备2"
//           : scope.row.checkMode == 2
//             ? "设备3"
//             : scope.row.checkMode;
//     },
//   },
//   {
//     prop: "checkMode",
//     label: "设备类型",
//     width: 140,
//     render: (scope) => {
//       return scope.row.checkMode == 0
//         ? "PQS991"
//         : scope.row.checkMode == 1
//           ? "PQS882"
//           : scope.row.checkMode == 2
//             ? "PQS6666"
//             : scope.row.checkMode;
//     },
//   },
//   {
//     prop: "checkFrom",
//     label: "制造厂商",
//     width: 140,
//     render: (scope) => {
//       return scope.row.checkFrom == 0
//         ? "南京灿能"
//         : scope.row.checkFrom == 1
//           ? "南瑞继保"
//           : scope.row.checkFrom == 2
//             ? "/"
//             : scope.row.checkFrom;
//     },
//   },
//   {
//     prop: "numberFromName",
//     label: "MAC/IP",
//     render: (scope) => {
//       return scope.row.numberFromName == 0
//         ? "192.168.0.1"
//         : scope.row.numberFromName == 1
//           ? "192.168.0.2"
//           : scope.row.numberFromName == 2
//             ? "192.168.0.3"
//             : scope.row.numberFromName;
//     },
//   },
  // {
  //   prop: "checkExe",
  //   label: "检测脚本",
  //   render: (scope) => {
  //     return scope.row.checkExe == 0
  //       ? "国网入网检测脚本（单影响量-模拟式）"
  //       : scope.row.checkExe == 1
  //         ? "国网入网检测脚本"
  //         : scope.row.checkExe == 2
  //           ? "/"
  //           : scope.row.checkExe;
  //   },
  // },
  // {
  //   prop: "wctx",
  //   label: "误差体系",
  //   render: (scope) => {
  //     return scope.row.wctx == 0
  //       ? "Q/GDW 1650.2- 2016"
  //       : scope.row.wctx == 1
  //         ? "Q/GDW 10650.2 - 2021"
  //         : scope.row.wctx == 2
  //           ? "/"
  //           : scope.row.wctx;
  //   },
  // },
  // {
  //   prop: "checkStatus",
  //   label: "检测状态",
  //   width: 120,
  //   render: (scope) => {
  //     return scope.row.checkStatus == 1
  //       ? "未检测"
  //       : scope.row.checkStatus == 2
  //         ? "检测中"
  //         : scope.row.checkStatus == 3
  //           ? "检测完成"
  //           : scope.row.checkStatus;
  //   },
  // },
  // {
  //   prop: "checkReport",
  //   label: "检测报告",
  //   width: 120,
  //   render: (scope) => {
  //     return scope.row.checkReport == 1
  //       ? "未生成"
  //       : scope.row.checkReport == 2
  //         ? "部分生成"
  //         : scope.row.checkReport == 3
  //           ? "全部生成"
  //           : scope.row.checkReport;
  //   },
  // },
  // {
  //   prop: "checkResult",
  //   label: "检测结果",
  //   width: 120,
  //   render: (scope) => {
  //     return scope.row.checkReport == 1
  //       ? "/"
  //       : scope.row.checkReport == 2
  //         ? "符合"
  //         : scope.row.checkReport == 3
  //           ? "不符合"
  //           : scope.row.checkReport;
  //   },
  // },
  // {
  //   prop: "parentNode",
  //   label: "父节点",
  //   width: 90,
  //   render: (scope) => {
  //     return scope.row.checkReport == 0
  //       ? "/"
  //       : scope.row.checkReport == 1
  //         ? "检测计划1"
  //         : scope.row.checkReport == 2
  //           ? "检测计划2"
  //           : scope.row.checkReport == 3
  //             ? "检测计划3"
  //             : scope.row.checkReport;
  //   },
  // },
  // { prop: "operation", label: "操作", fixed: "right", width: 250 },
// ]);
// 跳转详情页
const toDetail = () => {
  router.push(
    `/proTable/useProTable/detail/${Math.random().toFixed(3)}?params=detail-page`
  );
};
//重置查询条件
const resetSearchForm = () => {
  searchForm.value = {
    intervalType: 0,
    time: ["2024-08-20", "2024-08-27"],
    searchBeginTime: "",
    searchEndTime: "",
    checkStatus: 0,
    checkReportStatus: 0,
    checkResult: 0,
  };
};
let testType = "test";//检测还是复检

const handleSelectionChange = (selection: any[]) => {

  devNum = selection.length;
  devChannelsNum = 0;
  for (let i = 0; i < selection.length; i++) {
    devChannelsNum += selection[i].dev_Chns;
  }

  devTestedNum = selection.filter((item) => item.check_State === '检测完成').length;
  const result = selection.filter((item) => item.check_Result != "不合格")
  if(result.length > 0)
  {
    testType= "test";    
  }
  else
  {
    testType= "reTest";
  }
}

//查询
const handleSearch = () => {

  if(form.value.activeTabs === 0 || form.value.activeTabs === 4)//设备检测、设备归档
  {
    deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.document_State === "未归档")
  }
  else if(form.value.activeTabs === 3 || form.value.activeTabs === 5)//报告生成、数据查询
  {
    deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.check_State === "检测完成");
  }
  //matchDialogVisible.value = true;
  //proTable.value?.getTableList();
};
//重置
const handleRefresh = () => {
  form.value.search = "";
  form.value.checkStatus = null;
  form.value.checkResult = null;
  form.value.checkReportStatus = null;
  
  
  if(form.value.activeTabs === 0 || form.value.activeTabs === 4)//设备检测、设备归档
  {
    deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.document_State === "未归档")
  }
  else if(form.value.activeTabs === 3 || form.value.activeTabs === 5)//报告生成、数据查询
  {
    deviceData.value = deviceDataList.plan_devicedata.filter((item) => item.check_State === "检测完成");
  }
};
// 表格拖拽排序
const sortTable = ({
  newIndex,
  oldIndex,
}: {
  newIndex?: number;
  oldIndex?: number;
}) => {
  //console.log(newIndex, oldIndex);
  //console.log(proTable.value?.tableData);
  ElMessage.success("修改列表排序成功");
};

// 删除用户信息
const deleteAccount = async (params: User.ResUserList) => {
  await useHandleData(
    deleteUser,
    { id: [params.id] },
    `删除【${params.username}】`
  );
  proTable.value?.getTableList();
};

// 批量删除用户信息
const batchDelete = async (id: string[]) => {
  await useHandleData(deleteUser, { id }, "删除所选用户信息");
  proTable.value?.clearSelection();
  proTable.value?.getTableList();
};

// 重置用户密码
const resetPass = async (params: User.ResUserList) => {
  await useHandleData(
    resetUserPassWord,
    { id: params.id },
    `重置【${params.username}】用户密码`
  );
  proTable.value?.getTableList();
};

// 切换用户状态
const changeStatus = async (row: User.ResUserList) => {
  await useHandleData(
    changeUserStatus,
    { id: row.id, status: row.status == 1 ? 0 : 1 },
    `切换【${row.username}】用户状态`
  );
  proTable.value?.getTableList();
};
//顶部功能切换时修改activeTabs
const changeActiveTabs = (val: number,val2: number,tabledata:any[]) => {
  form.value.activeTabs = val;
  form.value.activeChildTabs= val2;
  deviceData.value = tabledata;
  tableHeaderInit(val)
  console.log(form,val,val2,666)
};

//根据当前功能，初始化表头下拉框中的默认值和禁用值
function tableHeaderInit(val: number) {
  refreshStatusList()

  switch (val) {
    case 0://设备检测
    case 1://手动检测
      //disableCheckStatus("检测中")
      disableCheckStatus("归档")
      // operationShow.value = false;
      columns[columns.length - 1].minWidth = 100;
      tableKey.value ++;
      operationShow.value = true;
      documentStateShow.value = false;
      checkStateShow.value = true;
      selectionShow.value = true;
      break;
    case 2://设备复检
      // form.value.checkStatus = 2;//检测状态默认为检测完成
      // form.value.checkReportStatus = 0;//检测报告状态默认为未生成报告
      // form.value.checkResult = 1;//检测结果默认为不合格
      // disableCheckStatus("未检测")
      // disableCheckStatus("检测中")
      // disableCheckStatus("归档")
      // disablecheckResultList("未出结果")
      // operationShow.value = false;
    break;
    case 3://报告生成
      // form.value.checkStatus = 2;//检测状态默认为检测完成
      // form.value.checkReportStatus = 0;//检测报告状态默认为未生成报告
      // form.value.checkResult = 2;//检测结果默认为合格
      // disableCheckStatus("未检测")
      // disableCheckStatus("检测中")
      // disableCheckStatus("归档")
      disablecheckResultList("未检测")
      disableCheckReportStatus("未检测")
      columns[columns.length - 1].minWidth = 180;
      tableKey.value += 1;
      operationShow.value = true;
      documentStateShow.value = true;
      checkStateShow.value = false;
      selectionShow.value = true;
    break;
    case 4://设备归档
      // form.value.checkStatus = 2;//检测状态默认为检测完成
      // form.value.checkReportStatus = 1;//检测报告状态默认为已生成报告
      // form.value.checkResult = 2;//检测结果默认为合格
      // disableCheckStatus("未检测")
      // disableCheckStatus("检测中")
      // disableCheckStatus("归档")
      disableCheckReportStatus("未生成报告")
      disablecheckResultList("未出结果")
      columns[columns.length - 1].minWidth = 100;
      tableKey.value ++;
      operationShow.value = true;
      documentStateShow.value = true;
      checkStateShow.value = false;
      selectionShow.value = true;
    break;
    case 5://数据查询
    disablecheckResultList("未检测")
    disableCheckReportStatus("未检测")
    columns[columns.length - 1].minWidth = 250;
    operationShow.value = true;
    documentStateShow.value = true;
    checkStateShow.value = false;
    selectionShow.value = false;
    columns[0].isShow = false;
    tableKey.value += 1;
    break;
  }
console.log("test",columns);

}

tableHeaderInit(0)
function refreshStatusList(){
  // devNum = 0;
  // devChannelsNum = 0;
  // devTestedNum = 0;
  devNum = 0;
  devChannelsNum = 0;
  devTestedNum = 0;
  checkStatusList.map((item: any, index: any) => {
    if (item.disabled) {
      item.disabled = false;
    }
  });
  checkReportStatusList.map((item: any, index: any) => {
    if (item.disabled) {
      item.disabled = false;
    }
  });
  checkResultList.map((item: any, index: any) => {
    if (item.disabled) {
      item.disabled = false;
    }
  });

  form.value.checkStatus = null;//检测状态默认为未检
  form.value.checkReportStatus = null;//检测报告状态默认为未生成报告
  form.value.checkResult = null;//检测结果默认为未出结果
}

function disableCheckStatus(val: string){
  checkStatusList.map((item: any, index: any) => {
    if (val == item.label) {
      item.disabled = true;
    }
  });
}
function disableCheckReportStatus(val: string){
  checkReportStatusList.map((item: any, index: any) => {
    if (val == item.label) {
      item.disabled = true;
    }
  });
}
function disablecheckResultList(val: string){
  checkResultList.map((item: any, index: any) => {
    if (val == item.label) {
      item.disabled = true;
    }
  });
}

const addDevice = (val:string) => {
  router.push({
    path: "/machine/device",
  });
};
const handleTest = (val:string) => {

  if(devNum == 0)
  {
    ElMessageBox.confirm(
      '请先选择被检设备',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }
    )
    return
  }
  if(val==='手动检测'||val==='自动检测'||val==='不合格项复检'||val==='全部复检' )
  {
    if(devNum > 6)
    {
      ElMessageBox.confirm(
        '每次检测最多只能选择6台设备，请重新选择',
        '提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        }
      )
      return
    }
    if(devChannelsNum > 20)
    {
      ElMessageBox.confirm(
        '每次检测最多只能检测20个设备通道，请重新选择',
        '提示',
        {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
        }
      )
      return
    }
    if(testType === "reTest")
    {
      ElMessageBox.confirm(
        '请选择复检检测方式',
        '设备复检',
        {
          distinguishCancelAndClose: true,
          confirmButtonText: '不合格项复检',
          cancelButtonText: '全部复检',
          type: 'warning',
        },
    )
        .then(() => {
          ElMessage.success('不合格项复检');
          dialogTitle.value = val;
          dialogFormVisible.value = true; // 打开对话框
        })
        .catch((action: Action) => {
          ElMessage.success('全部复检');
          dialogTitle.value = val;
          dialogFormVisible.value = true; // 打开对话框
        })
    }
    else
    {
      ElMessage.success(val);
      dialogTitle.value = val;
      dialogFormVisible.value = true; // 打开对话框
    }
    return

  }
  
  if(devTestedNum == 0)
  {
    ElMessageBox.confirm(
      '请先选择检测完成状态的被检设备',
      '提示',
      {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }
    )
    return
  }
  if(val==='批量生成')
  {
     reportDialogVisible.value = true;
     return
  }

  if(val==='批量归档')
  {
    const loading = ElLoading.service({
      lock: true,
      text: '归档中...',
      background: 'rgba(0, 0, 0, 0.7)',
    })
    setTimeout(() => {
      loading.close()
      ElMessage.success("归档成功");
    }, 2000)
  }
};


// 打开 drawer(新增、查看、编辑)
const openDrawer = (title: string, row: any) => {
    if (title === '查看')
    {
      console.log(title);
      const link = document.createElement('a');
      const fileUrl = 'G:/南网数研院非结构化数据生成程序MMS_JSON修改记录.docx'; // 文件路径
      link.href = fileUrl;
      link.target = '_blank'; // 在新标签页中打开
      link.download = 'file.docx'; // 设置下载文件的名称
      link.click();
    }

    if(title === '生成')
    {
      reportDialogVisible.value = true;
    }
      
    if(title === '检测数据查询')
    {
      dataCheckDialogVisible.value = true;
    }
    if (title === '误差体系更换')
    {
      dataCheckChangeErrSysDialogVisible.value = true;
    }


    if (title === '归档')
    {
      const loading = ElLoading.service({
      lock: true,
      text: '归档中...',
      background: 'rgba(0, 0, 0, 0.7)',
    })
    setTimeout(() => {
      loading.close()
      ElMessage.success("归档成功");
    }, 2000)
    }
}

onMounted(() => {
  //console.log(proTable.value?.tableData);
});
defineExpose({ changeActiveTabs });
</script>
<style lang="scss" scoped>
/* 当屏幕宽度小于或等于1300像素时 */
@media screen and (max-width: 1300px) {
  .el-select {
    width: 130px !important;
  }
}
@media screen and (min-width: 1300px) {
  .el-select {
    width: 150px !important;
  }
}

.el-form {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  .el-form-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    .el-button {
      margin: 0 !important;
      margin-right: 10px !important;
    }
  }
}
</style>