Skip to content

Commit cc14963

Browse files
YunaiVYunaiV
committed
BPM：增加流程表达式的管理
1 parent 7218e71 commit cc14963

File tree

8 files changed

+426
-12
lines changed

8 files changed

+426
-12
lines changed

‎src/api/bpm/processExpression/index.ts

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import request from '@/config/axios'
2+
3+
// BPM 流程表达式 VO
4+
export interface ProcessExpressionVO {
5+
id: number // 编号
6+
name: string // 表达式名字
7+
status: number // 表达式状态
8+
expression: string // 表达式
9+
}
10+
11+
// BPM 流程表达式 API
12+
export const ProcessExpressionApi = {
13+
// 查询BPM 流程表达式分页
14+
getProcessExpressionPage: async (params: any) => {
15+
return await request.get({ url: `/bpm/process-expression/page`, params })
16+
},
17+
18+
// 查询BPM 流程表达式详情
19+
getProcessExpression: async (id: number) => {
20+
return await request.get({ url: `/bpm/process-expression/get?id=` + id })
21+
},
22+
23+
// 新增BPM 流程表达式
24+
createProcessExpression: async (data: ProcessExpressionVO) => {
25+
return await request.post({ url: `/bpm/process-expression/create`, data })
26+
},
27+
28+
// 修改BPM 流程表达式
29+
updateProcessExpression: async (data: ProcessExpressionVO) => {
30+
return await request.put({ url: `/bpm/process-expression/update`, data })
31+
},
32+
33+
// 删除BPM 流程表达式
34+
deleteProcessExpression: async (id: number) => {
35+
return await request.delete({ url: `/bpm/process-expression/delete?id=` + id })
36+
},
37+
38+
// 导出BPM 流程表达式 Excel
39+
exportProcessExpression: async (params) => {
40+
return await request.download({ url: `/bpm/process-expression/export-excel`, params })
41+
}
42+
}

‎src/components/bpmnProcessDesigner/package/penal/listeners/ElementListeners.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -250,7 +250,7 @@
250250
</div>
251251

252252
<!-- 选择弹窗 -->
253-
<ProcessListenerDialog ref="processListenerDialogRef" @select="selectListener" />
253+
<ProcessListenerDialog ref="processListenerDialogRef" @select="selectProcessListener" />
254254
</template>
255255
<script lang="ts" setup>
256256
import { ElMessageBox } from 'element-plus'
@@ -417,7 +417,7 @@ const processListenerDialogRef = ref()
417417
const openProcessListenerDialog = async () => {
418418
processListenerDialogRef.value.open('execution')
419419
}
420-
const selectListener = (listener) => {
420+
const selectProcessListener = (listener) => {
421421
const listenerForm = initListenerForm2(listener)
422422
const listenerObject = createListenerObject(listenerForm, false, prefix)
423423
bpmnElementListeners.value.push(listenerObject)

‎src/components/bpmnProcessDesigner/package/penal/listeners/ProcessListenerDialog.vue

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,6 @@
99
<dict-tag :type="DICT_TYPE.BPM_PROCESS_LISTENER_TYPE" :value="scope.row.type" />
1010
</template>
1111
</el-table-column>
12-
<el-table-column label="状态" align="center" prop="status">
13-
<template #default="scope">
14-
<dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
15-
</template>
16-
</el-table-column>
1712
<el-table-column label="事件" align="center" prop="event" />
1813
<el-table-column label="值类型" align="center" prop="valueType">
1914
<template #default="scope">

‎src/components/bpmnProcessDesigner/package/penal/listeners/UserTaskListeners.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -295,7 +295,7 @@
295295
</div>
296296

297297
<!-- 选择弹窗 -->
298-
<ProcessListenerDialog ref="processListenerDialogRef" @select="selectListener" />
298+
<ProcessListenerDialog ref="processListenerDialogRef" @select="selectProcessListener" />
299299
</template>
300300
<script lang="ts" setup>
301301
import { ElMessageBox } from 'element-plus'
@@ -460,7 +460,7 @@ const processListenerDialogRef = ref()
460460
const openProcessListenerDialog = async () => {
461461
processListenerDialogRef.value.open('task')
462462
}
463-
const selectListener = (listener) => {
463+
const selectProcessListener = (listener) => {
464464
const listenerForm = initListenerForm2(listener)
465465
const listenerObject = createListenerObject(listenerForm, true, prefix)
466466
bpmnElementListeners.value.push(listenerObject)

‎src/components/bpmnProcessDesigner/package/penal/task/task-components/ProcessExpressionDialog.vue

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
<!-- 表达式选择 -->
2+
<template>
3+
<Dialog title="请选择表达式" v-model="dialogVisible" width="1024px">
4+
<ContentWrap>
5+
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
6+
<el-table-column label="名字" align="center" prop="name" />
7+
<el-table-column label="表达式" align="center" prop="expression" />
8+
<el-table-column label="操作" align="center">
9+
<template #default="scope">
10+
<el-button link type="primary" @click="select(scope.row)"> 选择 </el-button>
11+
</template>
12+
</el-table-column>
13+
</el-table>
14+
<!-- 分页 -->
15+
<Pagination
16+
:total="total"
17+
v-model:page="queryParams.pageNo"
18+
v-model:limit="queryParams.pageSize"
19+
@pagination="getList"
20+
/>
21+
</ContentWrap>
22+
</Dialog>
23+
</template>
24+
<script setup lang="ts">
25+
import { CommonStatusEnum } from '@/utils/constants'
26+
import { ProcessExpressionApi, ProcessExpressionVO } from '@/api/bpm/processExpression'
27+
28+
/** BPM 流程 表单 */
29+
defineOptions({ name: 'ProcessExpressionDialog' })
30+
31+
const { t } = useI18n() // 国际化
32+
const message = useMessage() // 消息弹窗
33+
34+
const dialogVisible = ref(false) // 弹窗的是否展示
35+
const loading = ref(true) // 列表的加载中
36+
const list = ref<ProcessExpressionVO[]>([]) // 列表的数据
37+
const total = ref(0) // 列表的总页数
38+
const queryParams = reactive({
39+
pageNo: 1,
40+
pageSize: 10,
41+
type: undefined,
42+
status: CommonStatusEnum.ENABLE
43+
})
44+
45+
/** 打开弹窗 */
46+
const open = async (type: string) => {
47+
dialogVisible.value = true
48+
loading.value = true
49+
try {
50+
queryParams.pageNo = 1
51+
queryParams.type = type
52+
const data = await ProcessExpressionApi.getProcessExpressionPage(queryParams)
53+
list.value = data.list
54+
total.value = data.total
55+
} finally {
56+
loading.value = false
57+
}
58+
}
59+
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
60+
61+
/** 提交表单 */
62+
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
63+
const select = async (row) => {
64+
dialogVisible.value = false
65+
// 发送操作成功的事件
66+
emit('select', row)
67+
}
68+
</script>

‎src/components/bpmnProcessDesigner/package/penal/task/task-components/UserTask.vue

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
v-model="userTaskForm.candidateStrategy"
66
clearable
77
style="width: 100%"
8-
@change="changecandidateStrategy"
8+
@change="changeCandidateStrategy"
99
>
1010
<el-option
1111
v-for="dict in getIntDictOptions(DICT_TYPE.BPM_TASK_CANDIDATE_STRATEGY)"
@@ -114,9 +114,14 @@
114114
type="textarea"
115115
v-model="userTaskForm.candidateParam[0]"
116116
clearable
117-
style="width: 100%"
117+
style="width: 72%"
118118
@change="updateElementTask"
119119
/>
120+
<el-button class="ml-5px" size="small" type="success" @click="openProcessExpressionDialog"
121+
>选择表达式</el-button
122+
>
123+
<!-- 选择弹窗 -->
124+
<ProcessExpressionDialog ref="processExpressionDialogRef" @select="selectProcessExpression" />
120125
</el-form-item>
121126
</el-form>
122127
</template>
@@ -129,6 +134,7 @@ import * as DeptApi from '@/api/system/dept'
129134
import * as PostApi from '@/api/system/post'
130135
import * as UserApi from '@/api/system/user'
131136
import * as UserGroupApi from '@/api/bpm/userGroup'
137+
import ProcessExpressionDialog from './ProcessExpressionDialog.vue'
132138
133139
defineOptions({ name: 'UserTask' })
134140
const props = defineProps({
@@ -173,7 +179,7 @@ const resetTaskForm = () => {
173179
}
174180
175181
/** 更新 candidateStrategy 字段时，需要清空 candidateParam，并触发 bpmn 图更新 */
176-
const changecandidateStrategy = () => {
182+
const changeCandidateStrategy = () => {
177183
userTaskForm.value.candidateParam = []
178184
updateElementTask()
179185
}
@@ -186,6 +192,15 @@ const updateElementTask = () => {
186192
})
187193
}
188194
195+
// 打开监听器弹窗
196+
const processExpressionDialogRef = ref()
197+
const openProcessExpressionDialog = async () => {
198+
processExpressionDialogRef.value.open()
199+
}
200+
const selectProcessExpression = (expression) => {
201+
userTaskForm.value.candidateParam = [expression.expression]
202+
}
203+
189204
watch(
190205
() => props.id,
191206
() => {

‎src/views/bpm/processExpression/ProcessExpressionForm.vue

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
<template>
2+
<Dialog :title="dialogTitle" v-model="dialogVisible">
3+
<el-form
4+
ref="formRef"
5+
:model="formData"
6+
:rules="formRules"
7+
label-width="100px"
8+
v-loading="formLoading"
9+
>
10+
<el-form-item label="名字" prop="name">
11+
<el-input v-model="formData.name" placeholder="请输入名字" />
12+
</el-form-item>
13+
<el-form-item label="状态" prop="status">
14+
<el-radio-group v-model="formData.status">
15+
<el-radio
16+
v-for="dict in getIntDictOptions(DICT_TYPE.COMMON_STATUS)"
17+
:key="dict.value"
18+
:label="dict.value"
19+
>
20+
{{ dict.label }}
21+
</el-radio>
22+
</el-radio-group>
23+
</el-form-item>
24+
<el-form-item label="表达式" prop="expression">
25+
<el-input type="textarea" v-model="formData.expression" placeholder="请输入表达式" />
26+
</el-form-item>
27+
</el-form>
28+
<template #footer>
29+
<el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
30+
<el-button @click="dialogVisible = false">取 消</el-button>
31+
</template>
32+
</Dialog>
33+
</template>
34+
<script setup lang="ts">
35+
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
36+
import { ProcessExpressionApi, ProcessExpressionVO } from '@/api/bpm/processExpression'
37+
import { CommonStatusEnum } from '@/utils/constants'
38+
39+
/** BPM 流程 表单 */
40+
defineOptions({ name: 'ProcessExpressionForm' })
41+
42+
const { t } = useI18n() // 国际化
43+
const message = useMessage() // 消息弹窗
44+
45+
const dialogVisible = ref(false) // 弹窗的是否展示
46+
const dialogTitle = ref('') // 弹窗的标题
47+
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
48+
const formType = ref('') // 表单的类型：create - 新增；update - 修改
49+
const formData = ref({
50+
id: undefined,
51+
name: undefined,
52+
status: undefined,
53+
expression: undefined
54+
})
55+
const formRules = reactive({
56+
name: [{ required: true, message: '名字不能为空', trigger: 'blur' }],
57+
status: [{ required: true, message: '状态不能为空', trigger: 'blur' }],
58+
expression: [{ required: true, message: '表达式不能为空', trigger: 'blur' }]
59+
})
60+
const formRef = ref() // 表单 Ref
61+
62+
/** 打开弹窗 */
63+
const open = async (type: string, id?: number) => {
64+
dialogVisible.value = true
65+
dialogTitle.value = t('action.' + type)
66+
formType.value = type
67+
resetForm()
68+
// 修改时，设置数据
69+
if (id) {
70+
formLoading.value = true
71+
try {
72+
formData.value = await ProcessExpressionApi.getProcessExpression(id)
73+
} finally {
74+
formLoading.value = false
75+
}
76+
}
77+
}
78+
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
79+
80+
/** 提交表单 */
81+
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
82+
const submitForm = async () => {
83+
// 校验表单
84+
await formRef.value.validate()
85+
// 提交请求
86+
formLoading.value = true
87+
try {
88+
const data = formData.value as unknown as ProcessExpressionVO
89+
if (formType.value === 'create') {
90+
await ProcessExpressionApi.createProcessExpression(data)
91+
message.success(t('common.createSuccess'))
92+
} else {
93+
await ProcessExpressionApi.updateProcessExpression(data)
94+
message.success(t('common.updateSuccess'))
95+
}
96+
dialogVisible.value = false
97+
// 发送操作成功的事件
98+
emit('success')
99+
} finally {
100+
formLoading.value = false
101+
}
102+
}
103+
104+
/** 重置表单 */
105+
const resetForm = () => {
106+
formData.value = {
107+
id: undefined,
108+
name: undefined,
109+
status: CommonStatusEnum.ENABLE,
110+
expression: undefined
111+
}
112+
formRef.value?.resetFields()
113+
}
114+
</script>

0 commit comments

Comments
 (0)