Crunchy
2025-04-29 e5454b769d44a34af423bf87ac8a740bf8c20341
src/views/CNAS/resourceDemand/device/component/borrow.vue
@@ -2,23 +2,24 @@
<template>
  <div>
    <div class="search">
      <div class="search_thing">
        <div class="search_label">流程编号:</div>
        <div><el-input size="small" placeholder="请输入" clearable v-model="componentData.entity.processNumber"
            @keyup.enter.native="refreshTable()"></el-input></div>
      </div>
      <div class="search_thing" style="padding-left: 30px;">
        <el-button size="small" @click="refresh()">重 置</el-button>
        <el-button size="small" type="primary" @click="refreshTable()">查 询</el-button>
      </div>
      <div class="btns">
      <el-form :model="queryParams" ref="queryParams" size="small" :inline="true">
        <el-form-item label="流程编号">
          <el-input size="small" placeholder="请输入" clearable v-model="queryParams.processNumber"
                    @keyup.enter.native="refreshTable()"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" type="primary" @click="refreshTable()">查询</el-button>
          <el-button size="mini" @click="refresh()">重置</el-button>
        </el-form-item>
      </el-form>
      <div>
        <el-button size="small" type="primary" @click="add">新增</el-button>
        <!--        <el-button size="small" type="primary" @click="handleDown" :loading="outLoading">导出</el-button>-->
      </div>
    </div>
    <div class="tables" style="margin-top: 10px;">
      <ValueTable ref="ValueTable" :url="$api.deviceBorrow.deviceBorrowPage"
        :delUrl="$api.deviceBorrow.deleteDeviceBorrow" :componentData="componentData" :key="upIndex" />
    <div class="tables">
      <lims-table :tableData="tableData" :column="column" :tableLoading="tableLoading" :height="'calc(100vh - 290px)'"
        :page="page" @pagination="pagination"></lims-table>
    </div>
    <el-dialog title="仪器设备领(借)用登记" top="5vh" :visible.sync="dialogVisible" width="60%">
      <el-steps :active="currentStep" finish-status="success" align-center>
@@ -116,7 +117,6 @@
              <el-col :span="12">
                <el-form-item label="归还人:" prop="rebackUser"
                  :rules="[{ required: currentStep === 1, message: '请输入归还人', trigger: 'change' }]">
                  <!-- <el-input v-model="form.rebackUser" size="small" :disabled="currentStep !== 1"></el-input> -->
                  <el-select v-model="form.rebackUser" filterable placeholder="请选择" clearable size="small"
                    style="width: 50%;" :disabled="currentStep !== 1">
                    <el-option v-for="item in responsibleOptions" :key="item.id" :label="item.name" :value="item.name">
@@ -145,7 +145,6 @@
              <el-col :span="12">
                <el-form-item label="设备负责人:" prop="deviceUser"
                  :rules="[{ required: currentStep === 1, message: '请选择设备负责人', trigger: 'change' }]">
                  <!-- <el-input v-model="form.deviceUser" size="small" :disabled="currentStep !== 1"></el-input> -->
                  <el-select v-model="form.deviceUser" filterable placeholder="请选择" clearable size="small"
                    style="width: 50%;" :disabled="currentStep !== 1">
                    <el-option v-for="item in responsibleOptions" :key="item.id" :label="item.name" :value="item.name">
@@ -158,7 +157,6 @@
                  <el-input type="textarea" v-model="form.note" :disabled="currentStep !== 1" size="small"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-card>
          <el-row style="margin-top: 1em;">
@@ -180,7 +178,7 @@
      </span>
    </el-dialog>
    <el-dialog title="流程跟踪" top="5vh" :visible.sync="dialogVisible0" width="60%">
      <el-table :data="deviceLogs" style="width: 100%">
      <el-table :data="deviceLogs" style="width: 100%" :header-cell-style="{ background: '#f8f8f9', color: '#515a6e' }" border>
        <el-table-column type="index" width="50">
        </el-table-column>
        <el-table-column prop="operator" label="操作人" width="180">
@@ -197,13 +195,18 @@
</template>
<script>
import ValueTable from '@/components/Table/value-table.vue'
import limsTable from "@/components/Table/lims-table.vue";
import { dateFormat } from '@/utils/date'
import {
  saveDeviceBorrow,
  deleteCNASFile,
  getDeviceBorrow,
  deviceBorrowExport,
  deleteDeviceBorrow,
  deviceBorrowPage,
} from '@/api/cnas/resourceDemand/device.js'
import { selectUserCondition } from "@/api/business/inspectionTask";
import { mapGetters } from "vuex";
export default {
  props: {
    clickNodeVal: {
@@ -214,72 +217,12 @@
    }
  },
  components: {
    ValueTable
    limsTable
  },
  data() {
    return {
      dialogVisible: false,
      dialogVisible0: false,
      //表头显示
      componentData: {
        entity: {
          processNumber: null,
          deviceId: null,
          orderBy: {
            field: 'id',
            order: 'asc'
          }
        },
        isIndex: true,
        showSelect: false,
        select: false,
        do: [
          {
            id: 'show',
            font: '查看',
            type: 'text',
            method: 'lookDetail'
          },
          {
            id: 'delete',
            font: '删除',
            type: 'text',
            method: 'doDiy'
          },
          {
            id: '111',
            font: '流程跟踪',
            type: 'text',
            method: 'handleLookList'
          }],
        init: false,
        tagField: {
          recipientState: {
            select: [{
              value: 0,
              type: 'success',
              label: '合格'
            }, {
              value: 1,
              type: 'warning',
              label: '维修'
            }, {
              value: 2,
              type: 'info',
              label: '停用'
            }, {
              value: 3,
              type: 'danger',
              label: '报废'
            }]
          }
        },
        selectField: {},
        requiredAdd: [],
        requiredUp: [],
      },
      upIndex: 0,
      entityCopy: null,
      currentStep: 0, // 步骤条显示第几步
      currentStepClick: 0, // 点击步骤条变化
      steps: ['借出', '借用'],
@@ -307,15 +250,94 @@
        nextUser: [{ required: true, message: '请选择下环节负责人', trigger: 'change' }],
      },
      deviceLogs: [],
      outLoading: false
      outLoading: false,
      recipientStateList: [{
        value: 0,
        type: 'success',
        label: '合格'
      }, {
        value: 1,
        type: 'warning',
        label: '维修'
      }, {
        value: 2,
        type: 'info',
        label: '停用'
      }, {
        value: 3,
        type: 'danger',
        label: '报废'
      }],
      queryParams: {},
      tableData: [],
      column: [
        { label: "流程编号", prop: "processNumber" },
        { label: "设备名称", prop: "deviceName" },
        {
          label: "管理编号",
          prop: "unifyNumber"
        },
        { label: "借用人", prop: "recipientUser" },
        { label: "借用人联系方式", prop: "borrowerContactInformation", width: '140px' },
        { label: "借用日期", prop: "recipientTime" },
        {
          label: "借用时状态", prop: "recipientState", dataType: "tag",
          formatData: (params) => {
            return this.recipientStateList.find((m) => m.value == params).label;
          },
          formatType: (params) => {
            return this.recipientStateList.find((m) => m.value == params).type;
          },
        },
        { label: "借出人", prop: "submitUser" },
        { label: "借出日期", prop: "createTime" },
        {
          label: "当前状态", prop: "nowState"
        },
        { label: "当前责任人", prop: "nowUser" },
        { label: "附件", prop: "fileName" },
        {
          dataType: "action",
          fixed: "right",
          label: "操作",
          operation: [
            {
              name: "查看",
              type: "text",
              clickFun: (row) => {
                this.lookDetail(row);
              },
            },
            {
              name: "删除",
              type: "text",
              clickFun: (row) => {
                this.handleDelete(row);
              },
            },
            {
              name: "流程跟踪",
              type: "text",
              clickFun: (row) => {
                this.handleLookList(row);
              },
            },
          ],
        },
      ],
      page: {
        total: 0,
        size: 10,
        current: 0,
      },
      tableLoading: false,
    }
  },
  watch: {
    // 监听点击el-tree的数据,进行数据刷新
    clickNodeVal(newVal) {
      if (newVal.value) {
        this.componentData.entity.deviceId = this.clickNodeVal.value
        this.entityCopy = this.HaveJson(this.componentData.entity)
        thisqueryParams.deviceId = this.clickNodeVal.value
        this.refreshTable()
      }
    },
@@ -329,25 +351,46 @@
    }
  },
  computed: {
    ...mapGetters(["nickName"]),
    action() {
      return this.javaApi + '/personBasicInfo/saveCNASFile'
    }
  },
  mounted() {
    this.componentData.entity.deviceId = this.clickNodeVal.value
    this.entityCopy = this.HaveJson(this.componentData.entity)
    // console.log(333,this.clickNodeVal)
    this.queryParams.deviceId = this.clickNodeVal.value
    this.getUserList()
    this.refreshTable()
  },
  methods: {
    refreshTable(e) {
      this.$refs['ValueTable'].selectList(e)
    getList() {
      this.tableLoading = true;
      let param = { ...this.queryParams, ...this.page };
      delete param.total;
      deviceBorrowPage({ ...param })
        .then((res) => {
          this.tableLoading = false;
          if (res.code === 200) {
            this.tableData = res.data.records;
            this.page.total = res.data.total;
          }
        })
        .catch((err) => {
          this.tableLoading = false;
        });
    },
    pagination({ page, limit }) {
      this.page.current = page;
      this.page.size = limit;
      this.getList();
    },
    refresh() {
      this.componentData.entity = this.HaveJson(this.entityCopy)
      this.refreshTable()
      // this.upIndex++
      this.queryParams = {};
      this.page.current = 1;
      this.getList();
    },
    refreshTable() {
      this.page.current = 1;
      this.getList();
    },
    choiceStep(index) {
      this.currentStepClick = index
@@ -362,11 +405,11 @@
          // 获取当前环节操作人与日期
          switch (this.currentStep) {
            case 0:
              this.form.submitOperationUser = user.name
              this.form.submitOperationUser = this.nickName
              this.form.submitOperationTime = dateTime
              break
            case 1:
              this.form.receiveOperationUser = user.name
              this.form.receiveOperationUser = this.nickName
              this.form.receiveOperationTime = dateTime
              break
            default:
@@ -452,7 +495,7 @@
    },
    // 查看详情
    lookDetail(row) {
      this.$axios.get(this.$api.deviceBorrow.getDeviceBorrow + '?id=' + row.id).then(res => {
      getDeviceBorrow({ id: row.id }).then(res => {
        if (res.code == 200) {
          this.form = res.data
          this.form.deviceName = this.clickNodeVal.label
@@ -493,131 +536,46 @@
    //导出
    handleDown() {
      this.outLoading = true
      this.$axios.post(this.$api.deviceBorrow.deviceBorrowExport, { deviceId: this.clickNodeVal.value }, { responseType: 'blob' }).then(res => {
      deviceBorrowExport({ deviceId: this.clickNodeVal.value }).then(res => {
        this.outLoading = false
        const blob = new Blob([res], {
          type: 'application/force-download'
        })
        const filename = decodeURI(this.clickNodeVal.label + '设备借出统计' + '.xlsx')
        //将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 elink = document.createElement('a')
              elink.download = filename
              elink.style.display = 'none'
              elink.href = URL.createObjectURL(blob)
              document.body.appendChild(elink)
              elink.click();
              URL.revokeObjectURL(elink.href) // 释放URL 对象
              document.body.removeChild(elink)
              this.$message.success('导出成功')
            }
          } catch (err) {
            console.log(err);
            // 创建一个超链接,将文件流赋进去,然后实现这个超链接的单击事件
            const elink = document.createElement('a')
            elink.download = filename
            elink.style.display = 'none'
            elink.href = URL.createObjectURL(blob)
            document.body.appendChild(elink)
            elink.click();
            URL.revokeObjectURL(elink.href) // 释放URL 对象
            document.body.removeChild(elink)
            this.$message.success('导出成功')
          }
        }
        this.$download.saveAs(blob, filename)
      })
    },
    handleLookList(row) {
      this.$axios.get(this.$api.deviceBorrow.getDeviceBorrow + '?id=' + row.id).then(res => {
      getDeviceBorrow({ id: row.id }).then(res => {
        if (res.code == 200) {
          this.deviceLogs = res.data.deviceLogs
          this.dialogVisible0 = true
        }
      })
    }
    },
    handleDelete(row) {
      this.$confirm("是否删除该条数据?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          deleteDeviceBorrow({ id: row.id }).then((res) => {
            this.$message.success("删除成功");
            this.refresh();
          });
        })
        .catch(() => { });
    },
  },
}
</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 - 15em);
}
.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: 70px;
  font-size: 14px;
  text-align: right;
}
.search_input {
  width: calc(100% - 120px);
}
.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;
}
.el-radio {
  margin-right: 10px;
}
.el-radio-group {
  width: 100%;
  display: flex;
  margin-top: 12px;
}
</style>