From dccbac08d6d6c8580a8843ab5de062a5a1bfa94c Mon Sep 17 00:00:00 2001
From: wangxiang <1827945911@qq.com>
Date: Mon, 23 May 2022 06:55:02 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=91=88=20=E7=BC=96=E5=86=99=E9=AB=98?=
 =?UTF-8?q?=E5=BE=B7=E5=9C=B0=E5=9B=BE=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 kicc-ui/src/components/AMap/src/Amap.vue | 32 +++++++++++++++++++++---
 kicc-ui/src/components/AMap/src/data.ts  |  4 +--
 2 files changed, 31 insertions(+), 5 deletions(-)

diff --git a/kicc-ui/src/components/AMap/src/Amap.vue b/kicc-ui/src/components/AMap/src/Amap.vue
index 65ea21f8..0136bce1 100644
--- a/kicc-ui/src/components/AMap/src/Amap.vue
+++ b/kicc-ui/src/components/AMap/src/Amap.vue
@@ -1,5 +1,8 @@
 <template>
-  <div id="mapview" ref="mapview" v-loading="mapState.loading"/>
+  <div v-loading="mapState.loading">
+    <div id="mapview" ref="mapview"/>
+    <div id="mapPanel" ref="mapPanel"/>
+  </div>
 </template>
 <script lang="ts" setup>
   import AMapLoader from '@amap/amap-jsapi-loader';
@@ -265,10 +268,12 @@
       // 构造路线导航类
       const driving = new AMap.Driving({
         map: map,
-        panel: 'panel'
+        panel: instance.refs.mapPanel
       });
       // 根据起终点经纬度规划驾车导航路线
-      driving.search(new AMap.LngLat(116.379028, 39.865042), new AMap.LngLat(116.427281, 39.903719), function(status, result) {
+      driving.search(new AMap.LngLat(112.913864, 28.295114), new AMap.LngLat(112.918119, 28.282891), {
+        waypoints:[new AMap.LngLat(112.919165, 28.289924)]
+      }, function(status, result) {
         if (status === 'complete') {
           console.log('绘制驾车路线完成');
         } else {
@@ -311,4 +316,25 @@
   display: none!important;
 }
 
+#mapPanel {
+  position: fixed;
+  background-color: white;
+  max-height: 90%;
+  overflow-y: auto;
+  top: 210px;
+  right: 18px;
+  width: 280px;
+}
+
+#mapPanel :deep(.amap-call) {
+  background-color: #009cf9;
+  border-top-left-radius: 4px;
+  border-top-right-radius: 4px;
+}
+
+#mapPanel :deep(.amap-lib-driving) {
+  border-bottom-left-radius: 4px;
+  border-bottom-right-radius: 4px;
+  overflow: hidden;
+}
 </style>
diff --git a/kicc-ui/src/components/AMap/src/data.ts b/kicc-ui/src/components/AMap/src/data.ts
index 939e4190..ebc3bd93 100644
--- a/kicc-ui/src/components/AMap/src/data.ts
+++ b/kicc-ui/src/components/AMap/src/data.ts
@@ -28,7 +28,7 @@ export const smallHospitalMapList: mapType[] = [
 ];
 
 export const specimenMapList: mapType[] = [
-  {title: '收样员:小明', orientation: 0, lng: 112.915897, lat: 28.295506},
+  {title: '收样员:小梅', orientation: 0, lng: 112.915897, lat: 28.295506},
   {title: '收样员:小红', orientation: 0, lng: 112.914481, lat: 28.294977},
-  {title: '收样员:小测', orientation: 0, lng: 112.913864, lat: 28.295114}
+  {title: '收样员:小明', orientation: 0, lng: 112.913864, lat: 28.295114}
 ];