diff --git a/deploy/fba/fba-ui-src/apps/web-antdv-next/src/views/iaop/cockpit/index.vue b/deploy/fba/fba-ui-src/apps/web-antdv-next/src/views/iaop/cockpit/index.vue index 5cf6f1d..3db20de 100644 --- a/deploy/fba/fba-ui-src/apps/web-antdv-next/src/views/iaop/cockpit/index.vue +++ b/deploy/fba/fba-ui-src/apps/web-antdv-next/src/views/iaop/cockpit/index.vue @@ -29,6 +29,9 @@ const loading = ref(true); const errorMsg = ref(''); let timer = 0; +// issue #189:记录注入 :root 的主题变量及其旧值,卸载时恢复, +// 避免进过驾驶舱后全局 CSS 变量被残留值污染其他页面。 +const injectedTokens: Array<{ key: string; prev: string }> = []; onMounted(async () => { try { @@ -37,9 +40,12 @@ onMounted(async () => { widgets.value = (plan.widgets as unknown as PlanWidget[]) || []; // 主题 token 注入 CSS 变量(切模板 = 换一套变量) const root = document.documentElement; - Object.entries((plan.themeTokens as Record) || {}).forEach(([k, v]) => - root.style.setProperty(k, v), - ); + Object.entries((plan.themeTokens as Record) || {}).forEach(([k, v]) => { + // 先记下旧值,卸载时恢复(getComputedStyle 取级联值;为空表示原本无) + const prev = root.style.getPropertyValue(k); + injectedTokens.push({ key: k, prev }); + root.style.setProperty(k, v); + }); timer = window.setInterval(refreshHealth, 2000); await refreshHealth(); } catch { @@ -49,7 +55,19 @@ onMounted(async () => { } }); -onUnmounted(() => window.clearInterval(timer)); +onUnmounted(() => { + window.clearInterval(timer); + // issue #189:清理本次注入到 :root 的主题变量,恢复旧值,杜绝全局污染 + const root = document.documentElement; + for (const { key, prev } of injectedTokens) { + if (prev) { + root.style.setProperty(key, prev); + } else { + root.style.removeProperty(key); + } + } + injectedTokens.length = 0; +}); const inferOnline = ref(false); async function refreshHealth() {