<template>
|
<div ref="device">
|
<a-modal :title="title" :width="800" :visible="visible" :confirmLoading="confirmLoading" :getContainer="() => this.$refs.device"
|
:okButtonProps="{ props: {disabled: disableSubmit} }" @ok="handleOk" @cancel="handleCancel" cancelText="关闭">
|
<a-spin :spinning="confirmLoading">
|
<a-form :form="form">
|
<a-row :gutter="24">
|
<a-col :span="24">
|
<a-form-item label="报警号" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-input placeholder="请输入报警号" v-decorator="['alarmCode', validatorRules.alarmCode]" ></a-input>
|
</a-form-item>
|
</a-col>
|
<a-col :span="24">
|
<a-form-item label="报警内容" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-input placeholder="请输入报警内容" v-decorator="['alarmContent', validatorRules.alarmContent]"></a-input>
|
</a-form-item>
|
</a-col>
|
<a-col :span='24'>
|
<a-form-item label="驱动类型" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<!--<a-select v-decorator="['driveType', validatorRules. driveType]" placeholder="请选择驱动类型"-->
|
<!--:options="shiftList">-->
|
<!--</a-select>-->
|
<!--<j-dict-select-tag-->
|
<!--placeholder="请选择驱动类型"-->
|
<!--v-decorator="['driveType', validatorRules.driveType]"-->
|
<!--dictCode="mdc_driveType"-->
|
<!--/>-->
|
<a-auto-complete
|
v-decorator="['driveType', validatorRules.driveType]"
|
:data-source="driveTypeList"
|
placeholder="请选择驱动类型"
|
:filter-option="filterOption"
|
:allowClear="true"
|
/>
|
</a-form-item>
|
</a-col>
|
<a-col :span="24">
|
<a-form-item label="是否启用" :labelCol="labelCol" :wrapperCol="wrapperCol">
|
<a-switch :checked="isFilterChecked" v-decorator="['isUse', validatorRules.isUse]" @change="isFilterChange"></a-switch>
|
</a-form-item>
|
</a-col>
|
<!--<a-col :span='24'>-->
|
<!--<a-form-item-->
|
<!--:labelCol="labelCol"-->
|
<!--:wrapperCol="wrapperCol"-->
|
<!--label="新增方式"-->
|
<!--hidden>-->
|
<!--<a-input-->
|
<!--v-decorator="[-->
|
<!--'addWay',-->
|
<!--{ rules:-->
|
<!--[-->
|
<!--{ required: true, message: '' }-->
|
<!--],-->
|
<!--initialValue: '2'-->
|
<!--}-->
|
<!--]"-->
|
<!--placeholder="请输入新增方式"-->
|
<!--allowClear-->
|
<!-->-->
|
<!--</a-input>-->
|
<!--</a-form-item>-->
|
<!--</a-col>-->
|
</a-row>
|
</a-form>
|
</a-spin>
|
</a-modal>
|
</div>
|
</template>
|
|
<script>
|
import moment from 'moment'
|
import pick from 'lodash.pick'
|
import {
|
getAction,
|
postAction,
|
requestPut,
|
putAction
|
} from '@/api/manage'
|
import {
|
duplicateCheck
|
} from '@/api/api'
|
|
export default {
|
name: 'alarmManagerForm',
|
// components: {AlarmManagerEqupment},
|
props: {
|
driveTypeList:{
|
type:Array
|
},
|
filterOption:{
|
type:Function
|
}
|
},
|
data() {
|
return {
|
isFilterChecked:true,
|
isUse:true,
|
title: '',
|
visible: false,
|
show: false,
|
model: {},
|
checked: false,
|
labelCol: {
|
xs: {
|
span: 24
|
},
|
sm: {
|
span: 4
|
}
|
},
|
wrapperCol: {
|
xs: {
|
span: 24
|
},
|
sm: {
|
span: 18
|
}
|
},
|
confirmLoading: false,
|
form: this.$form.createForm(this),
|
validatorRules: {
|
driveType:{
|
rules: [{
|
required: true, message: '请选择驱动类型!',
|
}],
|
},
|
alarmCode:{
|
rules: [{
|
required: true, message: '请输入报警号!',
|
}],
|
},
|
alarmContent:{
|
rules: [{
|
required: true, message: '请输入报警内容!',
|
}],
|
},
|
},
|
url: {
|
add: '/mdc/mdcAlarmInfo/add',
|
// edit:'/mdc/alarmInfo/edit',
|
//驱动类型
|
initShiftList: '/mdc/mdcequipment/driveTypeSelected',
|
|
//新增方式
|
},
|
shiftList: [],
|
shiftSubList: [],
|
disableSubmit: true
|
}
|
},
|
created() {
|
},
|
|
methods: {
|
initShiftList() {
|
getAction(this.url.initShiftList).then((res) => {
|
if (res.success) {
|
this.shiftList = res.result
|
}
|
})
|
},
|
add(record) {
|
let _this = this
|
this.isFilterChecked=true
|
this.form.resetFields()
|
this.model = Object.assign({}, record)
|
// this.initShiftList()
|
this.visible = true
|
this.$nextTick(() => {
|
|
})
|
},
|
close() {
|
this.$emit('close')
|
this.visible = false
|
this.show = false
|
},
|
handleOk() {
|
const that = this
|
// 触发表单验证
|
this.form.validateFields((err, values) => {
|
if (!err) {
|
that.confirmLoading = true
|
let formData = Object.assign(this.model, values)
|
// console.log(formData)
|
// formData.isUse = formData.isUse ? "1" : "2"
|
formData.isUse = formData.isUse == true || formData.isUse == undefined ? "0" : "-1"
|
postAction(this.url.add, formData).then((res) => {
|
if (res.success) {
|
// that.$message.success(res.message)
|
that.$notification.success({
|
message:'消息',
|
description:res.message
|
});
|
that.$emit('ok', res.result)
|
} else {
|
// that.$message.warning(res.message)
|
that.$notification.warning({
|
message:'消息',
|
description:res.message
|
});
|
}
|
}).finally(() => {
|
that.confirmLoading = false
|
that.close()
|
})
|
}
|
})
|
},
|
handleCancel() {
|
this.close()
|
},
|
/**
|
* 是否过滤切换器change事件
|
* @param checked 切换后的状态
|
*/
|
isFilterChange(checked){
|
this.isFilterChecked=checked
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="less">
|
/deep/ .ant-modal-content{
|
/*background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.27) 100%);*/
|
/*background: -webkit-gradient(linear, left left, right right, color-stop(0%, rgba(0, 0, 0, 0.66)), color-stop(100%, rgba(0, 0, 0, 0.4)));*/
|
/*background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
|
/*background: -o-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
|
/*background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
|
/*background: linear-gradient(to right, rgba(0, 0, 0, 0.66) 0%, rgba(0, 0, 0, 0.4) 100%);*/
|
/*background-color: #000;*/
|
}
|
/deep/ .ant-modal-close{
|
color: #1191b0;
|
font-size: 24px;
|
}
|
/deep/ .ant-modal-close-x{
|
font-size: 24px;
|
}
|
.ant-btn {
|
padding: 0 10px;
|
margin-left: 3px;
|
}
|
|
.ant-form-item-control {
|
line-height: 0px;
|
}
|
|
/** 主表单行间距 */
|
.ant-form .ant-form-item {
|
margin-bottom: 10px;
|
}
|
|
/** Tab页面行间距 */
|
.ant-tabs-content .ant-form-item {
|
margin-bottom: 0px;
|
}
|
</style>
|
