提交 | 用户 | 时间
|
759b1c
|
1 |
<template> |
H |
2 |
<div> |
|
3 |
<!-- 列表弹窗 --> |
|
4 |
<el-dialog title="任务分配规则" :visible.sync="visible" width="800px" append-to-body> |
|
5 |
<el-table v-loading="loading" :data="list"> |
|
6 |
<el-table-column label="任务名" align="center" prop="taskDefinitionName" width="120" fixed /> |
|
7 |
<el-table-column label="任务标识" align="center" prop="taskDefinitionKey" width="120" show-tooltip-when-overflow /> |
|
8 |
<el-table-column label="规则类型" align="center" prop="type" width="120"> |
|
9 |
<template v-slot="scope"> |
|
10 |
<dict-tag :type="DICT_TYPE.BPM_TASK_ASSIGN_RULE_TYPE" :value="scope.row.type" /> |
|
11 |
</template> |
|
12 |
</el-table-column> |
|
13 |
<el-table-column label="规则范围" align="center" prop="options" width="440px"> |
|
14 |
<template v-slot="scope"> |
|
15 |
<el-tag size="medium" v-if="scope.row.options" :key="option" v-for="option in scope.row.options"> |
|
16 |
{{ getAssignRuleOptionName(scope.row.type, option) }} |
|
17 |
</el-tag> |
|
18 |
</template> |
|
19 |
</el-table-column> |
|
20 |
<el-table-column v-if="modelId" label="操作" align="center" width="80" fixed="right"> |
|
21 |
<template v-slot="scope"> |
|
22 |
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdateTaskAssignRule(scope.row)" |
|
23 |
v-hasPermi="['bpm:task-assign-rule:update']">修改</el-button> |
|
24 |
</template> |
|
25 |
</el-table-column> |
|
26 |
</el-table> |
|
27 |
</el-dialog> |
|
28 |
<!-- 添加/修改弹窗 --> |
|
29 |
<el-dialog title="修改任务规则" :visible.sync="open" width="500px" append-to-body> |
|
30 |
<el-form ref="taskAssignRuleForm" :model="form" :rules="rules" label-width="110px"> |
|
31 |
<el-form-item label="任务名称" prop="taskDefinitionName"> |
|
32 |
<el-input v-model="form.taskDefinitionName" disabled /> |
|
33 |
</el-form-item> |
|
34 |
<el-form-item label="任务标识" prop="taskDefinitionKey"> |
|
35 |
<el-input v-model="form.taskDefinitionKey" disabled /> |
|
36 |
</el-form-item> |
|
37 |
<el-form-item label="规则类型" prop="type"> |
|
38 |
<el-select v-model="form.type" clearable style="width: 100%"> |
|
39 |
<el-option v-for="dict in taskAssignRuleTypeDictDatas" :key="parseInt(dict.value)" :label="dict.label" :value="parseInt(dict.value)"/> |
|
40 |
</el-select> |
|
41 |
</el-form-item> |
|
42 |
<el-form-item v-if="form.type === 10" label="指定角色" prop="roleIds"> |
|
43 |
<el-select v-model="form.roleIds" multiple clearable style="width: 100%"> |
|
44 |
<el-option v-for="item in roleOptions" :key="parseInt(item.id)" :label="item.name" :value="parseInt(item.id)" /> |
|
45 |
</el-select> |
|
46 |
</el-form-item> |
|
47 |
<el-form-item v-if="form.type === 20 || form.type === 21" label="指定部门" prop="deptIds"> |
|
48 |
<treeselect v-model="form.deptIds" :options="deptTreeOptions" multiple flat :defaultExpandLevel="3" |
|
49 |
placeholder="请选择指定部门" :normalizer="normalizer"/> |
|
50 |
</el-form-item> |
|
51 |
<el-form-item v-if="form.type === 22" label="指定岗位" prop="postIds"> |
|
52 |
<el-select v-model="form.postIds" multiple clearable style="width: 100%"> |
|
53 |
<el-option v-for="item in postOptions" :key="parseInt(item.id)" :label="item.name" :value="parseInt(item.id)" /> |
|
54 |
</el-select> |
|
55 |
</el-form-item> |
|
56 |
<el-form-item v-if="form.type === 30 || form.type === 31 || form.type === 32" label="指定用户" prop="userIds"> |
|
57 |
<el-select v-model="form.userIds" multiple clearable style="width: 100%"> |
|
58 |
<el-option v-for="item in userOptions" :key="parseInt(item.id)" :label="item.nickname" :value="parseInt(item.id)" /> |
|
59 |
</el-select> |
|
60 |
</el-form-item> |
|
61 |
<el-form-item v-if="form.type === 40" label="指定用户组" prop="userGroupIds"> |
|
62 |
<el-select v-model="form.userGroupIds" multiple clearable style="width: 100%"> |
|
63 |
<el-option v-for="item in userGroupOptions" :key="parseInt(item.id)" :label="item.name" :value="parseInt(item.id)" /> |
|
64 |
</el-select> |
|
65 |
</el-form-item> |
|
66 |
<el-form-item v-if="form.type === 50" label="指定脚本" prop="scripts"> |
|
67 |
<el-select v-model="form.scripts" multiple clearable style="width: 100%"> |
|
68 |
<el-option v-for="dict in taskAssignScriptDictDatas" :key="parseInt(dict.value)" |
|
69 |
:label="dict.label" :value="parseInt(dict.value)"/> |
|
70 |
</el-select> |
|
71 |
</el-form-item> |
|
72 |
</el-form> |
|
73 |
<div slot="footer" class="dialog-footer"> |
|
74 |
<el-button type="primary" @click="submitAssignRuleForm">确 定</el-button> |
|
75 |
<el-button @click="cancelAssignRuleForm">取 消</el-button> |
|
76 |
</div> |
|
77 |
</el-dialog> |
|
78 |
</div> |
|
79 |
</template> |
|
80 |
|
|
81 |
<script> |
|
82 |
import {DICT_TYPE, getDictDatas} from "@/utils/dict"; |
|
83 |
import {createTaskAssignRule, getTaskAssignRuleList, updateTaskAssignRule} from "@/api/bpm/taskAssignRule"; |
|
84 |
import {listSimpleRoles} from "@/api/system/role"; |
|
85 |
import {listSimpleDepts} from "@/api/system/dept"; |
|
86 |
|
|
87 |
import Treeselect from "@riophae/vue-treeselect"; |
|
88 |
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; |
|
89 |
import {listSimplePosts} from "@/api/system/post"; |
|
90 |
import {listSimpleUsers} from "@/api/system/user"; |
|
91 |
import {listSimpleUserGroups} from "@/api/bpm/userGroup"; |
|
92 |
|
|
93 |
export default { |
|
94 |
name: "BpmTaskAssignRule", |
|
95 |
components: { |
|
96 |
Treeselect |
|
97 |
}, |
|
98 |
data() { |
|
99 |
return { |
|
100 |
// 如下参数,可传递 |
|
101 |
modelId: undefined, // 流程模型的编号。如果 modelId 非空,则用于流程模型的查看与配置 |
|
102 |
processDefinitionId: undefined, // 流程定义的编号。如果 processDefinitionId 非空,则用于流程定义的查看,不支持配置 |
|
103 |
visible: false, |
|
104 |
|
|
105 |
// 任务分配规则表单 |
|
106 |
row: undefined, // 选中的流程模型 |
|
107 |
list: [], // 选中流程模型的任务分配规则们 |
|
108 |
loading: false, // 加载中 |
|
109 |
open: false, // 是否打开 |
|
110 |
form: {}, // 表单 |
|
111 |
rules: { // 表单校验规则 |
|
112 |
type: [{ required: true, message: "规则类型不能为空", trigger: "change" }], |
|
113 |
roleIds: [{required: true, message: "指定角色不能为空", trigger: "change" }], |
|
114 |
deptIds: [{required: true, message: "指定部门不能为空", trigger: "change" }], |
|
115 |
postIds: [{required: true, message: "指定岗位不能为空", trigger: "change"}], |
|
116 |
userIds: [{required: true, message: "指定用户不能为空", trigger: "change"}], |
|
117 |
userGroupIds: [{required: true, message: "指定用户组不能为空", trigger: "change"}], |
|
118 |
scripts: [{required: true, message: "指定脚本不能为空", trigger: "change"}], |
|
119 |
}, |
|
120 |
|
|
121 |
// 各种下拉框 |
|
122 |
roleOptions: [], |
|
123 |
deptOptions: [], |
|
124 |
deptTreeOptions: [], |
|
125 |
postOptions: [], |
|
126 |
userOptions: [], |
|
127 |
userGroupOptions: [], |
|
128 |
|
|
129 |
// 数据字典 |
|
130 |
modelFormTypeDictDatas: getDictDatas(DICT_TYPE.BPM_MODEL_FORM_TYPE), |
|
131 |
taskAssignRuleTypeDictDatas: getDictDatas(DICT_TYPE.BPM_TASK_ASSIGN_RULE_TYPE), |
|
132 |
taskAssignScriptDictDatas: getDictDatas(DICT_TYPE.BPM_TASK_ASSIGN_SCRIPT), |
|
133 |
}; |
|
134 |
}, |
|
135 |
methods: { |
|
136 |
initModel(modelId) { |
|
137 |
this.modelId = modelId; |
|
138 |
this.processDefinitionId = undefined; |
|
139 |
|
|
140 |
// 初始化所有下拉框 |
|
141 |
this.init0(); |
|
142 |
}, |
|
143 |
initProcessDefinition(processDefinitionId) { |
|
144 |
this.modelId = undefined; |
|
145 |
this.processDefinitionId = processDefinitionId; |
|
146 |
|
|
147 |
// 初始化所有下拉框 |
|
148 |
this.init0(); |
|
149 |
}, |
|
150 |
/** 初始化 */ |
|
151 |
init0() { |
|
152 |
// 设置可见 |
|
153 |
this.visible = true; |
|
154 |
// 获得列表 |
|
155 |
this.getList(); |
|
156 |
|
|
157 |
// 获得角色列表 |
|
158 |
this.roleOptions = []; |
|
159 |
listSimpleRoles().then(response => { |
|
160 |
this.roleOptions.push(...response.data); |
|
161 |
}); |
|
162 |
// 获得部门列表 |
|
163 |
this.deptOptions = []; |
|
164 |
this.deptTreeOptions = []; |
|
165 |
listSimpleDepts().then(response => { |
|
166 |
this.deptOptions.push(...response.data); |
|
167 |
this.deptTreeOptions.push(...this.handleTree(response.data, "id")); |
|
168 |
}); |
|
169 |
// 获得岗位列表 |
|
170 |
this.postOptions = []; |
|
171 |
listSimplePosts().then(response => { |
|
172 |
this.postOptions.push(...response.data); |
|
173 |
}); |
|
174 |
// 获得用户列表 |
|
175 |
this.userOptions = []; |
|
176 |
listSimpleUsers().then(response => { |
|
177 |
this.userOptions.push(...response.data); |
|
178 |
}); |
|
179 |
// 获得用户组列表 |
|
180 |
this.userGroupOptions = []; |
|
181 |
listSimpleUserGroups().then(response => { |
|
182 |
this.userGroupOptions.push(...response.data); |
|
183 |
}); |
|
184 |
}, |
|
185 |
/** 获得任务分配规则列表 */ |
|
186 |
getList() { |
|
187 |
this.loading = true; |
|
188 |
getTaskAssignRuleList({ |
|
189 |
modelId: this.modelId, |
|
190 |
processDefinitionId: this.processDefinitionId, |
|
191 |
}).then(response => { |
|
192 |
this.loading = false; |
|
193 |
this.list = response.data; |
|
194 |
}) |
|
195 |
}, |
|
196 |
/** 处理修改任务分配规则的按钮操作 */ |
|
197 |
handleUpdateTaskAssignRule(row) { |
|
198 |
// 先重置标识 |
|
199 |
this.resetAssignRuleForm(); |
|
200 |
// 设置表单 |
|
201 |
this.form = { |
|
202 |
...row, |
|
203 |
options: [], |
|
204 |
roleIds: [], |
|
205 |
deptIds: [], |
|
206 |
postIds: [], |
|
207 |
userIds: [], |
|
208 |
userGroupIds: [], |
|
209 |
scripts: [], |
|
210 |
}; |
|
211 |
// 将 options 赋值到对应的 roleIds 等选项 |
|
212 |
if (row.type === 10) { |
|
213 |
this.form.roleIds.push(...row.options); |
|
214 |
} else if (row.type === 20 || row.type === 21) { |
|
215 |
this.form.deptIds.push(...row.options); |
|
216 |
} else if (row.type === 22) { |
|
217 |
this.form.postIds.push(...row.options); |
|
218 |
} else if (row.type === 30 || row.type === 31 || row.type === 32) { |
|
219 |
this.form.userIds.push(...row.options); |
|
220 |
} else if (row.type === 40) { |
|
221 |
this.form.userGroupIds.push(...row.options); |
|
222 |
} else if (row.type === 50) { |
|
223 |
this.form.scripts.push(...row.options); |
|
224 |
} |
|
225 |
this.open = true; |
|
226 |
}, |
|
227 |
/** 提交任务分配规则的表单 */ |
|
228 |
submitAssignRuleForm() { |
|
229 |
this.$refs["taskAssignRuleForm"].validate(valid => { |
|
230 |
if (valid) { |
|
231 |
// 构建表单 |
|
232 |
let form = { |
|
233 |
...this.form, |
|
234 |
taskDefinitionName: undefined, |
|
235 |
}; |
|
236 |
// 将 roleIds 等选项赋值到 options 中 |
|
237 |
if (form.type === 10) { |
|
238 |
form.options = form.roleIds; |
|
239 |
} else if (form.type === 20 || form.type === 21) { |
|
240 |
form.options = form.deptIds; |
|
241 |
} else if (form.type === 22) { |
|
242 |
form.options = form.postIds; |
|
243 |
} else if (form.type === 30 || form.type === 31 || form.type === 32) { |
|
244 |
form.options = form.userIds; |
|
245 |
} else if (form.type === 40) { |
|
246 |
form.options = form.userGroupIds; |
|
247 |
} else if (form.type === 50) { |
|
248 |
form.options = form.scripts; |
|
249 |
} |
|
250 |
form.roleIds = undefined; |
|
251 |
form.deptIds = undefined; |
|
252 |
form.postIds = undefined; |
|
253 |
form.userIds = undefined; |
|
254 |
form.userGroupIds = undefined; |
|
255 |
form.scripts = undefined; |
|
256 |
// 新增 |
|
257 |
if (!form.id) { |
|
258 |
form.modelId = this.modelId; // 模型编号 |
|
259 |
createTaskAssignRule(form).then(response => { |
|
260 |
this.$modal.msgSuccess("修改成功"); |
|
261 |
this.open = false; |
|
262 |
this.getList(); |
|
263 |
}); |
|
264 |
// 修改 |
|
265 |
} else { |
|
266 |
form.taskDefinitionKey = undefined; // 无法修改 |
|
267 |
updateTaskAssignRule(form).then(response => { |
|
268 |
this.$modal.msgSuccess("修改成功"); |
|
269 |
this.open = false; |
|
270 |
this.getList(); |
|
271 |
}); |
|
272 |
} |
|
273 |
} |
|
274 |
}); |
|
275 |
}, |
|
276 |
/** 取消任务分配规则的表单 */ |
|
277 |
cancelAssignRuleForm() { |
|
278 |
this.open = false; |
|
279 |
this.resetAssignRuleForm(); |
|
280 |
}, |
|
281 |
/** 表单重置 */ |
|
282 |
resetAssignRuleForm() { |
|
283 |
this.form = {}; |
|
284 |
this.resetForm("taskAssignRuleForm"); |
|
285 |
}, |
|
286 |
getAssignRuleOptionName(type, option) { |
|
287 |
if (type === 10) { |
|
288 |
for (const roleOption of this.roleOptions) { |
|
289 |
if (roleOption.id === option) { |
|
290 |
return roleOption.name; |
|
291 |
} |
|
292 |
} |
|
293 |
} else if (type === 20 || type === 21) { |
|
294 |
for (const deptOption of this.deptOptions) { |
|
295 |
if (deptOption.id === option) { |
|
296 |
return deptOption.name; |
|
297 |
} |
|
298 |
} |
|
299 |
} else if (type === 22) { |
|
300 |
for (const postOption of this.postOptions) { |
|
301 |
if (postOption.id === option) { |
|
302 |
return postOption.name; |
|
303 |
} |
|
304 |
} |
|
305 |
} else if (type === 30 || type === 31 || type === 32) { |
|
306 |
for (const userOption of this.userOptions) { |
|
307 |
if (userOption.id === option) { |
|
308 |
return userOption.nickname; |
|
309 |
} |
|
310 |
} |
|
311 |
} else if (type === 40) { |
|
312 |
for (const userGroupOption of this.userGroupOptions) { |
|
313 |
if (userGroupOption.id === option) { |
|
314 |
return userGroupOption.name; |
|
315 |
} |
|
316 |
} |
|
317 |
} else if (type === 50) { |
|
318 |
option = option + ''; // 转换成 string |
|
319 |
for (const dictData of this.taskAssignScriptDictDatas) { |
|
320 |
if (dictData.value === option) { |
|
321 |
return dictData.label; |
|
322 |
} |
|
323 |
} |
|
324 |
} |
|
325 |
return '未知(' + option + ')'; |
|
326 |
}, |
|
327 |
// 格式化部门的下拉框 |
|
328 |
normalizer(node) { |
|
329 |
return { |
|
330 |
id: node.id, |
|
331 |
label: node.name, |
|
332 |
children: node.children |
|
333 |
} |
|
334 |
} |
|
335 |
} |
|
336 |
}; |
|
337 |
</script> |