|
1
2
3
4
5
6
7
8
|
<template>
<a-modal
:title="title"
:width="800"
:visible="visible"
:confirmLoading="confirmLoading"
@ok="handleOk"
@cancel="handleCancel"
|
|
9
|
:okButtonProps="{ props: {disabled: disabled} }"
|
|
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
cancelText="关闭">
<a-spin :spinning="confirmLoading">
<a-form :form="form">
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="标题">
<a-input placeholder="请输入标题" v-decorator="['titile', validatorRules.title]" :readOnly="disableSubmit" />
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
|
|
24
25
26
27
28
29
30
31
32
33
34
35
|
label="消息类型">
<a-select
v-decorator="[ 'msgCategory', validatorRules.msgCategory]"
placeholder="请选择消息类型"
:disabled="disableSubmit">
<a-select-option value="1">通知公告</a-select-option>
<a-select-option value="2">系统消息</a-select-option>
</a-select>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
|
|
36
|
label="内容">
|
|
37
|
<j-editor v-decorator="[ 'msgContent', {} ]" triggerChange></j-editor>
|
|
38
|
</a-form-item>
|
|
39
|
|
|
40
41
42
43
|
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="开始时间">
|
|
44
|
<j-date v-decorator="[ 'startTime', validatorRules.startTime]" placeholder="请选择开始时间" showTime dateFormat="YYYY-MM-DD HH:mm:ss"></j-date>
|
|
45
46
47
48
49
|
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="结束时间">
|
|
50
|
<j-date v-decorator="[ 'endTime', validatorRules.endTime]" placeholder="请选择结束时间" showTime dateFormat="YYYY-MM-DD HH:mm:ss"></j-date>
|
|
51
|
</a-form-item>
|
|
52
|
|
|
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="优先级">
<a-select
v-decorator="[ 'priority', {}]"
placeholder="请选择优先级"
:disabled="disableSubmit">
<a-select-option value="L">低</a-select-option>
<a-select-option value="M">中</a-select-option>
<a-select-option value="H">高</a-select-option>
</a-select>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="通告对象类型">
<a-select
|
|
71
|
v-decorator="[ 'msgType', validatorRules.msgType]"
|
|
72
73
74
75
76
77
78
79
80
81
82
83
|
placeholder="请选择通告对象类型"
:disabled="disableSubmit"
@change="chooseMsgType">
<a-select-option value="USER">指定用户</a-select-option>
<a-select-option value="ALL">全体用户</a-select-option>
</a-select>
</a-form-item>
<a-form-item
:labelCol="labelCol"
:wrapperCol="wrapperCol"
label="指定用户"
v-if="userType">
|
|
84
85
86
87
88
89
90
|
<a-select
mode="multiple"
style="width: 100%"
placeholder="请选择用户"
v-model="selectedUser"
@dropdownVisibleChange="selectUserIds">
</a-select>
|
|
91
92
93
|
</a-form-item>
</a-form>
</a-spin>
|
|
94
|
<select-user-list-modal ref="UserListModal" @choseUser="choseUser"></select-user-list-modal>
|
|
95
96
97
98
99
100
|
</a-modal>
</template>
<script>
import { httpAction } from '@/api/manage'
import pick from 'lodash.pick'
|
|
101
102
|
import { getAction } from '@/api/manage'
import JDate from '@/components/jeecg/JDate'
|
|
103
|
import JEditor from '@/components/jeecg/JEditor'
|
|
104
|
import SelectUserListModal from "./SelectUserListModal";
|
|
105
|
import moment from 'moment'
|
|
106
107
|
export default {
|
|
108
|
components: { JEditor, JDate, SelectUserListModal},
|
|
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
|
name: "SysAnnouncementModal",
data () {
return {
title:"操作",
visible: false,
disableSubmit:false,
model: {},
labelCol: {
xs: { span: 24 },
sm: { span: 5 },
},
wrapperCol: {
xs: { span: 24 },
sm: { span: 16 },
},
confirmLoading: false,
form: this.$form.createForm(this),
validatorRules:{
title:{rules: [{ required: true, message: '请输入标题!' }]},
|
|
129
130
|
msgCategory:{rules: [{ required: true, message: '请选择消息类型!' }]},
msgType:{rules: [{ required: true, message: '请选择通告对象类型!' }]},
|
|
131
132
|
endTime:{rules:[{validator: this.endTimeValidate}]},
startTime:{rules:[{validator: this.startTimeValidate}]}
|
|
133
134
|
},
url: {
|
|
135
|
queryByIds: "/sys/user/queryByIds",
|
|
136
137
138
139
|
add: "/sys/annountCement/add",
edit: "/sys/annountCement/edit",
},
userType:false,
|
|
140
141
142
143
|
userIds:[],
selectedUser:[],
disabled:false,
msgContent:"",
|
|
144
145
146
147
148
149
150
151
152
153
|
}
},
created () {
},
methods: {
add () {
this.edit({});
},
edit (record) {
this.form.resetFields();
|
|
154
|
this.model = {}
|
|
155
|
this.disable = false;
|
|
156
|
this.visible = true;
|
|
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
|
this.getUser(record);
},
getUser(record){
this.model = Object.assign({}, record);
// 指定用户
if(record&&record.msgType === "USER"){
this.userType = true;
this.userIds = record.userIds;
getAction(this.url.queryByIds,{userIds:this.userIds}).then((res)=>{
if(res.success){
for(var i=0;i<res.result.length;i++){
this.selectedUser.push(res.result[i].realname);
}
this.$refs.UserListModal.edit(res.result,this.userIds);
}
});
}
|
|
174
|
this.$nextTick(() => {
|
|
175
|
this.form.setFieldsValue(pick(this.model,'endTime','startTime','titile','msgContent','sender','priority','msgCategory','msgType','sendStatus','delFlag'))
|
|
176
177
178
179
|
});
},
close () {
this.$emit('close');
|
|
180
|
this.selectedUser = [];
|
|
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
|
this.visible = false;
},
handleOk () {
const that = this;
// 触发表单验证
this.form.validateFields((err, values) => {
if (!err) {
that.confirmLoading = true;
let httpurl = '';
let method = '';
if(!this.model.id){
httpurl+=this.url.add;
method = 'post';
}else{
httpurl+=this.url.edit;
method = 'put';
}
let formData = Object.assign(this.model, values);
|
|
199
200
201
|
if(this.userType){
formData.userIds = this.userIds;
}
|
|
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
|
console.log(formData)
httpAction(httpurl,formData,method).then((res)=>{
if(res.success){
that.$message.success(res.message);
that.$emit('ok');
}else{
that.$message.warning(res.message);
}
}).finally(() => {
that.confirmLoading = false;
that.close();
})
}
})
},
handleCancel () {
|
|
221
222
223
224
225
226
227
228
229
230
231
232
233
|
this.visible = false;
this.$emit('close');
this.resetUser();
},
resetUser (){
this.userType = false;
this.userIds = [];
this.selectedUser = [];
this.disabled = false;
this.$refs.UserListModal.edit(null,null);
},
selectUserIds() {
this.$refs.UserListModal.add(this.selectedUser,this.userIds);
|
|
234
235
236
237
238
239
|
},
chooseMsgType(value) {
if("USER" == value) {
this.userType = true;
} else {
this.userType = false;
|
|
240
241
|
this.selectedUser = [];
this.userIds = [];
|
|
242
243
|
}
},
|
|
244
245
246
247
248
249
250
251
|
// 子modal回调
choseUser:function(userList){
this.selectedUser = [];
this.userIds = [];
for(var i=0;i<userList.length;i++){
this.selectedUser.push(userList[i].realname);
this.userIds += userList[i].id+","
}
|
|
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
|
},
startTimeValidate(rule,value,callback){
let endTime = this.form.getFieldValue("endTime")
if(!value || !endTime){
callback()
}else if(moment(value).isBefore(endTime)){
callback()
}else{
callback("开始时间需小于结束时间")
}
},
endTimeValidate(rule,value,callback){
let startTime = this.form.getFieldValue("startTime")
if(!value || !startTime){
callback()
}else if(moment(startTime).isBefore(value)){
callback()
}else{
callback("结束时间需大于开始时间")
}
|
|
272
273
274
275
276
277
278
279
280
|
}
}
}
</script>
<style scoped>
</style>
|