合并分支 'zz-dev' 到 'pre'

src/components/base/RiskSignalOverviewDetailDialog/risk-signal-overview-detail-dialog.scss

@@ -5,6 +5,9 @@
 	justify-content: center;
 	overflow: hidden !important;
 	z-index: 20000 !important;
+	background-color: rgba(0, 0, 0, 0.25) !important;
+	backdrop-filter: blur(30px);
+	-webkit-backdrop-filter: blur(30px);
 }
 
 .risk-signal-detail-modal .el-overlay-dialog {
@@ -218,6 +221,7 @@
 .risk-signal-detail-dialog .header-icon {
 	width: 32px;
 	height: 32px;
+	margin-right: 6px;
 }
 
 .risk-signal-detail-dialog .header-icon img {

src/components/base/moduleHeader/index.vue

@@ -85,6 +85,7 @@ import { useRouter } from "vue-router";
 import { useRoute } from "vue-router";
 import { getPersonType } from "@/api/common/index";
 import request, { removeToken } from "@/api/request.js";
+import { broadcastAuthLogout } from "@/utils/authCrossTabLogout.js";
 import SearchBar from "@/components/layout/SearchBar.vue";
 
 import Menu1 from "@/assets/icons/overview/menu1.png";
@@ -478,6 +479,7 @@ const handleUserCommand = async (command) => {
 		} catch {
 			// ignore
 		}
+		broadcastAuthLogout();
 		try {
 			window.sessionStorage.removeItem("auth_token");
 		} catch {

src/router/index.js

 import { createRouter, createWebHistory } from "vue-router";
 import { setToken, removeToken, getToken } from "@/api/request.js";
+import { AUTH_LOGOUT_CHANNEL } from "@/utils/authCrossTabLogout.js";
 
 /** localStorage：跨标签页记录当前前端的 bootId（与 vite define 的 __APP_BOOT_ID__ 对齐） */
 const VITE_BOOT_STORAGE_KEY = "app_vite_boot_id";
@@ -241,5 +242,59 @@ router.beforeEach((to, from, next) => {
   next();
 });
 
+/**
+ * 在其它标签页/窗口退出登录时，本页立即跳转登录页（不依赖用户再点一次路由）。
+ * 1）storage：监听同源其它文档对 `force_login` 的写入
+ * 2）BroadcastChannel：与登出时的 `broadcastAuthLogout()` 配对，减少仅依赖 storage 的时序问题
+ */
+function installCrossTabLogoutRedirect() {
+  if (typeof window === "undefined") {
+    return;
+  }
+
+  const redirectToLoginAfterRemoteLogout = () => {
+    try {
+      window.localStorage.setItem(FORCE_LOGIN_KEY, "1");
+    } catch {
+      // ignore
+    }
+    try {
+      removeToken();
+      window.localStorage.removeItem("auth_token");
+      window.sessionStorage.removeItem("auth_token");
+    } catch {
+      // ignore
+    }
+    try {
+      if (router.currentRoute.value.path !== "/login") {
+        router.replace({ path: "/login", replace: true }).catch(() => {});
+      }
+    } catch {
+      // ignore
+    }
+  };
+
+  window.addEventListener("storage", (e) => {
+    if (e.key !== FORCE_LOGIN_KEY || e.newValue !== "1") {
+      return;
+    }
+    redirectToLoginAfterRemoteLogout();
+  });
+
+  try {
+    if (typeof BroadcastChannel !== "undefined") {
+      const authBroadcast = new BroadcastChannel(AUTH_LOGOUT_CHANNEL);
+      authBroadcast.addEventListener("message", (ev) => {
+        if (ev?.data?.type === "force_logout") {
+          redirectToLoginAfterRemoteLogout();
+        }
+      });
+    }
+  } catch {
+    // ignore
+  }
+}
+
+installCrossTabLogoutRedirect();
 
 export default router;

src/utils/authCrossTabLogout.js

+/** 与 `router/index.js` 中 BroadcastChannel 监听使用同一频道名 */
+export const AUTH_LOGOUT_CHANNEL = "risk_monitor_auth";
+
+/**
+ * 通知同源其它标签页/窗口：用户已退出，应立即进入登录页。
+ * 与 localStorage `force_login=1` 配合；发起退出的标签页在写入后调用一次即可。
+ */
+export function broadcastAuthLogout() {
+	try {
+		if (typeof BroadcastChannel === "undefined") {
+			return;
+		}
+		const ch = new BroadcastChannel(AUTH_LOGOUT_CHANNEL);
+		ch.postMessage({ type: "force_logout" });
+		ch.close();
+	} catch {
+		// ignore
+	}
+}

src/views/viewRiskSignal/index.vue

@@ -1288,7 +1288,6 @@ onMounted(async () => {
 	width: 32px;
 	height: 32px;
 
-
 	img {
 		width: 100%;
 		height: 100%;
@@ -1397,6 +1396,9 @@ onMounted(async () => {
 	align-items: center;
 	justify-content: center;
 	overflow: hidden !important;
+	background-color: rgba(0, 0, 0, 0.25) !important;
+	backdrop-filter: blur(30px);
+	-webkit-backdrop-filter: blur(30px);
 }
 
 .risk-signal-detail-modal .el-overlay-dialog {
@@ -1527,6 +1529,10 @@ onMounted(async () => {
 	position: relative;
 }
 
+.risk-signal-detail-dialog .header-icon {
+	margin-right: 6px;
+}
+
 /* 顶部分隔线：替代原 header 底边框，宽度与底部分隔线一致（左右各多 16px） */
 .risk-signal-detail-dialog .el-dialog__header::after {
 	content: "";