27
27
/>
28
28
</el-form-item >
29
29
<el-form-item label =" 流程分类" prop =" category" >
30
- <el-select v-model =" queryParams.category" placeholder =" 请选择" clearable >
30
+ <el-select
31
+ v-model =" queryParams.category"
32
+ placeholder =" 请选择流程分类"
33
+ clearable
34
+ class =" !w-240px"
35
+ >
31
36
<el-option
32
37
v-for =" dict in getIntDictOptions(DICT_TYPE.BPM_MODEL_CATEGORY)"
33
38
:key =" dict.value"
37
42
</el-select >
38
43
</el-form-item >
39
44
<el-form-item label =" 状态" prop =" status" >
40
- <el-select v-model =" queryParams.status" placeholder =" 请选择 " clearable >
45
+ <el-select v-model =" queryParams.status" placeholder =" 请选择状态 " clearable class = " !w-240px " >
41
46
<el-option
42
47
v-for =" dict in getIntDictOptions(DICT_TYPE.BPM_PROCESS_INSTANCE_STATUS)"
43
48
:key =" dict.value"
47
52
</el-select >
48
53
</el-form-item >
49
54
<el-form-item label =" 结果" prop =" result" >
50
- <el-select v-model =" queryParams.result" placeholder =" 请选择 " clearable >
55
+ <el-select v-model =" queryParams.result" placeholder =" 请选择结果 " clearable class = " !w-240px " >
51
56
<el-option
52
57
v-for =" dict in getIntDictOptions(DICT_TYPE.BPM_PROCESS_INSTANCE_RESULT)"
53
58
:key =" dict.value"
70
75
<el-form-item >
71
76
<el-button @click =" handleQuery" ><Icon icon =" ep:search" class =" mr-5px" /> 搜索</el-button >
72
77
<el-button @click =" resetQuery" ><Icon icon =" ep:refresh" class =" mr-5px" /> 重置</el-button >
78
+ <el-button
79
+ type =" primary"
80
+ plain
81
+ v-hasPermi =" ['bpm:process-instance:query']"
82
+ @click =" handleCreate"
83
+ >
84
+ 发起流程
85
+ </el-button >
73
86
</el-form-item >
74
87
</el-form >
75
- <el-col >
76
- <el-row >
77
- <el-col >
78
- <!-- 操作:新增 -->
79
- <el-button
80
- type =" primary"
81
- v-hasPermi =" ['bpm:process-instance:query']"
82
- @click =" handleCreate"
83
- >发起流程</el-button
84
- >
85
- </el-col >
86
- </el-row >
87
- </el-col >
88
88
</ContentWrap >
89
89
90
90
<!-- 列表 -->
135
135
type =" primary"
136
136
v-hasPermi =" ['bpm:process-instance:cancel']"
137
137
@click =" handleDetail(scope.row)"
138
- >详情</el-button
139
138
>
139
+ 详情
140
+ </el-button >
140
141
<el-button
141
142
link
142
143
type =" primary"
143
144
v-if =" scope.row.result === 1"
144
145
v-hasPermi =" ['bpm:process-instance:query']"
145
146
@click =" handleCancel(scope.row)"
146
- >取消</el-button
147
147
>
148
+ 取消
149
+ </el-button >
148
150
</template >
149
151
</el-table-column >
150
152
</el-table >
158
160
</ContentWrap >
159
161
</template >
160
162
<script setup lang="ts">
161
- // 全局相关的 import
162
- import { ElMessageBox } from ' element-plus'
163
163
import { DICT_TYPE , getIntDictOptions } from ' @/utils/dict'
164
-
165
- // 业务相关的 import
166
- import * as ProcessInstanceApi from ' @/api/bpm/processInstance'
167
- // import { allSchemas } from './process.data'
168
164
import { dateFormatter } from ' @/utils/formatTime'
165
+ import { ElMessageBox } from ' element-plus'
166
+ import * as ProcessInstanceApi from ' @/api/bpm/processInstance'
167
+ const router = useRouter () // 路由
168
+ const message = useMessage () // 消息弹窗
169
+ const { t } = useI18n () // 国际化
170
+
169
171
const loading = ref (true ) // 列表的加载中
170
172
const total = ref (0 ) // 列表的总页数
171
173
const list = ref ([]) // 列表的数据
@@ -179,10 +181,8 @@ const queryParams = reactive({
179
181
result: undefined ,
180
182
createTime: []
181
183
})
182
- const router = useRouter () // 路由
183
- const message = useMessage () // 消息弹窗
184
- const { t } = useI18n () // 国际化
185
184
const queryFormRef = ref () // 搜索的表单
185
+
186
186
/** 查询列表 */
187
187
const getList = async () => {
188
188
loading .value = true
@@ -194,6 +194,7 @@ const getList = async () => {
194
194
loading .value = false
195
195
}
196
196
}
197
+
197
198
/** 搜索按钮操作 */
198
199
const handleQuery = () => {
199
200
queryParams .pageNo = 1
@@ -205,11 +206,6 @@ const resetQuery = () => {
205
206
queryFormRef .value .resetFields ()
206
207
handleQuery ()
207
208
}
208
- // ========== 列表相关 ==========
209
- // const [reload] = useXTable({
210
- // allSchemas: allSchemas,
211
- // getListApi: ProcessInstanceApi.getMyProcessInstancePage
212
- // })
213
209
214
210
/** 发起流程操作 **/
215
211
const handleCreate = () => {
@@ -218,7 +214,7 @@ const handleCreate = () => {
218
214
})
219
215
}
220
216
221
- // 列表操作
217
+ /** 查看详情 */
222
218
const handleDetail = (row ) => {
223
219
router .push ({
224
220
name: ' BpmProcessInstanceDetail' ,
@@ -229,18 +225,21 @@ const handleDetail = (row) => {
229
225
}
230
226
231
227
/** 取消按钮操作 */
232
- const handleCancel = (row ) => {
233
- ElMessageBox .prompt (' 请输入取消原因' , ' 取消流程' , {
228
+ const handleCancel = async (row ) => {
229
+ // 二次确认
230
+ const { value } = await ElMessageBox .prompt (' 请输入取消原因' , ' 取消流程' , {
234
231
confirmButtonText: t (' common.ok' ),
235
232
cancelButtonText: t (' common.cancel' ),
236
233
inputPattern: / ^ [\s\S ] * . * \S [\s\S ] * $ / , // 判断非空,且非空格
237
234
inputErrorMessage: ' 取消原因不能为空'
238
- }).then (async ({ value }) => {
239
- await ProcessInstanceApi .cancelProcessInstance (row .id , value )
240
- message .success (' 取消成功' )
241
- // reload()
242
235
})
236
+ // 发起取消
237
+ await ProcessInstanceApi .cancelProcessInstance (row .id , value )
238
+ message .success (' 取消成功' )
239
+ // 刷新列表
240
+ await getList ()
243
241
}
242
+
244
243
/** 初始化 **/
245
244
onMounted (() => {
246
245
getList ()
0 commit comments