From 32b01f9bf38b9d5d3b90cd1410207c943f2fc742 Mon Sep 17 00:00:00 2001
From: chenxing <chenxing@bestsch.com>
Date: Sat, 10 Oct 2026 16:23:41 +0800
Subject: [PATCH] =?UTF-8?q?fix(flow-embed):=20=E5=B5=8C=E5=85=A5=E9=A1=B5?=
 =?UTF-8?q?=E6=97=81=E8=B7=AF=E5=85=A8=E5=B1=80=20body=20min-width?=
 =?UTF-8?q?=E2=80=94=E2=80=94740=20=E6=8A=BD=E5=B1=89=E9=87=8C=E6=95=B4?=
 =?UTF-8?q?=E4=BD=93=E5=8F=B3=E5=81=8F/=E5=8F=B3=E4=BE=A7=E8=A2=AB?=
 =?UTF-8?q?=E8=A3=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- App.vue：/embed/** 路由下给 body 置内联 min-width:0（内联优先级高于样式表），
  离开嵌入路由 removeProperty 回落到原值；不动全局样式表，管理面零影响
- 根因：isEmbed 只旁路了组件壳（layout / base-wrap-main），管不到全局 CSS——
  assets/styles/base/_base.scss:13 的 body{min-width:1200px} 让 740px 的 iframe
  仍按 ≥1200px 排版，表现为可见区里所有元素整体右偏、右侧被裁
- 实测（截图 1910x873，DPR 1.25）：.diagram-img 外框左边 1540px=1232 CSS，
  按 1200 布局反推 1237；开始按钮中心 1749px=1399 CSS，按 1200 反推 1400；
  按 740 布局应为 1000 / 370 —— 两条独立测算都落在 6px 内，1200 布局成立
---
 src/App.vue | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/App.vue b/src/App.vue
index 75cc956..80716d1 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, reactive, computed, onMounted } from "vue";
+import { ref, reactive, computed, onMounted, watch, onBeforeUnmount } from "vue";
 import layout from "./components/layout.vue";
 import { useRouter } from "vue-router";
 import config from "@/assets/config/host.config";
@@ -12,6 +12,17 @@ const isLogin = ref(false);
 // 嵌入页旁路（/embed/**，iframe 免签嵌入）：子应用 Drawer 里打开，带不了本应用 CAS 会话，
 // 也不该出现菜单壳。判定用路由前缀而非 query 标记——刷新/直链/分享均稳定
 const isEmbed = computed(() => router.currentRoute.value.path.startsWith("/embed/"));
+
+// 嵌入页必须旁路全局 body 的 min-width（assets/styles/base/_base.scss 的 1200px）：
+// 上面 isEmbed 只旁路了组件壳，管不到全局 CSS，740px 的 iframe 里页面仍按 ≥1200px 排版，
+// 表现为整体右偏 + 右侧被裁。用内联样式覆盖（优先级高于样式表），非嵌入态移除内联属性回落到原值
+function syncEmbedLayout(embed: boolean) {
+    if (embed) document.body.style.minWidth = "0";
+    else document.body.style.removeProperty("min-width");
+}
+watch(isEmbed, syncEmbedLayout, { immediate: true });
+onBeforeUnmount(() => syncEmbedLayout(false));
+
 const layoutData = reactive({
     appName: "流程中心",
     baseHost: config.baseHost,