fix: 修复新布局下地图搜索框、选择下拉、图例等位置到正常显示的地方

src/components/TongzhouTrafficMap.vue

@@ -2,7 +2,7 @@
   <div class="map-wrapper">
     <div ref="mapContainer" class="map-container"></div>
 
-    <div class="map-header" v-if="initialized">
+    <div class="map-header" v-if="initialized" :style="privateStyle.search">
       <div class="search-form">
         <input type="text" v-model="searchQuery" placeholder="请输入路段或设备名称" class="search-input"
           @keyup.enter="handleSearch" />
@@ -11,7 +11,7 @@
       <div class="action-box" @click="toggleAll">全选 ▾</div>
     </div>
 
-    <div class="map-legend" v-if="initialized">
+    <div class="map-legend" v-if="initialized" :style="privateStyle.legend">
       <div class="legend-title">图例</div>
       <div class="legend-list">
         <div v-for="item in legendConfig" :key="item.type" class="legend-item"
@@ -54,11 +54,21 @@ export default {
         { type: 'degraded', label: '降级', color: '#c4a737' },
         { type: 'fault', label: '故障', color: '#ff4d4f' }
       ],
-      overlayGroups: {}
+      overlayGroups: {},
+      privateStyle: {
+        search: {},
+        legend: {}
+      }
     };
   },
   mounted() {
     this.initAMap();
+    
+    // 自定义首页地图搜索和图例位置样式
+    if (this.$route.path === '/home') {
+      this.privateStyle.search = { top: "100px", left: "25%", right: "25%" };
+      this.privateStyle.legend = { right: "25%" };
+    }
   },
   beforeDestroy() {
     if (this.map) {
@@ -229,9 +239,9 @@ export default {
 /* 头部样式：增加了搜索表单布局 */
 .map-header {
   position: absolute;
-  top: 20px;
-  left: 20px;
-  right: 20px;
+  top: 80px;
+  left: 50px;
+  right: 50px;
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -288,7 +298,7 @@ export default {
 /* 图例与其它样式保持不变 */
 .map-legend {
   position: absolute;
-  right: 25px;
+  right: 50px;
   bottom: 40px;
   width: 170px;
   background: rgba(8, 20, 36, 0.95);