feat：完善功能

src/views/scenic/components/big-map.vue

@@ -23,12 +23,11 @@
               :key="index"
               @click="handleTab(index)"
             >
-              {{ item.label }}({{ item.value }})
+              {{ item.label }}({{ item.number }})
             </li>
           </ul>
           <ul class="list">
             <li
-              v-if="active == 0"
               class="item"
               :class="{ item__active: current === index }"
               v-for="(item, index) in list"
@@ -50,7 +49,7 @@
                 </div>
               </div>
             </li>
-            <li
+            <!-- <li
               v-if="active == 1"
               class="item"
               :class="{ item__active: current === index }"
@@ -118,7 +117,7 @@
                 >
                 </div>
               </div>
-            </li>
+            </li> -->
           </ul>
         </div>
         <div id="big-car-ship" class="big-car-ship" />
@@ -128,7 +127,7 @@
 </template>
 
 <script setup>
-  import { getGpsListApi } from '@/api/scenic'
+  import { getGpsListApi, getGpsStatusListApi } from '@/api/scenic'
 
   import closeIcon from '@/assets/images/close.png'
   import carIcon from '@/assets/images/car.png'
@@ -168,7 +167,6 @@
   let lng = ref('')
   let scenicSpotId = ref('')
   let keyword = ref('')
-  let status = ref('')
   let active = ref(0)
   let current = ref('')
   let scenicChange = null
@@ -181,24 +179,25 @@
   let tabs = ref([
     {
       label: '所有',
-      value: '0'
+      value: '',
+      number: 0
     },
     {
-      label: '在线',
-      value: '0'
+      label: '行驶',
+      value: '行驶',
+      number: 0
+    },
+    {
+      label: '静止',
+      value: '静止',
+      number: 0
     },
     {
       label: '离线',
-      value: '0'
-    },
-    {
-      label: '未启用',
-      value: '0'
+      value: '离线',
+      number: 0
     }
   ])
-  let onlineList = ref([])
-  let offlineList = ref([])
-  let staticList = ref([])
 
   watch(
     () => modelValue.value,
@@ -380,6 +379,7 @@
   const handleTab = (index) => {
     if (active.value == index) return
     active.value = index
+    getGpsList()
   }
 
   const handleClose = () => {
@@ -393,18 +393,18 @@
 
   const getGpsList = async () => {
     let res = await getGpsListApi({
-      scenicSpotId: scenicSpotId.value,
       keyword: keyword.value,
-      status: status.value
+      scenicSpotId: scenicSpotId.value,
+      status: tabs.value[active.value].value
     })
-    list.value = res.data
-    onlineList.value = res.data.filter((item) => item.status == '在线')
-    offlineList.value = res.data.filter((item) => item.status == '离线')
-    staticList.value = res.data.filter((item) => item.status == '未启用')
-    tabs.value[0].value = res.data.length
-    tabs.value[1].value = onlineList.value.length
-    tabs.value[2].value = offlineList.value.length
-    tabs.value[3].value = staticList.value.length
+    list.value = res.data.list
+    let statusRes = await getGpsStatusListApi({
+      scenicSpotId: scenicSpotId.value
+    })
+    tabs.value[0].number = statusRes.data['全部']
+    tabs.value[1].number = statusRes.data['行驶']
+    tabs.value[2].number = statusRes.data['静止']
+    tabs.value[3].number = statusRes.data['离线']
   }
 
   const onInput = debounce((e) => {