feat(ui): 详情页父子导航/列表链接按钮/办件详情内嵌流程图（办件进度抽屉数据源就绪）

src/views/flow/InstanceDetail.vue

@@ -53,6 +53,9 @@ const branchText = computed(() => {
     return `${arrived}/${branches.length} 分支已到达汇聚点`;
 });
 
+/** 流程示意图图片直嵌（2026-09-16 "CAS 验证码式"：后端 /diagram.png 返回 PNG 流，img 直显） */
+const diagramSrc = computed(() => `/api/flow/diagram.png?instanceId=${route.params.instanceId}`);
+
 function statusName(s: number) {
     return INSTANCE_STATUS[s] || s;
 }
@@ -110,6 +113,14 @@ onMounted(async () => {
             </template>
         </Card>
 
+        <Card class="block" :bordered="false" dis-hover>
+            <template #title>
+                流程示意图
+                <a class="diagram-more" @click="router.push({ path: '/diagram', query: { instanceId: String(route.params.instanceId) } })">查看大图</a>
+            </template>
+            <img class="diagram-img" :src="diagramSrc" alt="流程示意图" />
+        </Card>
+
         <Card class="block" :bordered="false" dis-hover>
             <template #title>流程轨迹</template>
             <Timeline>
@@ -145,6 +156,9 @@ export default { methods: { taskStatusName } };
 .k { width: 120px; color: #888; flex-shrink: 0; }
 .v { white-space: pre-wrap; word-break: break-all; }
 .muted { color: #999; }
+.diagram-box { display: flex; justify-content: center; }
+.diagram-img { max-width: 100%; }
+.diagram-more { float: right; font-size: 12px; font-weight: normal; margin-right: 16px; }
 .node { font-weight: 600; margin-right: 6px; }
 .opinion { color: #666; }
 .time { color: #aaa; font-size: 12px; }

src/views/flow/MyInstances.vue

@@ -4,6 +4,7 @@ import { ref, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import { Message } from "view-ui-plus";
 import { flowApi, INSTANCE_STATUS } from "@/api/module/flow";
+import Utils from "@/utils";
 
 const router = useRouter();
 const loading = ref(false);
@@ -23,13 +24,13 @@ const columns = [
     { title: "当前节点", key: "currentNodes", width: 150 },
     { title: "提交时间", width: 170, render: (h: any, p: any) => h("span", (p.row.submitTime || "").replace("T", " ")) },
     { title: "办结时间", width: 170, render: (h: any, p: any) => h("span", (p.row.finishTime || "").replace("T", " ") || "-") },
-    { title: "操作", width: 180, render: (h: any, p: any) => {
-        const btns = [h("Button", { size: "small", onClick: () => router.push(`/instance/${p.row.instanceId}`) }, () => "详情")];
+    { title: "操作", width: 150, render: (h: any, p: any) => {
+        const btns = [Utils.operatingTextHandle(h, "详情", "", () => router.push(`/instance/${p.row.instanceId}?pid=101`))];
         if (p.row.status === 10) {
-            btns.push(h("Button", { size: "small", onClick: () => onWithdraw(p.row) }, () => "撤回"));
-            btns.push(h("Button", { size: "small", onClick: () => onUrge(p.row) }, () => "催办"));
+            btns.push(Utils.operatingTextHandle(h, "撤回", "", () => onWithdraw(p.row)));
+            btns.push(Utils.operatingTextHandle(h, "催办", "", () => onUrge(p.row)));
         }
-        return h("div", { style: "display:flex;gap:4px" }, btns);
+        return btns;
     } },
 ];
 

src/views/flow/Workbench.vue

@@ -4,6 +4,7 @@ import { ref, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import { Message } from "view-ui-plus";
 import { flowApi, TASK_STATUS, INSTANCE_STATUS } from "@/api/module/flow";
+import Utils from "@/utils";
 
 const router = useRouter();
 const tab = ref<"todo" | "done">("todo");
@@ -18,7 +19,7 @@ const todoColumns = [
     { title: "当前节点", key: "nodeName", width: 160 },
     { title: "提交人", key: "submitter", width: 100, render: (h: any, p: any) => h("span", p.row.submitterName || "-") },
     { title: "到达时间", key: "arriveTime", width: 170, render: (h: any, p: any) => h("span", (p.row.arriveTime || "").replace("T", " ")) },
-    { title: "操作", width: 90, render: (h: any, p: any) => h("Button", { size: "small", type: "primary", onClick: () => goHandle(p.row) }, () => "办理") },
+    { title: "操作", width: 90, render: (h: any, p: any) => Utils.operatingTextHandle(h, "办理", "", () => goHandle(p.row)) },
 ];
 
 const doneColumns = [
@@ -28,7 +29,7 @@ const doneColumns = [
     { title: "意见", key: "opinion", minWidth: 140 },
     { title: "办理时间", width: 170, render: (h: any, p: any) => h("span", (p.row.handleTime || "").replace("T", " ")) },
     { title: "办件状态", width: 100, render: (h: any, p: any) => h("span", INSTANCE_STATUS[p.row.instanceStatus] || p.row.instanceStatus) },
-    { title: "操作", width: 90, render: (h: any, p: any) => h("Button", { size: "small", onClick: () => router.push(`/instance/${p.row.instanceId}`) }, () => "详情") },
+    { title: "操作", width: 90, render: (h: any, p: any) => Utils.operatingTextHandle(h, "详情", "", () => router.push(`/instance/${p.row.instanceId}?pid=100`)) },
 ];
 
 function submitterNameFallback(row: any) {
@@ -36,7 +37,7 @@ function submitterNameFallback(row: any) {
 }
 
 function goHandle(row: any) {
-    router.push(`/task/${row.taskId}`);
+    router.push(`/task/${row.taskId}?pid=100`);
 }
 
 async function load() {

src/views/flow/admin/Callbacks.vue

@@ -3,6 +3,7 @@
 import { ref, onMounted } from "vue";
 import { Message, Modal } from "view-ui-plus";
 import { flowApi } from "@/api/module/flow";
+import Utils from "@/utils";
 
 const LOG_STATUS: Record<number, string> = { 0: "待推/重试中", 1: "成功", 2: "死信" };
 const EVENT_OPTIONS = ["flow.submitted", "flow.task.created", "flow.task.handled", "flow.completed", "flow.rejected", "flow.withdrawn"];
@@ -19,11 +20,10 @@ const regColumns = [
     { title: "订阅事件", key: "eventTypes", width: 200, render: (h: any, p: any) => h("span", p.row.eventTypes || "全部") },
     { title: "状态", width: 80, render: (h: any, p: any) => h("Tag", { color: p.row.status === 0 ? "green" : "gray" }, () => (p.row.status === 0 ? "启用" : "停用")) },
     { title: "操作", width: 220, render: (h: any, p: any) => {
-        const btns: any[] = [
-            h("Button", { size: "small", onClick: () => onRegStatus(p.row, p.row.status === 0) }, () => (p.row.status === 0 ? "停用" : "启用")),
-            h("Button", { size: "small", type: "warning", onClick: () => onResetSecret(p.row) }, () => "重置secret"),
+        return [
+            Utils.operatingTextHandle(h, p.row.status === 0 ? "停用" : "启用", "", () => onRegStatus(p.row, p.row.status === 0)),
+            Utils.operatingTextHandle(h, "重置secret", "text-error", () => onResetSecret(p.row)),
         ];
-        return h("div", { style: "display:flex;gap:4px" }, btns);
     } },
 ];
 
@@ -60,7 +60,7 @@ const hungColumns = [
     { title: "末次结果", key: "lastError", minWidth: 220, render: (h: any, p: any) => h("span", p.row.lastError || p.row.lastHttpStatus || "-") },
     { title: "下次重推", width: 160, render: (h: any, p: any) => h("span", (p.row.nextRetryTime || "").replace("T", " ") || "-") },
     { title: "操作", width: 120, render: (h: any, p: any) =>
-        h("Button", { size: "small", type: "error", onClick: () => onMarkDead(p.row) }, () => "标记死信") },
+        Utils.operatingTextHandle(h, "标记死信", "text-error", () => onMarkDead(p.row)) },
 ];
 
 async function loadRegs() {

src/views/flow/admin/Defs.vue

@@ -6,6 +6,7 @@ import { ref, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import { Message } from "view-ui-plus";
 import { flowApi } from "@/api/module/flow";
+import Utils from "@/utils";
 
 const router = useRouter();
 const DEF_STATUS: Record<number, string> = { 0: "草稿", 1: "已发布", 2: "停用" };
@@ -25,18 +26,18 @@ const columns = [
     } },
     { title: "GUID", key: "flowGuid", width: 200 },
     { title: "发布时间", width: 160, render: (h: any, p: any) => h("span", (p.row.publishTime || "").replace("T", " ") || "-") },
-    { title: "操作", width: 330, render: (h: any, p: any) => {
+    { title: "操作", width: 320, fixed: "right", render: (h: any, p: any) => {
         const btns: any[] = [];
         if (p.row.status === 0) {
-            btns.push(h("Button", { size: "small", type: "primary", onClick: () => onEdit(p.row) }, () => "编辑"));
-            btns.push(h("Button", { size: "small", type: "success", onClick: () => onPublish(p.row) }, () => "发布"));
+            btns.push(Utils.operatingTextHandle(h, "编辑", "", () => onEdit(p.row)));
+            btns.push(Utils.operatingTextHandle(h, "发布", "", () => onPublish(p.row)));
         } else if (p.row.status === 1) {
-            btns.push(h("Button", { size: "small", onClick: () => onNewVersion(p.row) }, () => "升版本"));
-            btns.push(h("Button", { size: "small", type: "warning", onClick: () => onOffline(p.row) }, () => "停用"));
+            btns.push(Utils.operatingTextHandle(h, "升版本", "", () => onNewVersion(p.row)));
+            btns.push(Utils.operatingTextHandle(h, "停用", "text-error", () => onOffline(p.row)));
         }
-        btns.push(h("Button", { size: "small", onClick: () => onDiagram(p.row) }, () => "图示"));
-        btns.push(h("Button", { size: "small", onClick: () => onVersions(p.row) }, () => "版本历史"));
-        return h("div", { style: "display:flex;gap:4px" }, btns);
+        btns.push(Utils.operatingTextHandle(h, "图示", "", () => onDiagram(p.row)));
+        btns.push(Utils.operatingTextHandle(h, "版本历史", "", () => onVersions(p.row)));
+        return btns;
     } },
 ];
 

src/views/flow/admin/Instances.vue

@@ -3,6 +3,7 @@
 import { ref, onMounted } from "vue";
 import { useRouter } from "vue-router";
 import { flowApi, INSTANCE_STATUS } from "@/api/module/flow";
+import Utils from "@/utils";
 
 const router = useRouter();
 const loading = ref(false);
@@ -21,7 +22,7 @@ const columns = [
     { title: "提交人", key: "submitterName", width: 100 },
     { title: "提交时间", width: 160, render: (h: any, p: any) => h("span", (p.row.submitTime || "").replace("T", " ")) },
     { title: "操作", width: 90, render: (h: any, p: any) =>
-        h("Button", { size: "small", onClick: () => router.push(`/instance/${p.row.id}`) }, () => "详情") },
+        Utils.operatingTextHandle(h, "详情", "", () => router.push(`/instance/${p.row.id}?pid=102`)) },
 ];
 
 async function load() {

src/views/flow/admin/Maps.vue

@@ -3,6 +3,7 @@
 import { ref, onMounted } from "vue";
 import { Message } from "view-ui-plus";
 import { flowApi } from "@/api/module/flow";
+import Utils from "@/utils";
 
 const loading = ref(false);
 const deptKeyFilter = ref("");
@@ -60,7 +61,7 @@ const columns = [
     { title: "状态", width: 90, render: (h: any, p: any) => h("Tag", { color: p.row.status === 0 ? "green" : "gray" }, () => (p.row.status === 0 ? "启用" : "停用")) },
     { title: "操作", width: 100, render: (h: any, p: any) =>
         p.row.status === 0
-            ? h("Button", { size: "small", type: "warning", onClick: () => onDisable(p.row) }, () => "停用")
+            ? Utils.operatingTextHandle(h, "停用", "text-error", () => onDisable(p.row))
             : h("span", "-") },
 ];