From 71528c78acb8702c7de73ac0416f18642aa6e120 Mon Sep 17 00:00:00 2001 From: 疯狂的狮子Li <15040126243@163.com> Date: 星期三, 15 一月 2025 18:20:29 +0800 Subject: [PATCH] update 优化 设计器界面展示效果 --- src/components/Process/approvalRecord.vue | 80 ++++++++++++++++++++++++++-------------- 1 files changed, 52 insertions(+), 28 deletions(-) diff --git a/src/components/Process/approvalRecord.vue b/src/components/Process/approvalRecord.vue index bb4ed91..baf86a7 100644 --- a/src/components/Process/approvalRecord.vue +++ b/src/components/Process/approvalRecord.vue @@ -2,39 +2,49 @@ <div class="container"> <el-dialog v-model="visible" draggable title="瀹℃壒璁板綍" :width="props.width" :height="props.height" :close-on-click-modal="false"> <el-tabs v-model="tabActiveName" class="demo-tabs"> - <el-tab-pane label="娴佺▼鍥�" name="bpmn"> - <BpmnView ref="bpmnViewRef"></BpmnView> + <el-tab-pane v-loading="loading" label="娴佺▼鍥�" name="bpmn"> + <img :src="imgUrl" width="100%" style="margin: 0 auto" /> </el-tab-pane> <el-tab-pane v-loading="loading" label="瀹℃壒淇℃伅" name="info"> <div> <el-table :data="historyList" style="width: 100%" border fit> <el-table-column type="index" label="搴忓彿" align="center" width="60"></el-table-column> - <el-table-column prop="name" label="浠诲姟鍚嶇О" sortable align="center"></el-table-column> - <el-table-column prop="nickName" :show-overflow-tooltip="true" label="鍔炵悊浜�" sortable align="center"> + <el-table-column prop="nodeName" label="浠诲姟鍚嶇О" sortable align="center"></el-table-column> + <el-table-column prop="approveName" :show-overflow-tooltip="true" label="鍔炵悊浜�" sortable align="center"> <template #default="scope"> - <el-tag type="success">{{ scope.row.nickName || '鏃�' }}</el-tag> + <template v-if="scope.row.approveName"> + <el-tag v-for="(item, index) in scope.row.approveName.split(',')" :key="index" type="success">{{ item }}</el-tag> + </template> + <template v-else> <el-tag type="success">鏃�</el-tag></template> </template> </el-table-column> - <el-table-column label="鐘舵��" sortable align="center"> + <el-table-column prop="flowStatus" label="鐘舵��" width="80" sortable align="center"> <template #default="scope"> - <el-tag type="success">{{ scope.row.statusName }}</el-tag> + <dict-tag :options="wf_task_status" :value="scope.row.flowStatus"></dict-tag> </template> </el-table-column> - <el-table-column prop="comment" label="瀹℃壒鎰忚" sortable align="center"></el-table-column> - <el-table-column prop="startTime" label="寮�濮嬫椂闂�" sortable align="center"></el-table-column> - <el-table-column prop="endTime" label="缁撴潫鏃堕棿" sortable align="center"></el-table-column> - <el-table-column prop="runDuration" label="杩愯鏃堕暱" sortable align="center"></el-table-column> - <el-table-column prop="attachmentList" label="闄勪欢" sortable align="center"> + <el-table-column prop="message" label="瀹℃壒鎰忚" :show-overflow-tooltip="true" sortable align="center"></el-table-column> + <el-table-column prop="createTime" label="寮�濮嬫椂闂�" width="160" :show-overflow-tooltip="true" sortable align="center"></el-table-column> + <el-table-column prop="updateTime" label="缁撴潫鏃堕棿" width="160" :show-overflow-tooltip="true" sortable align="center"></el-table-column> + <el-table-column + prop="runDuration" + label="杩愯鏃跺父" + width="140" + :show-overflow-tooltip="true" + sortable + align="center" + ></el-table-column> + <el-table-column prop="attachmentList" width="120" label="闄勪欢" align="center"> <template #default="scope"> <el-popover v-if="scope.row.attachmentList && scope.row.attachmentList.length > 0" placement="right" :width="310" trigger="click"> <template #reference> - <el-button style="margin-right: 16px">闄勪欢</el-button> + <el-button type="primary" style="margin-right: 16px">闄勪欢</el-button> </template> <el-table border :data="scope.row.attachmentList"> - <el-table-column prop="name" width="202" :show-overflow-tooltip="true" label="闄勪欢鍚嶇О"></el-table-column> + <el-table-column prop="originalName" width="202" :show-overflow-tooltip="true" label="闄勪欢鍚嶇О"></el-table-column> <el-table-column prop="name" width="80" align="center" :show-overflow-tooltip="true" label="鎿嶄綔"> <template #default="tool"> - <el-button type="text" @click="handleDownload(tool.row.contentId)">涓嬭浇</el-button> + <el-button type="text" @click="handleDownload(tool.row.ossId)">涓嬭浇</el-button> </template> </el-table-column> </el-table> @@ -49,36 +59,50 @@ </div> </template> <script lang="ts" setup> -import BpmnView from '@/components/BpmnView/index.vue'; -import processApi from '@/api/workflow/processInstance'; +import { flowImage } from '@/api/workflow/instance'; import { propTypes } from '@/utils/propTypes'; +import { listByIds } from '@/api/system/oss'; const { proxy } = getCurrentInstance() as ComponentInternalInstance; - +const { wf_task_status } = toRefs<any>(proxy?.useDict('wf_task_status')); const props = defineProps({ - width: propTypes.string.def('70%'), + width: propTypes.string.def('80%'), height: propTypes.string.def('100%') }); const loading = ref(false); const visible = ref(false); const historyList = ref<Array<any>>([]); const tabActiveName = ref('bpmn'); - -const bpmnViewRef = ref<BpmnView>(); +const imgUrl = ref(''); //鍒濆鍖栨煡璇㈠鎵硅褰� -const init = async (businessKey: string | number) => { +const init = async (businessId: string | number) => { visible.value = true; loading.value = true; tabActiveName.value = 'bpmn'; historyList.value = []; - processApi.getHistoryRecord(businessKey).then((resp) => { - historyList.value = resp.data; - loading.value = false; + flowImage(businessId).then((resp) => { + if (resp.data) { + historyList.value = resp.data.list; + imgUrl.value = 'data:image/gif;base64,' + resp.data.image; + if (historyList.value.length > 0) { + historyList.value.forEach((item) => { + if (item.ext) { + getIds(item.ext).then((res) => { + item.attachmentList = res.data; + }); + } else { + item.attachmentList = []; + } + }); + } + loading.value = false; + } }); - await nextTick(() => { - bpmnViewRef.value.init(businessKey); - }); +}; +const getIds = async (ids: string | number) => { + const res = await listByIds(ids); + return res; }; /** 涓嬭浇鎸夐挳鎿嶄綔 */ -- Gitblit v1.9.3