From a91be61c217aa1c65f6ba01ce26f54ba0a368e38 Mon Sep 17 00:00:00 2001
From: jason <2667446@qq.com>
Date: Thu, 18 Dec 2025 23:25:37 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20[bpm][ele]=20bpmn=20=E8=AE=BE=E8=AE=A1?=
 =?UTF-8?q?=E5=99=A8=E6=B5=81=E7=A8=8B=E8=A1=A8=E8=BE=BE=E5=BC=8F=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9=E5=BC=B9=E7=AA=97=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bpm/processExpression/components/index.ts |  1 +
 .../components/select-modal.vue               | 92 +++++++++++++++++++
 2 files changed, 93 insertions(+)
 create mode 100644 apps/web-ele/src/views/bpm/processExpression/components/index.ts
 create mode 100644 apps/web-ele/src/views/bpm/processExpression/components/select-modal.vue

diff --git a/apps/web-ele/src/views/bpm/processExpression/components/index.ts b/apps/web-ele/src/views/bpm/processExpression/components/index.ts
new file mode 100644
index 000000000..4047767df
--- /dev/null
+++ b/apps/web-ele/src/views/bpm/processExpression/components/index.ts
@@ -0,0 +1 @@
+export { default as ProcessExpressionSelectModal } from './select-modal.vue';
diff --git a/apps/web-ele/src/views/bpm/processExpression/components/select-modal.vue b/apps/web-ele/src/views/bpm/processExpression/components/select-modal.vue
new file mode 100644
index 000000000..dc1fb4984
--- /dev/null
+++ b/apps/web-ele/src/views/bpm/processExpression/components/select-modal.vue
@@ -0,0 +1,92 @@
+<script lang="ts" setup>
+import type { VxeGridPropTypes } from '#/adapter/vxe-table';
+import type { BpmProcessExpressionApi } from '#/api/bpm/processExpression';
+
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { CommonStatusEnum } from '@vben/constants';
+
+import { TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
+import { getProcessExpressionPage } from '#/api/bpm/processExpression';
+
+defineOptions({ name: 'ProcessExpressionSelectModal' });
+
+const emit = defineEmits<{
+  select: [expression: BpmProcessExpressionApi.ProcessExpression];
+}>();
+
+// 查询参数
+const queryParams = ref({
+  status: CommonStatusEnum.ENABLE,
+});
+
+// 配置 VxeGrid
+const [Grid] = useVbenVxeGrid({
+  gridOptions: {
+    columns: [
+      { field: 'name', title: '名字', minWidth: 160 },
+      { field: 'expression', title: '表达式', minWidth: 260 },
+      {
+        field: 'action',
+        title: '操作',
+        width: 120,
+        slots: { default: 'action' },
+      },
+    ],
+    showOverflow: true,
+    minHeight: 300,
+    proxyConfig: {
+      ajax: {
+        // 查询表达式列表
+        query: async ({ page }) => {
+          return await getProcessExpressionPage({
+            pageNo: page.currentPage,
+            pageSize: page.pageSize,
+            status: queryParams.value.status,
+          });
+        },
+      },
+    } as VxeGridPropTypes.ProxyConfig,
+    rowConfig: {
+      keyField: 'id',
+      isHover: true,
+    },
+    toolbarConfig: {
+      enabled: false,
+    },
+  },
+});
+
+// 配置 Modal
+const [Modal, modalApi] = useVbenModal({
+  showConfirmButton: false,
+  destroyOnClose: true,
+});
+
+// 选择表达式
+function handleSelect(row: BpmProcessExpressionApi.ProcessExpression) {
+  emit('select', row);
+  modalApi.close();
+}
+</script>
+
+<template>
+  <Modal class="w-4/5" title="请选择表达式">
+    <Grid>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '选择',
+              type: 'primary',
+              link: true,
+              icon: 'lucide:pointer',
+              onClick: handleSelect.bind(null, row),
+            },
+          ]"
+        />
+      </template>
+    </Grid>
+  </Modal>
+</template>