feat: 优化
parent
329a1a324e
commit
2ca04c2165
@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card>
|
||||
|
||||
<el-form :model="query" v-if="showSearch" label-width="auto">
|
||||
<el-row :gutter="20">
|
||||
<!-- <el-col :span="6">-->
|
||||
<!-- <el-form-item label="所属科室" >-->
|
||||
<!-- <deptSelect :value.sync="query.deptCode" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<el-col :span="6">
|
||||
<el-form-item label="设备编码">
|
||||
<el-input v-model="query.deviceCode" clearable/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="设备名称">
|
||||
<el-input v-model="query.productName" clearable/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="设备状态">
|
||||
<el-select v-model="query.status"
|
||||
style="width: 100%"
|
||||
clearable>
|
||||
<el-option
|
||||
v-for="item in deviceStatus"
|
||||
:key="item.key"
|
||||
:label="item.desc"
|
||||
:value="item.key">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div class="top-right-btn">
|
||||
<el-button-group>
|
||||
<el-button icon="el-icon-view" type="primary" @click="showSearch = !showSearch">显示/隐藏搜索栏</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="onReset"
|
||||
>重置
|
||||
</el-button>
|
||||
<el-button type="primary" icon="el-icon-search" @click="search"
|
||||
>查询
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
<el-divider style="margin: 15px"></el-divider>
|
||||
|
||||
<el-table :data="list" @current-change="rowClickDetail" v-loading="loading" click-row-light>
|
||||
<el-table-column label="序号" width="50" type="index"/>
|
||||
<el-table-column label="科室" width="150" prop="deptName"/>
|
||||
<el-table-column label="设备编码" width="150" prop="deviceCode"/>
|
||||
<el-table-column label="最小销售标识" width="150" prop="nameCode"/>
|
||||
<el-table-column label="名称" width="150" prop="productName"/>
|
||||
<el-table-column label="规格型号" width="160" prop="ggxh"/>
|
||||
<el-table-column label="状态" width="120" prop="statusName">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="deviceStatus[scope.row.status].tagType">{{ scope.row.statusName }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="巡检锁定" width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="scope.row.checkLock?'primark':'info'">{{ scope.row.checkLock ? '是' : '否' }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="变更次数" width="100" prop="changeCount"/>
|
||||
<el-table-column label="维修次数" width="100" prop="repairCount"/>
|
||||
<el-table-column label="巡检次数" width="100" prop="checkCount"/>
|
||||
<el-table-column label="计量单位" width="100" prop="measname"/>
|
||||
<el-table-column label="生产企业" width="180" prop="manufactory"/>
|
||||
<el-table-column label="批次号" width="100" prop="batchNo"/>
|
||||
<el-table-column label="序列号" width="100" prop="serialNo"/>
|
||||
<el-table-column label="生产日期" width="140" prop="productionDate"/>
|
||||
<el-table-column label="过期时间" width="140" prop="expireDate"/>
|
||||
<el-table-column label="供应商" width="100" prop="supName"/>
|
||||
<el-table-column label="udi码" width="150" prop="udi"/>
|
||||
<el-table-column label="注册/备案号" width="150" prop="zczbhhzbapzbh"/>
|
||||
<el-table-column label="操作" :width="200" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<!-- <el-button class="mr10" type="text" @click="rowClickDetail(scope.row)"-->
|
||||
<!-- >详情-->
|
||||
<!-- </el-button>-->
|
||||
<el-button class="mr10" type="text" @click="getDeviceLogs(scope.row)"
|
||||
>变更日志
|
||||
</el-button>
|
||||
<el-popover class="mr10"
|
||||
placement="left"
|
||||
width="300"
|
||||
trigger="click">
|
||||
<div v-if="scope.row.QR" align="center">
|
||||
<el-image :src="scope.row.QR" style="display: block"/>
|
||||
<el-button style="display: block"
|
||||
@click="downloadBase64Image(scope.row.QR,`${scope.row.deviceCode}——${scope.row.productName}——${scope.row.ggxh}`)">
|
||||
下载
|
||||
</el-button>
|
||||
</div>
|
||||
<el-button slot="reference" type="text" @click="genQR(scope.row)"
|
||||
>设备码
|
||||
</el-button>
|
||||
</el-popover>
|
||||
<el-button v-if="isChoose&&scope.row.status==deviceStatus.NORMAL.key" type="text"
|
||||
@click="chooseFunc(scope.row)"
|
||||
>选择
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="query.page"
|
||||
:limit.sync="query.limit"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</el-card>
|
||||
|
||||
<deptDeviceDetail v-if="deviceInfoFlag"
|
||||
:rowData="this.curDevRow"
|
||||
:editSaveDev="editSaveDev"
|
||||
:visible="false"
|
||||
@refresh="rowClickDetail"
|
||||
>
|
||||
</deptDeviceDetail>
|
||||
|
||||
<el-dialog
|
||||
:title="`设备变更日志——${productRow.productName}(${productRow.deviceCode})`"
|
||||
:visible="true"
|
||||
v-if="showLog"
|
||||
@close="showLog = false"
|
||||
>
|
||||
<el-timeline>
|
||||
<el-timeline-item placement="top"
|
||||
v-for="(item, index) in logList"
|
||||
:key="index"
|
||||
size="large"
|
||||
icon="el-icon-s-promotion"
|
||||
:type="deviceChangeType[item.type].tagType"
|
||||
:timestamp="item.createTime">
|
||||
<el-card style="margin-left: 0px">
|
||||
<div slot="header">
|
||||
<div style="font-size: 24px">
|
||||
{{ item.typeName }}
|
||||
</div>
|
||||
</div>
|
||||
<el-descriptions>
|
||||
<el-descriptions-item label="操作部门">{{ item.deptName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="操作人">{{ item.createUserName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="变更单号">{{ item.changeOrderId }}</el-descriptions-item>
|
||||
<el-descriptions-item label="目标部门">{{ item.toDeptName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="确认人">{{ item.confirmUserName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="确认时间">{{ item.confirmTime }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-card>
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script src="./js/deviceInfoFull.js"/>
|
@ -0,0 +1,163 @@
|
||||
import {deviceAllPage, deviceLogs, detailPage, genDeviceQR,detailByDeptCodePage} from "@/api/dev/deviceInfoApi";
|
||||
import {deviceChangeStatus, deviceChangeType, deviceStatus} from "@/utils/enum";
|
||||
import {downloadBase64Image} from "@/utils";
|
||||
import deptDeviceDetail from "@/views/dev/DeptDeviceDetail.vue";
|
||||
import {updateOrderItem } from "@/api/dev/deviceInfoApi";
|
||||
|
||||
let query = {
|
||||
page: 1,
|
||||
limit: 10,
|
||||
productName: null,
|
||||
deviceCode: null,
|
||||
deptCode: null,
|
||||
status: null,
|
||||
}
|
||||
|
||||
let detailQuery = {
|
||||
page: 1,
|
||||
limit: 10,
|
||||
deviceCode:null,
|
||||
deptCode: null,
|
||||
productId: null,
|
||||
}
|
||||
|
||||
export default {
|
||||
name: "deviceInfo",
|
||||
computed: {
|
||||
deviceChangeType() {
|
||||
return deviceChangeType
|
||||
},
|
||||
deviceStatus() {
|
||||
return deviceStatus
|
||||
},
|
||||
deviceChangeStatus() {
|
||||
return deviceChangeStatus
|
||||
}
|
||||
},
|
||||
props: {isChoose: {required: false, default: false, type: Boolean}, chooseFunc: {required: false, type: Function}},
|
||||
data() {
|
||||
return {
|
||||
deviceInfoFlag: false,
|
||||
locDeptCode: null,
|
||||
clickRow: null,
|
||||
showSearch: true,
|
||||
loading: false,
|
||||
total: .0,
|
||||
list: [],
|
||||
query: {...query},
|
||||
//设备详情=============================================
|
||||
detailLoading: false,
|
||||
detailQuery: {...detailQuery},
|
||||
detailList: [],
|
||||
detailTotal: 0,
|
||||
showLog: false,
|
||||
productRow: null,
|
||||
//===================================================
|
||||
logList: [],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.locDeptCode = this.$store.getters.locDeptCode
|
||||
this.query.deptCode = this.$store.getters.locDeptCode
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
|
||||
//设备编辑保存
|
||||
editSaveDev(row) {
|
||||
// this.curDevRow = row;
|
||||
// console.log(this.curDevRow)
|
||||
updateOrderItem(this.curDevRow).then(res => {
|
||||
if (res.code != 20000) {
|
||||
this.$message.error(res.message)
|
||||
return
|
||||
}
|
||||
this.getList()
|
||||
this.$message.success(res.message)
|
||||
})
|
||||
// this.deviceInfoFlag = false;
|
||||
},
|
||||
downloadBase64Image,
|
||||
genQR(row) {
|
||||
genDeviceQR(row.deviceCode).then(res => {
|
||||
if (res.code != 20000) {
|
||||
this.$message.error(res.message)
|
||||
return
|
||||
}
|
||||
this.$set(row, 'QR', res.data)
|
||||
})
|
||||
},
|
||||
getDeviceLogs(row) {
|
||||
this.productRow = row
|
||||
deviceLogs(row.deviceCode).then(res => {
|
||||
if (res.code != 20000) {
|
||||
this.$message.error(res.message)
|
||||
return
|
||||
}
|
||||
this.logList = res.data || []
|
||||
this.showLog = true
|
||||
}).catch(e => {
|
||||
})
|
||||
},
|
||||
rowClick(row) {
|
||||
if (this.clickRow && row.deptCode == this.clickRow.deptCode && row.productId == this.clickRow.productId && row.status == this.clickRow.status && row.checkLock == this.clickRow.checkLock) {
|
||||
return false
|
||||
}
|
||||
this.clickRow = row
|
||||
this.detailQuery = {...detailQuery, deptCode: row.deptCode, productId: row.productId, status: row.status,checkLock:row.checkLock}
|
||||
this.getDetailList()
|
||||
},
|
||||
rowClickDetail(row){
|
||||
this.deviceInfoFlag = false
|
||||
this.curDevRow = row;
|
||||
this.$emit('refresh');
|
||||
this.deviceInfoFlag = true
|
||||
},
|
||||
getDetailList() {
|
||||
this.detailLoading = true
|
||||
detailPage(this.detailQuery).then(res => {
|
||||
this.detailLoading = false
|
||||
if (res.code != 20000) {
|
||||
this.$message.error(res.message)
|
||||
return
|
||||
}
|
||||
this.detailList = res.data.list || []
|
||||
this.detailTotal = res.data.total || 0
|
||||
}).catch(e => {
|
||||
this.detailLoading = false
|
||||
})
|
||||
},
|
||||
search() {
|
||||
this.query.page = 1
|
||||
this.getList()
|
||||
},
|
||||
onReset() {
|
||||
this.query = {...query}
|
||||
this.query.deptCode = this.$store.getters.locDeptCode
|
||||
this.getList()
|
||||
},
|
||||
getList() {
|
||||
this.loading = true
|
||||
if (this.query.deptCode == null){
|
||||
this.$message.warning("请选择所属科室!")
|
||||
this.loading = false
|
||||
return
|
||||
}
|
||||
detailByDeptCodePage(this.query).then(res => {
|
||||
this.loading = false
|
||||
if (res.code != 20000) {
|
||||
this.$message.error(res.message)
|
||||
return
|
||||
}
|
||||
this.list = res.data.list || []
|
||||
this.total = res.data.total || 0
|
||||
|
||||
}).catch(e => {
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
},
|
||||
components:{
|
||||
deptDeviceDetail
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue