<template>
|
<!-- 设备维护保养（只读台账，记录由保养计划生成）-->
|
<div>
|
<div class="search">
|
<el-button size="small" type="primary" @click="refreshTableList">刷新</el-button>
|
<el-button :loading="outLoading" size="small" type="primary" @click="openHandleOut">导 出</el-button>
|
</div>
|
<div>
|
<el-table v-loading="tableLoading" :data="tableData" border height="calc(100vh - 20em)" style="width: 100%;">
|
<el-table-column align="center" header-align="center" label="序号" prop="prop" type="index"
|
width="60"></el-table-column>
|
<el-table-column align="center" header-align="center" label="维护日期" min-width="110">
|
<template #default="scope">{{ formatDate(scope.row.maintenanceDate) }}</template>
|
</el-table-column>
|
<el-table-column align="center" header-align="center" label="维护保养内容">
|
<el-table-column v-for="item in checkColumns" :key="item.prop" align="center" header-align="center"
|
:label="item.label" width="110">
|
<template #default="scope">{{ scope.row[item.prop] || '—' }}</template>
|
</el-table-column>
|
</el-table-column>
|
<el-table-column align="center" header-align="center" label="维护人" min-width="100">
|
<template #default="scope">{{ scope.row.maintenanceUserName || '—' }}</template>
|
</el-table-column>
|
<el-table-column label="审核状态" min-width="100">
|
<template #default="scope">
|
<el-tag v-if="scope.row.recordStatus === 1" type="warning" disable-transitions>待审核</el-tag>
|
<el-tag v-else-if="scope.row.recordStatus === 2" type="success" disable-transitions>通过</el-tag>
|
<el-tag v-else-if="scope.row.recordStatus === 3" type="danger" disable-transitions>不通过</el-tag>
|
<el-tag v-else type="info" disable-transitions>历史</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="备注" min-width="140" show-overflow-tooltip>
|
<template #default="scope">{{ scope.row.remark || '—' }}</template>
|
</el-table-column>
|
<el-table-column align="center" fixed="right" label="操作" min-width="120">
|
<template #default="scope">
|
<el-button size="small" link type="primary" @click="handleView(scope.row)">查看</el-button>
|
<el-button v-if="scope.row.recordStatus === 1 || scope.row.recordStatus === 3" size="small" link
|
type="danger" @click="handleDeleteClick(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-pagination :current-page="pagination.current" :page-size="pagination.size"
|
:page-sizes="[10, 20, 30, 50, 100]" background :total="pagination.total"
|
layout="->,total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
|
@current-change="handleCurrentChange">
|
</el-pagination>
|
</div>
|
<el-dialog :close-on-click-modal="false" v-model="dialogVisible" title="查看保养记录" width="880px">
|
<el-form :model="form" label-width="150px" size="small">
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="设备名称：">
|
<el-input v-model="form.deviceName" disabled></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="设备编号：">
|
<el-input v-model="form.managementNumber" disabled></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="维护日期：">
|
<el-input v-model="form.maintenanceDate" disabled></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="维护人：">
|
<el-input v-model="form.maintenanceUserName" disabled></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<div class="form-section-title">维护保养内容</div>
|
<el-row>
|
<el-col v-for="item in checkColumns" :key="item.prop" :span="12">
|
<el-form-item :label="item.label + '：'">
|
<el-input v-model="form[item.prop]" disabled></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item label="保养备注：">
|
<el-input v-model="form.remark" :rows="2" disabled type="textarea"></el-input>
|
</el-form-item>
|
<el-form-item label="审核状态：">
|
<el-tag v-if="form.recordStatus === 1" type="warning" disable-transitions>待审核</el-tag>
|
<el-tag v-else-if="form.recordStatus === 2" type="success" disable-transitions>通过</el-tag>
|
<el-tag v-else-if="form.recordStatus === 3" type="danger" disable-transitions>不通过</el-tag>
|
<el-tag v-else type="info" disable-transitions>历史</el-tag>
|
</el-form-item>
|
<el-row v-if="form.reviewUserName || form.reviewTime">
|
<el-col :span="12">
|
<el-form-item label="审核人：">
|
<el-input v-model="form.reviewUserName" disabled></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="审核时间：">
|
<el-input v-model="form.reviewTime" disabled></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item v-if="form.reviewRemark" label="审核意见：">
|
<el-input v-model="form.reviewRemark" :rows="2" disabled type="textarea"></el-input>
|
</el-form-item>
|
</el-form>
|
<template #footer><span class="dialog-footer">
|
<el-button @click="dialogVisible = false">关 闭</el-button>
|
</span></template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
deleteDeviceMaintenance,
|
exportDeviceMaintenance,
|
selectDeviceMaintenancePage,
|
} from '@/api/cnas/resourceDemand/device'
|
import { formatDateOnly, formatListDate } from './dateFormat'
|
import { saveBlobOrShowError } from '@/utils/saveBlob'
|
|
// 维护保养检查项，与仪器设备维护保养记录表一致
|
const CHECK_ITEMS = [
|
{ label: '外观是否良好', prop: 'appearanceGood' },
|
{ label: '是否可以正常使用', prop: 'normalUse' },
|
{ label: '是否清洁仪器表面', prop: 'surfaceClean' },
|
{ label: '标识是否完好', prop: 'labelIntact' },
|
{ label: '显示器灯是否正常', prop: 'displayLightNormal' },
|
{ label: '仪器是否生锈', prop: 'noRust' },
|
{ label: '校准是否正常', prop: 'calibrationNormal' },
|
{ label: '配件是否需要更换', prop: 'partsReplace' },
|
{ label: '维护结果是否正常', prop: 'resultNormal' },
|
]
|
|
export default {
|
name: 'equipment-maintenance',
|
props: {
|
clickNodeVal: {
|
type: Object,
|
default: () => {
|
return {};
|
}
|
},
|
},
|
data() {
|
return {
|
outLoading: false,
|
tableData: [],
|
tableLoading: false,
|
pagination: {
|
total: 0,
|
size: 20,
|
current: 1,
|
},
|
checkColumns: CHECK_ITEMS.map(item => ({ ...item })),
|
dialogVisible: false,
|
form: {},
|
};
|
},
|
mounted() {
|
this.refreshTableList()
|
},
|
methods: {
|
// 点击刷新
|
refreshTableList() {
|
this.pagination.current = 1
|
this.getTableList()
|
},
|
formatDate(value) {
|
return formatDateOnly(value) || '—'
|
},
|
// 分页
|
handleSizeChange(val) {
|
this.pagination.size = val
|
this.getTableList()
|
},
|
// 分页
|
handleCurrentChange(val) {
|
this.pagination.current = val
|
this.getTableList()
|
},
|
getTableList() {
|
if (!this.clickNodeVal.value) {
|
this.tableData = []
|
this.pagination.total = 0
|
return
|
}
|
this.tableLoading = true
|
selectDeviceMaintenancePage({
|
deviceId: this.clickNodeVal.value,
|
current: this.pagination.current,
|
size: this.pagination.size,
|
}).then(res => {
|
this.tableLoading = false
|
if (res.code == 200) {
|
this.tableData = res.data.records || []
|
this.pagination.total = res.data.total || 0
|
}
|
}).catch(() => {
|
this.tableLoading = false
|
})
|
},
|
// 查看保养记录（只读）
|
handleView(row) {
|
this.form = {
|
deviceName: row.deviceName || '',
|
managementNumber: row.managementNumber || '',
|
maintenanceDate: formatDateOnly(row.maintenanceDate),
|
maintenanceUserName: row.maintenanceUserName || '',
|
remark: row.remark || '',
|
reviewUserName: row.reviewUserName || '',
|
reviewTime: formatListDate(row.reviewTime) || '',
|
reviewRemark: row.reviewRemark || '',
|
recordStatus: row.recordStatus,
|
}
|
this.checkColumns.forEach(item => {
|
this.form[item.prop] = row[item.prop] || ''
|
})
|
this.dialogVisible = true
|
},
|
openHandleOut() {
|
if (!this.clickNodeVal.value) {
|
this.$message.warning('请先选择设备')
|
return
|
}
|
this.outLoading = true
|
exportDeviceMaintenance({
|
deviceId: this.clickNodeVal.value
|
}).then(res => {
|
this.outLoading = false
|
saveBlobOrShowError(res, '仪器设备维护保养记录.docx', 'application/msword')
|
}).catch(() => {
|
this.outLoading = false
|
})
|
},
|
// 只允许删除待审核/不通过的记录（历史与审核通过记录留档）
|
handleDeleteClick(row) {
|
this.$confirm('此操作将永久删除该条保养记录, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
deleteDeviceMaintenance({ id: row.id }).then(res => {
|
this.$message({
|
type: 'success',
|
message: '删除成功!'
|
});
|
this.getTableList()
|
})
|
}).catch(() => {
|
this.$message({
|
type: 'info',
|
message: '已取消删除'
|
});
|
});
|
},
|
},
|
watch: {
|
// 监听点击el-tree的数据，进行数据刷新
|
clickNodeVal(newVal) {
|
this.refreshTableList();
|
},
|
}
|
};
|
</script>
|
|
<style scoped>
|
.search {
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
height: 46px;
|
margin-top: 10px;
|
}
|
|
.form-section-title {
|
font-size: 14px;
|
font-weight: 600;
|
color: var(--lims-text);
|
margin: 4px 0 16px;
|
padding-left: 8px;
|
border-left: 4px solid var(--el-color-primary);
|
}
|
</style>
|
