将背景图像移动到::after伪元素中，避免z-index冲突问题

src/views/dashboard1/index.less

@@ -2,32 +2,41 @@
   width: 1920px;
   height: 1080px;
   position: relative;
+  z-index: 0;
   overflow: hidden;
-  background-image: url("./assets/头部动画.webp"), url("./assets/头部动画.png"),
+
-  url("./assets/整体边框_静态图片.png"), url("./assets/底部动画.webp"),
+  &:after {
-  url("./assets/底部动画.png"), url("./assets/头部动画_左侧点.webp"),
+    content: "";
-  url("./assets/头部动画_左侧点.png"), url("./assets/头部动画_右侧点.webp"),
+    position: absolute;
-  url("./assets/头部动画_右侧点.png");
+    inset: 0;
-  background-position: top,
+    z-index: 1;
-  top,
+    pointer-events: none;
-  center,
+    background-image: url("./assets/头部动画.webp"), url("./assets/头部动画.png"),
-  bottom,
+    url("./assets/整体边框_静态图片.png"), url("./assets/底部动画.webp"),
-  bottom,
+    url("./assets/底部动画.png"), url("./assets/头部动画_左侧点.webp"),
-  left top,
+    url("./assets/头部动画_左侧点.png"), url("./assets/头部动画_右侧点.webp"),
-  left top,
+    url("./assets/头部动画_右侧点.png");
-  right top,
+    background-position: top,
-  right top;
+    top,
-  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat,
+    center,
-  no-repeat, no-repeat;
+    bottom,
-  background-size: 100%,
+    bottom,
-  100%,
+    left top,
-  100% 100%,
+    left top,
-  100%,
+    right top,
-  100%,
+    right top;
-  auto,
+    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat,
-  auto,
+    no-repeat, no-repeat;
-  auto,
+    background-size: 100%,
-  auto;
+    100%,
+    100% 100%,
+    100%,
+    100%,
+    auto,
+    auto,
+    auto,
+    auto;
+  }
 
   &:before {
     content: "管廊巡检机器人综合管理平台";
@@ -38,7 +47,10 @@
     -webkit-text-fill-color: transparent;
     font-family: YouSheBiaoTiHei, system-ui;
     font-size: 42px;
-    position: relative;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
     z-index: 2;
     display: flex;
     align-items: center;
@@ -48,8 +60,9 @@
 }
 
 .background {
-  position: relative;
+  position: absolute;
-  z-index: -1;
+  inset: 0;
+  z-index: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
@@ -57,6 +70,7 @@
 
 .main {
   position: absolute;
+  z-index: 2;
   width: 100%;
   height: 100%;
   top: 0;

src/views/dashboard1/pages/IntegratedCenterPage.vue

@@ -284,14 +284,11 @@ const streamLoading = ref(false);
 const streamError = ref("");
 const controlWsStatus = ref("未连接");
 const controlError = ref("");
-const controlReconnectLimit = 5;
-const controlReconnectDelay = 2000;
 let streamPeerConnection = null;
 let streamRequestId = 0;
 let controlSocket = null;
 let controlRequestSeed = 0;
 let controlReconnectTimer = null;
-let controlReconnectAttempts = 0;
 let controlSocketManualClose = false;
 let chassisControlTimer = null;
 let ptzControlTimer = null;
@@ -629,17 +626,11 @@ function scheduleControlReconnect() {
   if (controlSocketManualClose || controlReconnectTimer !== null) {
     return;
   }
-  if (controlReconnectAttempts >= controlReconnectLimit) {
+  controlWsStatus.value = "重连中";
-    controlWsStatus.value = "连接失败";
-    controlError.value = "控制 WebSocket 连接失败，请检查 /ws/ros 服务或登录状态";
-    return;
-  }
-  controlReconnectAttempts += 1;
-  controlWsStatus.value = `重连中(${controlReconnectAttempts}/${controlReconnectLimit})`;
   controlReconnectTimer = window.setTimeout(() => {
     controlReconnectTimer = null;
     connectControlSocket();
-  }, controlReconnectDelay);
+  }, 2e3);
 }
 function connectControlSocket() {
   if (controlSocket && (controlSocket.readyState === WebSocket.OPEN || controlSocket.readyState === WebSocket.CONNECTING)) {
@@ -648,17 +639,13 @@ function connectControlSocket() {
   controlSocketManualClose = false;
   controlError.value = "";
   controlWsStatus.value = "连接中";
-  const socket = new WebSocket(buildControlWsUrl());
+  controlSocket = new WebSocket(buildControlWsUrl());
-  controlSocket = socket;
+  controlSocket.onopen = () => {
-  socket.onopen = () => {
-    controlReconnectAttempts = 0;
     controlWsStatus.value = "已连接";
   };
-  socket.onmessage = (event) => {
+  controlSocket.onmessage = (event) => {
     if (event.data === "ping") {
-      if (socket.readyState === WebSocket.OPEN) {
+      controlSocket?.send("pong");
-        socket.send("pong");
-      }
       return;
     }
     if (event.data === "pong") {
@@ -689,27 +676,18 @@ function connectControlSocket() {
       console.error(error);
     }
   };
-  socket.onerror = () => {
+  controlSocket.onerror = () => {
-    if (socket === controlSocket) {
+    controlError.value = "控制 WebSocket 连接异常";
-      controlError.value = "控制 WebSocket 连接异常";
-    }
   };
-  socket.onclose = (event) => {
+  controlSocket.onclose = () => {
-    if (socket !== controlSocket) {
-      return;
-    }
-    controlSocket = null;
     controlWsStatus.value = "未连接";
-    if (controlSocketManualClose || event.code === 1000) {
+    controlSocket = null;
-      return;
-    }
     scheduleControlReconnect();
   };
-  return socket;
+  return controlSocket;
 }
 function closeControlSocket() {
   controlSocketManualClose = true;
-  controlReconnectAttempts = 0;
   if (controlReconnectTimer !== null) {
     window.clearTimeout(controlReconnectTimer);
     controlReconnectTimer = null;
@@ -718,10 +696,8 @@ function closeControlSocket() {
     controlWsStatus.value = "未连接";
     return;
   }
-  const socket = controlSocket;
+  controlSocket.close();
   controlSocket = null;
-  socket.onclose = null;
-  socket.close(1000, "manual close");
   controlWsStatus.value = "未连接";
 }
 function sendControlMessage(type, data) {
@@ -729,7 +705,6 @@ function sendControlMessage(type, data) {
     controlError.value = "当前机器人缺少设备标识";
     return;
   }
-  controlReconnectAttempts = 0;
   const socket = connectControlSocket();
   const payload = {
     type,