<template>
|
<div>
|
<div class="search">
|
<el-button size="small" type="primary" @click="refreshTableList">刷新</el-button>
|
<el-button size="small" type="primary" @click="openDia('add')">新 建</el-button>
|
<el-button :loading="outLoading" size="small" type="primary" @click="openHandleOut">导 出</el-button>
|
</div>
|
<div>
|
<lims-table :tableData="tableData" :column="column"
|
height="calc(100vh - 20em)" @pagination="pagination"
|
:page="page" :tableLoading="tableLoading"></lims-table>
|
</div>
|
<el-dialog :visible.sync="dialogVisible" title="仪器设备使用维护保养表" width="55%">
|
<el-form ref="form" :model="form" label-width="130px" :rules="rules">
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="维护日期:" prop="maintenanceDate">
|
<el-date-picker v-model="form.maintenanceDate" :disabled="operationType === 'view'"
|
format="yyyy-MM-dd" size="small" placeholder="选择日期" style="width:100%"
|
type="date" value-format="yyyy-MM-dd">
|
</el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="24">
|
<el-form-item label="维护内容:" prop="maintenanceContentArr">
|
<el-checkbox-group v-model="form.maintenanceContentArr" :disabled="operationType === 'view'">
|
<el-checkbox v-for="city in qualificationList" :key="city.label" :label="city.label"
|
:value="city.label"></el-checkbox>
|
</el-checkbox-group>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="维护人:" prop="maintenanceUserId">
|
<el-select v-model="form.maintenanceUserId"
|
clearable filterable
|
placeholder="请选择" size="small" style="width: 100%;">
|
<el-option v-for="item in responsibleOptions" :key="item.id" :label="item.name" :value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="备注:" prop="remark">
|
<el-input v-model="form.remark" :disabled="operationType === 'view'" size="small"
|
style="width: 100%;"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="closeDia">取 消</el-button>
|
<el-button v-if="operationType !== 'view'" type="primary" @click="saveRecord" :loading="buttonLoading">确 定</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
addDeviceMaintenance,
|
deleteDeviceMaintenance, exportDeviceMaintenance,
|
selectDeviceMaintenancePage
|
} from "@/api/cnas/resourceDemand/device";
|
import limsTable from "@/components/Table/lims-table.vue";
|
import {selectUserCondition} from "@/api/system/user";
|
|
export default {
|
name: '',
|
// import 引入的组件需要注入到对象中才能使用
|
components: {limsTable},
|
props: {
|
clickNodeVal: {
|
type: Object,
|
default: () => {
|
return {};
|
}
|
},
|
},
|
data() {
|
// 这里存放数据
|
return {
|
search: {
|
maintenanceDate: '',
|
},
|
outLoading: false,
|
tableData: [],
|
tableLoading: false,
|
page: {
|
total: 0,
|
size: 20,
|
current: 1
|
},
|
column: [
|
{ label: '维护日期', prop: 'maintenanceDate' },
|
{ label: '维护内容', prop: 'maintenanceContent' },
|
{ label: '维护人', prop: 'maintenanceUserName' },
|
{ label: '备注', prop: 'remark' },
|
{
|
dataType: 'action',
|
label: '操作',
|
operation: [
|
{
|
name: '编辑',
|
type: 'text',
|
clickFun: (row) => {
|
this.openDia('edit', row);
|
},
|
},
|
{
|
name: '删除',
|
type: 'text',
|
clickFun: (row) => {
|
this.handleDeleteClick(row);
|
},
|
},
|
]
|
}
|
],
|
dialogVisible: false,
|
form: {
|
id: '',
|
deviceId: '',
|
maintenanceDate: '',
|
maintenanceContentArr: [],
|
maintenanceContent: '',
|
maintenanceUserId: '',
|
remark: '',
|
},
|
operationType: '',
|
buttonLoading: false,
|
qualificationList: [],
|
rules: {
|
maintenanceDate: [{ required: true, message: '请选择维护日期', trigger: 'change' }],
|
maintenanceContentArr: [{ required: true, message: '请选择维护内容', trigger: 'change' }],
|
maintenanceUserId: [{ required: true, message: '请选择维护人', trigger: 'change' }],
|
},
|
responsibleOptions: [],
|
};
|
},
|
mounted() {
|
this.refreshTableList()
|
},
|
// 方法集合
|
methods: {
|
// 点击刷新
|
refreshTableList () {
|
this.page.current = 1;
|
this.getTableList()
|
},
|
// 分页切换
|
pagination(page) {
|
this.page.size = page.limit
|
this.getTableList()
|
},
|
getTableList () {
|
this.tableLoading = true
|
selectDeviceMaintenancePage({
|
deviceId: this.clickNodeVal.value,
|
...this.page
|
}).then(res => {
|
this.tableLoading = false
|
this.tableData = res.data.records
|
this.page.total = res.data.total
|
}).catch(err => {
|
this.tableLoading = false
|
})
|
},
|
// 打开操作弹框
|
openDia (type, row) {
|
this.operationType = type
|
this.dialogVisible = true
|
this.$nextTick(() => {
|
this.$refs['form'].resetFields()
|
this.form.id = ''
|
if (this.operationType === 'edit') {
|
this.form = {...row}
|
this.$set(this.form, 'maintenanceContentArr', this.form.maintenanceContent.split(','))
|
}
|
})
|
this.getDictS()
|
this.getUserList()
|
},
|
// 查询维护内容选择框内容
|
getDictS () {
|
// 定义实验室名称与维护内容类型的映射关系
|
const labTypeMapping = {
|
'老化室': 'aging_maintenance_content',
|
'老化实验室': 'aging_maintenance_content',
|
'电性能实验室': 'electrical_maintenance_content',
|
'环境实验室': 'environmental_maintenance_content',
|
'燃烧实验室': 'burn_maintenance_content',
|
'混炼实验室': 'mixing_maintenance_content',
|
'检测中心电性能实验室': 'center_electrical_maintenance_content',
|
'恒温二': 'temperature2_maintenance_content',
|
'恒温一': 'temperature1_maintenance_content',
|
'化学实验室': 'chemistry_maintenance_content',
|
'制样室': 'sample_maintenance_content',
|
'低温实验室': 'hypothermia_maintenance_content',
|
};
|
// 获取当前节点的实验室名称
|
const name = this.clickNodeVal.parent.label;
|
// 根据映射关系获取对应的类型
|
const type = labTypeMapping[name];
|
this.getDicts(type).then((response) => {
|
this.qualificationList = response.data.map((m) => {
|
return {
|
label: m.dictLabel,
|
value: m.dictValue,
|
};
|
});
|
});
|
},
|
openHandleOut () {
|
this.outLoading = true
|
exportDeviceMaintenance({
|
deviceId: this.clickNodeVal.value
|
}).then(res => {
|
this.outLoading = false
|
const blob = new Blob([res], { type: 'application/octet-stream' });
|
this.$download.saveAs(blob, '设备维护保养.doc')
|
})
|
|
},
|
handleDeleteClick(row) {
|
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
deleteDeviceMaintenance({ id: row.id }).then(res => {
|
this.$message({
|
type: 'success',
|
message: '删除成功!'
|
});
|
this.refreshTableList()
|
})
|
}).catch(() => {
|
this.$message({
|
type: 'info',
|
message: '已取消删除'
|
});
|
});
|
},
|
// 提交新增和保存
|
saveRecord () {
|
this.$refs.form.validate((valid) => {
|
if (valid) {
|
this.buttonLoading = true;
|
this.form.maintenanceContent = this.form.maintenanceContentArr.join(',')
|
this.form.deviceId = this.clickNodeVal.value
|
addDeviceMaintenance(this.form).then(res => {
|
this.buttonLoading = false;
|
this.$message.success('新增成功')
|
this.closeDia()
|
this.getTableList()
|
}).catch(err => {
|
this.buttonLoading = false;
|
})
|
}
|
})
|
},
|
closeDia () {
|
this.$refs['form'].resetFields();
|
this.dialogVisible = false
|
this.refreshTableList()
|
},
|
// 获取负责人信息接口
|
getUserList() {
|
selectUserCondition({type: 2}).then(res => {
|
if (res.code == 200) {
|
this.responsibleOptions = res.data
|
}
|
})
|
},
|
},
|
watch: {
|
// 监听点击el-tree的数据，进行数据刷新
|
clickNodeVal(newVal) {
|
if (newVal.value) {
|
this.refreshTableList();
|
}
|
},
|
}
|
};
|
</script>
|
|
<style scoped>
|
.search {
|
height: 46px;
|
text-align: right;
|
margin-top: 10px;
|
}
|
</style>
|
