From f79c29d168d340000539df7cec8db785e9ff824a Mon Sep 17 00:00:00 2001 From: jason <2667446@qq.com> Date: Fri, 5 Apr 2024 13:04:12 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BB=BF=E9=92=89=E9=92=89=E8=AE=BE=E8=AE=A1?= =?UTF-8?q?=E6=B5=81=E7=A8=8B=EF=BC=9A=E5=A2=9E=E5=8A=A0=E6=8A=84=E9=80=81?= =?UTF-8?q?=E4=BA=BA=E8=8A=82=E7=82=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../SimpleProcessDesigner/src/addNode.vue | 16 +- .../src/drawer/approverDrawer.vue | 30 +-- .../src/drawer/copyerDrawer.vue | 246 ++++++++++++++++++ .../SimpleProcessDesigner/src/nodeWrap.vue | 115 ++++---- .../SimpleProcessDesigner/src/util.ts | 23 +- .../SimpleProcessDesigner/theme/workflow.css | 49 ++-- src/directives/index.ts | 12 + src/main.ts | 6 +- src/store/modules/simpleWorkflow.ts | 12 +- src/views/bpm/simpleWorkflow/index.vue | 2 + 10 files changed, 391 insertions(+), 120 deletions(-) create mode 100644 src/components/SimpleProcessDesigner/src/drawer/copyerDrawer.vue diff --git a/src/components/SimpleProcessDesigner/src/addNode.vue b/src/components/SimpleProcessDesigner/src/addNode.vue index 7595b670..d0c7d746 100644 --- a/src/components/SimpleProcessDesigner/src/addNode.vue +++ b/src/components/SimpleProcessDesigner/src/addNode.vue @@ -24,6 +24,12 @@

条件分支

--> + +
+ +
+

抄送人

+
@@ -86,9 +92,13 @@ const addType = (type) => { data = { name: '抄送人', type: 2, - ccSelfSelectFlag: 1, - childNode: props.childNodeP, - nodeUserList: [] + error: true, + // 抄送节点配置 + attributes : { + candidateStrategy: undefined, + candidateParam: undefined + }, + childNode: props.childNodeP } } emits('update:childNodeP', data) diff --git a/src/components/SimpleProcessDesigner/src/drawer/approverDrawer.vue b/src/components/SimpleProcessDesigner/src/drawer/approverDrawer.vue index 089a6ac1..cbcec808 100644 --- a/src/components/SimpleProcessDesigner/src/drawer/approverDrawer.vue +++ b/src/components/SimpleProcessDesigner/src/drawer/approverDrawer.vue @@ -2,7 +2,6 @@ ([]) // 角色列表 const postOptions = ref([]) // 岗位列表 const userOptions = ref([]) // 用户列表 @@ -183,7 +177,7 @@ const candidateConfig = ref({ }) let approverConfig = ref({}) let store = useWorkFlowStoreWithOut() -let { setApprover, setUserTaskConfig } = store +let { setApproverDrawer, setUserTaskConfig } = store let approverConfig1 = computed(() => store.approverConfig1) let approverDrawer = computed(() => store.approverDrawer) const userTaskConfig = computed(() => store.userTaskConfig) @@ -233,32 +227,16 @@ const saveConfig = () => { // flag: true, // id: approverConfig1.value.id // }) - const showText = getApproverShowText() setUserTaskConfig({ value: rawConfig.value, flag: true, id: userTaskConfig.value.id, - showText }) - console.log('after is userTaskConfig', userTaskConfig.value) closeDrawer() } -const getApproverShowText = () => { - let appoveMethodText = '' - approveMethods.forEach((item) => { - if (item.value == candidateConfig.value.approveMethod) { - appoveMethodText = item.label - } - }) - const strategyText = getDictLabel( - DICT_TYPE.BPM_TASK_CANDIDATE_STRATEGY, - candidateConfig.value.candidateStrategy - ) - return `审批方式:${appoveMethodText}
- 审批人规则类型:按${strategyText}` -} + const closeDrawer = () => { - setApprover(false) + setApproverDrawer(false) } const changecandidateStrategy = () => { candidateConfig.value.candidateParam = [] diff --git a/src/components/SimpleProcessDesigner/src/drawer/copyerDrawer.vue b/src/components/SimpleProcessDesigner/src/drawer/copyerDrawer.vue new file mode 100644 index 00000000..d8bd01b6 --- /dev/null +++ b/src/components/SimpleProcessDesigner/src/drawer/copyerDrawer.vue @@ -0,0 +1,246 @@ + + + diff --git a/src/components/SimpleProcessDesigner/src/nodeWrap.vue b/src/components/SimpleProcessDesigner/src/nodeWrap.vue index 034d534b..56112e71 100644 --- a/src/components/SimpleProcessDesigner/src/nodeWrap.vue +++ b/src/components/SimpleProcessDesigner/src/nodeWrap.vue @@ -22,12 +22,13 @@ v-if="isInput" type="text" class="ant-input editable-title-input" - @blur="blurEvent()" - @focus="$event.currentTarget.select()" + @blur="blurEvent(-1)" + @focus="$event.currentTarget?.select()" + v-mountedFoucs v-model="nodeConfig.name" :placeholder="defaultText" /> - {{ nodeConfig.name }} + {{ nodeConfig.name }}
@@ -60,7 +61,8 @@ type="text" class="ant-input editable-title-input" @blur="blurEvent(index)" - @focus="$event.currentTarget.select()" + @focus="$event.currentTarget?.select()" + v-mountedFoucs v-model="item.name" /> {{ @@ -135,9 +137,8 @@ let props = defineProps({ let defaultText = computed(() => { return placeholderList[props.nodeConfig.type] }) - -let isInputList = ref([]) -let isInput = ref(false) +const isInputList = ref([]) +const isInput = ref(false) const resetConditionNodesErr = () => { for (var i = 0; i < props.nodeConfig.conditionNodes.length; i++) { // eslint-disable-next-line vue/no-mutating-props @@ -160,20 +161,20 @@ onMounted(() => { let emits = defineEmits(['update:nodeConfig']) let store = useWorkFlowStoreWithOut() let { - setPromoter, - setApprover, - setCopyer, - setCondition, + setApproverDrawer, + setCopyerDrawer, + // setCondition, setCopyerConfig, - setConditionsConfig, + // setConditionsConfig, setUserTaskConfig } = store +// ??? +const isTried = computed(() => store.isTried) // 审批节点的配置 const userTaskConfig = computed(() => store.userTaskConfig) -let isTried = computed(() => store.isTried) -let approverConfig1 = computed(() => store.approverConfig1) -let copyerConfig1 = computed(() => store.copyerConfig1) -let conditionsConfig1 = computed(() => store.conditionsConfig1) +// 抄送节点的配置 +const copyerConfig = computed(() => store.copyerConfig) +// let conditionsConfig1 = computed(() => store.conditionsConfig1) const showText = computed(() => { if (props.nodeConfig.type == 0) return '发起人' if (props.nodeConfig.type == 1) { @@ -186,42 +187,49 @@ const showText = computed(() => { return '' } } - return copyerStr(props.nodeConfig) + if(props.nodeConfig.type === 2) { + if(props.nodeConfig.attributes) { + return copyerStr( props.nodeConfig.attributes.candidateStrategy) + } else { + return '' + } + + } + return '' }) watch(userTaskConfig, (approver) => { if (approver.flag && approver.id === _uid) { emits('update:nodeConfig', approver.value) } }) -watch(approverConfig1, (approver) => { - if (approver.flag && approver.id === _uid) { - emits('update:nodeConfig', approver.value) - } -}) -watch(copyerConfig1, (copyer) => { +watch(copyerConfig, (copyer) => { + console.log('copyer',copyer) if (copyer.flag && copyer.id === _uid) { + console.log('copyer id is equal',copyer) emits('update:nodeConfig', copyer.value) } }) -watch(conditionsConfig1, (condition) => { - if (condition.flag && condition.id === _uid) { - emits('update:nodeConfig', condition.value) - } -}) + +// watch(conditionsConfig1, (condition) => { +// if (condition.flag && condition.id === _uid) { +// emits('update:nodeConfig', condition.value) +// } +// }) const clickEvent = (index) => { - if (index || index === 0) { + if (index >= 0) { isInputList.value[index] = true } else { isInput.value = true } } + const blurEvent = (index) => { - if (index || index === 0) { + if (index >= 0) { isInputList.value[index] = false // eslint-disable-next-line vue/no-mutating-props props.nodeConfig.conditionNodes[index].name = - props.nodeConfig.conditionNodes[index].name || '条件' + props.nodeConfig.conditionNodes[index].name || '条件' } else { isInput.value = false // eslint-disable-next-line vue/no-mutating-props @@ -278,42 +286,45 @@ const reData = (data, addData) => { } } const setPerson = (priorityLevel) => { - var { type } = props.nodeConfig + console.log('priorityLevel',priorityLevel) + const { type } = props.nodeConfig + console.log('type',type) if (type == 0) { - setPromoter(true) + // setPromoter(true) } else if (type == 1) { - setApprover(true) - let showText = undefined - if (_uid === userTaskConfig.value.id) { - showText = userTaskConfig.value.showText - } + setApproverDrawer(true) + // if (_uid === userTaskConfig.value.id) { + // showText = userTaskConfig.value.showText + // } setUserTaskConfig({ value: { ...JSON.parse(JSON.stringify(props.nodeConfig)), id: 'Activity_' + _uid }, flag: false, - id: _uid, - showText + id: _uid }) } else if (type == 2) { - setCopyer(true) + setCopyerDrawer(true) setCopyerConfig({ - value: JSON.parse(JSON.stringify(props.nodeConfig)), + value: { + ...JSON.parse(JSON.stringify(props.nodeConfig)), + id: 'Activity_' + _uid + }, flag: false, id: _uid }) } else { - setCondition(true) - setConditionsConfig({ - value: { - ...JSON.parse(JSON.stringify(props.nodeConfig)), - id: 'Gateway_' + _uid - }, - priorityLevel, - flag: false, - id: _uid - }) + // setCondition(true) + // setConditionsConfig({ + // value: { + // ...JSON.parse(JSON.stringify(props.nodeConfig)), + // id: 'Gateway_' + _uid + // }, + // priorityLevel, + // flag: false, + // id: _uid + // }) } } // const arrTransfer = (index, type = 1) => { diff --git a/src/components/SimpleProcessDesigner/src/util.ts b/src/components/SimpleProcessDesigner/src/util.ts index f910d56b..3e36ec2b 100644 --- a/src/components/SimpleProcessDesigner/src/util.ts +++ b/src/components/SimpleProcessDesigner/src/util.ts @@ -80,13 +80,24 @@ export const getApproverShowText = (approveMethod :number, candidateStrategy: nu } } -export const copyerStr = (nodeConfig: any) => { - if (nodeConfig.nodeUserList.length != 0) { - return arrToStr(nodeConfig.nodeUserList) +export const copyerStr = ( candidateStrategy: number) => { + // if (nodeConfig.nodeUserList.length != 0) { + // return arrToStr(nodeConfig.nodeUserList) + // } else { + // if (nodeConfig.ccSelfSelectFlag == 1) { + // return '发起人自选' + // } + // } + console.log('candidateStrategy', candidateStrategy); + + if(candidateStrategy) { + const strategyText = getDictLabel( + DICT_TYPE.BPM_TASK_CANDIDATE_STRATEGY, + candidateStrategy + ) + return `抄送人类型:按${strategyText}` } else { - if (nodeConfig.ccSelfSelectFlag == 1) { - return '发起人自选' - } + return '' } } export const conditionStr = (nodeConfig, index) => { diff --git a/src/components/SimpleProcessDesigner/theme/workflow.css b/src/components/SimpleProcessDesigner/theme/workflow.css index 19f1cb84..2b9e0daa 100644 --- a/src/components/SimpleProcessDesigner/theme/workflow.css +++ b/src/components/SimpleProcessDesigner/theme/workflow.css @@ -1163,11 +1163,7 @@ html { box-shadow: 0 0 6px 0 rgba(50, 150, 250, .3) } -.dingflow-design .auto-judge.active .close, -.dingflow-design .auto-judge:active .close, -.dingflow-design .auto-judge:hover .close { - display: block -} + .dingflow-design .auto-judge.error:after { border: 1px solid #f25643; @@ -1183,6 +1179,7 @@ html { line-height: 24px; width: 258px; } */ + .dingflow-design .title-wrapper { display: flex; justify-content: space-between; @@ -1195,18 +1192,39 @@ html { line-height: 24px; width: 220px; color: #fff; + padding-right: 10px; + padding-left: 10px; } + .dingflow-design .title-wrapper .editable-title { max-width: 120px; - padding-left: 10px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } -.dingflow-design .title-wrapper .close { - padding-right: 10px; + +.dingflow-design .title-wrapper .close { + display: none; + position: absolute; + right: 10px; + top: 2px; + width: 20px; + height: 20px; + font-size: 14px; + color:#fff; + border-radius: 50%; + text-align: center; + line-height: 20px; + z-index: 2 } +.dingflow-design .title-wrapper:hover .close { + display: block +} +/* .dingflow-design .title-wrapper .close { + padding-right: 2px; +} */ + /* .dingflow-design .title-wrapper .priority-title { display: inline-block; float: right; @@ -1233,21 +1251,6 @@ html { color: #bfbfbf } -.dingflow-design .auto-judge .close { - display: none; - position: absolute; - right: -10px; - top: -10px; - width: 20px; - height: 20px; - font-size: 14px; - color: rgba(0, 0, 0, .25); - border-radius: 50%; - text-align: center; - line-height: 20px; - z-index: 2 -} - .dingflow-design .auto-judge .content { font-size: 14px; color: #191f25; diff --git a/src/directives/index.ts b/src/directives/index.ts index 89cc8ba1..8fb6ff94 100644 --- a/src/directives/index.ts +++ b/src/directives/index.ts @@ -10,4 +10,16 @@ import { hasPermi } from './permission/hasPermi' export const setupAuth = (app: App) => { hasRole(app) hasPermi(app) + +} + +/** + * 导出指令:v-mountedFoucs + */ +export const setupMountedFoucs= (app: App) => { + app.directive('mountedFoucs', { + mounted(el) { + el.focus(); + } + }) } diff --git a/src/main.ts b/src/main.ts index 76c72473..24666be8 100644 --- a/src/main.ts +++ b/src/main.ts @@ -28,8 +28,8 @@ import '@/plugins/animate.css' // 路由 import router, { setupRouter } from '@/router' -// 权限 -import { setupAuth } from '@/directives' +// 其它指令 +import { setupAuth, setupMountedFoucs } from '@/directives' import { createApp } from 'vue' @@ -60,6 +60,8 @@ const setupAll = async () => { setupAuth(app) + setupMountedFoucs(app) + await router.isReady() app.use(VueDOMPurifyHTML) diff --git a/src/store/modules/simpleWorkflow.ts b/src/store/modules/simpleWorkflow.ts index dbeff606..c7c8abd4 100644 --- a/src/store/modules/simpleWorkflow.ts +++ b/src/store/modules/simpleWorkflow.ts @@ -6,11 +6,10 @@ export const useWorkFlowStore = defineStore('simpleWorkflow', { tableId: '', isTried: false, promoterDrawer: false, - flowPermission1: {}, approverDrawer: false, approverConfig1: {}, copyerDrawer: false, - copyerConfig1: {}, + copyerConfig: {}, conditionDrawer: false, conditionsConfig1: { conditionNodes: [] @@ -27,20 +26,17 @@ export const useWorkFlowStore = defineStore('simpleWorkflow', { setPromoter(payload) { this.promoterDrawer = payload }, - setFlowPermission(payload) { - this.flowPermission1 = payload - }, - setApprover(payload) { + setApproverDrawer(payload) { this.approverDrawer = payload }, setApproverConfig(payload) { this.approverConfig1 = payload }, - setCopyer(payload) { + setCopyerDrawer(payload) { this.copyerDrawer = payload }, setCopyerConfig(payload) { - this.copyerConfig1 = payload + this.copyerConfig = payload }, setCondition(payload) { this.conditionDrawer = payload diff --git a/src/views/bpm/simpleWorkflow/index.vue b/src/views/bpm/simpleWorkflow/index.vue index bf298996..5e215c1b 100644 --- a/src/views/bpm/simpleWorkflow/index.vue +++ b/src/views/bpm/simpleWorkflow/index.vue @@ -24,10 +24,12 @@ +