修正2D圓點（卡片點選）

src/views/system/System.vue

@@ -69,7 +69,8 @@ const getData = async () => {
       currentColor: dev.device_normal_point_color,
       spriteDbId: 10 + index,
       sensorTypes: dev.points.map(({ points }) => points),
-      floor_guid: d.floor_guid
+      floor_guid: d.floor_guid,
+      is2DActive: false
     })),
   }));
 

src/views/system/SystemFloor.vue

@@ -55,6 +55,8 @@ const defaultOption = (map, data = []) => {
 
 const { selectedFloor } = useSelectedFloor()
 
+const allData = ref([])
+
 watch([selectedFloor, () => asset_floor_chart,], ([newValue, newChart], [oldValue]) => {
   if (newValue && newChart.value && oldValue?.key !== newValue.key && newValue.map_url) {
     asset_floor_chart.value.updateSvg(
@@ -65,24 +67,27 @@ watch([selectedFloor, () => asset_floor_chart,], ([newValue, newChart], [oldValu
 
       defaultOption(newValue?.title, subscribeData.value?.filter(d => d.device_coordinate && d.floor_guid === route.params.floor_id).map(d => [...d.device_coordinate.split(","), d]) || [])
     );
-    const allData = subscribeData.value?.filter(d => d.device_coordinate && d.floor_guid === route.params.floor_id).map(d => [...d.device_coordinate.split(","), d])
+
     newChart.value.chart.on("click", function (params) {
       console.log(params, params.data[2])
       getCurrentInfoModalData(params.event, {
         left: params.event.offsetX
         , top: params.event.offsetY
-      }, params.data[3])
+      }, params.data[2])
-      const selected = allData.filter((d => d[2].device_number === params.data[2].device_number))
-      const unSelected =  allData.filter((d => d[2].device_number !== params.data[2].device_number))
-      newChart.value.chart.setOption({
 
+      let values = [...subscribeData.value].map(d => ({ ...d, is2DActive: d.forge_dbid === params.data[2].forge_dbid }))
+      subscribeData.value = values;
+
+      const selected = allData.value.filter((d => d[2].device_number === params.data[2].device_number))
+      const unSelected = allData.value.filter((d => d[2].device_number !== params.data[2].device_number))
+      newChart.value.chart.setOption({
         series: [
           { data: unSelected }, {
             data: selected,
           }
         ]
       })
-      console.log(selected, unSelected)
+
     });
 
 
@@ -93,12 +98,19 @@ watch([selectedFloor, () => asset_floor_chart,], ([newValue, newChart], [oldValu
 })
 
 watch(subscribeData, (newData) => {
+  let values = newData?.filter(d => d.device_coordinate && d.floor_guid === route.params.floor_id).map(d => [...d.device_coordinate.split(","), d])
+  allData.value = values;
   if (selectedFloor.value && asset_floor_chart.value && asset_floor_chart.value.chart) {
+    const selected = allData.value.filter((d => d[2].is2DActive))
+    const unSelected = allData.value.filter((d => !d[2].is2DActive))
     asset_floor_chart.value.chart.setOption({
-      series: {
+      series: [
-        data: newData.filter(d => d.device_coordinate && d.floor_guid === route.params.floor_id).map(d => [...d.device_coordinate.split(","), d]),
+        { data: unSelected }, {
-      },
+          data: selected,
+        }
+      ]
     })
+    console.log(asset_floor_chart.value.chart.getOption())
   }
 }, {
   immediate: true,

src/views/system/components/SystemCard.vue

@@ -3,12 +3,17 @@ import { computed, inject, watch } from "vue"
 import useSystemShowData from "@/hooks/useSystemShowData"
 
 const { getCurrentInfoModalData, selected_dbid } = inject("system_selectedDevice")
+const { subscribeData } = inject("system_deviceList");
 
 const { showData } = useSystemShowData()
 const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
 
-const fitToView = (forge_dbid,spriteDbId) => {
+const fitToView = (forge_dbid, spriteDbId) => {
-  selected_dbid.value=[forge_dbid,spriteDbId];
+  selected_dbid.value = [forge_dbid, spriteDbId];
+  console.log(subscribeData.value)
+  let allData = [...subscribeData.value].map(d => ({ ...d, is2DActive: d.forge_dbid === forge_dbid }))
+  subscribeData.value = allData;
+
 };
 
 </script>
@@ -25,7 +30,8 @@ const fitToView = (forge_dbid,spriteDbId) => {
             <div class="item h-full cursor-pointer" @click="() => fitToView(device.forge_dbid, device.spriteDbId)">
               <div class="left h-full flex flex-wrap justify-center">
                 <div class="sec02 w-full">
-                  <img v-if="device.device_image_url" :src="`${FILE_BASEURL}/upload/device_icon/${device.device_image}`" :alt="device.device_image" >
+                  <img v-if="device.device_image_url" :src="`${FILE_BASEURL}/upload/device_icon/${device.device_image}`"
+                    :alt="device.device_image">
                   <span v-else></span>
                   <span>{{ device.full_name }}</span>
                 </div>
@@ -108,7 +114,7 @@ const fitToView = (forge_dbid,spriteDbId) => {
   z-index: 1;
 }
 
-.equipment-show .item .sec02 img{
+.equipment-show .item .sec02 img {
   margin-right: 10px;
   width: 2rem !important;
   height: 2rem;