feat: 添加displayRoute属性控制显示指定路线，默认不显示图例

src/components/TongzhouTrafficMap.vue

@@ -5,7 +5,7 @@
     <div class="map-legend" :style="privateStyle.legend" v-if="showLegend">
       <div class="legend-title">图例</div>
       <div class="legend-list">
-        <div class="legend-item all-select" @click="toggleAll">
+        <div class="legend-item all-select" @click="toggleAll" v-if="!displayRoute">
           <div class="legend-dot"
             :style="{ backgroundColor: isAllSelected ? '#fff' : 'transparent', border: '1px solid #fff' }"></div>
           <div class="legend-label" style="font-weight: bold;">全选</div>
@@ -13,7 +13,7 @@
 
         <div v-for="item in legendConfig" class="legend-item" @click="toggleRouteVisible(item.name)" :key="item.name"
           :class="{ 'is-inactive': !activeLegends.includes(item.name) }"
-          v-if="showSpecialRoutes || !['干线协调', '勤务路线'].includes(item.name)"> 
+          v-if="(displayRoute && item.name === displayRoute) || (!displayRoute && activeLegends.includes(item.name))"> 
 
           <div class="legend-dot"
             :style="{ backgroundColor: ['离线', '降级', '故障'].includes(item.name) ? 'transparent' : item.color }"
@@ -43,8 +43,8 @@ export default {
   props: {
     amapKey: { type: String, default: '您的Key' },
     securityJsCode: { type: String, default: '您的安全密钥' },
-    showSpecialRoutes: { type: Boolean, default: true },
-    showLegend: { type: Boolean, default: true }
+    displayRoute: { type: String, default: '', validator: (value) => ['', '干线协调', '勤务路线'].includes(value) },
+    showLegend: { type: Boolean, default: false }
   },
   data() {
     return {
@@ -75,15 +75,12 @@ export default {
   },
   mounted() {
     // 根据props调整activeLegends数组
-    if (!this.showSpecialRoutes) {
-      const trunkCoordinationIndex = this.activeLegends.indexOf('干线协调');
-      if (trunkCoordinationIndex > -1) {
-        this.activeLegends.splice(trunkCoordinationIndex, 1);
-      }
-      const serviceRouteIndex = this.activeLegends.indexOf('勤务路线');
-      if (serviceRouteIndex > -1) {
-        this.activeLegends.splice(serviceRouteIndex, 1);
-      }
+    if (this.displayRoute) {
+      // 如果指定了要显示的路线，只保留该路线
+      this.activeLegends = [this.displayRoute];
+    } else {
+      // 如果没有指定，显示所有路线
+      this.activeLegends = ["中心计划", "干线协调", "勤务路线", "定周期控制", "感应控制", "自适应控制", "手动控制", "特殊控制", "离线", "降级", "故障"];
     }
     
     this.initAMap();
@@ -153,8 +150,8 @@ export default {
       const AMap = this.AMap;
 
       this.legendConfig.forEach((config, index) => {
-        // 当showSpecialRoutes为false时，跳过干线协调和勤务路线
-        if (!this.showSpecialRoutes && ['干线协调', '勤务路线'].includes(config.name)) {
+        // 如果指定了要显示的路线，只处理该路线
+        if (this.displayRoute && config.name !== this.displayRoute) {
           return;
         }