| | |
| | | </el-row> |
| | | </template> |
| | | |
| | | <el-table v-loading="loading" :data="processInstanceList" @selection-change="handleSelectionChange"> |
| | | <el-table v-loading="loading" border :data="processInstanceList" @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="55" align="center" /> |
| | | <el-table-column fixed align="center" type="index" label="序号" width="50"></el-table-column> |
| | | <el-table-column v-if="false" fixed align="center" prop="id" label="id"></el-table-column> |
| | | <el-table-column fixed align="center" prop="processDefinitionName" label="流程定义名称"></el-table-column> |
| | | <el-table-column fixed align="center" prop="processDefinitionKey" label="流程定义KEY"></el-table-column> |
| | | <el-table-column align="center" type="index" label="序号" width="60"></el-table-column> |
| | | <el-table-column align="center" prop="processDefinitionName" label="流程定义名称"></el-table-column> |
| | | <el-table-column align="center" prop="processDefinitionKey" label="流程定义KEY"></el-table-column> |
| | | <el-table-column align="center" prop="processDefinitionVersion" label="版本号" width="90"> |
| | | <template #default="scope"> v{{ scope.row.processDefinitionVersion }}.0</template> |
| | | </el-table-column> |
| | |
| | | <el-tag v-else type="danger">挂起</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column align="center" prop="businessStatusName" label="流程状态" min-width="70"> |
| | | <el-table-column align="center" label="流程状态" min-width="70"> |
| | | <template #default="scope"> |
| | | <el-tag type="success">{{ scope.row.businessStatusName }}</el-tag> |
| | | </template> |
| | | <dict-tag :options="wf_business_status" :value="scope.row.businessStatus"></dict-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column align="center" prop="startTime" label="启动时间" width="160"></el-table-column> |
| | | <el-table-column v-if="tab === 'finish'" align="center" prop="endTime" label="结束时间" width="160"></el-table-column> |
| | | <el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width"> |
| | | <el-table-column label="操作" align="center" :width="tab === 'finish' ? '130' : '160'"> |
| | | <template #default="scope"> |
| | | <el-row :gutter="10" class="mb8"> |
| | | <el-col :span="1.5"> |
| | | <el-button link type="primary" size="small" icon="Document" @click="handleApprovalRecord(scope.row)">审批记录</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button link type="primary" size="small" icon="Delete" @click="handleDelete(scope.row)">删除</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row v-if="tab === 'running'" :gutter="10" class="mb8"> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | size="small" |
| | | icon="Sort" |
| | | @click="getProcessDefinitionHitoryList(scope.row.processDefinitionId, scope.row.processDefinitionKey)" |
| | | >切换版本</el-button |
| | | > |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-popover :ref="`popoverRef${scope.$index}`" trigger="click" placement="left" :width="300"> |
| | | <el-input v-model="deleteReason" resize="none" :rows="3" type="textarea" placeholder="请输入作废原因" /> |
| | |
| | | <el-button link type="primary" size="small" icon="CircleClose">作废</el-button> |
| | | </template> |
| | | </el-popover> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | link |
| | | type="primary" |
| | | size="small" |
| | | icon="Sort" |
| | | @click="getProcessDefinitionHitoryList(scope.row.processDefinitionId, scope.row.processDefinitionKey)" |
| | | >切换版本</el-button |
| | | > |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="10" class="mb8"> |
| | | <el-col :span="1.5"> |
| | | <el-button link type="primary" size="small" icon="View" @click="handleView(scope.row)">查看</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button link type="primary" size="small" icon="Delete" @click="handleDelete(scope.row)">删除</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | </template> |
| | |
| | | </el-row> |
| | | <el-dialog v-if="processDefinitionDialog.visible" v-model="processDefinitionDialog.visible" :title="processDefinitionDialog.title" width="70%"> |
| | | <el-table v-loading="loading" :data="processDefinitionHistoryList"> |
| | | <el-table-column fixed align="center" type="index" label="序号" width="50"></el-table-column> |
| | | <el-table-column fixed align="center" type="index" label="序号" width="60"></el-table-column> |
| | | <el-table-column fixed align="center" prop="name" label="流程定义名称"></el-table-column> |
| | | <el-table-column align="center" prop="key" label="标识Key"></el-table-column> |
| | | <el-table-column align="center" prop="version" label="版本号" width="90"> |
| | |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-dialog> |
| | | <!-- 审批记录 --> |
| | | <approvalRecord ref="approvalRecordRef" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts" setup> |
| | | import { |
| | | getProcessInstanceRunningByPage, |
| | | getProcessInstanceFinishByPage, |
| | | deleteRuntimeProcessAndHisInst, |
| | | deleteFinishProcessAndHisInst, |
| | | deleteRuntimeProcessInst |
| | | getPageByRunning, |
| | | getPageByFinish, |
| | | deleteRunAndHisInstance, |
| | | deleteFinishAndHisInstance, |
| | | deleteRunInstance |
| | | } from '@/api/workflow/processInstance'; |
| | | import { getProcessDefinitionListByKey, migrationProcessDefinition } from '@/api/workflow/processDefinition'; |
| | | import ApprovalRecord from '@/components/Process/approvalRecord.vue'; |
| | | import { getListByKey, migrationDefinition } from '@/api/workflow/processDefinition'; |
| | | import { listCategory } from '@/api/workflow/category'; |
| | | import { CategoryVO } from '@/api/workflow/category/types'; |
| | | import { ProcessInstanceQuery, ProcessInstanceVO } from '@/api/workflow/processInstance/types'; |
| | | import workflowCommon from '@/api/workflow/workflowCommon'; |
| | | import { RouterJumpVo } from '@/api/workflow/workflowCommon/types'; |
| | | //审批记录组件 |
| | | const approvalRecordRef = ref<InstanceType<typeof ApprovalRecord>>(); |
| | | const { proxy } = getCurrentInstance() as ComponentInternalInstance; |
| | | const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status')); |
| | | const queryFormRef = ref<ElFormInstance>(); |
| | | const categoryTreeRef = ref<ElTreeInstance>(); |
| | | |
| | |
| | | categoryCode: undefined |
| | | }); |
| | | |
| | | onMounted(() => { |
| | | getProcessInstanceRunningList(); |
| | | getTreeselect(); |
| | | }); |
| | | |
| | | /** 节点单击事件 */ |
| | | const handleNodeClick = (data: CategoryVO) => { |
| | | queryParams.value.categoryCode = data.categoryCode; |
| | |
| | | categoryOptions.value.push(data); |
| | | }; |
| | | |
| | | //审批记录 |
| | | const handleApprovalRecord = (row: any) => { |
| | | if (approvalRecordRef.value) { |
| | | approvalRecordRef.value.init(row.id); |
| | | } |
| | | }; |
| | | /** 搜索按钮操作 */ |
| | | const handleQuery = () => { |
| | | if ('running' === tab.value) { |
| | |
| | | //分页 |
| | | const getProcessInstanceRunningList = () => { |
| | | loading.value = true; |
| | | getProcessInstanceRunningByPage(queryParams.value).then((resp) => { |
| | | getPageByRunning(queryParams.value).then((resp) => { |
| | | processInstanceList.value = resp.rows; |
| | | total.value = resp.total; |
| | | loading.value = false; |
| | |
| | | //分页 |
| | | const getProcessInstanceFinishList = () => { |
| | | loading.value = true; |
| | | getProcessInstanceFinishByPage(queryParams.value).then((resp) => { |
| | | getPageByFinish(queryParams.value).then((resp) => { |
| | | processInstanceList.value = resp.rows; |
| | | total.value = resp.total; |
| | | loading.value = false; |
| | |
| | | await proxy?.$modal.confirm('是否确认删除id为【' + id + '】的数据项?'); |
| | | loading.value = true; |
| | | if ('running' === tab.value) { |
| | | await deleteRuntimeProcessAndHisInst(id).finally(() => (loading.value = false)); |
| | | await deleteRunAndHisInstance(id).finally(() => (loading.value = false)); |
| | | getProcessInstanceRunningList(); |
| | | } else { |
| | | await deleteFinishProcessAndHisInst(id).finally(() => (loading.value = false)); |
| | | await deleteFinishAndHisInstance(id).finally(() => (loading.value = false)); |
| | | getProcessInstanceFinishList(); |
| | | } |
| | | proxy?.$modal.msgSuccess('删除成功'); |
| | | }; |
| | | const changeTab = async (data: string) => { |
| | | processInstanceList.value = [] |
| | | queryParams.value.pageNum = 1; |
| | | if ('running' === data) { |
| | | getProcessInstanceRunningList(); |
| | |
| | | processInstanceId: row.id, |
| | | deleteReason: deleteReason.value |
| | | }; |
| | | await deleteRuntimeProcessInst(param).finally(() => (loading.value = false)); |
| | | await deleteRunInstance(param).finally(() => (loading.value = false)); |
| | | getProcessInstanceRunningList(); |
| | | proxy?.$modal.msgSuccess('操作成功'); |
| | | } |
| | |
| | | processDefinitionDialog.visible = true; |
| | | processDefinitionId.value = id; |
| | | loading.value = true; |
| | | getProcessDefinitionListByKey(key).then((resp) => { |
| | | getListByKey(key).then((resp) => { |
| | | if (resp.data && resp.data.length > 0) { |
| | | processDefinitionHistoryList.value = resp.data.filter((item: any) => item.id !== id); |
| | | } |
| | |
| | | const handleChange = async (id: string) => { |
| | | await proxy?.$modal.confirm('是否确认切换?'); |
| | | loading.value = true; |
| | | migrationProcessDefinition(processDefinitionId.value, id).then((resp) => { |
| | | migrationDefinition(processDefinitionId.value, id).then((resp) => { |
| | | proxy?.$modal.msgSuccess('操作成功'); |
| | | getProcessInstanceRunningList(); |
| | | processDefinitionDialog.visible = false; |
| | | loading.value = false; |
| | | }); |
| | | }; |
| | | /** 查看按钮操作 */ |
| | | const handleView = (row) => { |
| | | const routerJumpVo = reactive<RouterJumpVo>({ |
| | | wfDefinitionConfigVo: row.wfDefinitionConfigVo, |
| | | wfNodeConfigVo: row.wfNodeConfigVo, |
| | | businessKey: row.businessKey, |
| | | taskId: row.id, |
| | | type: 'view' |
| | | }); |
| | | workflowCommon.routerJump(routerJumpVo,proxy) |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | getProcessInstanceRunningList(); |
| | | getTreeselect(); |
| | | }); |
| | | </script> |