修复DockIndicator指示器位置移动问题和层级显示问题

AutoRobot/Windows/Robot/Web/src/DockLayout/DockIndicator.vue

@@ -176,6 +176,26 @@
         clip-rule="evenodd"
         d="M10 14 L30 14 L30 30 L10 30 Z" />
     </svg>
+    <!-- 中心指示区 -->
+    <svg 
+      width="185" 
+      height="185" 
+      viewBox="0 0 185 185" 
+      aria-hidden="true" 
+      class="indicator-top" 
+      style="position: relative; left: 400px; top: 300px;" 
+    >
+      <path
+        fill="#636873"
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M0 72 L63 72 L72 63 L72 0 L113 0 L113 63 L123 72 L185 72 L185 113 L123 113 L113 123 L113 185 L72 185 L72 123 L63 113 L0 113 Z" />
+      <path
+        fill="#D5DCF0"
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M1 73 L64 73 L73 64 L73 1 L112 1 L112 64 L122 73 L184 73 L184 112 L122 112 L112 122 L112 184 L73 184 L73 122 L64 112 L1 112 Z" />
+    </svg>
   </div>
 </template>
 
@@ -348,6 +368,7 @@ watch(activeDockZone, (newZone) => {
   transform: translateX(-50%);
   opacity: 0.7; /* 默认半透明 */
   transition: opacity 0.2s;
+  z-index: 9999; /* 确保在预览区域上方 */
 }
 
 /* 右指示器：定位在目标区域的右侧中间，右边缘距dock-layout右边缘5像素 */
@@ -358,6 +379,7 @@ watch(activeDockZone, (newZone) => {
   transform: translateY(-50%);
   opacity: 0.7; /* 默认半透明 */
   transition: opacity 0.2s;
+  z-index: 9999; /* 确保在预览区域上方 */
 }
 
 /* 下指示器：定位在目标区域的底部中间，下边缘距dock-layout下边缘5像素 */
@@ -368,6 +390,7 @@ watch(activeDockZone, (newZone) => {
   transform: translateX(-50%);
   opacity: 0.7; /* 默认半透明 */
   transition: opacity 0.2s;
+  z-index: 9999; /* 确保在预览区域上方 */
 }
 
 /* 左指示器：定位在目标区域的左侧中间，左边缘距dock-layout左边缘5像素 */
@@ -378,6 +401,7 @@ watch(activeDockZone, (newZone) => {
   transform: translateY(-50%);
   opacity: 0.7; /* 默认半透明 */
   transition: opacity 0.2s;
+  z-index: 9999; /* 确保在预览区域上方 */
 }
 
 /* 中心指示器：定位在目标区域的中心 */
@@ -388,16 +412,29 @@ watch(activeDockZone, (newZone) => {
   transform: translate(-50%, -50%);
   opacity: 0.7; /* 默认半透明 */
   transition: opacity 0.2s;
+  z-index: 9999; /* 确保在预览区域上方 */
 }
 
 /* 活动状态样式 */
-.indicator-top.active,
-.indicator-right.active,
-.indicator-bottom.active,
-.indicator-left.active,
+.indicator-top.active {
+  opacity: 1; /* 完全不透明 */
+  transform: translateX(-50%) scale(1.1); /* 保持水平居中的同时放大 */
+}
+.indicator-right.active {
+  opacity: 1; /* 完全不透明 */
+  transform: translateY(-50%) scale(1.1); /* 保持垂直居中的同时放大 */
+}
+.indicator-bottom.active {
+  opacity: 1; /* 完全不透明 */
+  transform: translateX(-50%) scale(1.1); /* 保持水平居中的同时放大 */
+}
+.indicator-left.active {
+  opacity: 1; /* 完全不透明 */
+  transform: translateY(-50%) scale(1.1); /* 保持垂直居中的同时放大 */
+}
 .indicator-center.active {
   opacity: 1; /* 完全不透明 */
-  transform: scale(1.1); /* 稍微放大 */
+  transform: translate(-50%, -50%) scale(1.1); /* 保持中心居中的同时放大 */
   transition: all 0.2s;
 }
 </style>