fix(flow-embed): 嵌入页旁路全局 body min-width——740 抽屉里整体右偏/右侧被裁
build / build (push) Successful in 2m0s

- 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 布局成立
This commit is contained in:
chenxing
2026-10-10 16:23:41 +08:00
parent c189ad70a7
commit 32b01f9bf3
+12 -1
View File
@@ -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,