|
|
@@ -0,0 +1,516 @@ |
|
|
|
<!-- |
|
|
|
filename: WaitingListUnplanned--edit.vue |
|
|
|
author: liubin |
|
|
|
date: 2023-08-22 14:38:56 |
|
|
|
description: |
|
|
|
--> |
|
|
|
|
|
|
|
<template> |
|
|
|
<el-drawer |
|
|
|
:visible="visible" |
|
|
|
:show-close="false" |
|
|
|
:wrapper-closable="false" |
|
|
|
class="drawer" |
|
|
|
custom-class="mes-drawer" |
|
|
|
size="60%" |
|
|
|
@closed="$emit('destroy')"> |
|
|
|
<SmallTitle slot="title">添加保养项目</SmallTitle> |
|
|
|
|
|
|
|
<div class="drawer-body flex"> |
|
|
|
<div class="drawer-body__content"> |
|
|
|
<SmallTitle>保养内容</SmallTitle> |
|
|
|
|
|
|
|
<div style="margin-top: 12px; position: relative"> |
|
|
|
<SearchBar |
|
|
|
:formConfigs="searchBarFormConfig" |
|
|
|
ref="attr-search-bar" |
|
|
|
@headBtnClick="handleSearchBarBtnClick" /> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div style="margin-top: 12px; position: relative"> |
|
|
|
<div style="position: absolute; top: -40px; right: 0"> |
|
|
|
<el-button @click="handleAddAttr" type="text"> |
|
|
|
<i class="el-icon-plus"></i> |
|
|
|
添加项目 |
|
|
|
</el-button> |
|
|
|
</div> |
|
|
|
<base-table |
|
|
|
v-loading="attrListLoading" |
|
|
|
:table-props="attrTableProps" |
|
|
|
:page="attrQuery?.params.pageNo || 1" |
|
|
|
:limit="attrQuery?.params.pageSize || 10" |
|
|
|
:table-data="attrList" |
|
|
|
@emitFun="handleEmitFun"> |
|
|
|
<method-btn |
|
|
|
slot="handleBtn" |
|
|
|
label="操作" |
|
|
|
:method-list="tableBtn" |
|
|
|
@clickBtn="handleTableBtnClick" /> |
|
|
|
</base-table> |
|
|
|
|
|
|
|
<!-- 分页组件 --> |
|
|
|
<pagination |
|
|
|
v-show="attrTotal > 0" |
|
|
|
:total="attrTotal" |
|
|
|
:page.sync="attrQuery.params.pageNo" |
|
|
|
:limit.sync="attrQuery.params.pageSize" |
|
|
|
@pagination="getAttrList" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="drawer-body__footer"> |
|
|
|
<el-button style="" @click="handleCancel">取消</el-button> |
|
|
|
<el-button type="primary" @click="handleConfirm">保存</el-button> |
|
|
|
<!-- sections的第二项必须是 属性列表 --> |
|
|
|
<!-- <el-button |
|
|
|
v-if="sections[1].allowAdd" |
|
|
|
type="primary" |
|
|
|
@click="handleAddAttr"> |
|
|
|
添加属性 |
|
|
|
</el-button> --> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 属性对话框 --> |
|
|
|
<base-dialog |
|
|
|
:dialogTitle="attrTitle" |
|
|
|
:dialogVisible="attrFormVisible" |
|
|
|
width="35%" |
|
|
|
:append-to-body="true" |
|
|
|
custom-class="baseDialog" |
|
|
|
@close="closeAttrForm" |
|
|
|
@cancel="closeAttrForm" |
|
|
|
@confirm="submitAttrForm"> |
|
|
|
<DialogForm |
|
|
|
v-if="attrFormVisible" |
|
|
|
ref="attrForm" |
|
|
|
v-model="attrForm" |
|
|
|
:rows="attrRows" /> |
|
|
|
</base-dialog> |
|
|
|
</el-drawer> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import DialogForm from '../../../components/DialogForm/index.vue'; |
|
|
|
|
|
|
|
const SmallTitle = { |
|
|
|
name: 'SmallTitle', |
|
|
|
props: ['size'], |
|
|
|
components: {}, |
|
|
|
data() { |
|
|
|
return {}; |
|
|
|
}, |
|
|
|
methods: {}, |
|
|
|
render: function (h) { |
|
|
|
return h( |
|
|
|
'span', |
|
|
|
{ |
|
|
|
class: 'small-title', |
|
|
|
style: { |
|
|
|
fontSize: '18px', |
|
|
|
lineHeight: |
|
|
|
this.size == 'lg' ? '24px' : this.size == 'sm' ? '18px' : '20px', |
|
|
|
fontWeight: 500, |
|
|
|
fontFamily: '微软雅黑, Microsoft YaHei, Arial, Helvetica, sans-serif', |
|
|
|
}, |
|
|
|
}, |
|
|
|
this.$slots.default |
|
|
|
); |
|
|
|
}, |
|
|
|
}; |
|
|
|
|
|
|
|
export default { |
|
|
|
components: { SmallTitle, DialogForm }, |
|
|
|
props: ['dataId'], // dataId 作为一个通用的存放id的字段 |
|
|
|
data() { |
|
|
|
return { |
|
|
|
visible: false, |
|
|
|
btnLoading: false, |
|
|
|
form: {}, |
|
|
|
formLoading: false, |
|
|
|
lineList: [], |
|
|
|
maintainerList: [], |
|
|
|
departmentList: [], |
|
|
|
attrTableProps: [ |
|
|
|
{ |
|
|
|
prop: 'equipmentName', |
|
|
|
label: '设备名称', |
|
|
|
}, |
|
|
|
{ |
|
|
|
prop: 'program', |
|
|
|
label: '保养项目', |
|
|
|
}, |
|
|
|
{ |
|
|
|
prop: 'maintenanceDes', |
|
|
|
label: '保养描述', |
|
|
|
}, |
|
|
|
], |
|
|
|
attrList: [], |
|
|
|
attrTotal: 0, |
|
|
|
attrTitle: '', |
|
|
|
attrForm: { |
|
|
|
id: null, |
|
|
|
logId: null, |
|
|
|
program: null, |
|
|
|
maintenanceDes: null, |
|
|
|
remark: null, |
|
|
|
}, |
|
|
|
attrFormVisible: false, |
|
|
|
attrRows: [ |
|
|
|
[ |
|
|
|
{ |
|
|
|
select: true, |
|
|
|
label: '设备名称', |
|
|
|
prop: 'equipmentId', |
|
|
|
url: '/base/core-equipment/page?pageNo=1&pageSize=100&special=true', |
|
|
|
// method: 'post', |
|
|
|
// queryParams: { |
|
|
|
// pageNo: 1, |
|
|
|
// pageSize: 100, |
|
|
|
// special: true, |
|
|
|
// }, |
|
|
|
rules: [ |
|
|
|
{ required: true, message: '设备不能为空', trigger: 'blur' }, |
|
|
|
], |
|
|
|
}, |
|
|
|
], |
|
|
|
[ |
|
|
|
{ |
|
|
|
input: true, |
|
|
|
label: '保养项目', |
|
|
|
prop: 'program', |
|
|
|
}, |
|
|
|
], |
|
|
|
[ |
|
|
|
{ |
|
|
|
input: true, |
|
|
|
label: '保养描述', |
|
|
|
prop: 'maintenanceDes', |
|
|
|
}, |
|
|
|
], |
|
|
|
[ |
|
|
|
{ |
|
|
|
input: true, |
|
|
|
label: '备注', |
|
|
|
prop: 'remark', |
|
|
|
}, |
|
|
|
], |
|
|
|
], |
|
|
|
attrQuery: { |
|
|
|
params: { |
|
|
|
pageNo: 1, |
|
|
|
pageSize: 10, |
|
|
|
equipmentName: null, |
|
|
|
}, |
|
|
|
}, // 属性列表的请求 |
|
|
|
searchBarFormConfig: [ |
|
|
|
{ |
|
|
|
type: 'input', |
|
|
|
label: '设备', |
|
|
|
placeholder: '请输入设备名称', |
|
|
|
param: 'equipmentName', |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: 'button', |
|
|
|
btnName: '查询', |
|
|
|
name: 'search', |
|
|
|
color: 'primary', |
|
|
|
}, |
|
|
|
], |
|
|
|
attrFormSubmitting: false, |
|
|
|
attrListLoading: false, |
|
|
|
// syncFileListFlag: null, |
|
|
|
tableBtn: [], |
|
|
|
row: null, |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
departmentOptions() { |
|
|
|
return (this.departmentList || []).map((item) => ({ |
|
|
|
id: item.id, |
|
|
|
label: item.name, |
|
|
|
value: item.id, |
|
|
|
})); |
|
|
|
}, |
|
|
|
lineOptions() { |
|
|
|
return (this.lineList || []).map((item) => ({ |
|
|
|
id: item.id, |
|
|
|
label: item.name, |
|
|
|
value: item.id, |
|
|
|
})); |
|
|
|
}, |
|
|
|
maintainerOptions() { |
|
|
|
return (this.maintainerList || []).map((item) => ({ |
|
|
|
id: item.id, |
|
|
|
label: item.name, |
|
|
|
value: item.name, |
|
|
|
})); |
|
|
|
}, |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
// this.getList('maintainer'); |
|
|
|
// this.getList('department'); |
|
|
|
// this.getList('line'); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
handleSearchBarBtnClick(btn) { |
|
|
|
switch (btn.btnName) { |
|
|
|
case 'search': |
|
|
|
this.attrQuery.params.equipmentName = btn.equipmentName; |
|
|
|
this.getAttrList(); |
|
|
|
break; |
|
|
|
} |
|
|
|
}, |
|
|
|
handleTableBtnClick({ type, data }) { |
|
|
|
switch (type) { |
|
|
|
case 'edit': |
|
|
|
this.handleEditAttr(data.id); |
|
|
|
break; |
|
|
|
case 'delete': |
|
|
|
this.handleDeleteAttr(data.id); |
|
|
|
break; |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
getConfirmed() { |
|
|
|
return this.$confirm('是否直接确认保养记录', '提示', { |
|
|
|
confirmButtonText: '确定', |
|
|
|
cancelButtonText: '取消', |
|
|
|
type: 'warning', |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
async handleConfirm() { |
|
|
|
if (this.attrList.length == 0) { |
|
|
|
return this.$message.error('请添加保养项目'); |
|
|
|
} |
|
|
|
|
|
|
|
let confirmed = false; |
|
|
|
try { |
|
|
|
confirmed = await this.getConfirmed(); |
|
|
|
} catch (err) { |
|
|
|
confirmed = false; |
|
|
|
} |
|
|
|
|
|
|
|
if (confirmed) { |
|
|
|
const res = await this.$axios({ |
|
|
|
url: '/base/equipment-maintain-log/confirm', |
|
|
|
method: 'put', |
|
|
|
data: [this.row.id], |
|
|
|
}); |
|
|
|
if (res.code == 0) { |
|
|
|
this.$message.success('已确认'); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// this.btnLoading = true; |
|
|
|
// this.$nextTick(async () => { |
|
|
|
// const { code, data } = await this.$axios({ |
|
|
|
// url: '/base/equipment-maintain-log/update', |
|
|
|
// method: 'put', |
|
|
|
// data: { |
|
|
|
// ...this.form, |
|
|
|
// maintainWorker: this.form.maintainWorker.join(','), |
|
|
|
// }, |
|
|
|
// }); |
|
|
|
// if (code == 0) { |
|
|
|
// this.$modal.msgSuccess('更新成功'); |
|
|
|
// } |
|
|
|
// this.btnLoading = false; |
|
|
|
// this.$emit('refreshDataList'); |
|
|
|
// this.handleCancel(); |
|
|
|
// }); |
|
|
|
this.$emit('refreshDataList'); |
|
|
|
this.handleCancel(); |
|
|
|
}, |
|
|
|
|
|
|
|
handleEmitFun(val) { |
|
|
|
console.log('handleEmitFun', val); |
|
|
|
}, |
|
|
|
|
|
|
|
init(row) { |
|
|
|
this.visible = true; |
|
|
|
this.row = row; |
|
|
|
this.getAttrList(row); |
|
|
|
}, |
|
|
|
|
|
|
|
async getAttrList(row, condition = {}) { |
|
|
|
if (!row) row = this.row; |
|
|
|
this.attrListLoading = true; |
|
|
|
const res = await this.$axios({ |
|
|
|
url: '/base/equipment-maintain-log-det/page', |
|
|
|
method: 'get', |
|
|
|
params: { |
|
|
|
...this.attrQuery.params, |
|
|
|
logId: row.id, |
|
|
|
...condition, |
|
|
|
}, |
|
|
|
}); |
|
|
|
if (res.code == 0) { |
|
|
|
this.attrList = res.data.list; |
|
|
|
this.attrTotal = res.data.total; |
|
|
|
} |
|
|
|
this.attrListLoading = false; |
|
|
|
}, |
|
|
|
|
|
|
|
handleCancel() { |
|
|
|
if (!this.attrList.length) { |
|
|
|
return this.$message.error('请添加保养项目'); |
|
|
|
} |
|
|
|
this.visible = false; |
|
|
|
}, |
|
|
|
|
|
|
|
resetAttrform() { |
|
|
|
this.attrForm = { |
|
|
|
id: null, |
|
|
|
logId: this.row.id, |
|
|
|
maintenanceDes: '', |
|
|
|
program: null, |
|
|
|
remark: null, |
|
|
|
}; |
|
|
|
}, |
|
|
|
|
|
|
|
// 新增属性 |
|
|
|
handleAddAttr() { |
|
|
|
if (!this.row.id) return this.$message.error('请先选中保养记录'); |
|
|
|
this.resetAttrform(); |
|
|
|
this.attrTitle = '添加保养项目'; |
|
|
|
this.attrFormVisible = true; |
|
|
|
}, |
|
|
|
|
|
|
|
// 编辑属性 |
|
|
|
async handleEditAttr(attrId) { |
|
|
|
const res = await this.$axios({ |
|
|
|
url: '/base/equipment-maintain-log-det/get', |
|
|
|
method: 'get', |
|
|
|
params: { id: attrId }, |
|
|
|
}); |
|
|
|
if (res.code == 0) { |
|
|
|
this.attrForm = res.data; |
|
|
|
this.attrTitle = '编辑保养项目'; |
|
|
|
this.attrFormVisible = true; |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
// 删除属性 |
|
|
|
handleDeleteAttr(attrId) { |
|
|
|
this.$confirm('确定删除该保养项目?', '提示', { |
|
|
|
confirmButtonText: '确定', |
|
|
|
cancelButtonText: '取消', |
|
|
|
type: 'warning', |
|
|
|
}) |
|
|
|
.then(async () => { |
|
|
|
const res = await this.$axios({ |
|
|
|
url: 'url delete', // this.sections[1].urlDelete, |
|
|
|
method: 'delete', |
|
|
|
params: { id: attrId }, |
|
|
|
}); |
|
|
|
if (res.code == 0) { |
|
|
|
this.$message({ |
|
|
|
message: '删除成功', |
|
|
|
type: 'success', |
|
|
|
duration: 1500, |
|
|
|
onClose: () => { |
|
|
|
this.getAttrList(); |
|
|
|
}, |
|
|
|
}); |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch(() => {}); |
|
|
|
}, |
|
|
|
|
|
|
|
// 提交属性表 |
|
|
|
submitAttrForm() { |
|
|
|
this.$refs['attrForm'].validate(async (valid) => { |
|
|
|
if (!valid) { |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
try { |
|
|
|
const isEdit = this.attrForm.id != null; |
|
|
|
this.attrFormSubmitting = true; |
|
|
|
const res = await this.$axios({ |
|
|
|
url: isEdit |
|
|
|
? '/base/equipment-maintain-log-det/update' |
|
|
|
: '/base/equipment-maintain-log-det/create', |
|
|
|
method: isEdit ? 'put' : 'post', |
|
|
|
data: this.attrForm, |
|
|
|
}); |
|
|
|
|
|
|
|
if (res.code == 0) { |
|
|
|
this.closeAttrForm(); |
|
|
|
this.$message({ |
|
|
|
message: `${isEdit ? '更新' : '创建'}成功`, |
|
|
|
type: 'success', |
|
|
|
duration: 1500, |
|
|
|
onClose: () => { |
|
|
|
this.getAttrList(); |
|
|
|
}, |
|
|
|
}); |
|
|
|
} |
|
|
|
this.attrFormSubmitting = false; |
|
|
|
} catch (err) { |
|
|
|
this.$message({ |
|
|
|
message: err, |
|
|
|
type: 'error', |
|
|
|
duration: 1500, |
|
|
|
}); |
|
|
|
this.attrFormSubmitting = false; |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
closeAttrForm() { |
|
|
|
this.attrFormVisible = false; |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped> |
|
|
|
.drawer >>> .el-drawer { |
|
|
|
border-radius: 8px 0 0 8px; |
|
|
|
} |
|
|
|
|
|
|
|
.drawer >>> .el-date-editor, |
|
|
|
.drawer >>> .el-select { |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
.drawer >>> .el-drawer__header { |
|
|
|
margin: 0; |
|
|
|
padding: 32px 32px 24px; |
|
|
|
border-bottom: 1px solid #dcdfe6; |
|
|
|
margin-bottom: 0px; |
|
|
|
} |
|
|
|
|
|
|
|
.small-title::before { |
|
|
|
content: ''; |
|
|
|
display: inline-block; |
|
|
|
vertical-align: top; |
|
|
|
width: 4px; |
|
|
|
height: 22px; |
|
|
|
border-radius: 1px; |
|
|
|
margin-right: 8px; |
|
|
|
background-color: #0b58ff; |
|
|
|
} |
|
|
|
|
|
|
|
.drawer-body { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
.drawer-body__content { |
|
|
|
flex: 1; |
|
|
|
/* background: #eee; */ |
|
|
|
padding: 20px 30px; |
|
|
|
overflow-y: auto; |
|
|
|
} |
|
|
|
|
|
|
|
.drawer-body__footer { |
|
|
|
display: flex; |
|
|
|
justify-content: flex-end; |
|
|
|
padding: 18px; |
|
|
|
} |
|
|
|
</style> |