设备维护保养页面开发、联调

gaoluyang

2025-04-17 333d98a8ffa718aaa903632525f16e4aecb92638

设备维护保养页面开发、联调

 src/api/cnas/resourceDemand/device.js

@@ -874,42 +874,6 @@
  });
}

//设备保养单条导出
export function exportMaintenanceRecord(query) {
  return request({
    url: "/deviceMaintain/exportMaintenanceRecord",
    method: "get",
    responseType: "blob",
    params: query,
  });
}

//设备维护删除
export function deleteDeviceMaintenance(query) {
  return request({
    url: "/deviceMaintain/deleteDeviceMaintenance",
    method: "delete",
    params: query,
  });
}

// æ–°å¢žè®¾å¤‡ç»´æŠ¤ä¿å…»
export function addDeviceMaintenance(data) {
  return request({
    url: "/deviceMaintain/addDeviceMaintenance",
    method: "post",
    data: data,
  });
}
//设备维护表 æŸ¥è¯¢
export function getDeviceMaintenancePage(query) {
  return request({
    url: "/deviceMaintain/getDeviceMaintenancePage",
    method: "get",
    params: query,
  });
}

// å€Ÿç”¨-保存
export function saveDeviceBorrow(data) {
  return request({
@@ -1275,3 +1239,27 @@
    params: query,
  });
}
//设备维护保养 æŸ¥è¯¢
export function selectDeviceMaintenancePage(query) {
  return request({
    url: "/deviceMaintain/selectDeviceMaintenancePage",
    method: "get",
    params: query,
  });
}
//设备维护保养 åˆ é™¤
export function deleteDeviceMaintenance(query) {
  return request({
    url: "/deviceMaintain/deleteDeviceMaintenance",
    method: "delete",
    params: query,
  });
}
//设备维护保养 æ–°å¢ž
export function addDeviceMaintenance(query) {
  return request({
    url: "/deviceMaintain/addDeviceMaintenance",
    method: "post",
    data: query,
  });
}

 src/views/CNAS/resourceDemand/device/component/equipmentMaintenance.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,282 @@
<template>
  <div>
    <div class="search">
      <el-button size="small" type="primary" @click="refreshTableList">刷新</el-button>
      <el-button size="small" type="primary" @click="openDia('add')">新 å»º</el-button>
      <el-button :loading="outLoading" size="small" type="primary" @click="openHandleOut">导 å‡º</el-button>
    </div>
    <div>
      <lims-table :tableData="tableData" :column="column"
                  height="calc(100vh - 20em)" @pagination="pagination"
                  :page="page" :tableLoading="tableLoading"></lims-table>
    </div>
    <el-dialog :visible.sync="dialogVisible" title="仪器设备使用维护保养表" width="55%">
      <el-form ref="form" :model="form" label-width="130px" :rules="rules">
        <el-row>
          <el-col :span="12">
            <el-form-item label="维护日期:" prop="maintenanceDate">
              <el-date-picker v-model="form.maintenanceDate" :disabled="operationType === 'view'"
                              format="yyyy-MM-dd" size="small" placeholder="选择日期" style="width:100%"
                              type="date" value-format="yyyy-MM-dd">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="维护内容:" prop="maintenanceContentArr">
              <el-checkbox-group v-model="form.maintenanceContentArr" :disabled="operationType === 'view'">
                <el-checkbox v-for="city in qualificationList" :key="city.label" :label="city.label"
                             :value="city.label"></el-checkbox>
              </el-checkbox-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="维护人:" prop="maintenanceUserId">
              <el-select v-model="form.maintenanceUserId"
                         clearable filterable
                         placeholder="请选择" size="small" style="width: 100%;">
                <el-option v-for="item in responsibleOptions" :key="item.id" :label="item.name" :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="备注:" prop="remark">
              <el-input v-model="form.remark" :disabled="operationType === 'view'" size="small"
                        style="width: 100%;"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeDia">取 æ¶ˆ</el-button>
        <el-button v-if="operationType !== 'view'" type="primary" @click="saveRecord" :loading="buttonLoading">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  addDeviceMaintenance,
  deleteDeviceMaintenance,
  selectDeviceMaintenancePage
} from "@/api/cnas/resourceDemand/device";
import limsTable from "@/components/Table/lims-table.vue";
import {selectUserCondition} from "@/api/system/user";

export default {
  name: '',
  // import å¼•å…¥çš„组件需要注入到对象中才能使用
  components: {limsTable},
  props: {
    clickNodeVal: {
      type: Object,
      default: () => {
        return {};
      }
    },
  },
  data() {
    // è¿™é‡Œå­˜æ”¾æ•°æ®
    return {
      search: {
        maintenanceDate: '',
      },
      total: 0,
      outLoading: false,
      tableData: [],
      tableLoading: false,
      page: {
        total: 0,
        size: 20,
        current: 1
      },
      column: [
        { label: '维护日期', prop: 'maintenanceDate' },
        { label: '维护内容', prop: 'maintenanceContent' },
        { label: '维护人', prop: 'maintenanceUserName' },
        { label: '备注', prop: 'remark' },
        {
          dataType: 'action',
          label: '操作',
          operation: [
            {
              name: '编辑',
              type: 'text',
              clickFun: (row) => {
                this.openDia('edit', row);
              },
            },
            {
              name: '删除',
              type: 'text',
              clickFun: (row) => {
                this.handleDeleteClick(row);
              },
            },
          ]
        }
      ],
      dialogVisible: false,
      form: {
        id: '',
        deviceId: '',
        maintenanceDate: '',
        maintenanceContentArr: [],
        maintenanceContent: '',
        maintenanceUserId: '',
        remark: '',
      },
      operationType: '',
      buttonLoading: false,
      qualificationList: [],
      rules: {
        maintenanceDate: [{ required: true, message: '请选择维护日期', trigger: 'change' }],
        maintenanceContentArr: [{ required: true, message: '请选择维护内容', trigger: 'change' }],
        maintenanceUserId: [{ required: true, message: '请选择维护人', trigger: 'change' }],
      },
      responsibleOptions: [],
    };
  },
  mounted() {
    this.refreshTableList()
  },
  // æ–¹æ³•é›†åˆ
  methods: {
    // ç‚¹å‡»åˆ·æ–°
    refreshTableList () {
      this.page.current = 1;
      this.getTableList()
    },
    // åˆ†é¡µåˆ‡æ¢
    pagination(page) {
      this.page.size = page.limit
      this.getTableList()
    },
    getTableList () {
      this.tableLoading = true
      selectDeviceMaintenancePage({
        deviceId: this.clickNodeVal.value,
        ...this.page
      }).then(res => {
        this.tableLoading = false
        this.tableData = res.data.records
        this.page.total = res.data.total
      }).catch(err => {
        this.tableLoading = false
      })
    },
    // æ‰“开操作弹框
    openDia (type, row) {
      this.operationType = type
      this.dialogVisible = true
      this.$nextTick(() => {
        this.$refs['form'].resetFields()
        this.form.id = ''
        if (this.operationType === 'edit') {
          this.form = {...row}
          this.$set(this.form, 'maintenanceContentArr', this.form.maintenanceContent.split(','))
        }
      })
      this.getDictS()
      this.getUserList()
    },
    // æŸ¥è¯¢ç»´æŠ¤å†…容选择框内容
    getDictS () {
      // å®šä¹‰å®žéªŒå®¤åç§°ä¸Žç»´æŠ¤å†…容类型的映射关系
      const labTypeMapping = {
        '老化室': 'aging_maintenance_content',
        '老化实验室': 'aging_maintenance_content',
        '电性能实验室': 'electrical_maintenance_content',
        '环境实验室': 'environmental_maintenance_content',
        '燃烧实验室': 'burn_maintenance_content',
        '混炼实验室': 'mixing_maintenance_content',
        '检测中心电性能实验室': 'center_electrical_maintenance_content',
        '恒温二': 'temperature2_maintenance_content',
        '恒温一': 'temperature1_maintenance_content',
        '化学实验室': 'chemistry_maintenance_content',
        '制样室': 'sample_maintenance_content',
        '低温实验室': 'hypothermia_maintenance_content',
      };
      // èŽ·å–当前节点的实验室名称
      const name = this.clickNodeVal.parent.label;
      // æ ¹æ®æ˜ å°„关系获取对应的类型
      const type = labTypeMapping[name];
      this.getDicts(type).then((response) => {
        this.qualificationList = response.data.map((m) => {
          return {
            label: m.dictLabel,
            value: m.dictValue,
          };
        });
      });
    },
    openHandleOut () {

    },
    handleDeleteClick(row) {
      this.$confirm('此操作将永久删除该文件, æ˜¯å¦ç»§ç»­?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteDeviceMaintenance({ id: row.id }).then(res => {
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
          this.refreshTableList()
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    // æäº¤æ–°å¢žå’Œä¿å­˜
    saveRecord () {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.buttonLoading = true;
          this.form.maintenanceContent = this.form.maintenanceContentArr.join(',')
          this.form.deviceId = this.clickNodeVal.value
          addDeviceMaintenance(this.form).then(res => {
            this.buttonLoading = false;
            this.$message.success('新增成功')
            this.closeDia()
            this.getTableList()
          }).catch(err => {
            this.buttonLoading = false;
          })
        }
      })
    },
    closeDia () {
      this.$refs['form'].resetFields();
      this.dialogVisible = false
      this.refreshTableList()
    },
    // èŽ·å–负责人信息接口
    getUserList() {
      selectUserCondition({type: 2}).then(res => {
        if (res.code == 200) {
          this.responsibleOptions = res.data
        }
      })
    },
  }
};
</script>

<style scoped>
.search {
  height: 46px;
  text-align: right;
  margin-top: 10px;
}
</style>

 src/views/CNAS/resourceDemand/device/component/maintenance.vue

ÎļþÒÑɾ³ý

 src/views/CNAS/resourceDemand/device/index.vue

@@ -74,8 +74,8 @@
          <el-tab-pane label="设备校准" name="设备校准">
            <calibration v-if="tabListActiveName == '设备校准'" :clickNodeVal="clickNodeVal" />
          </el-tab-pane>
          <el-tab-pane label="设备维护" name="设备维护">
            <maintenance v-if="tabListActiveName == '设备维护'" :clickNodeVal="clickNodeVal" />
          <el-tab-pane label="设备维护保养" name="设备维护保养">
            <equipmentMaintenance v-if="tabListActiveName == '设备维护保养'" :clickNodeVal="clickNodeVal" />
          </el-tab-pane>
          <el-tab-pane label="设备借用" name="设备借用">
            <borrow v-if="tabListActiveName == '设备借用'" :clickNodeVal="clickNodeVal" />
@@ -112,7 +112,6 @@
import files from "./component/files.vue";
import calibration from "./component/calibration.vue";
import check from "./component/check.vue";
import maintenance from "./component/maintenance.vue";
import borrow from "./component/borrow.vue";
import fault from "./component/fault.vue";
import record from "./component/record.vue";
@@ -131,6 +130,7 @@
import EquipmentMaintenancePlan from "./component/equipmentMaintenancePlan.vue";
import EquipmentAcceptance from "./component/equipmentAcceptance.vue";
import QuantityValueTraceabilityPlan from "./component/quantityValueTraceabilityPlan.vue";
import equipmentMaintenance from "./component/equipmentMaintenance.vue";
import {
  treeDevice,
} from '@/api/cnas/resourceDemand/device.js'
@@ -151,7 +151,6 @@
    files,
    calibration,
    check,
    maintenance,
    borrow,
    fault,
    record,
@@ -159,7 +158,8 @@
    management,
    overview,
    resourceReservation,
    operationInstruction
    operationInstruction,
    equipmentMaintenance,
  },
  data() {
    return {