Skip to content

Commit 739a1c2

Browse files
committed
feat: Simple设计器-监听器
1 parent 0a15eca commit 739a1c2

File tree

3 files changed

+184
-3
lines changed

3 files changed

+184
-3
lines changed

src/components/SimpleProcessDesignerV2/src/NodeHandler.vue

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,10 @@ const addNode = (type: number) => {
120120
type: AssignEmptyHandlerType.APPROVE
121121
},
122122
assignStartUserHandlerType: AssignStartUserHandlerType.START_USER_AUDIT,
123-
childNode: props.childNode
123+
childNode: props.childNode,
124+
createTaskListener: {
125+
enable: false
126+
}
124127
}
125128
emits('update:childNode', data)
126129
}

src/components/SimpleProcessDesignerV2/src/consts.ts

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -93,6 +93,8 @@ export interface SimpleFlowNode {
9393
assignEmptyHandler?: AssignEmptyHandler
9494
// 审批节点的审批人与发起人相同时,对应的处理类型
9595
assignStartUserHandlerType?: number
96+
// 创建任务监听器
97+
createTaskListener: ListenerHandler
9698
// 条件类型
9799
conditionType?: ConditionType
98100
// 条件表达式
@@ -222,6 +224,31 @@ export type AssignEmptyHandler = {
222224
userIds?: number[]
223225
}
224226

227+
/**
228+
* 监听器的结构定义
229+
*/
230+
export type ListenerHandler = {
231+
enable: boolean
232+
path: string
233+
header: ListenerMap[]
234+
body: ListenerMap[]
235+
}
236+
export type ListenerMap = {
237+
key: string
238+
type: number
239+
value: string
240+
}
241+
export const LISTENER_MAP_TYPES = [
242+
{
243+
value: 1,
244+
label: '固定值'
245+
},
246+
{
247+
value: 2,
248+
label: '表单'
249+
}
250+
]
251+
225252
// 审批拒绝类型枚举
226253
export enum RejectHandlerType {
227254
/**

src/components/SimpleProcessDesignerV2/src/nodes-config/UserTaskNodeConfig.vue

Lines changed: 153 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -434,6 +434,133 @@
434434
</div>
435435
</div>
436436
</el-tab-pane>
437+
<el-tab-pane label="监听器" name="listener">
438+
<div>
439+
<el-form label-position="top">
440+
<el-divider content-position="left">
441+
<el-text tag="b" size="large">创建任务</el-text>
442+
</el-divider>
443+
<el-form-item prop="createTaskListenerEnable">
444+
<el-switch
445+
v-model="configForm.createTaskListenerEnable"
446+
active-text="开启"
447+
inactive-text="关闭"
448+
/>
449+
</el-form-item>
450+
<div v-if="configForm.createTaskListenerEnable">
451+
<el-form-item>
452+
<el-alert
453+
title="仅支持POST请求,以请求体方式接收参数"
454+
type="warning"
455+
show-icon
456+
:closable="false"
457+
/>
458+
</el-form-item>
459+
<el-form-item label="请求地址" prop="createTaskListenerPath">
460+
<el-input v-model="configForm.createTaskListenerPath" />
461+
</el-form-item>
462+
<el-form-item label="请求头" prop="createTaskListenerHeader">
463+
<div
464+
class="flex pt-2"
465+
v-for="(item, index) in configForm.createTaskListenerHeader"
466+
:key="index"
467+
>
468+
<div class="mr-2">
469+
<el-input v-model="item.key" style="width: 160px" />
470+
</div>
471+
<div class="mr-2">
472+
<el-select v-model="item.type" style="width: 100px">
473+
<el-option
474+
v-for="types in LISTENER_MAP_TYPES"
475+
:key="types.value"
476+
:label="types.label"
477+
:value="types.value"
478+
/>
479+
</el-select>
480+
</div>
481+
<div class="mr-2">
482+
<el-input v-model="item.value" style="width: 160px" />
483+
</div>
484+
<div class="mr-1 flex items-center">
485+
<Icon
486+
icon="ep:delete"
487+
:size="18"
488+
@click="deleteTaskListenerMap(configForm.createTaskListenerHeader, index)"
489+
/>
490+
</div>
491+
</div>
492+
<el-button
493+
type="primary"
494+
text
495+
@click="addTaskListenerMap(configForm.createTaskListenerHeader)"
496+
>
497+
<Icon icon="ep:plus" class="mr-5px" />添加一行
498+
</el-button>
499+
</el-form-item>
500+
<el-form-item label="请求体" prop="createTaskListenerBody">
501+
<div
502+
class="flex pt-2"
503+
v-for="(item, index) in configForm.createTaskListenerBody"
504+
:key="index"
505+
>
506+
<div class="mr-2">
507+
<el-input v-model="item.key" style="width: 160px" />
508+
</div>
509+
<div class="mr-2">
510+
<el-select v-model="item.type" style="width: 100px">
511+
<el-option
512+
v-for="types in LISTENER_MAP_TYPES"
513+
:key="types.value"
514+
:label="types.label"
515+
:value="types.value"
516+
/>
517+
</el-select>
518+
</div>
519+
<div class="mr-2">
520+
<el-input v-model="item.value" style="width: 160px" />
521+
</div>
522+
<div class="mr-1 flex items-center">
523+
<Icon
524+
icon="ep:delete"
525+
:size="18"
526+
@click="deleteTaskListenerMap(configForm.createTaskListenerBody, index)"
527+
/>
528+
</div>
529+
</div>
530+
<el-button
531+
type="primary"
532+
text
533+
@click="addTaskListenerMap(configForm.createTaskListenerBody)"
534+
>
535+
<Icon icon="ep:plus" class="mr-5px" />添加一行
536+
</el-button>
537+
</el-form-item>
538+
</div>
539+
540+
<el-divider content-position="left">
541+
<el-text tag="b" size="large">指派任务执行人员</el-text>
542+
</el-divider>
543+
<el-form-item prop="assignTaskListenerEnable">
544+
<el-switch
545+
v-model="configForm.assignTaskListenerEnable"
546+
active-text="开启"
547+
inactive-text="关闭"
548+
/>
549+
</el-form-item>
550+
551+
<el-divider content-position="left">
552+
<el-text tag="b" size="large">完成任务</el-text>
553+
</el-divider>
554+
<el-form-item prop="completeTaskListenerEnable">
555+
<el-switch
556+
v-model="configForm.completeTaskListenerEnable"
557+
active-text="开启"
558+
inactive-text="关闭"
559+
/>
560+
</el-form-item>
561+
</el-form>
562+
</div>
563+
</el-tab-pane>
437564
</el-tabs>
438565
<template #footer>
439566
<el-divider />
@@ -469,7 +596,8 @@ import {
469596
ASSIGN_EMPTY_HANDLER_TYPES,
470597
AssignEmptyHandlerType,
471598
FieldPermissionType,
472-
ProcessVariableEnum
599+
ProcessVariableEnum,
600+
LISTENER_MAP_TYPES
473601
} from '../consts'
474602
475603
import {
@@ -513,7 +641,7 @@ const { settingVisible, closeDrawer, openDrawer } = useDrawer()
513641
// 节点名称配置
514642
const { nodeName, showInput, clickIcon, blurEvent } = useNodeName(NodeType.USER_TASK_NODE)
515643
// 激活的 Tab 标签页
516-
const activeTabName = ref('user')
644+
const activeTabName = ref('listener')
517645
// 表单字段权限设置
518646
const { formType, fieldsPermissionConfig, formFieldOptions, getNodeConfigFormFields } =
519647
useFormFieldsPermission(FieldPermissionType.READ)
@@ -662,6 +790,13 @@ const saveConfig = async () => {
662790
currentNode.value.fieldsPermission = fieldsPermissionConfig.value
663791
// 设置按钮权限
664792
currentNode.value.buttonsSetting = buttonsSetting.value
793+
// 创建任务监听器
794+
currentNode.value.createTaskListener = {
795+
enable: configForm.value.createTaskListenerEnable,
796+
path: configForm.value.createTaskListenerPath,
797+
header: configForm.value.createTaskListenerHeader,
798+
body: configForm.value.createTaskListenerBody
799+
}
665800
666801
currentNode.value.showText = showText
667802
settingVisible.value = false
@@ -713,6 +848,11 @@ const showUserTaskNodeConfig = (node: SimpleFlowNode) => {
713848
buttonsSetting.value = cloneDeep(node.buttonsSetting) || DEFAULT_BUTTON_SETTING
714849
// 4. 表单字段权限配置
715850
getNodeConfigFormFields(node.fieldsPermission)
851+
// 创建任务监听器
852+
configForm.value.createTaskListenerEnable = node.createTaskListener.enable
853+
configForm.value.createTaskListenerPath = node.createTaskListener.path
854+
configForm.value.createTaskListenerHeader = node.createTaskListener.header ?? []
855+
configForm.value.createTaskListenerBody = node.createTaskListener.body ?? []
716856
}
717857
718858
defineExpose({ openDrawer, showUserTaskNodeConfig }) // 暴露方法给父组件
@@ -825,6 +965,17 @@ function useTimeoutHandler() {
825965
cTimeoutMaxRemindCount
826966
}
827967
}
968+
969+
const addTaskListenerMap = (arr) => {
970+
arr.push({
971+
key: '',
972+
type: 1,
973+
value: ''
974+
})
975+
}
976+
const deleteTaskListenerMap = (arr, index) => {
977+
arr.splice(index, 1)
978+
}
828979
</script>
829980

830981
<style lang="scss" scoped>

0 commit comments

Comments
 (0)