spring
2025-04-16 3c510ea35b428feed7f7a1743a595e7dba634518
src/views/CNAS/resourceDemand/device/component/maintenance.vue
@@ -2,22 +2,24 @@
<template>
  <div>
    <div class="search">
      <div class="search_thing">
        <div class="search_label">流程编号:</div>
        <div class="search_input"><el-input v-model="search.deviceNumber" clearable placeholder="请输入" size="small"
            @keyup.enter.native="getAllMessage(clickNodeVal.value)"></el-input></div>
      </div>
      <div class="search_thing" style="padding-left: 30px;">
        <el-button size="small" @click="resetSearch">重 置</el-button>
        <el-button size="small" type="primary" @click="getAllMessage(clickNodeVal.value)">查 询</el-button>
      </div>
      <div class="btns">
      <el-form :model="search" ref="search" size="small" :inline="true">
        <el-form-item label="流程编号">
          <el-input v-model="search.deviceNumber" clearable placeholder="请输入" size="small"
                    @keyup.enter.native="getAllMessage(clickNodeVal.value)"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" type="primary" @click="getAllMessage(clickNodeVal.value)">查询</el-button>
          <el-button size="mini" @click="resetSearch">重置</el-button>
        </el-form-item>
      </el-form>
      <div>
        <el-button size="small" type="primary" @click="dialogVisible = true; add()">添加维护记录</el-button>
        <el-button :loading="outLoading" size="small" type="primary" @click="handleDownOne">导出</el-button>
      </div>
    </div>
    <div class="tables" style="margin-top: 10px;">
      <el-table ref="table" :data="MaintainParam" height="calc(100vh - 20em)">
    <div>
      <el-table ref="table" :data="MaintainParam" height="calc(100vh - 20em)"
                :header-cell-style="{ background: '#f8f8f9', color: '#515a6e' }" border>
        <el-table-column label="序号" type="index" width="120">
          <template v-slot="scope">
            <span>{{ (search.current - 1) * search.size + scope.$index + 1 }}</span>
@@ -40,7 +42,7 @@
      </el-table>
      <el-pagination :current-page="1" :page-size="search.size" :page-sizes="[10, 20, 30, 50, 100]"
        :total="search.total" layout="->,total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
        @current-change="handleCurrentChange">
        @current-change="handleCurrentChange" background>
      </el-pagination>
    </div>
    <!-- 新建维护 -->
@@ -118,8 +120,10 @@
<script>
import {
  exportMaintenanceRecord,
  deviceMaintainDelete,
  deleteDeviceMaintenance,
  selectDeviceByCode,
  addDeviceMaintenance,
  getDeviceMaintenancePage,
} from '@/api/cnas/resourceDemand/device.js'
export default {
  props: {
@@ -180,33 +184,7 @@
      exportMaintenanceRecord({ deviceId: this.clickNodeVal.value }).then(res => {
        this.outLoading = false
        const blob = new Blob([res], { type: 'application/octet-stream' });
        this.$message.success('导出成功')
        //将Blob 对象转换成字符串
        let reader = new FileReader();
        reader.readAsText(blob, 'utf-8');
        reader.onload = () => {
          try {
            let result = JSON.parse(reader.result);
            if (result.message) {
              this.$message.error(result.message);
            } else {
              const url = URL.createObjectURL(blob);
              const link = document.createElement('a');
              link.href = url;
              link.download = '设备维护保养记录.doc';
              link.click();
              this.$message.success('导出成功')
            }
          } catch (err) {
            console.log(err);
            const url = URL.createObjectURL(blob);
            const link = document.createElement('a');
            link.href = url;
            link.download = '设备维护保养记录.doc';
            link.click();
            this.$message.success('导出成功')
          }
        }
        this.$download.saveAs(blob, '设备维护保养记录.doc')
      })
    },
    //操作详情删除
@@ -216,9 +194,10 @@
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deviceMaintainDelete(row.id).then(res => {
        deleteDeviceMaintenance({ id: row.id }).then(res => {
        })
        this.MaintainParam.splice(index, 1);
        // this.MaintainParam.splice(index, 1);
        this.getAllMessage(this.clickNodeVal.value)
        this.$message({
          type: 'success',
          message: '删除成功!'
@@ -246,15 +225,15 @@
      this.$refs['form'].validate((valid) => {
        if (valid) {
          this.formData.deviceId = this.clickNodeVal.value;
          this.$axios.post(this.$api.deviceCheck.deviceMaintainAdd, this.formData).then(res => {
          addDeviceMaintenance(this.formData).then(res => {
            if (res.code == 200) {
              this.$message.success('添加成功');
              this.getAllMessage(this.clickNodeVal.value)
              this.dialogVisible = false;
              this.formData = {}; //清空表单
            }
          })
          this.MaintainParam.push(this.formData)
          this.dialogVisible = false;
          this.formData = {}; //清空表单
          // this.MaintainParam.push(this.formData)
        }
      })
    },
@@ -269,7 +248,10 @@
    },
    //获取表单设备维护信息
    getAllMessage(deviceId) {
      this.$axios.get(this.$api.deviceCheck.getDeviceMaintenancePage + "?deviceId=" + deviceId + "&size=" + this.search.size + "&current=" + this.search.current + "&deviceNumber=" + this.search.deviceNumber).then(res => {
      getDeviceMaintenancePage({
        deviceId,
        ...this.search
      }).then(res => {
        if (res.code == 200) {
          this.MaintainParam = res.data.records
          this.search.total = res.data.total
@@ -295,66 +277,11 @@
</script>
<style scoped>
h4 {
  font-weight: 400;
  font-size: 16px;
.search {
  height: 46px;
  display: flex;
  justify-content: space-between;
  margin: 10px 0;
}
h4 .line {
  display: inline-block;
  width: 3px;
  height: 16px;
  background: #3A7BFA;
  margin-right: 4px;
}
.tables {
  width: 100%;
  height: calc(100vh - 17em);
}
.search {
  background-color: #fff;
  display: flex;
  align-items: center;
  position: relative;
  margin-top: 10px;
}
.search_thing {
  display: flex;
  align-items: center;
  height: 40px;
}
.search_label {
  width: 80px;
  font-size: 14px;
  text-align: right;
}
.search_input {
  width: 73%;
}
.btns {
  position: absolute;
  right: 0px;
  top: 50%;
  transform: translate(0, -50%);
}
.btns_thing {
  position: absolute;
  right: 230px;
  top: 50%;
  transform: translate(0, -50%);
}
.form .search_label {
  width: 120px;
  align-items: flex-start;
}
</style>