调整

frontend/matrix-middle-service-web/src/views/record/AMapLocation.vue

@@ -79,9 +79,14 @@
         <div class="fixed bg-amber-50 rounded-tl z-max text-left absolute-bottom-right pl-1.5" style="width: 350px" v-if="view.lines.length > 0">
             路径数量: {{view.lines.length}}
 
-            <div v-for="(item,i) in view.lines" :key="i">
-                {{item[0].locationTime}} ~ {{item[item.length-1].locationTime}}
-            </div>
+                <q-scroll-area style="height: 250px" class="overflow-auto"
+                                :thumb-style="scrollArea.thumbStyle"
+                                :bar-style="scrollArea.barStyle">
+                    <div v-for="(item,i) in view.lines" :key="i" >
+                        {{item[0].locationTime}} ~ {{item[item.length-1].locationTime}}
+                    </div>
+                </q-scroll-area>
+
         </div>
     </div>
 </template>
@@ -97,11 +102,22 @@ import {createCanvasDir} from "matrix-middle-service-web/src/views/record/logic/
 import {getAvgSpeed, getMaxSpeed} from "matrix-middle-service-web/src/views/record/logic/speed";
 import {randomColorList} from "matrix-middle-service-web/src/views/record/logic/color";
 const $q = useQuasar();
-const COLOR = [
-    '#6090e0', '#30c030', '#d070d0', '#80c0f0', '#f07050', '#ffb900',
-    '#37a2da', '#ffdb5c', '#8378ea', '#e7bcf3', '#32c5e9', '#67e0e3',
-    '#dd6b66', '#759aa0', '#e69d87', '#8dc1a9', '#ea7e53', '#eedd78',
-]
+const scrollArea = reactive({
+    thumbStyle: {
+        right: '4px',
+        borderRadius: '5px',
+        backgroundColor: '#027be3',
+        width: '5px',
+        opacity: "0.75"
+    },
+    barStyle: {
+        right: '2px',
+        borderRadius: '9px',
+        backgroundColor: '#027be3',
+        width: '9px',
+        opacity: "0.2"
+    }
+})
 let canvasDir = createCanvasDir();
 const date = ref({
     from: moment().startOf('d').format("YYYY-MM-DD HH:mm:ss"),