BPM：增加流程表达式的管理

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

@@ -250,7 +250,7 @@
   </div>
 
   <!-- 选择弹窗 -->
-  <ProcessListenerDialog ref="processListenerDialogRef" @select="selectListener" />
+  <ProcessListenerDialog ref="processListenerDialogRef" @select="selectProcessListener" />
 </template>
 <script lang="ts" setup>
 import { ElMessageBox } from 'element-plus'
@@ -417,7 +417,7 @@ const processListenerDialogRef = ref()
 const openProcessListenerDialog = async () => {
   processListenerDialogRef.value.open('execution')
 }
-const selectListener = (listener) => {
+const selectProcessListener = (listener) => {
   const listenerForm = initListenerForm2(listener)
   const listenerObject = createListenerObject(listenerForm, false, prefix)
   bpmnElementListeners.value.push(listenerObject)

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

@@ -9,11 +9,6 @@
             <dict-tag :type="DICT_TYPE.BPM_PROCESS_LISTENER_TYPE" :value="scope.row.type" />
           </template>
         </el-table-column>
-        <el-table-column label="状态" align="center" prop="status">
-          <template #default="scope">
-            <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
-          </template>
-        </el-table-column>
         <el-table-column label="事件" align="center" prop="event" />
         <el-table-column label="值类型" align="center" prop="valueType">
           <template #default="scope">

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

@@ -295,7 +295,7 @@
   </div>
 
   <!-- 选择弹窗 -->
-  <ProcessListenerDialog ref="processListenerDialogRef" @select="selectListener" />
+  <ProcessListenerDialog ref="processListenerDialogRef" @select="selectProcessListener" />
 </template>
 <script lang="ts" setup>
 import { ElMessageBox } from 'element-plus'
@@ -460,7 +460,7 @@ const processListenerDialogRef = ref()
 const openProcessListenerDialog = async () => {
   processListenerDialogRef.value.open('task')
 }
-const selectListener = (listener) => {
+const selectProcessListener = (listener) => {
   const listenerForm = initListenerForm2(listener)
   const listenerObject = createListenerObject(listenerForm, true, prefix)
   bpmnElementListeners.value.push(listenerObject)

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

@@ -0,0 +1,68 @@
+<!-- 表达式选择 -->
+<template>
+  <Dialog title="请选择表达式" v-model="dialogVisible" width="1024px">
+    <ContentWrap>
+      <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+        <el-table-column label="名字" align="center" prop="name" />
+        <el-table-column label="表达式" align="center" prop="expression" />
+        <el-table-column label="操作" align="center">
+          <template #default="scope">
+            <el-button link type="primary" @click="select(scope.row)"> 选择 </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 分页 -->
+      <Pagination
+        :total="total"
+        v-model:page="queryParams.pageNo"
+        v-model:limit="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </ContentWrap>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import { CommonStatusEnum } from '@/utils/constants'
+import { ProcessExpressionApi, ProcessExpressionVO } from '@/api/bpm/processExpression'
+
+/** BPM 流程 表单 */
+defineOptions({ name: 'ProcessExpressionDialog' })
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const dialogVisible = ref(false) // 弹窗的是否展示
+const loading = ref(true) // 列表的加载中
+const list = ref<ProcessExpressionVO[]>([]) // 列表的数据
+const total = ref(0) // 列表的总页数
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  type: undefined,
+  status: CommonStatusEnum.ENABLE
+})
+
+/** 打开弹窗 */
+const open = async (type: string) => {
+  dialogVisible.value = true
+  loading.value = true
+  try {
+    queryParams.pageNo = 1
+    queryParams.type = type
+    const data = await ProcessExpressionApi.getProcessExpressionPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const select = async (row) => {
+  dialogVisible.value = false
+  // 发送操作成功的事件
+  emit('select', row)
+}
+</script>

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

@@ -5,7 +5,7 @@
         v-model="userTaskForm.candidateStrategy"
         clearable
         style="width: 100%"
-        @change="changecandidateStrategy"
+        @change="changeCandidateStrategy"
       >
         <el-option
           v-for="dict in getIntDictOptions(DICT_TYPE.BPM_TASK_CANDIDATE_STRATEGY)"
@@ -114,9 +114,14 @@
         type="textarea"
         v-model="userTaskForm.candidateParam[0]"
         clearable
-        style="width: 100%"
+        style="width: 72%"
         @change="updateElementTask"
       />
+      <el-button class="ml-5px" size="small" type="success" @click="openProcessExpressionDialog"
+        >选择表达式</el-button
+      >
+      <!-- 选择弹窗 -->
+      <ProcessExpressionDialog ref="processExpressionDialogRef" @select="selectProcessExpression" />
     </el-form-item>
   </el-form>
 </template>
@@ -129,6 +134,7 @@ import * as DeptApi from '@/api/system/dept'
 import * as PostApi from '@/api/system/post'
 import * as UserApi from '@/api/system/user'
 import * as UserGroupApi from '@/api/bpm/userGroup'
+import ProcessExpressionDialog from './ProcessExpressionDialog.vue'
 
 defineOptions({ name: 'UserTask' })
 const props = defineProps({
@@ -173,7 +179,7 @@ const resetTaskForm = () => {
 }
 
 /** 更新 candidateStrategy 字段时，需要清空 candidateParam，并触发 bpmn 图更新 */
-const changecandidateStrategy = () => {
+const changeCandidateStrategy = () => {
   userTaskForm.value.candidateParam = []
   updateElementTask()
 }
@@ -186,6 +192,15 @@ const updateElementTask = () => {
   })
 }
 
+// 打开监听器弹窗
+const processExpressionDialogRef = ref()
+const openProcessExpressionDialog = async () => {
+  processExpressionDialogRef.value.open()
+}
+const selectProcessExpression = (expression) => {
+  userTaskForm.value.candidateParam = [expression.expression]
+}
+
 watch(
   () => props.id,
   () => {