Compare commits
12
Commits
13afb22060
...
c1fe0783fb
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
c1fe0783fb | ||
|
|
3de71aa99b | ||
|
|
8fe3e2ef8c | ||
|
|
dbbabc56eb | ||
|
|
ab647c67ba | ||
|
|
b685ff5dc0 | ||
|
|
9c8b0f900a | ||
|
|
fea12895c1 | ||
|
|
599fed01b5 | ||
|
|
e0d1b2b769 | ||
|
|
f611c15a6e | ||
|
|
941031e1b4 |
@@ -85,11 +85,20 @@ onMounted(async () => {
|
||||
}
|
||||
});
|
||||
|
||||
/** 流程图:flow-center 示意图深链(Notice 指定到人场景用人员视图) */
|
||||
/** 流程图 Drawer(后端 DiagramDef 中转 PNG:同源免 token;与设置页同款,修复旧深链 404) */
|
||||
const flowDiagramVisible = ref(false);
|
||||
const flowDiagramSrc = computed(() =>
|
||||
flowDiagramVisible.value && auditFlowGuid.value
|
||||
? `${config.serviceHost}/api/notice/flow/DiagramDef?flowGuid=${encodeURIComponent(auditFlowGuid.value)}`
|
||||
: "",
|
||||
);
|
||||
function openFlowDiagram() {
|
||||
if (auditFlowGuid.value) {
|
||||
window.open(`${config.flowHost}/#/diagram?flowGuid=${auditFlowGuid.value}&mode=user`, "_blank");
|
||||
if (!auditFlowGuid.value) return;
|
||||
flowDiagramVisible.value = true;
|
||||
}
|
||||
function onFlowDiagramError() {
|
||||
flowDiagramVisible.value = false;
|
||||
Message.error("流程图加载失败(流程可能未发布或绑定已解除)");
|
||||
}
|
||||
|
||||
/* ============ 富文本编辑器(wangeditor v5 for vue3) ============ */
|
||||
@@ -408,6 +417,14 @@ async function saveEditAndLeave(data: NoticeRequest) {
|
||||
<Button @click="isModal.timiSend = false" style="margin-left: 8px">取消</Button>
|
||||
</template>
|
||||
</Modal>
|
||||
|
||||
<!-- 流程图 Drawer(后端 DiagramDef 同源 PNG;竖版长图容器内纵向滚动) -->
|
||||
<Drawer v-model="flowDiagramVisible" title="流程示意图" :width="860" :transfer="false"
|
||||
:styles="{ body: { padding: '0' } }">
|
||||
<div class="flow-diagram-frame">
|
||||
<img v-if="flowDiagramSrc" :src="flowDiagramSrc" alt="流程示意图" @error="onFlowDiagramError" />
|
||||
</div>
|
||||
</Drawer>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -439,4 +456,17 @@ async function saveEditAndLeave(data: NoticeRequest) {
|
||||
.bottom-btn {
|
||||
margin-top: 6px;
|
||||
}
|
||||
/* 流程图 Drawer:浅底色 + 纵向滚动(竖版长图),图片撑满可读宽度 */
|
||||
.flow-diagram-frame {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
background: #f5f7fa;
|
||||
padding: 12px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.flow-diagram-frame img {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -80,9 +80,21 @@ function unbindFlow() {
|
||||
});
|
||||
}
|
||||
|
||||
/** 流程图(flow-center 示意图深链,与发通知页同一入口) */
|
||||
function openFlowDiagram(guid: string) {
|
||||
if (guid) window.open(`${config.flowHost}/#/diagram?flowGuid=${guid}`, "_blank");
|
||||
/** 流程图 Drawer(后端 DiagramDef 中转 PNG:同源免 token 免跨域。修复旧深链 404——
|
||||
* 生产前端静态挂 /flow-center/front*,Caddy 无 /flow-center/ 根路由,window.open 深链必 404) */
|
||||
const flowDiagramVisible = ref(false);
|
||||
const flowDiagramSrc = computed(() =>
|
||||
flowDiagramVisible.value && boundFlowGuid.value
|
||||
? `${config.serviceHost}/api/notice/flow/DiagramDef?flowGuid=${encodeURIComponent(boundFlowGuid.value)}`
|
||||
: "",
|
||||
);
|
||||
function openFlowDiagram() {
|
||||
if (!boundFlowGuid.value) return;
|
||||
flowDiagramVisible.value = true;
|
||||
}
|
||||
function onFlowDiagramError() {
|
||||
flowDiagramVisible.value = false;
|
||||
Message.error("流程图加载失败(流程可能未发布或绑定已解除)");
|
||||
}
|
||||
|
||||
/** 当前绑定流程的节点摘要(下拉里回显) */
|
||||
@@ -517,7 +529,7 @@ const groupH = useElementHeight(groupRegionRef);
|
||||
已绑定
|
||||
<Tag color="blue">{{ boundFlowName || boundFlowGuid }}</Tag>
|
||||
<span class="node-summary">{{ boundFlowSummary }}</span>
|
||||
<Button type="text" size="small" @click="openFlowDiagram(boundFlowGuid)">查看流程图</Button>
|
||||
<Button type="text" size="small" @click="openFlowDiagram">查看流程图</Button>
|
||||
</template>
|
||||
<template v-else>
|
||||
<Tag>未绑定</Tag>
|
||||
@@ -528,6 +540,14 @@ const groupH = useElementHeight(groupRegionRef);
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 流程图 Drawer(后端 DiagramDef 同源 PNG;竖版长图容器内纵向滚动) -->
|
||||
<Drawer v-model="flowDiagramVisible" title="流程示意图" :width="860" :transfer="false"
|
||||
:styles="{ body: { padding: '0' } }">
|
||||
<div class="flow-diagram-frame">
|
||||
<img v-if="flowDiagramSrc" :src="flowDiagramSrc" alt="流程示意图" @error="onFlowDiagramError" />
|
||||
</div>
|
||||
</Drawer>
|
||||
|
||||
<!-- 新增发文部门 Modal(编辑走 TypeSetBox 内联编辑) -->
|
||||
<Modal v-model="deptModal" :mask-closable="false" width="450px" title="新增部门">
|
||||
<Form ref="deptFormRef" :model="deptForm" :rules="deptRule" :label-width="110">
|
||||
@@ -627,4 +647,17 @@ const groupH = useElementHeight(groupRegionRef);
|
||||
margin-top: 16px;
|
||||
color: var(--text-3);
|
||||
}
|
||||
/* 流程图 Drawer:浅底色 + 纵向滚动(竖版长图),图片撑满可读宽度 */
|
||||
.flow-diagram-frame {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
background: #f5f7fa;
|
||||
padding: 12px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.flow-diagram-frame img {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user