root/ludu-admin-vue3
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

仿钉钉流程设计器- 通过只需一人,拒绝需要全员

Browse Source
This commit is contained in:
jason 2024-06-06 10:05:34 +08:00
parent e8d06c314e
commit 632bcb9944
3 changed files with 85 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/SimpleProcessDesignerV2/src/NodeHandler.vue
View File

@ -84,7 +84,7 @@ const addNode = (type: number) => {
enable: false
},
rejectHandler: {
type: RejectHandlerType.TERMINATION
type: RejectHandlerType.FINISH_PROCESS
}
},
childNode: props.childNode

44
src/components/SimpleProcessDesignerV2/src/consts.ts
View File

@ -66,11 +66,20 @@ export enum RejectHandlerType {
/**
* 结束流程
*/
TERMINATION = 1,
FINISH_PROCESS = 1,
/**
* 驳回到指定节点
*/
RETURN_PRE_USER_TASK = 2
RETURN_PRE_USER_TASK = 2,
/**
* 按拒绝人数比例终止流程
*/
FINISH_PROCESS_BY_REJECT_RATIO = 3,
/**
* 结束任务
*/
FINISH_TASK = 4
}
// 条件配置类型 （ 用于条件节点配置 ）
@ -99,13 +108,22 @@ export enum ApproveMethodType {
*/
ALL_APPROVE = 2,
/**
* 多人或签(一名审批人同意即可)
* 多人会签(按比例投票)
*/
ANY_OF_APPROVE = 3,
APPROVE_BY_RATIO = 3,
/**
* 多人会签(通过只需一人，拒绝需要全员)
*/
ANY_APPROVE_ALL_REJECT = 4,
/**
* 多人或签(一名审批人通过即可)
*/
ANY_APPROVE = 5,
/**
* 多人依次审批
*/
SEQUENTIAL_APPROVE = 4
SEQUENTIAL_APPROVE = 6
}
@ -198,10 +216,12 @@ NODE_DEFAULT_NAME.set(NodeType.COPY_TASK_NODE, '抄送人')
NODE_DEFAULT_NAME.set(NodeType.CONDITION_NODE, '条件')
export const APPROVE_METHODS: DictDataVO [] = [
{ label: '单人审批', value: 1 },
{ label: '多人会签(需所有审批人同意)', value: 2 },
{ label: '多人或签(一名审批人同意即可)', value: 3 },
{ label: '依次审批(按顺序依次审批)', value: 4 }
{ label: '单人审批', value: ApproveMethodType.SINGLE_PERSON_APPROVE },
{ label: '多人会签(需所有审批人同意)', value: ApproveMethodType.ALL_APPROVE },
// { label: '多人会签(按比例投票)', value: ApproveMethodType.APPROVE_BY_RATIO },
{ label: '多人会签(通过只需一人,拒绝需要全员)', value: ApproveMethodType.ANY_APPROVE_ALL_REJECT },
{ label: '多人或签(一名审批人通过即可)', value: ApproveMethodType.ANY_APPROVE },
{ label: '依次审批(按顺序依次审批)', value: ApproveMethodType.SEQUENTIAL_APPROVE }
]
export const CONDITION_CONFIG_TYPES: DictDataVO [] = [
@ -222,8 +242,10 @@ export const TIMEOUT_HANDLER_ACTION_TYPES: DictDataVO [] = [
{ label: '自动拒绝', value: 3 },
]
export const REJECT_HANDLER_TYPES: DictDataVO [] = [
{ label: '结束流程', value: RejectHandlerType.TERMINATION },
{ label: '驳回到指定节点', value: RejectHandlerType.RETURN_PRE_USER_TASK }
{ label: '终止流程', value: RejectHandlerType.FINISH_PROCESS },
{ label: '驳回到指定节点', value: RejectHandlerType.RETURN_PRE_USER_TASK },
{ label: '按拒绝人数终止流程(用于会签)', value: RejectHandlerType.FINISH_PROCESS_BY_REJECT_RATIO }
// { label: '结束任务', value: RejectHandlerType.FINISH_TASK }
]
// 比较运算符

71
src/components/SimpleProcessDesignerV2/src/nodes-config/UserTaskNodeConfig.vue
View File

@ -144,7 +144,10 @@
/>
</el-form-item>
<el-form-item label="审批方式" prop="approveMethod">
<el-radio-group v-model="currentNode.attributes.approveMethod">
<el-radio-group
v-model="currentNode.attributes.approveMethod"
@change="approveMethodChanged"
>
<div class="flex-col">
<div v-for="(item, index) in APPROVE_METHODS" :key="index">
<el-radio
@ -162,24 +165,33 @@
</el-radio-group>
</el-form-item>
<el-divider content-position="left">审批人拒绝时</el-divider>
<el-form-item label="处理方式" prop="rejectHandler">
<el-radio-group v-model="currentNode.attributes.rejectHandler.type" @change="rejectHandlerTypeChange">
<el-radio
:border="true"
v-for="item in REJECT_HANDLER_TYPES"
:key="item.value"
:value="item.value"
:label="item.label"
/>
<el-form-item prop="rejectHandler">
<el-radio-group v-model="currentNode.attributes.rejectHandler.type">
<div class="flex-col">
<div v-for="(item, index) in REJECT_HANDLER_TYPES" :key="index">
<el-radio
:key="item.value"
:value="item.value"
:label="item.label"
:disabled="rejectHandlerOptionDisabled(item.value)"
/>
</div>
</div>
</el-radio-group>
</el-form-item>
<el-form-item
v-if="currentNode.attributes.rejectHandler.type == RejectHandlerType.RETURN_PRE_USER_TASK"
v-if="
currentNode.attributes.rejectHandler.type == RejectHandlerType.RETURN_PRE_USER_TASK
"
label="驳回节点"
prop="rejectHandlerNode"
>
<el-select v-model="currentNode.attributes.rejectHandler.returnNodeId" clearable style="width: 100%">
<el-select
v-model="currentNode.attributes.rejectHandler.returnNodeId"
clearable
style="width: 100%"
>
<el-option
v-for="item in returnTaskList"
:key="item.id"
@ -474,9 +486,9 @@ const setCurrentNode = (node: SimpleFlowNode) => {
timeUnit.value = convertTimeUnit(parseTimeUnit)
}
// 查找可以驳回的用户节点
const matchNodeList = [];
emits('find:returnTaskNodes', matchNodeList);
returnTaskList.value = matchNodeList;
const matchNodeList = []
emits('find:returnTaskNodes', matchNodeList)
returnTaskList.value = matchNodeList
}
defineExpose({ open, setCurrentNode }) // 暴露方法给父组件
@ -517,12 +529,30 @@ const blurEvent = () => {
currentNode.value.name =
currentNode.value.name || (NODE_DEFAULT_NAME.get(NodeType.USER_TASK_NODE) as string)
}
const rejectHandlerTypeChange = () => {
if (currentNode.value.attributes?.rejectHandler.type === RejectHandlerType.RETURN_PRE_USER_TASK) {
console.log('nodeList is {}', returnTaskList.value);
const approveMethodChanged = () => {
const approveMethod = currentNode.value.attributes?.approveMethod
if (approveMethod === ApproveMethodType.ANY_APPROVE_ALL_REJECT || approveMethod === ApproveMethodType.APPROVE_BY_RATIO) {
currentNode.value.attributes.rejectHandler.type =RejectHandlerType.FINISH_PROCESS_BY_REJECT_RATIO
} else {
currentNode.value.attributes.rejectHandler.type = RejectHandlerType.FINISH_PROCESS
}
}
const rejectHandlerOptionDisabled = computed(() => {
return (val: number) => {
const approveMethod = currentNode.value.attributes?.approveMethod
if (val === RejectHandlerType.FINISH_PROCESS_BY_REJECT_RATIO && approveMethod !== ApproveMethodType.APPROVE_BY_RATIO
&& approveMethod !== ApproveMethodType.ANY_APPROVE_ALL_REJECT) {
return true
}
if ( approveMethod === ApproveMethodType.ANY_APPROVE_ALL_REJECT &&
val === RejectHandlerType.FINISH_PROCESS
) {
return true
}
return false
}
})
// 默认 6小时
const timeDuration = ref(6)
const timeUnit = ref(TimeUnitType.HOUR)
@ -540,6 +570,7 @@ const isoTimeDuration = computed(() => {
}
return strTimeDuration
})
// 超时开关改变
const timeoutHandlerChange = () => {
if (currentNode.value.attributes.timeoutHandler.enable) {