1

ruoyi-ui/src/views/childRoom/index.vue

@@ -21,17 +21,6 @@
         <div class="red-dot"></div>
         <i class="el-icon-s-unfold icon-inside"></i>
       </div>
-      
-      <!-- 地图中间的浮动红点（触发右侧面板） -->
-      <div 
-        class="floating-red-dot right-red-dot" 
-        :class="{ hidden: !isRightPanelHidden }"
-        @click="showRightPanel"
-        title="显示右侧面板"
-      >
-        <div class="red-dot"></div>
-        <i class="el-icon-s-fold icon-inside"></i>
-      </div>
     </div>
 
     <!-- 顶部浮动导航栏 - 最终优化设计 -->
@@ -280,7 +269,6 @@
       :sea-platforms="seaPlatforms"
       :ground-platforms="groundPlatforms"
       @hide="hideRightPanel"
-      @tab-change="activeRightTab = $event"
       @select-route="selectRoute"
       @open-route-dialog="openRouteDialog"
       @open-waypoint-dialog="openWaypointDialog"
@@ -326,20 +314,7 @@
         </div>
       </div>
       
-      <div class="system-status">
-        <div class="status-item">
-          <span class="status-label">网络延迟：</span>
-          <span class="status-value success blue-success">< 200ms</span>
-        </div>
-        <div class="status-item">
-          <span class="status-label">数据同步：</span>
-          <span class="status-value success blue-success">正常</span>
-        </div>
-        <div class="status-item">
-          <span class="status-label">检测告警：</span>
-          <span class="status-value warning blue-warning">2处</span>
-        </div>
-      </div>
+
     </div>
     
     <!-- 在线成员弹窗 -->
@@ -431,9 +406,9 @@ export default {
       showKTimePopup: false,
       
       menuItems: [
-        { id: 'file', name: '文件', icon: 'el-icon-document' },
-        { id: 'start', name: '开始', icon: 'el-icon-caret-right' },
-        { id: 'insert', name: '插入', icon: 'el-icon-plus' },
+        { id: 'file', name: '方案', icon: 'el-icon-s-operation' },
+        { id: 'start', name: '冲突', icon: 'el-icon-warning-outline' },
+        { id: 'insert', name: '平台', icon: 'el-icon-ship' },
         { id: 'pattern', name: '图案', icon: 'el-icon-picture-outline' },
         { id: 'deduction', name: '推演', icon: 'el-icon-video-play' },
         { id: 'modify', name: '修改', icon: 'el-icon-edit' },
@@ -787,7 +762,33 @@ export default {
     
     selectMenu(item) {
       this.activeMenu = item.id;
-      if(item.id === 'modify'){
+      
+      // 点击左侧的方案、冲突、平台时，切换右侧面板内容
+      if (item.id === 'file') {
+        // 如果当前已经是方案标签页，则关闭右侧面板
+        if (this.activeRightTab === 'plan' && !this.isRightPanelHidden) {
+          this.isRightPanelHidden = true;
+        } else {
+          this.activeRightTab = 'plan';
+          this.isRightPanelHidden = false;
+        }
+      } else if (item.id === 'start') {
+        // 如果当前已经是冲突标签页，则关闭右侧面板
+        if (this.activeRightTab === 'conflict' && !this.isRightPanelHidden) {
+          this.isRightPanelHidden = true;
+        } else {
+          this.activeRightTab = 'conflict';
+          this.isRightPanelHidden = false;
+        }
+      } else if (item.id === 'insert') {
+        // 如果当前已经是平台标签页，则关闭右侧面板
+        if (this.activeRightTab === 'platform' && !this.isRightPanelHidden) {
+          this.isRightPanelHidden = true;
+        } else {
+          this.activeRightTab = 'platform';
+          this.isRightPanelHidden = false;
+        }
+      } else if(item.id === 'modify'){
           this.drawDom = !this.drawDom
           console.log(this.drawDom,999999)
         }
@@ -968,12 +969,6 @@ background: url('~@/assets/map-background.png');
   transform: translateY(-50%);
 }
 
-/* 右侧红点 */
-.right-red-dot {
-  right: 20px;
-  transform: translateY(-50%);
-}
-
 .red-dot {
   width: 20px;
   height: 20px;
@@ -1418,7 +1413,7 @@ background: url('~@/assets/map-background.png');
   width: 80%;
   border-radius: 12px;
   z-index: 95;
-  padding: 20px;
+  padding: 10px 20px;
   color: #333;
   transition: all 0.3s ease;
   opacity: 0;
@@ -1468,7 +1463,7 @@ background: url('~@/assets/map-background.png');
   display: flex;
   align-items: center;
   justify-content: space-between;
-  margin-bottom: 10px;
+  margin-bottom: 5px;
 }
 
 .current-time {