gaoluyang
2 天以前 9d496497c8f4b9fea9609efd20b96b44016c305d
src/views/equipmentManagement/inspectionManagement/index.vue
@@ -15,20 +15,7 @@
      </el-form-item>
    </el-form>
    <el-card>
      <!-- 标签页 -->
      <el-tabs
          v-model="activeTab"
          class="info-tabs"
          @tab-click="handleTabClick"
      >
        <el-tab-pane
            v-for="tab in tabs"
            :key="tab.name"
            :label="tab.label"
            :name="tab.name"
        />
      </el-tabs>
      <div style="display: flex;flex-direction: row;justify-content: space-between;" v-if="tabName === 'task'">
      <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"
@@ -39,7 +26,10 @@
        <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 type="info" plain :icon="Download">导出</el-button> -->
          <el-button @click="handleOut">导出</el-button>
        </el-space>
        <el-space v-else>
          <el-button @click="handleOut">导出</el-button>
        </el-space>
      </div>
      <div>
@@ -50,8 +40,7 @@
                  @selection-change="handleSelectionChange"
                  :is-selection="true"
                  :border="true"
                  :table-style="{ width: '100%', height: 'calc(100vh - 30em)' }"
                  v-if="tabName === 'task'"
                  :table-style="{ width: '100%', height: 'calc(100vh - 23em)' }"
          >
          <template #inspector="{ row }">
            <div class="person-tags">
@@ -71,27 +60,7 @@
              <span v-else class="no-data">--</span>
            </div>
          </template>
          </PIMTable>
          <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">
              <template #default="scope">
                {{scope.row.qrCode.deviceName}}
              </template>
            </el-table-column>
            <el-table-column prop="location" label="所在位置描述" :show-overflow-tooltip="true">
              <template #default="scope">
                {{scope.row.qrCode.location}}
              </template>
            </el-table-column>
            <el-table-column prop="scanner" label="巡检人"></el-table-column>
            <el-table-column prop="scanTime" label="巡检时间"></el-table-column>
            <el-table-column fixed="right" label="操作">
              <template #default="scope">
                <el-button link type="primary" @click="handleAdd(scope.row)">查看附件</el-button>
              </template>
            </el-table-column>
          </el-table>
            </PIMTable>
        </div>
        <pagination
            v-if="total>0"
@@ -104,23 +73,20 @@
      </div>
    </el-card>
    <form-dia ref="formDia" @closeDia="handleQuery"></form-dia>
    <qr-code-dia ref="qrCodeDia" @closeDia="handleQuery"></qr-code-dia>
    <view-files ref="viewFiles"></view-files>
    <view-qr-code-files ref="viewQrCodeFiles"></view-qr-code-files>
  </div>
</template>
<script setup>
import { Delete, Plus } from "@element-plus/icons-vue";
import { onMounted, ref, reactive, getCurrentInstance, nextTick } from "vue";
import { ElMessageBox } from "element-plus";
// 组件引入
import Pagination from "@/components/Pagination/index.vue";
import PIMTable from "@/components/PIMTable/PIMTable.vue";
import FormDia from "@/views/equipmentManagement/inspectionManagement/components/formDia.vue";
import QrCodeDia from "@/views/equipmentManagement/inspectionManagement/components/qrCodeDia.vue";
import ViewFiles from "@/views/equipmentManagement/inspectionManagement/components/viewFiles.vue";
import ViewQrCodeFiles from "@/views/equipmentManagement/inspectionManagement/components/viewQrCodeFiles.vue";
// 接口引入
import {
@@ -128,38 +94,22 @@
  inspectionTaskList,
  timingTaskList
} from "@/api/inspectionManagement/index.js";
import {
  delQrCode,
  qrCodeList,
  qrCodeScanRecordList
} from "@/api/inspectionUpload/index.js";
// 全局变量
const { proxy } = getCurrentInstance();
const formDia = ref();
const qrCodeDia = ref();
const viewFiles = ref();
const viewQrCodeFiles = ref();
// 查询参数
const queryParams = reactive({
  searchAll: "",
});
// 标签页配置
const activeTab = ref("task");
const tabName = ref("task");
const tabs = reactive([
  { name: "task", label: "生产巡检" },
  { name: "qrCodeScanRecord", label: "现场巡检记录" },
]);
// 单选框配置
const activeRadio = ref("taskManage");
const radios = reactive([
  { name: "taskManage", label: "定时任务管理" },
  { name: "task", label: "定时任务记录" },
  { name: "qrCode", label: "二维码管理" },
]);
// 表格数据
@@ -175,7 +125,6 @@
// 列配置
const columns = ref([
  { prop: "taskName", label: "巡检任务名称", minWidth: 160 },
  { prop: "inspectionLocation", label: "地点", minWidth: 120 },
  { prop: "remarks", label: "备注", minWidth: 150 },
  { prop: "inspector", label: "执行巡检人", minWidth: 150, slot: "inspector" },
  {
@@ -246,23 +195,9 @@
  return operationConfig;
};
const columns1 = ref([
  { prop: "deviceName", label: "设备名称", minWidth: 160 },
  { prop: "location", label: "所在位置描述", minWidth: 120 },
  { prop: "createBy", label: "创建者", minWidth: 100 },
  { prop: "createTime", label: "创建时间", minWidth: 100 },
]);
onMounted(() => {
  radioChange('taskManage');
});
// 标签页点击事件
const handleTabClick = (tab) => {
  tabName.value = tab.props.name;
  tableData.value = [];
  getList();
};
// 单选变化
const radioChange = (value) => {
@@ -274,10 +209,6 @@
    const operationColumn = getOperationColumn(['viewFile']);
    tableColumns.value = [...columns.value, ...(operationColumn ? [operationColumn] : [])];
    operationsArr.value = ['viewFile'];
  } else {
    const operationColumn = getOperationColumn(['edit']);
    tableColumns.value = [...columns1.value, ...(operationColumn ? [operationColumn] : [])];
    operationsArr.value = ['edit'];
  }
  pageNum.value = 1;
  pageSize.value = 10;
@@ -293,7 +224,7 @@
// 分页处理
const handlePagination = (val) => {
   pageNum.value = val.page;
   pageSize.value = val.limit;
   pageSize.value = val.size;
   getList();
};
// 获取列表数据
@@ -303,19 +234,10 @@
  const params = { ...queryParams, size: pageSize.value, current: pageNum.value };
  
  let apiCall;
  if (tabName.value === 'task') {
    switch (activeRadio.value) {
      case "task":
        apiCall = inspectionTaskList(params);
        break;
      case "qrCode":
        apiCall = qrCodeList(params);
        break;
      default:
        apiCall = timingTaskList(params);
    }
  if (activeRadio.value === "task") {
    apiCall = inspectionTaskList(params);
  } else {
    apiCall = qrCodeScanRecordList(params);
    apiCall = timingTaskList(params);
  }
  
  apiCall.then(res => {
@@ -360,15 +282,7 @@
const handleAdd = (row) => {
  const type = row ? 'edit' : 'add';
  nextTick(() => {
    if (tabName.value === 'task') {
      if (activeRadio.value === "taskManage") {
        formDia.value?.openDialog(type, row);
      } else if (activeRadio.value === "qrCode") {
        qrCodeDia.value?.openDialog(type, row);
      }
    } else {
      viewQrCodeFiles.value?.openDialog(row);
    }
    formDia.value?.openDialog(type, row);
  });
};
@@ -387,10 +301,9 @@
  }
  
  const deleteIds = selectedRows.value.map(item => item.id);
  const api = activeRadio.value === "taskManage" ? delTimingTask : delQrCode;
  
  proxy.$modal.confirm('是否确认删除所选数据项?').then(() => {
    return api(deleteIds);
    return delTimingTask(deleteIds);
  }).then(() => {
    proxy.$modal.msgSuccess("删除成功");
    handleQuery();
@@ -401,6 +314,28 @@
const handleSelectionChange = (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("已取消");
    });
};
</script>
<style scoped>