houzhongjian
2024-08-08 820397e43a0b64d35c6d31d2a55475061438593b
提交 | 用户 | 时间
820397 1 <!-- 表达式选择 -->
H 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 dialogVisible = ref(false) // 弹窗的是否展示
32 const loading = ref(true) // 列表的加载中
33 const list = ref<ProcessExpressionVO[]>([]) // 列表的数据
34 const total = ref(0) // 列表的总页数
35 const queryParams = reactive({
36   pageNo: 1,
37   pageSize: 10,
38   type: '',
39   status: CommonStatusEnum.ENABLE
40 })
41
42 /** 打开弹窗 */
43 const open = (type: string) => {
44   queryParams.pageNo = 1
45   queryParams.type = type
46   getList()
47   dialogVisible.value = true
48 }
49 defineExpose({ open }) // 提供 open 方法,用于打开弹窗
50
51 /** 查询列表 */
52 const getList = async () => {
53   loading.value = true
54   try {
55     const data = await ProcessExpressionApi.getProcessExpressionPage(queryParams)
56     list.value = data.list
57     total.value = data.total
58   } finally {
59     loading.value = false
60   }
61 }
62
63 /** 提交表单 */
64 const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
65 const select = async (row) => {
66   dialogVisible.value = false
67   // 发送操作成功的事件
68   emit('select', row)
69 }
70 </script>