geg-gas/geg-gas-web
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:新增 全局会签 回调 和 节点上的 会签，预审，同意，退回的回调

Browse Source
This commit is contained in:
lvjunzhao
2025-04-14 16:51:22 +08:00
parent f55450cc99
commit c197cf7905
4 changed files with 473 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/model/workflow/workflowConfig.ts
View File

@ -114,6 +114,7 @@ export interface ProcessConfig {
globalAgreeEventConfigs: NodeEventConfig[];//全局同意事件
globalSuspendedEventConfigs: NodeEventConfig[];//全局 挂起/暂停事件
globalRestoreEventConfigs: NodeEventConfig[];//全局 恢复事件
globalSetSignEventConfigs: NodeEventConfig[];//全局 会签事件
xmlContent: String; //xml
}
@ -287,6 +288,11 @@ export interface BasicNodeConfig {
remark: string; //节点描述
startEventConfigs: NodeEventConfig[];
endEventConfigs: NodeEventConfig[];
prequalifyBeforeEventConfigs: [],//预审前
prequalifyAfterEventConfigs: [],//预审后
rejectEventConfigs: [],//全局退回事件
agreeEventConfigs: [],//全局同意事件
setSignEventConfigs: [],//全局 会签事件
}
export interface NodeEventConfig {

382
src/views/workflow/design/bpmn/components/BasicPanel.vue
View File

@ -51,6 +51,7 @@
<a-select v-model:value="record[column.dataIndex]">
<a-select-option :value="0">{{ t('执行API') }}</a-select-option>
<a-select-option :value="1">{{ t('规则引擎') }}</a-select-option>
<a-select-option :value="2">{{ t('类注入') }}</a-select-option>
</a-select>
</template>
<template v-if="column.key === 'operateConfig'">
@ -76,6 +77,11 @@
:options="liteFlowOptions"
:field-names="{ label: 'chainName', value: 'id' }"
/>
<a-input
style="width: 100%"
v-else-if="record.type === NodeEventExType.SERVICE"
v-model:value="record['serviceName']"
/>
</template>
<template v-if="column.key === 'action'">
<DeleteTwoTone two-tone-color="#ff8080" @click="deleteStartEvent(index)" />
@ -105,6 +111,7 @@
<a-select v-model:value="record[column.dataIndex]">
<a-select-option :value="0">{{ t('执行API') }}</a-select-option>
<a-select-option :value="1">{{ t('规则引擎') }}</a-select-option>
<a-select-option :value="2">{{ t('类注入') }}</a-select-option>
</a-select>
</template>
<template v-if="column.key === 'operateConfig'">
@ -130,6 +137,11 @@
:options="liteFlowOptions"
:field-names="{ label: 'chainName', value: 'id' }"
/>
<a-input
style="width: 100%"
v-else-if="record.type === NodeEventExType.SERVICE"
v-model:value="record['serviceName']"
/>
</template>
<template v-if="column.key === 'action'">
<DeleteTwoTone two-tone-color="#ff8080" @click="deleteEndEvent(index)" />
@ -137,6 +149,306 @@
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="3" :tab="t('会签事件')" v-if="formInfo.setSignEventConfigs || formInfo.type==BpmnNodeKey.USER">
<div class="process-top">
<a-button type="primary" @click="addSetSignEvent"> {{ t('添加会签事件') }} </a-button>
</div>
<a-table :columns="columns" :data-source="formInfo.setSignEventConfigs" :pagination="false">
<template #headerCell="{ column }">
<template v-if="column.key === 'sort'">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fangxiang1" />
</svg>
</template>
</template>
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'sort'">
<svg class="icon draggable-icon" aria-hidden="true" style="cursor: move">
<use xlink:href="#icon-paixu" />
</svg>
</template>
<template v-if="column.key === 'type'">
<a-select v-model:value="record[column.dataIndex]">
<a-select-option :value="0">{{ t('执行API') }}</a-select-option>
<a-select-option :value="1">{{ t('规则引擎') }}</a-select-option>
<a-select-option :value="2">{{ t('类注入') }}</a-select-option>
</a-select>
</template>
<template v-if="column.key === 'operateConfig'">
<ScriptApiSelect
v-if="record.type === NodeEventExType.API"
style="width: 100%"
v-model="record['apiConfig']"
:need-hide-components="true"
/>
<!-- <a-input
v-if="record.type === NodeEventExType.API"
v-model:value="record['apiConfig'].path"
@click="showConfig(NodeEventType.END, index)"
>
<template #suffix>
<Icon icon="ant-design:ellipsis-outlined" />
</template>
</a-input> -->
<a-select
style="width: 100%"
v-else-if="record.type === NodeEventExType.LITEFLOW"
v-model:value="record['liteflowId']"
:options="liteFlowOptions"
:field-names="{ label: 'chainName', value: 'id' }"
/>
<a-input
style="width: 100%"
v-else-if="record.type === NodeEventExType.SERVICE"
v-model:value="record['serviceName']"
/>
</template>
<template v-if="column.key === 'action'">
<DeleteTwoTone two-tone-color="#ff8080" @click="deleteSetSignEvent(index)" />
</template>
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="4" :tab="t('预审前事件')" v-if="formInfo.prequalifyBeforeEventConfigs || formInfo.type==BpmnNodeKey.USER">
<div class="process-top">
<a-button type="primary" @click="addPrequalifyBeforeEvent"> {{ t('添加预审前事件') }} </a-button>
</div>
<a-table :columns="columns" :data-source="formInfo.prequalifyBeforeEventConfigs" :pagination="false">
<template #headerCell="{ column }">
<template v-if="column.key === 'sort'">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fangxiang1" />
</svg>
</template>
</template>
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'sort'">
<svg class="icon draggable-icon" aria-hidden="true" style="cursor: move">
<use xlink:href="#icon-paixu" />
</svg>
</template>
<template v-if="column.key === 'type'">
<a-select v-model:value="record[column.dataIndex]">
<a-select-option :value="0">{{ t('执行API') }}</a-select-option>
<a-select-option :value="1">{{ t('规则引擎') }}</a-select-option>
<a-select-option :value="2">{{ t('类注入') }}</a-select-option>
</a-select>
</template>
<template v-if="column.key === 'operateConfig'">
<ScriptApiSelect
v-if="record.type === NodeEventExType.API"
style="width: 100%"
v-model="record['apiConfig']"
:need-hide-components="true"
/>
<!-- <a-input
v-if="record.type === NodeEventExType.API"
v-model:value="record['apiConfig'].path"
@click="showConfig(NodeEventType.END, index)"
>
<template #suffix>
<Icon icon="ant-design:ellipsis-outlined" />
</template>
</a-input> -->
<a-select
style="width: 100%"
v-else-if="record.type === NodeEventExType.LITEFLOW"
v-model:value="record['liteflowId']"
:options="liteFlowOptions"
:field-names="{ label: 'chainName', value: 'id' }"
/>
<a-input
style="width: 100%"
v-else-if="record.type === NodeEventExType.SERVICE"
v-model:value="record['serviceName']"
/>
</template>
<template v-if="column.key === 'action'">
<DeleteTwoTone two-tone-color="#ff8080" @click="deletePrequalifyBeforeEvent(index)" />
</template>
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="5" :tab="t('预审后事件')" v-if="formInfo.prequalifyAfterEventConfigs || formInfo.type==BpmnNodeKey.USER">
<div class="process-top">
<a-button type="primary" @click="addPrequalifyAfterEvent"> {{ t('添加预审后事件') }} </a-button>
</div>
<a-table :columns="columns" :data-source="formInfo.prequalifyAfterEventConfigs" :pagination="false">
<template #headerCell="{ column }">
<template v-if="column.key === 'sort'">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fangxiang1" />
</svg>
</template>
</template>
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'sort'">
<svg class="icon draggable-icon" aria-hidden="true" style="cursor: move">
<use xlink:href="#icon-paixu" />
</svg>
</template>
<template v-if="column.key === 'type'">
<a-select v-model:value="record[column.dataIndex]">
<a-select-option :value="0">{{ t('执行API') }}</a-select-option>
<a-select-option :value="1">{{ t('规则引擎') }}</a-select-option>
<a-select-option :value="2">{{ t('类注入') }}</a-select-option>
</a-select>
</template>
<template v-if="column.key === 'operateConfig'">
<ScriptApiSelect
v-if="record.type === NodeEventExType.API"
style="width: 100%"
v-model="record['apiConfig']"
:need-hide-components="true"
/>
<!-- <a-input
v-if="record.type === NodeEventExType.API"
v-model:value="record['apiConfig'].path"
@click="showConfig(NodeEventType.END, index)"
>
<template #suffix>
<Icon icon="ant-design:ellipsis-outlined" />
</template>
</a-input> -->
<a-select
style="width: 100%"
v-else-if="record.type === NodeEventExType.LITEFLOW"
v-model:value="record['liteflowId']"
:options="liteFlowOptions"
:field-names="{ label: 'chainName', value: 'id' }"
/>
<a-input
style="width: 100%"
v-else-if="record.type === NodeEventExType.SERVICE"
v-model:value="record['serviceName']"
/>
</template>
<template v-if="column.key === 'action'">
<DeleteTwoTone two-tone-color="#ff8080" @click="deletePrequalifyAfterEvent(index)" />
</template>
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="6" :tab="t('同意事件')" v-if="formInfo.agreeEventConfigs || formInfo.type==BpmnNodeKey.USER">
<div class="process-top">
<a-button type="primary" @click="addAgreeEvent"> {{ t('添加同意事件') }} </a-button>
</div>
<a-table :columns="columns" :data-source="formInfo.agreeEventConfigs" :pagination="false">
<template #headerCell="{ column }">
<template v-if="column.key === 'sort'">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fangxiang1" />
</svg>
</template>
</template>
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'sort'">
<svg class="icon draggable-icon" aria-hidden="true" style="cursor: move">
<use xlink:href="#icon-paixu" />
</svg>
</template>
<template v-if="column.key === 'type'">
<a-select v-model:value="record[column.dataIndex]">
<a-select-option :value="0">{{ t('执行API') }}</a-select-option>
<a-select-option :value="1">{{ t('规则引擎') }}</a-select-option>
<a-select-option :value="2">{{ t('类注入') }}</a-select-option>
</a-select>
</template>
<template v-if="column.key === 'operateConfig'">
<ScriptApiSelect
v-if="record.type === NodeEventExType.API"
style="width: 100%"
v-model="record['apiConfig']"
:need-hide-components="true"
/>
<!-- <a-input
v-if="record.type === NodeEventExType.API"
v-model:value="record['apiConfig'].path"
@click="showConfig(NodeEventType.END, index)"
>
<template #suffix>
<Icon icon="ant-design:ellipsis-outlined" />
</template>
</a-input> -->
<a-select
style="width: 100%"
v-else-if="record.type === NodeEventExType.LITEFLOW"
v-model:value="record['liteflowId']"
:options="liteFlowOptions"
:field-names="{ label: 'chainName', value: 'id' }"
/>
<a-input
style="width: 100%"
v-else-if="record.type === NodeEventExType.SERVICE"
v-model:value="record['serviceName']"
/>
</template>
<template v-if="column.key === 'action'">
<DeleteTwoTone two-tone-color="#ff8080" @click="deleteAgreeEvent(index)" />
</template>
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="7" :tab="t('退回事件')" v-if="formInfo.rejectEventConfigs || formInfo.type==BpmnNodeKey.USER">
<div class="process-top">
<a-button type="primary" @click="addRejectEvent"> {{ t('添加退回事件') }} </a-button>
</div>
<a-table :columns="columns" :data-source="formInfo.rejectEventConfigs" :pagination="false">
<template #headerCell="{ column }">
<template v-if="column.key === 'sort'">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fangxiang1" />
</svg>
</template>
</template>
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'sort'">
<svg class="icon draggable-icon" aria-hidden="true" style="cursor: move">
<use xlink:href="#icon-paixu" />
</svg>
</template>
<template v-if="column.key === 'type'">
<a-select v-model:value="record[column.dataIndex]">
<a-select-option :value="0">{{ t('执行API') }}</a-select-option>
<a-select-option :value="1">{{ t('规则引擎') }}</a-select-option>
<a-select-option :value="2">{{ t('类注入') }}</a-select-option>
</a-select>
</template>
<template v-if="column.key === 'operateConfig'">
<ScriptApiSelect
v-if="record.type === NodeEventExType.API"
style="width: 100%"
v-model="record['apiConfig']"
:need-hide-components="true"
/>
<!-- <a-input
v-if="record.type === NodeEventExType.API"
v-model:value="record['apiConfig'].path"
@click="showConfig(NodeEventType.END, index)"
>
<template #suffix>
<Icon icon="ant-design:ellipsis-outlined" />
</template>
</a-input> -->
<a-select
style="width: 100%"
v-else-if="record.type === NodeEventExType.LITEFLOW"
v-model:value="record['liteflowId']"
:options="liteFlowOptions"
:field-names="{ label: 'chainName', value: 'id' }"
/>
<a-input
style="width: 100%"
v-else-if="record.type === NodeEventExType.SERVICE"
v-model:value="record['serviceName']"
/>
</template>
<template v-if="column.key === 'action'">
<DeleteTwoTone two-tone-color="#ff8080" @click="deleteRejectEvent(index)" />
</template>
</template>
</a-table>
</a-tab-pane>
</a-tabs>
</a-tab-pane>
</a-tabs>
@ -167,6 +479,9 @@
import Sortable from 'sortablejs';
import { NodeEventExType } from '/@/enums/workflowEnum';
import { NodeEventConfig } from '/@/model/workflow/workflowConfig';
import {
BpmnNodeKey,
} from '/@/enums/workflowEnum';
const { t } = useI18n();
const { showPanel, formInfo, nodeName } = useStateFormInfo();
const updateElementName = inject('updateElementName') as any;
@ -222,7 +537,12 @@
() => {
if (
formInfo.value.endEventConfigs?.length > 0 ||
formInfo.value.startEventConfigs?.length > 0
formInfo.value.startEventConfigs?.length > 0 ||
formInfo.value.setSignEventConfigs?.length > 0 ||
formInfo.value.prequalifyBeforeEventConfigs?.length > 0 ||
formInfo.value.prequalifyAfterEventConfigs?.length > 0 ||
formInfo.value.agreeEventConfigs?.length > 0 ||
formInfo.value.rejectEventConfigs?.length > 0
) {
nextTick(() => {
const tbody: any = document.querySelector('.ant-table-tbody');
@ -246,6 +566,66 @@
const getList = async () => {
liteFlowOptions.value = (await getLiteflowList()) || [];
};
//新增会签 因为旧值中不包含，所以html 判断node节点，这里对add 可以新增空数组
const addSetSignEvent = () => {
formInfo.value.setSignEventConfigs = formInfo.value.setSignEventConfigs==null?[]:formInfo.value.setSignEventConfigs;
formInfo.value.setSignEventConfigs.push({
type: NodeEventExType.API,
apiConfig: {},
} as NodeEventConfig);
};
const deleteSetSignEvent = (index) => {
formInfo.value.setSignEventConfigs.splice(index, 1);
};
// 预审前 因为旧值中不包含，所以html 判断node节点，这里对add 可以新增空数组
const addPrequalifyBeforeEvent = () => {
formInfo.value.prequalifyBeforeEventConfigs = formInfo.value.prequalifyBeforeEventConfigs==null?[]:formInfo.value.prequalifyBeforeEventConfigs;
formInfo.value.prequalifyBeforeEventConfigs.push({
type: NodeEventExType.API,
apiConfig: {},
} as NodeEventConfig);
};
const deletePrequalifyBeforeEvent = (index) => {
formInfo.value.prequalifyBeforeEventConfigs.splice(index, 1);
};
// 预审后 因为旧值中不包含，所以html 判断node节点，这里对add 可以新增空数组
const addPrequalifyAfterEvent = () => {
formInfo.value.prequalifyAfterEventConfigs = formInfo.value.prequalifyAfterEventConfigs==null?[]:formInfo.value.prequalifyAfterEventConfigs;
formInfo.value.prequalifyAfterEventConfigs.push({
type: NodeEventExType.API,
apiConfig: {},
} as NodeEventConfig);
};
const deletePrequalifyAfterEvent = (index) => {
formInfo.value.prequalifyAfterEventConfigs.splice(index, 1);
};
// 同意 因为旧值中不包含，所以html 判断node节点，这里对add 可以新增空数组
const addAgreeEvent = () => {
formInfo.value.agreeEventConfigs = formInfo.value.agreeEventConfigs==null?[]:formInfo.value.agreeEventConfigs;
formInfo.value.agreeEventConfigs.push({
type: NodeEventExType.API,
apiConfig: {},
} as NodeEventConfig);
};
const deleteAgreeEvent = (index) => {
formInfo.value.agreeEventConfigs.splice(index, 1);
};
// 退回 因为旧值中不包含，所以html 判断node节点，这里对add 可以新增空数组
const addRejectEvent = () => {
formInfo.value.rejectEventConfigs = formInfo.value.rejectEventConfigs==null?[]:formInfo.value.rejectEventConfigs;
formInfo.value.rejectEventConfigs.push({
type: NodeEventExType.API,
apiConfig: {},
} as NodeEventConfig);
};
const deleteRejectEvent = (index) => {
formInfo.value.rejectEventConfigs.splice(index, 1);
};
</script>
<style lang="less" scoped>

6
src/views/workflow/design/bpmn/config/propertyConfig.ts
View File

@ -94,6 +94,7 @@ export const processConfig: ProcessConfig = {
globalAgreeEventConfigs: [],//全局同意事件
globalSuspendedEventConfigs: [],//全局 挂起/暂停事件
globalRestoreEventConfigs: [],//全局 恢复事件
globalSetSignEventConfigs: [],//全局 会签事件
xmlContent: '',
};
// 默认属性
@ -204,6 +205,11 @@ const UserProperties: UserTaskConfig = {
}, //超时处理
startEventConfigs: [],
endEventConfigs: [],
prequalifyBeforeEventConfigs: [],//预审前
prequalifyAfterEventConfigs: [],//预审后
rejectEventConfigs: [],//全局退回事件
agreeEventConfigs: [],//全局同意事件
setSignEventConfigs: [],//全局 会签事件
};
// 脚本节点默认属性
const ScriptProperties: ScriptTaskConfig = {

84
src/views/workflow/design/bpmn/panel/process/globalEvent/Index.vue
View File

@ -132,7 +132,7 @@
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="3" :tab="t('全局预审前事件')">
<a-tab-pane key="3" :tab="t('预审前事件')">
<div class="process-top">
<a-button type="primary" @click="addGlobalPrequalifyBeforeEvent">
{{ t('添加全局预审前事件') }}
@ -198,7 +198,7 @@
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="4" :tab="t('全局预审后事件')">
<a-tab-pane key="4" :tab="t('预审后事件')">
<div class="process-top">
<a-button type="primary" @click="addGlobalPrequalifyAfterEvent">
{{ t('添加全局预审后事件') }}
@ -330,7 +330,7 @@
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="6" :tab="t('全局退回事件')">
<a-tab-pane key="6" :tab="t('退回事件')">
<div class="process-top">
<a-button type="primary" @click="addGlobalRejectEvent">
{{ t('添加全局退回事件') }}
@ -396,7 +396,7 @@
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="7" :tab="t('全局同意事件')">
<a-tab-pane key="7" :tab="t('同意事件')">
<div class="process-top">
<a-button type="primary" @click="addGlobalAgreeEvent">
{{ t('添加全局同意事件') }}
@ -594,6 +594,72 @@
</template>
</a-table>
</a-tab-pane>
<a-tab-pane key="10" :tab="t('会签事件')">
<div class="process-top">
<a-button type="primary" @click="addGlobalSetSignEvent">
{{ t('添加会签事件') }}
</a-button>
</div>
<a-table
:columns="columns"
:dataSource="processInfo.globalSetSignEventConfigs"
:pagination="false"
>
<template #headerCell="{ column }">
<template v-if="column.key === 'sort'">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-fangxiang1" />
</svg>
</template>
</template>
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'sort'">
<svg class="icon draggable-icon" aria-hidden="true" style="cursor: move">
<use xlink:href="#icon-paixu" />
</svg>
</template>
<template v-if="column.key === 'type'">
<a-select v-model:value="record[column.dataIndex]">
<a-select-option :value="0">{{ t('执行API') }}</a-select-option>
<a-select-option :value="1">{{ t('规则引擎') }}</a-select-option>
<a-select-option :value="2">{{ t('类注入') }}</a-select-option>
</a-select>
</template>
<template v-if="column.key === 'operateConfig'">
<!-- <a-input
v-if="record.type === NodeEventExType.API"
v-model:value="record['apiConfig'].path"
@click="showConfig(NodeEventType.START, index)"
>
<template #suffix>
<Icon icon="ant-design:ellipsis-outlined" />
</template>
</a-input> -->
<ScriptApiSelect
v-if="record.type === NodeEventExType.API"
style="width: 100%"
v-model="record['apiConfig']"
:need-hide-components="true"
/>
<a-select
style="width: 100%"
v-else-if="record.type === NodeEventExType.LITEFLOW"
v-model:value="record['liteflowId']"
:options="liteFlowOptions"
:field-names="{ label: 'chainName', value: 'id' }"
/>
<a-input
style="width: 100%"
v-else-if="record.type === NodeEventExType.SERVICE"
v-model:value="record['serviceName']"
/>
</template>
<template v-if="column.key === 'action'">
<DeleteTwoTone two-tone-color="#ff8080" @click="deleteSetSignEvent(index)" />
</template>
</template>
</a-table>
</a-tab-pane>
</a-tabs>
</template>
@ -737,7 +803,17 @@ const addGlobalRestoreEvent = () => {
const deleteRestoreEvent = (index) => {
processInfo.value.globalRestoreEventConfigs.splice(index, 1);
};
// 全局会签事件添加
const addGlobalSetSignEvent = () => {
processInfo.value.globalSetSignEventConfigs.push({
type: NodeEventExType.API,
apiConfig: {},
} as NodeEventConfig);
};
const deleteSetSignEvent = (index) => {
processInfo.value.globalSetSignEventConfigs.splice(index, 1);
};
</script>
<style lang="less" scoped>