From f9b459a3fefd5fab0ee8e19268adb9d9eadab2a7 Mon Sep 17 00:00:00 2001 From: dengzedong <dengzedong@email> Date: 星期二, 17 十二月 2024 18:16:58 +0800 Subject: [PATCH] 预测项setting的值修改最大输入长度为1000 --- src/views/bpm/processInstance/detail/ProcessInstanceTaskList.vue | 194 +++++++++++++++--------------------------------- 1 files changed, 61 insertions(+), 133 deletions(-) diff --git a/src/views/bpm/processInstance/detail/ProcessInstanceTaskList.vue b/src/views/bpm/processInstance/detail/ProcessInstanceTaskList.vue index f82e800..8690e58 100644 --- a/src/views/bpm/processInstance/detail/ProcessInstanceTaskList.vue +++ b/src/views/bpm/processInstance/detail/ProcessInstanceTaskList.vue @@ -1,85 +1,50 @@ <template> - <el-card v-loading="loading" class="box-card"> - <template #header> - <span class="el-icon-picture-outline">审批记录</span> - </template> - <el-col :offset="3" :span="17"> - <div class="block"> - <el-timeline> - <el-timeline-item - v-if="processInstance.endTime" - :type="getProcessInstanceTimelineItemType(processInstance)" - > - <p style="font-weight: 700"> - 结束流程:在 {{ formatDate(processInstance?.endTime) }} 结束 - <dict-tag - :type="DICT_TYPE.BPM_PROCESS_INSTANCE_STATUS" - :value="processInstance.status" - /> - </p> - </el-timeline-item> - <el-timeline-item - v-for="(item, index) in tasks" - :key="index" - :type="getTaskTimelineItemType(item)" - > - <p style="font-weight: 700"> - 审批任务:{{ item.name }} - <dict-tag :type="DICT_TYPE.BPM_TASK_STATUS" :value="item.status" /> - <el-button - class="ml-10px" - v-if="!isEmpty(item.children)" - @click="openChildrenTask(item)" - size="small" - > - <Icon icon="ep:memo" /> 子任务 - </el-button> - <el-button - class="ml-10px" - size="small" - v-if="item.formId > 0" - @click="handleFormDetail(item)" - > - <Icon icon="ep:document" /> 查看表单 - </el-button> - </p> - <el-card :body-style="{ padding: '10px' }"> - <label v-if="item.assigneeUser" style="margin-right: 30px; font-weight: normal"> - 审批人:{{ item.assigneeUser.nickname }} - <el-tag size="small" type="info">{{ item.assigneeUser.deptName }}</el-tag> - </label> - <label v-if="item.createTime" style="font-weight: normal">创建时间:</label> - <label style="font-weight: normal; color: #8a909c"> - {{ formatDate(item?.createTime) }} - </label> - <label v-if="item.endTime" style="margin-left: 30px; font-weight: normal"> - 审批时间: - </label> - <label v-if="item.endTime" style="font-weight: normal; color: #8a909c"> - {{ formatDate(item?.endTime) }} - </label> - <label v-if="item.durationInMillis" style="margin-left: 30px; font-weight: normal"> - 耗时: - </label> - <label v-if="item.durationInMillis" style="font-weight: normal; color: #8a909c"> - {{ formatPast2(item?.durationInMillis) }} - </label> - <p v-if="item.reason"> 审批建议:{{ item.reason }} </p> - </el-card> - </el-timeline-item> - <el-timeline-item type="success"> - <p style="font-weight: 700"> - 发起流程:【{{ processInstance.startUser?.nickname }}】在 - {{ formatDate(processInstance?.startTime) }} 发起【 {{ processInstance.name }} 】流程 - </p> - </el-timeline-item> - </el-timeline> - </div> - </el-col> - </el-card> + <el-table :data="tasks" border header-cell-class-name="table-header-gray"> + <el-table-column label="审批节点" prop="name" min-width="120" align="center" /> + <el-table-column label="审批人" min-width="100" align="center"> + <template #default="scope"> + {{ scope.row.assigneeUser?.nickname || scope.row.ownerUser?.nickname }} + </template> + </el-table-column> + <el-table-column + :formatter="dateFormatter" + align="center" + label="开始时间" + prop="createTime" + min-width="140" + /> + <el-table-column + :formatter="dateFormatter" + align="center" + label="结束时间" + prop="endTime" + min-width="140" + /> + <el-table-column align="center" label="审批状态" prop="status" min-width="90"> + <template #default="scope"> + <dict-tag :type="DICT_TYPE.BPM_TASK_STATUS" :value="scope.row.status" /> + </template> + </el-table-column> + <el-table-column align="center" label="审批建议" prop="reason" min-width="200"> + <template #default="scope"> + {{ scope.row.reason }} + <el-button + class="ml-10px" + size="small" + v-if="scope.row.formId > 0" + @click="handleFormDetail(scope.row)" + > + <Icon icon="ep:document" /> 查看表单 + </el-button> + </template> + </el-table-column> + <el-table-column align="center" label="耗时" prop="durationInMillis" min-width="100"> + <template #default="scope"> + {{ formatPast2(scope.row.durationInMillis) }} + </template> + </el-table-column> + </el-table> - <!-- 弹窗:子任务 --> - <TaskSignList ref="taskSignListRef" @success="refresh" /> <!-- 弹窗:表单 --> <Dialog title="表单详情" v-model="taskFormVisible" width="600"> <form-create @@ -91,61 +56,20 @@ </Dialog> </template> <script lang="ts" setup> -import { formatDate, formatPast2 } from '@/utils/formatTime' +import { dateFormatter, formatPast2 } from '@/utils/formatTime' import { propTypes } from '@/utils/propTypes' import { DICT_TYPE } from '@/utils/dict' -import { isEmpty } from '@/utils/is' -import TaskSignList from './dialog/TaskSignList.vue' import type { ApiAttrs } from '@form-create/element-ui/types/config' import { setConfAndFields2 } from '@/utils/formCreate' +import * as TaskApi from '@/api/bpm/task' defineOptions({ name: 'BpmProcessInstanceTaskList' }) -defineProps({ - loading: propTypes.bool, // 是否加载中 - processInstance: propTypes.object, // 流程实例 - tasks: propTypes.arrayOf(propTypes.object) // 流程任务的数组 +const props = defineProps({ + loading: propTypes.bool.def(false), // 是否加载中 + id: propTypes.string // 流程实例的编号 }) - -/** 获得流程实例对应的颜色 */ -const getProcessInstanceTimelineItemType = (item: any) => { - if (item.status === 2) { - return 'success' - } - if (item.status === 3) { - return 'danger' - } - if (item.status === 4) { - return 'warning' - } - return '' -} - -/** 获得任务对应的颜色 */ -const getTaskTimelineItemType = (item: any) => { - if ([0, 1, 6, 7].includes(item.status)) { - return 'primary' - } - if (item.status === 2) { - return 'success' - } - if (item.status === 3) { - return 'danger' - } - if (item.status === 4) { - return 'info' - } - if (item.status === 5) { - return 'warning' - } - return '' -} - -/** 子任务 */ -const taskSignListRef = ref() -const openChildrenTask = (item: any) => { - taskSignListRef.value.open(item) -} +const tasks = ref([]) // 流程任务的数组 /** 查看表单 */ const fApi = ref<ApiAttrs>() // form-create 的 API 操作类 @@ -155,7 +79,7 @@ value: {} }) // 流程任务的表单详情 const taskFormVisible = ref(false) -const handleFormDetail = async (row) => { +const handleFormDetail = async (row: any) => { // 设置表单 setConfAndFields2(taskForm, row.formConf, row.formFields, row.formVariables) // 弹窗打开 @@ -167,9 +91,13 @@ fApi.value?.fapi?.disabled(true) } -/** 刷新数据 */ -const emit = defineEmits(['refresh']) // 定义 success 事件,用于操作成功后的回调 -const refresh = () => { - emit('refresh') -} +/** 只有 loading 完成时,才去加载流程列表 */ +watch( + () => props.loading, + async (value) => { + if (value) { + tasks.value = await TaskApi.getTaskListByProcessInstanceId(props.id) + } + } +) </script> -- Gitblit v1.9.3