<template>
|
<el-form :inline="false" :model="form" ref="formRef" :rules="rules" label-position="top">
|
<el-form-item label="通知标题" prop="title">
|
<el-input v-model="form.title" placeholder="通知标题" />
|
</el-form-item>
|
<el-form-item label="通知内容" prop="content">
|
<el-input v-model="form.content" type="textarea" placeholder="通知内容" />
|
</el-form-item>
|
<el-form-item label="通知类型" prop="_typeArray">
|
<el-cascader
|
v-model="form._typeArray"
|
:options="noticeTypes"
|
placeholder="通知类型"
|
:props="props"
|
/>
|
</el-form-item>
|
<el-form-item label="区县类型" prop="district">
|
<el-select v-model="form.district" placeholder="区县类型">
|
<el-option v-for="s in districts" :key="s.value" :label="s.label" :value="s.value" />
|
</el-select>
|
</el-form-item>
|
<!-- <FYOptionScene
|
prop="receiverType"
|
:allOption="true"
|
:type="1"
|
:initValue="true"
|
v-model:value="form.receiverType"
|
></FYOptionScene> -->
|
<el-form-item label="场景类型" prop="_receiverType">
|
<el-select v-model="form._receiverType" placeholder="场景类型">
|
<el-option v-for="s in sceneTypes" :key="s.value" :label="s.label" :value="s.value" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="是否需要签收" prop="needSigned">
|
<el-switch v-model="form.needSigned" />
|
<span style="margin-left: 16px">{{ form.needSigned ? '是' : '否' }}</span>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" @click="onSubmit" :loading="loading">提交</el-button>
|
<el-button @click="onCancel">取消</el-button>
|
</el-form-item>
|
</el-form>
|
</template>
|
|
<script>
|
import { enumScene } from '@/enum/scene';
|
import { enumDistrict } from '@/enum/district';
|
import { enumNotice } from '@/enum/notice';
|
|
export default {
|
props: {
|
active: {
|
type: Boolean,
|
default: false
|
},
|
edit: Boolean,
|
loading: Boolean
|
},
|
emits: ['update:edit', 'onSubmit', 'onCancel'],
|
data() {
|
return {
|
props: {
|
// expandTrigger: 'hover'
|
},
|
districts: enumDistrict(),
|
sceneTypes: enumScene(1),
|
noticeTypes: enumNotice(),
|
form: {
|
//发布者id
|
authorId: '',
|
//发布者名字
|
authorName: '',
|
//通知类型数组
|
_typeArray: [],
|
//通知类型id
|
typeId: 0,
|
//通知子类型id
|
subTypeId: 0,
|
//通知标题
|
title: '',
|
//通知内容
|
content: '',
|
//通知图片
|
picUrl: null,
|
//通知链接
|
bodyUrl: '',
|
//是否需要签收
|
needSigned: false,
|
//接受用户场景类型
|
_receiverType: null,
|
receiverType: '0',
|
//接受用户区县
|
district: '0',
|
//接受用户id
|
receiverId: null
|
},
|
rules: {
|
title: [
|
{
|
required: true,
|
message: '请输入通知标题',
|
trigger: 'blur'
|
}
|
],
|
content: [
|
{
|
required: true,
|
message: '请输入通知内容',
|
trigger: 'blur'
|
}
|
],
|
_typeArray: [
|
{
|
required: true,
|
message: '请选择通知类型',
|
trigger: 'change'
|
}
|
]
|
}
|
};
|
},
|
watch: {
|
/**
|
* 当表单被取消激活后，重置表单数据
|
*/
|
active(nValue) {
|
if (!nValue) {
|
this.reset();
|
this.$emit('update:edit', false);
|
}
|
},
|
/**
|
* 表单被修改过
|
*/
|
form: {
|
handler() {
|
if (!this.isReset) {
|
this.$emit('update:edit', true);
|
}
|
this.isReset = false;
|
},
|
deep: true
|
}
|
},
|
computed: {},
|
methods: {
|
// 重置表单
|
reset() {
|
this.isReset = true;
|
this.$refs.formRef.resetFields();
|
},
|
onSubmit() {
|
this.$refs.formRef.validate((valid, fields) => {
|
if (valid) {
|
const a = this.form._typeArray;
|
if (a.length == 2) {
|
this.form.typeId = a[0];
|
this.form.subTypeId = a[1];
|
} else if (a.length == 1) {
|
this.form.typeId = a[0];
|
this.form.subTypeId = 0;
|
}
|
if (this.form._receiverType == null) {
|
this.form.receiverType = '0';
|
}
|
this.$emit('onSubmit', this.form);
|
} else {
|
console.log('error submit!', fields);
|
}
|
});
|
},
|
onCancel() {
|
// this.reset();
|
this.$emit('onCancel');
|
}
|
},
|
mounted() {
|
this.noticeTypes[0].disabled = true;
|
}
|
};
|
</script>
|
