Skip to content

Commit 16a98e5

Browse files
YunaiVYunaiV
committed
2 parents 8d9d9e7 + e75dbd6 commit 16a98e5

File tree

17 files changed

+574
-126
lines changed

17 files changed

+574
-126
lines changed

‎src/components/DeptSelectForm/index.vue‎

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
<template>
2+
<Dialog v-model="dialogVisible" title="部门选择" width="600">
3+
<el-row v-loading="formLoading">
4+
<el-col :span="24">
5+
<ContentWrap class="h-1/1">
6+
<el-tree
7+
ref="treeRef"
8+
:data="deptTree"
9+
:props="defaultProps"
10+
show-checkbox
11+
:check-strictly="checkStrictly"
12+
check-on-click-node
13+
default-expand-all
14+
highlight-current
15+
node-key="id"
16+
@check="handleCheck"
17+
/>
18+
</ContentWrap>
19+
</el-col>
20+
</el-row>
21+
<template #footer>
22+
<el-button
23+
:disabled="formLoading || !selectedDeptIds?.length"
24+
type="primary"
25+
@click="submitForm"
26+
>
27+
确 定
28+
</el-button>
29+
<el-button @click="dialogVisible = false">取 消</el-button>
30+
</template>
31+
</Dialog>
32+
</template>
33+
34+
<script lang="ts" setup>
35+
import { defaultProps, handleTree } from '@/utils/tree'
36+
import * as DeptApi from '@/api/system/dept'
37+
38+
defineOptions({ name: 'DeptSelectForm' })
39+
40+
const emit = defineEmits<{
41+
confirm: [deptList: any[]]
42+
}>()
43+
44+
const { t } = useI18n() // 国际化
45+
const message = useMessage() // 消息弹窗
46+
47+
const props = defineProps({
48+
// 是否严格的遵循父子不互相关联
49+
checkStrictly: {
50+
type: Boolean,
51+
default: false
52+
},
53+
// 是否支持多选
54+
multiple: {
55+
type: Boolean,
56+
default: true
57+
}
58+
})
59+
60+
const treeRef = ref()
61+
const deptTree = ref<Tree[]>([]) // 部门树形结构
62+
const selectedDeptIds = ref<number[]>([]) // 选中的部门 ID 列表
63+
const dialogVisible = ref(false) // 弹窗的是否展示
64+
const formLoading = ref(false) // 表单的加载中
65+
66+
/** 打开弹窗 */
67+
const open = async (selectedList?: DeptApi.DeptVO[]) => {
68+
resetForm()
69+
formLoading.value = true
70+
try {
71+
// 加载部门列表
72+
const deptData = await DeptApi.getSimpleDeptList()
73+
deptTree.value = handleTree(deptData)
74+
} finally {
75+
formLoading.value = false
76+
}
77+
dialogVisible.value = true
78+
// 设置已选择的部门
79+
if (selectedList?.length) {
80+
await nextTick()
81+
const selectedIds = selectedList
82+
.map((dept) => dept.id)
83+
.filter((id): id is number => id !== undefined)
84+
selectedDeptIds.value = selectedIds
85+
treeRef.value?.setCheckedKeys(selectedIds)
86+
}
87+
}
88+
89+
/** 处理选中状态变化 */
90+
const handleCheck = (data: any, checked: any) => {
91+
selectedDeptIds.value = treeRef.value.getCheckedKeys()
92+
if (!props.multiple && selectedDeptIds.value.length > 1) {
93+
// 单选模式下，只保留最后选择的节点
94+
const lastSelectedId = selectedDeptIds.value[selectedDeptIds.value.length - 1]
95+
selectedDeptIds.value = [lastSelectedId]
96+
treeRef.value.setCheckedKeys([lastSelectedId])
97+
}
98+
}
99+
100+
/** 提交选择 */
101+
const submitForm = async () => {
102+
try {
103+
// 获取选中的完整部门数据
104+
const checkedNodes = treeRef.value.getCheckedNodes()
105+
message.success(t('common.updateSuccess'))
106+
dialogVisible.value = false
107+
emit('confirm', checkedNodes)
108+
} finally {
109+
}
110+
}
111+
112+
/** 重置表单 */
113+
const resetForm = () => {
114+
deptTree.value = []
115+
selectedDeptIds.value = []
116+
if (treeRef.value) {
117+
treeRef.value.setCheckedKeys([])
118+
}
119+
}
120+
121+
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
122+
</script>

‎src/components/SimpleProcessDesignerV2/src/NodeHandler.vue‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,7 @@ import {
9191
DEFAULT_CONDITION_GROUP_VALUE
9292
} from './consts'
9393
import { generateUUID } from '@/utils'
94+
import { cloneDeep } from 'lodash-es'
9495
9596
defineOptions({
9697
name: 'NodeHandler'
@@ -184,7 +185,7 @@ const addNode = (type: number) => {
184185
conditionSetting: {
185186
defaultFlow: false,
186187
conditionType: ConditionType.RULE,
187-
conditionGroups: DEFAULT_CONDITION_GROUP_VALUE
188+
conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE)
188189
}
189190
},
190191
{
@@ -242,7 +243,7 @@ const addNode = (type: number) => {
242243
conditionSetting: {
243244
defaultFlow: false,
244245
conditionType: ConditionType.RULE,
245-
conditionGroups: DEFAULT_CONDITION_GROUP_VALUE
246+
conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE)
246247
}
247248
},
248249
{

‎src/components/SimpleProcessDesignerV2/src/SimpleProcessDesigner.vue‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,11 @@ const props = defineProps({
5959
startUserIds: {
6060
type: Array,
6161
required: false
62+
},
63+
// 可发起流程的部门编号
64+
startDeptIds: {
65+
type: Array,
66+
required: false
6267
}
6368
})
6469
@@ -82,6 +87,7 @@ provide('deptList', deptOptions)
8287
provide('userGroupList', userGroupOptions)
8388
provide('deptTree', deptTreeOptions)
8489
provide('startUserIds', props.startUserIds)
90+
provide('startDeptIds', props.startDeptIds)
8591
provide('tasks', [])
8692
provide('processInstance', {})
8793
const message = useMessage() // 国际化

‎src/components/SimpleProcessDesignerV2/src/nodes-config/StartUserNodeConfig.vue‎

Lines changed: 57 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -25,21 +25,46 @@
2525
</template>
2626
<el-tabs type="border-card" v-model="activeTabName">
2727
<el-tab-pane label="权限" name="user">
28-
<el-text v-if="!startUserIds || startUserIds.length === 0"> 全部成员可以发起流程 </el-text>
29-
<el-text v-else-if="startUserIds.length == 1">
30-
{{ getUserNicknames(startUserIds) }} 可发起流程
31-
</el-text>
32-
<el-text v-else>
33-
<el-tooltip
34-
class="box-item"
35-
effect="dark"
36-
placement="top"
37-
:content="getUserNicknames(startUserIds)"
38-
>
39-
{{ getUserNicknames(startUserIds.slice(0, 2)) }} 等
40-
{{ startUserIds.length }} 人可发起流程
41-
</el-tooltip>
28+
<el-text
29+
v-if="
30+
(!startUserIds || startUserIds.length === 0) &&
31+
(!startDeptIds || startDeptIds.length === 0)
32+
"
33+
>
34+
全部成员可以发起流程
4235
</el-text>
36+
<div v-else-if="startUserIds && startUserIds.length > 0">
37+
<el-text v-if="startUserIds.length == 1">
38+
{{ getUserNicknames(startUserIds) }} 可发起流程
39+
</el-text>
40+
<el-text v-else>
41+
<el-tooltip
42+
class="box-item"
43+
effect="dark"
44+
placement="top"
45+
:content="getUserNicknames(startUserIds)"
46+
>
47+
{{ getUserNicknames(startUserIds.slice(0, 2)) }} 等
48+
{{ startUserIds.length }} 人可发起流程
49+
</el-tooltip>
50+
</el-text>
51+
</div>
52+
<div v-else-if="startDeptIds && startDeptIds.length > 0">
53+
<el-text v-if="startDeptIds.length == 1">
54+
{{ getDeptNames(startDeptIds) }} 可发起流程
55+
</el-text>
56+
<el-text v-else>
57+
<el-tooltip
58+
class="box-item"
59+
effect="dark"
60+
placement="top"
61+
:content="getDeptNames(startDeptIds)"
62+
>
63+
{{ getDeptNames(startDeptIds.slice(0, 2)) }} 等
64+
{{ startDeptIds.length }} 个部门可发起流程
65+
</el-tooltip>
66+
</el-text>
67+
</div>
4368
</el-tab-pane>
4469
<el-tab-pane label="表单字段权限" name="fields" v-if="formType === 10">
4570
<div class="field-setting-pane">
@@ -107,6 +132,7 @@
107132
import { SimpleFlowNode, NodeType, FieldPermissionType, START_USER_BUTTON_SETTING } from '../consts'
108133
import { useWatchNode, useDrawer, useNodeName, useFormFieldsPermission } from '../node'
109134
import * as UserApi from '@/api/system/user'
135+
import * as DeptApi from '@/api/system/dept'
110136
defineOptions({
111137
name: 'StartUserNodeConfig'
112138
})
@@ -118,8 +144,12 @@ const props = defineProps({
118144
})
119145
// 可发起流程的用户编号
120146
const startUserIds = inject<Ref<any[]>>('startUserIds')
147+
// 可发起流程的部门编号
148+
const startDeptIds = inject<Ref<any[]>>('startDeptIds')
121149
// 用户列表
122150
const userOptions = inject<Ref<UserApi.UserVO[]>>('userList')
151+
// 部门列表
152+
const deptOptions = inject<Ref<DeptApi.DeptVO[]>>('deptList')
123153
// 抽屉配置
124154
const { settingVisible, closeDrawer, openDrawer } = useDrawer()
125155
// 当前节点
@@ -145,6 +175,19 @@ const getUserNicknames = (userIds: number[]): string => {
145175
})
146176
return nicknames.join(',')
147177
}
178+
const getDeptNames = (deptIds: number[]): string => {
179+
if (!deptIds || deptIds.length === 0) {
180+
return ''
181+
}
182+
const deptNames: string[] = []
183+
deptIds.forEach((deptId) => {
184+
const found = deptOptions?.value.find((item) => item.id === deptId)
185+
if (found && found.name) {
186+
deptNames.push(found.name)
187+
}
188+
})
189+
return deptNames.join(',')
190+
}
148191
// 保存配置
149192
const saveConfig = async () => {
150193
activeTabName.value = 'user'

‎src/components/SimpleProcessDesignerV2/src/nodes-config/TriggerNodeConfig.vue‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -254,6 +254,7 @@ import {
254254
import { useWatchNode, useDrawer, useNodeName, useFormFields, getConditionShowText } from '../node'
255255
import HttpRequestSetting from './components/HttpRequestSetting.vue'
256256
import ConditionDialog from './components/ConditionDialog.vue'
257+
import { cloneDeep } from 'lodash-es'
257258
const { proxy } = getCurrentInstance() as any
258259
259260
defineOptions({
@@ -290,7 +291,7 @@ const configForm = ref<TriggerSetting>({
290291
},
291292
formSettings: [
292293
{
293-
conditionGroups: DEFAULT_CONDITION_GROUP_VALUE,
294+
conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE),
294295
updateFormFields: {},
295296
deleteFields: []
296297
}
@@ -346,7 +347,7 @@ const changeTriggerType = () => {
346347
? originalSetting.formSettings
347348
: [
348349
{
349-
conditionGroups: DEFAULT_CONDITION_GROUP_VALUE,
350+
conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE),
350351
updateFormFields: {},
351352
deleteFields: []
352353
}
@@ -361,7 +362,7 @@ const changeTriggerType = () => {
361362
? originalSetting.formSettings
362363
: [
363364
{
364-
conditionGroups: DEFAULT_CONDITION_GROUP_VALUE,
365+
conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE),
365366
updateFormFields: undefined,
366367
deleteFields: []
367368
}
@@ -374,7 +375,7 @@ const changeTriggerType = () => {
374375
/** 添加新的修改表单设置 */
375376
const addFormSetting = () => {
376377
configForm.value.formSettings!.push({
377-
conditionGroups: DEFAULT_CONDITION_GROUP_VALUE,
378+
conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE),
378379
updateFormFields: {},
379380
deleteFields: []
380381
})
@@ -509,7 +510,7 @@ const showTriggerNodeConfig = (node: SimpleFlowNode) => {
509510
},
510511
formSettings: node.triggerSetting.formSettings || [
511512
{
512-
conditionGroups: DEFAULT_CONDITION_GROUP_VALUE,
513+
conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE),
513514
updateFormFields: {},
514515
deleteFields: []
515516
}

‎src/components/SimpleProcessDesignerV2/src/nodes-config/components/Condition.vue‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,7 @@ import {
154154
} from '../../consts'
155155
import { BpmModelFormType } from '@/utils/constants'
156156
import { useFormFieldsAndStartUser } from '../../node'
157+
import { cloneDeep } from 'lodash-es'
157158
158159
const props = defineProps({
159160
modelValue: {
@@ -196,7 +197,7 @@ const formRef = ref() // 表单 Ref
196197
const changeConditionType = () => {
197198
if (condition.value.conditionType === ConditionType.RULE) {
198199
if (!condition.value.conditionGroups) {
199-
condition.value.conditionGroups = DEFAULT_CONDITION_GROUP_VALUE
200+
condition.value.conditionGroups = cloneDeep(DEFAULT_CONDITION_GROUP_VALUE)
200201
}
201202
}
202203
}

‎src/components/SimpleProcessDesignerV2/src/nodes-config/components/ConditionDialog.vue‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<!-- TODO @jason：有可能，它里面套 Condition 么？ -->
2-
<!-- TODO 怕影响其它节点功能，后面看看如何如何复用 Condtion -->
2+
<!-- TODO 怕影响其它节点功能，后面看看如何如何复用 Condtion -->
33
<template>
44
<Dialog v-model="dialogVisible" title="条件配置" width="600px" :fullscreen="false">
55
<div class="h-410px">
@@ -165,6 +165,7 @@ import {
165165
} from '../../consts'
166166
import { BpmModelFormType } from '@/utils/constants'
167167
import { useFormFieldsAndStartUser } from '../../node'
168+
import { cloneDeep } from 'lodash-es'
168169
defineOptions({
169170
name: 'ConditionDialog'
170171
})
@@ -175,7 +176,7 @@ const condition = ref<{
175176
conditionGroups?: ConditionGroup
176177
}>({
177178
conditionType: ConditionType.RULE,
178-
conditionGroups: DEFAULT_CONDITION_GROUP_VALUE
179+
conditionGroups: cloneDeep(DEFAULT_CONDITION_GROUP_VALUE)
179180
})
180181
181182
const emit = defineEmits<{
@@ -210,7 +211,7 @@ const formRef = ref() // 表单 Ref
210211
const changeConditionType = () => {
211212
if (condition.value.conditionType === ConditionType.RULE) {
212213
if (!condition.value.conditionGroups) {
213-
condition.value.conditionGroups = DEFAULT_CONDITION_GROUP_VALUE
214+
condition.value.conditionGroups = cloneDeep(DEFAULT_CONDITION_GROUP_VALUE)
214215
}
215216
}
216217
}

0 commit comments

Comments
 (0)