<template>
|
<a-modal :title="title"
|
:maskClosable="true"
|
@cancel="closeModal"
|
:visible="visible"
|
:footer="null">
|
<a-spin :spinning="spinning">
|
<a-form-model ref="form" :form="form" :model="formParams" :rules="validatorRules" :labelCol="{span: 4}"
|
:wrapperCol="{span: 20}">
|
<a-form-model-item label="设备编号" :labelCol="{span: 4}" :wrapperCol="{span: 10}" prop="equipmentId">
|
<a-input-search :readOnly="true" :disabled="disableSubmit" v-model="formParams.equipmentId"
|
@search="deviceSearch" enter-button
|
placeholder="请选择设备"/>
|
</a-form-model-item>
|
<a-form-model-item label="异常类型" :labelCol="{span: 4}" :wrapperCol="{span: 10}"
|
:prop="!buttonId?'msgType':''">
|
<j-dict-select-tag dictCode="mdcMsgType" v-model='formParams.msgType' placeholder="请选择异常类型"
|
:disabled="disableSubmit&&buttonId!==2"/>
|
</a-form-model-item>
|
<a-form-model-item label="标题">
|
<a-input placeholder="请输入标题" v-model="formParams.titile" :disabled="disableSubmit"/>
|
</a-form-model-item>
|
<a-form-model-item label="内容">
|
<a-input placeholder="请输入内容" v-model="formParams.msgContent" :disabled="disableSubmit"/>
|
</a-form-model-item>
|
|
<a-form-model-item label="原因" prop="reportContent" v-if="buttonId">
|
<a-textarea v-model="formParams.reportContent" :disabled="buttonId!==2"/>
|
</a-form-model-item>
|
|
<a-form-model-item label="确认" :labelCol="{span: 4}" :wrapperCol="{span: 12}" prop="isConfirm"
|
v-if="buttonId==3">
|
<a-select v-model='formParams.isConfirm' placeholder="请选择是否确认">
|
<a-select-option value="2">确认</a-select-option>
|
<a-select-option value="3">拒绝</a-select-option>
|
</a-select>
|
</a-form-model-item>
|
</a-form-model>
|
</a-spin>
|
|
<div class="drawer-bottom-button" v-show="buttonId!==1">
|
<a-space>
|
<a-popconfirm title="确定放弃操作？" @confirm="closeModal" okText="确定" cancelText="取消">
|
<a-button>取消</a-button>
|
</a-popconfirm>
|
<a-button @click="handleSubmit" type="primary" :loading="confirmLoading">提交</a-button>
|
</a-space>
|
</div>
|
|
<SelectDeviceDrawerSingleSelection ref="selectDeviceDrawer" @selectFinished="selectOK" :title="'选择设备'"/>
|
</a-modal>
|
</template>
|
|
<script>
|
import { postAction } from '@/api/manage'
|
import SelectDeviceDrawerSingleSelection from './SelectDeviceDrawer-SingleSelection'
|
|
export default {
|
name: 'MdcMessageApprovalModal',
|
components: { SelectDeviceDrawerSingleSelection },
|
props: {
|
visible: {
|
type: Boolean
|
},
|
title: {
|
type: String
|
},
|
buttonId: {
|
type: Number
|
},
|
disableSubmit: {
|
type: Boolean
|
}
|
},
|
data() {
|
return {
|
form: this.$form.createForm(this),
|
treeData: [],
|
treeDefaultExpandedKeys: [],
|
formParams: {
|
equipmentId: '',
|
titile: '',
|
msgContent: '',
|
reportContent: '',
|
msgStatus: '',
|
isConfirm: ''
|
},
|
confirmLoading: false,
|
spinning: false,
|
validatorRules: {
|
equipmentId: [
|
{ required: true, message: '请选择设备', trigger: 'change' }
|
],
|
msgType: [
|
{ required: true, message: '请选择异常类型' }
|
],
|
reportContent: [
|
{ required: true, message: '请输入上报原因' }
|
],
|
isConfirm: [
|
{ required: true, message: '请选择是否确认' }
|
]
|
},
|
url: {
|
add: '/mdc/mdcMessageApproval/add',
|
reportUrl: '/mdc/mdcMessageApproval/reportReason',
|
confirmUrl: '/mdc/mdcMessageApproval/handleConfirm'
|
}
|
}
|
},
|
methods: {
|
deviceSearch() {
|
this.$refs.selectDeviceDrawer.visible = true
|
this.$refs.selectDeviceDrawer.checkedKeys = this.formParams.equipmentId ? [this.formParams.equipmentId] : []
|
this.$refs.selectDeviceDrawer.selectedKeys = this.formParams.equipmentId ? [this.formParams.equipmentId] : []
|
},
|
|
/**
|
* 选择已有设备后点击确定时触发
|
* @param data 已选择的设备
|
*/
|
selectOK(data) {
|
this.$set(this.formParams, 'equipmentId', data[0])
|
},
|
|
handleSubmit() {
|
const that = this
|
// 触发表单验证
|
this.$refs.form.validate(valid => {
|
if (valid) {
|
that.confirmLoading = that.spinning = true
|
this.formParams.msgStatus = this.formParams.isConfirm
|
let obj
|
if (!this.buttonId) {
|
obj = postAction(this.url.add, this.formParams)
|
} else {
|
if (this.buttonId === 2) {
|
obj = postAction(this.url.reportUrl, this.formParams)
|
} else {
|
obj = postAction(this.url.confirmUrl, this.formParams)
|
}
|
}
|
|
obj.then((res) => {
|
if (res.success) {
|
that.$notification.success({
|
message: '消息',
|
description: res.message
|
})
|
that.$emit('formHasSubmitted')
|
that.closeModal()
|
} else {
|
that.$notification.warning({
|
message: '消息',
|
description: res.message
|
})
|
}
|
}).finally(() => {
|
that.confirmLoading = that.spinning = false
|
})
|
} else {
|
return false
|
}
|
})
|
},
|
|
closeModal() {
|
this.$refs.form.clearValidate()
|
this.$emit('closeModal')
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="less">
|
.drawer-bottom-button {
|
position: absolute;
|
bottom: -25px;
|
width: 100%;
|
border-top: 1px solid #e8e8e8;
|
padding: 10px 16px;
|
text-align: right;
|
left: 0;
|
background: #fff;
|
border-radius: 0 0 2px 2px;
|
}
|
</style>
|
