| | |
| | | <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> |
| | |
| | | <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"> |
| | |
| | | <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"> |
| | |
| | | <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;"> |
| | |
| | | </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"> |
| | |
| | | </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: { |
| | |
| | | } |
| | | }, |
| | | 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: ['借出', '借用'], |
| | |
| | | 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() |
| | | } |
| | | }, |
| | |
| | | } |
| | | }, |
| | | 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 |
| | |
| | | // 获取当前环节操作人与日期 |
| | | 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: |
| | |
| | | }, |
| | | // 查看详情 |
| | | 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 |
| | |
| | | //导出 |
| | | 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> |