From 7c79c67c44fbbbba46f0242de0a6cd62d6ff18e5 Mon Sep 17 00:00:00 2001
From: Kven <2955163637@qq.com>
Date: Thu, 27 Mar 2025 21:35:08 +0800
Subject: [PATCH] =?UTF-8?q?fix(iot):=20=E4=BF=AE=E5=A4=8D=E4=BA=A7?=
 =?UTF-8?q?=E5=93=81=E7=BC=96=E8=BE=91=E5=92=8C=E5=9C=B0=E5=9B=BE=E5=B1=95?=
 =?UTF-8?q?=E7=A4=BA=E7=9B=B8=E5=85=B3=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 修改工作台数据面板中的产品数为告警数
- 优化设备地图页面布局和样式
-修复产品编辑页面中图标和预览图显示问题
- 优化地图标记点图标和样式
---
 .../workplace/components/data-panel.vue       |  2 +-
 src/views/iot/deviceMap/index.vue             | 86 ++++++++++---------
 .../iot/product/components/product-edit.vue   |  8 ++
 3 files changed, 54 insertions(+), 42 deletions(-)

diff --git a/src/views/dashboard/workplace/components/data-panel.vue b/src/views/dashboard/workplace/components/data-panel.vue
index 14c9cba..6e21d73 100644
--- a/src/views/dashboard/workplace/components/data-panel.vue
+++ b/src/views/dashboard/workplace/components/data-panel.vue
@@ -75,7 +75,7 @@
           <a-row align="center">
             <a-col :span="12">
               <a-statistic
-                title="产品数"
+                title="告警数"
                 value-style="font-size:36px"
                 :value="props.alarmInfo.warningCount"
                 :value-from="0"
diff --git a/src/views/iot/deviceMap/index.vue b/src/views/iot/deviceMap/index.vue
index 0eb532a..a3bca0c 100644
--- a/src/views/iot/deviceMap/index.vue
+++ b/src/views/iot/deviceMap/index.vue
@@ -7,48 +7,47 @@
           v-model="searchKeyword"
           placeholder="设备名称"
           @change="handleSearch"
-          @search="handleSearch"
-          style="margin-bottom: 16px"
+          @search="handleSearch"          style="margin-bottom: 16px"
         />
       </a-card>
-<!--       设备列表 -->
-      <a-row>
-        <a-col
-          :span="24"
-          v-for="device in deviceList"
-          :key="device.id"
-          @click="selectDevice(device)"
-        >
-          <a-card hoverable :style="{ margin: '5px', height: '100px' }">
-            <div
-              :style="{
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'space-between',
-              }"
-            >
-              <span
-                :style="{ display: 'flex', alignItems: 'center', color: '#1D2129' }"
+      <!-- 设备列表容器 -->
+      <div class="device-list-container">
+        <a-row>
+          <a-col
+            :span="24"
+            v-for="device in deviceList"
+            :key="device.id"
+            @click="selectDevice(device)"
+          >
+            <a-card hoverable :style="{ margin: '5px', height: '100px' }">
+              <div
+                :style="{
+                  display: 'flex',
+                  alignItems: 'center',
+                  justifyContent: 'space-between',
+                }"
               >
-                <a-avatar
-                  shape="square"
-                  :size="70"
+                <span
+                  :style="{ display: 'flex', alignItems: 'center', color: '#1D2129' }"
                 >
-                  <a-image
-                    :src="getImageUrl(device.previewId)"
-                  />
-                </a-avatar>
-                <a-descriptions layout="inline-horizontal" :style="{ marginLeft: '10px'}">
-                     <a-descriptions-item label="设备名称" :span="3">{{ device.name }}</a-descriptions-item>
-<!--                 <a-descriptions-item label="硬件版本">{{ device.hardwareVersion }}</a-descriptions-item>-->
-<!--                 <a-descriptions-item label="固件版本">{{ device.firmwareVersion }}</a-descriptions-item>-->
-                     <a-descriptions-item label="所属产品">{{ device.productName }}</a-descriptions-item>
-                   </a-descriptions>
-              </span>
-            </div>
-          </a-card>
-        </a-col>
-      </a-row>
+                  <a-avatar
+                    shape="square"
+                    :size="70"
+                  >
+                    <a-image
+                      :src="getImageUrl(device.previewId)"
+                    />
+                  </a-avatar>
+                  <a-descriptions layout="inline-horizontal" :style="{ marginLeft: '10px'}">
+                    <a-descriptions-item label="设备名称" :span="3">{{ device.name }}</a-descriptions-item>
+                    <a-descriptions-item label="所属产品">{{ device.productName }}</a-descriptions-item>
+                  </a-descriptions>
+                </span>
+              </div>
+            </a-card>
+          </a-col>
+        </a-row>
+      </div>
     </a-layout-sider>
     <a-layout-content>
       <div id="container"></div>
@@ -128,10 +127,10 @@
           const content = document.createElement('div');
           content.className = 'custom-content-marker';
           const markerIcon = device.warning === '1'
-            ? `/api/rest/attachment/${device.icon?.url}` // 警告标记
-            : `/api/rest/attachment/${device.icon?.url}`; // 默认标记
+            ? `/api/rest/attachment/${device.iconId}` // 警告标记
+            : `/api/rest/attachment/${device.iconId}`; // 默认标记
 
-          content.innerHTML = `<img src="${markerIcon}" alt="标记点" />`;
+          content.innerHTML = `<img src="${markerIcon}" alt="标记点" width="30px"  />`;
           // 创建标记点
           const marker = new AMap.Marker({
             position: lngLat,
@@ -204,4 +203,9 @@
     height: 100%;
   }
 
+  /* 设备列表容器样式 */
+  .device-list-container {
+    height: calc(100vh - 100px); /* 根据实际高度调整 */
+    overflow-y: auto; /* 添加垂直滚动条 */
+  }
 </style>
\ No newline at end of file
diff --git a/src/views/iot/product/components/product-edit.vue b/src/views/iot/product/components/product-edit.vue
index 6ba69a9..7c52037 100644
--- a/src/views/iot/product/components/product-edit.vue
+++ b/src/views/iot/product/components/product-edit.vue
@@ -253,6 +253,14 @@
     const res = await queryProductDetail(Id);
     formData.value = res.data;
     paramsData.value = res.data.params;
+
+    // 判断 iconId 和 previewId 是否存在
+    if (!formData.value.iconId) {
+      formData.value.icon = [];
+    }
+    if (!formData.value.previewId) {
+      formData.value.preview = [];
+    }
   };
 
   // 预览图列表