feat(notice): 办件视角加操作列「审批记录」——Drawer iframe 嵌 flow-center 进度页(token 每次现取不缓存),业务错原文提示不打断列表

This commit is contained in:
chenxing
2026-10-09 20:15:34 +08:00
parent 8fe3e2ef8c
commit 3de71aa99b
+41
View File
@@ -43,6 +43,9 @@
<template #status="{ row }">
<Tag :color="instStatusColor(row.status)">{{ instStatusText(row.status) }}</Tag>
</template>
<template #instAction="{ row }">
<Button size="small" @click="openEmbed(row)">审批记录</Button>
</template>
</Table>
</div>
<div class="page-panel" v-if="instPage.total > instPage.pageSize">
@@ -66,6 +69,13 @@
</p>
<Input v-model="rejectOpinion" type="textarea" :rows="3" placeholder="驳回意见(必填)" />
</Modal>
<!-- 审批记录 Drawer(flow-center 嵌入页 iframe 撑满:状态/基本信息/流程示意图/轨迹/审批流水/表单六块) -->
<Drawer v-model="embedVisible" title="审批记录" :width="860" :transfer="false" :styles="{ body: { padding: '0' } }">
<div class="embed-frame-wrap">
<iframe v-if="embedPageUrl" :src="embedPageUrl" title="办件进度"></iframe>
</div>
</Drawer>
</div>
</template>
@@ -77,6 +87,7 @@ import approvalApi, {
type ApprovalInstance,
type ApprovalTodoTask,
} from "@/api/module/approval";
import { noticeApi } from "@/api/module/notice";
/**
* 我的待审核(应用内审批,第三步):待办列表 + 办件视角,通过/驳回走本应用后端代理
@@ -119,8 +130,28 @@ const instCols = [
{ title: "提交人", key: "submitterName", width: 100 },
{ title: "提交时间", key: "submitTime", width: 170, render: fmtTime },
{ title: "办结时间", key: "finishTime", width: 170, render: fmtTime },
{ title: "操作", slot: "instAction", width: 100 },
];
/* 审批记录 Drawer(嵌入页 iframe):pageUrl 含 10 分钟短时 token,每次打开现取,
* 不缓存、不落 storage(既有安全纪律);业务错(尚未进入流程/无权限 403)原文提示,不打断列表 */
const embedVisible = ref(false);
const embedPageUrl = ref("");
async function openEmbed(row: ApprovalInstance) {
try {
const res = await noticeApi.flowEmbed(Number(row.bizId)).send();
embedPageUrl.value = res?.pageUrl || "";
if (!embedPageUrl.value) {
Message.error("审批记录地址获取失败");
return;
}
embedVisible.value = true;
} catch (e: any) {
Message.error(e?.message || "审批记录打开失败");
}
}
function fmtTime(h: any, p: any) {
return h(
"span",
@@ -229,4 +260,14 @@ onMounted(load);
.filter-bar {
margin-bottom: 12px;
}
/* 审批记录 Drawer:iframe 撑满,嵌入页内部自己滚动 */
.embed-frame-wrap {
height: 100%;
}
.embed-frame-wrap iframe {
display: block;
width: 100%;
height: 100%;
border: 0;
}
</style>