|
@@ -14,97 +14,69 @@
|
|
|
</template>
|
|
|
<!-- 当前审批任务 -->
|
|
|
<template #tasks_default="{ row }">
|
|
|
- <el-button
|
|
|
- v-for="task in row.tasks"
|
|
|
- :key="task.id"
|
|
|
- type="text"
|
|
|
- @click="handleFormDetail(task.id)"
|
|
|
- >
|
|
|
+ <el-button v-for="task in row.tasks" :key="task.id" type="text">
|
|
|
<span>{{ task.name }}</span>
|
|
|
</el-button>
|
|
|
</template>
|
|
|
<!-- 操作 -->
|
|
|
<template #actionbtns_default="{ row }">
|
|
|
+ <XButton preIcon="ep:view" :title="t('action.detail')" @click="handleDetail(row)" />
|
|
|
<XButton
|
|
|
- type="primary"
|
|
|
+ preIcon="ep:delete"
|
|
|
title="取消"
|
|
|
v-if="row.result === 1"
|
|
|
- preIcon="ep:delete"
|
|
|
@click="handleCancel(row)"
|
|
|
/>
|
|
|
- <XButton type="primary" title="详情" preIcon="ep:edit-pen" @click="handleDetail(row)" />
|
|
|
</template>
|
|
|
</XTable>
|
|
|
</ContentWrap>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
// 全局相关的 import
|
|
|
-import { ref } from 'vue'
|
|
|
-import { ElMessage, ElMessageBox } from 'element-plus'
|
|
|
-import { useXTable } from '@/hooks/web/useXTable'
|
|
|
-import { useRouter } from 'vue-router'
|
|
|
+import { ElMessageBox } from 'element-plus'
|
|
|
|
|
|
// 业务相关的 import
|
|
|
import * as ProcessInstanceApi from '@/api/bpm/processInstance'
|
|
|
-// import { decodeFields } from '@/utils/formGenerator' // TODO 芋艿:后续根据情况清理
|
|
|
import { allSchemas } from './process.data'
|
|
|
|
|
|
const router = useRouter() // 路由
|
|
|
+const message = useMessage() // 消息弹窗
|
|
|
+const { t } = useI18n() // 国际化
|
|
|
|
|
|
// ========== 列表相关 ==========
|
|
|
-const [registerTable] = useXTable({
|
|
|
+const [registerTable, { reload }] = useXTable({
|
|
|
allSchemas: allSchemas,
|
|
|
getListApi: ProcessInstanceApi.getMyProcessInstancePageApi
|
|
|
})
|
|
|
-// 流程表单的弹出框
|
|
|
-const detailOpen = ref(false)
|
|
|
-const detailForm = ref()
|
|
|
+
|
|
|
/** 发起流程操作 **/
|
|
|
const handleCreate = () => {
|
|
|
router.push({
|
|
|
name: 'BpmProcessInstanceCreate'
|
|
|
})
|
|
|
}
|
|
|
-/** 流程表单的详情按钮操作 */
|
|
|
-const handleFormDetail = (row) => {
|
|
|
- // 情况一:使用流程表单
|
|
|
- if (row.formId) {
|
|
|
- // 设置值 TODO 芋艿:动态表单做完后,需要测试下
|
|
|
- detailForm.value = {
|
|
|
- ...JSON.parse(row.formConf),
|
|
|
- fields: decodeFields([], row.formFields)
|
|
|
- }
|
|
|
- // 弹窗打开
|
|
|
- detailOpen.value = true
|
|
|
- // 情况二:使用业务表单
|
|
|
- } else if (row.formCustomCreatePath) {
|
|
|
- router.push({ path: row.formCustomCreatePath })
|
|
|
- }
|
|
|
-}
|
|
|
|
|
|
// 列表操作
|
|
|
const handleDetail = (row) => {
|
|
|
- console.log(row, 'row')
|
|
|
- router.push({ path: '/process-instance/detail', query: { id: row.id } })
|
|
|
+ router.push({
|
|
|
+ name: 'BpmProcessInstanceDetail',
|
|
|
+ query: {
|
|
|
+ id: row.processInstanceId
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
+
|
|
|
/** 取消按钮操作 */
|
|
|
const handleCancel = (row) => {
|
|
|
- const id = row.id
|
|
|
- ElMessageBox.prompt('请输入取消原因?', '取消流程', {
|
|
|
- type: 'warning',
|
|
|
- confirmButtonText: '确定',
|
|
|
- cancelButtonText: '取消',
|
|
|
+ ElMessageBox.prompt('请输入取消原因', '取消流程', {
|
|
|
+ confirmButtonText: t('common.ok'),
|
|
|
+ cancelButtonText: t('common.cancel'),
|
|
|
inputPattern: /^[\s\S]*.*\S[\s\S]*$/, // 判断非空,且非空格
|
|
|
inputErrorMessage: '取消原因不能为空'
|
|
|
+ }).then(async ({ value }) => {
|
|
|
+ await ProcessInstanceApi.cancelProcessInstanceApi(row.id, value)
|
|
|
+ message.success('取消成功')
|
|
|
+ reload()
|
|
|
})
|
|
|
- .then(({ value }) => {
|
|
|
- return ProcessInstanceApi.cancelProcessInstanceApi(id, value)
|
|
|
- })
|
|
|
- .then(() => {
|
|
|
- ElMessage({
|
|
|
- message: '取消成功',
|
|
|
- type: 'success'
|
|
|
- })
|
|
|
- })
|
|
|
}
|
|
|
</script>
|