定点分析 默认显示第一条路线，修复路线错误问题

src/views/globalMap/RightMenu/FixedPointAnalysis.vue

@@ -65,10 +65,15 @@
           <i class="icon-close2" @click="showAddress = false" />
         </div>
         <div class="route-list">
-          <div v-for="(item, index) in routeData" :key="index" class="route-item2" @click="drawRoute(item)">
+          <div
+            v-for="(item, index) in routeData"
+            :key="index"
+            :class="index === selectIndex ? 'route-item2 route-item2-active' : 'route-item2'"
+            @click="drawRoute(item)"
+          >
             <div class="text-box1">
               <div :class="'tag tag' + index">{{ getTag(index) }}</div>
-              <div class="text1">{{ item.strategy }}</div>
+<!--              <div class="text1">{{ item.strategy }}</div>-->
             </div>
             <div class="route-info">
               <div class="text-box2">
@@ -218,43 +223,36 @@ const selectEvent = (item, unFitView) => {
   }
   getList();
 };
-
+let selectIndex = ref(-1);
 const handleRoutes = async (item) => {
+  selectIndex.value = -1;
   const lnglat = gcoord.transform([item.longitude, item.latitude], gcoord.WGS84, gcoord.GCJ02);
   const lnglat2 = gcoord.transform([selectData.value.longitude, selectData.value.latitude], gcoord.WGS84, gcoord.GCJ02);
-  const start = [lnglat[0], lnglat[1]];
-  const end = lnglat2;
+  const start = [lnglat[0].toFixed(6), lnglat[1].toFixed(6)];
+  const end = [lnglat2[0].toFixed(6), lnglat2[1].toFixed(6)];
   showAddress.value = true;
   routesAddress.value = item.address;
-  // 10速度最快 返回结果会躲避拥堵，路程较短，尽量缩短时间，与高德地图的默认策略也就是不进行任何勾选一致
-  // 16费用最低 返回的结果尽量不走高速，并且尽量规划收费较低甚至免费的路径结果，与高德地图的“避免收费&不走高速”策略一致
-  const url = `https://restapi.amap.com/v3/direction/driving?origin=${start}&destination=${end}&key=${amapKey}`;
-  const response = await fetch(url + '&strategy=10');
+
+  const url = `https://restapi.amap.com/v5/direction/driving?origin=${start.toString()}&destination=${end.toString()}&key=${amapKey}`;
+  const response = await fetch(url + '&strategy=32&show_fields=polyline,cost');
 
   if (!!response.ok) {
     const data = await response.json();
     if (data.route && data.route.paths) {
       data.route.paths.forEach((item) => {
-        item.duration = formatDate(item.duration);
+        item.duration = formatDate(item.cost?.duration);
       });
       routeData.value = data.route.paths;
+      // 默认展示第一条
+      drawRoute(routeData.value[0], 0);
     } else {
       routeData.value = [];
     }
   }
-  const response2 = await fetch(url + '&strategy=16');
-  if (!!response2.ok) {
-    const data2 = await response2.json();
-    if (data2.route && data2.route.paths) {
-      data2.route.paths.forEach((item) => {
-        item.duration = formatDate(item.duration);
-      });
-      routeData.value = routeData.value.concat(data2.route.paths);
-    }
-  }
 };
 
-const drawRoute = (route) => {
+const drawRoute = (route, index) => {
+  selectIndex.value = index;
   const path = parseRouteToPath(route);
   clearLine();
   if (AMapType.includes(props.activeMap)) {
@@ -472,7 +470,7 @@ onMounted(() => {
   color: #fff;
   .scroll-box {
     width: 100%;
-    height: 100%;
+    height: 665px;
     position: relative;
     overflow-y: auto;
   }
@@ -648,6 +646,9 @@ onMounted(() => {
       padding: 5px;
       margin-top: 6px;
       cursor: pointer;
+      &:hover {
+        border: 1px solid #01e3fb;
+      }
       .text-box1 {
         display: flex;
         .tag {
@@ -716,6 +717,9 @@ onMounted(() => {
         }
       }
     }
+    .route-item2-active {
+      border: 1px solid #01e3fb;
+    }
   }
 }
 </style>

src/views/globalMap/RightMenu/LayerAnalysis.vue

@@ -307,7 +307,6 @@ const handleClick = (item) => {
   .box2-right {
     width: 100%;
     height: 230px;
-    margin-top: 20px;
     display: flex;
     align-items: flex-start;
     .legend-box {