增加危险范围的图片

danger-manage-web/src/components/bigWindow/Danger.vue

@@ -2,7 +2,7 @@
  * @Author: 纪泽龙 jizelong@qq.com
  * @Date: 2022-06-21 09:24:11
  * @LastEditors: 纪泽龙 jizelong@qq.com
- * @LastEditTime: 2022-10-22 10:36:04
+ * @LastEditTime: 2022-10-22 14:08:16
  * @FilePath: /danger-manage-web/src/components/bigWindow/Danger.vue
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -82,14 +82,27 @@
         <span class="left">工程技术:</span
         ><span v-unValue class="right">{{ deviceData.data.gcjs }}</span>
       </div>
-      <div class="item">
+      <div class="item flex">
         <span class="left">警示标识:</span>
-        <template v-if="deviceData.data.src">
-          <span v-unValue class="img"
-            ><img :src="deviceData.data.src" alt=""
-          /></span>
+        <template v-if="deviceData.data.src && deviceData.data.src.length > 0">
+          <span v-unValue class="img">
+            <!-- <img
+              v-for="src in deviceData.data.src"
+              :key="src"
+              :src="src"
+              alt=""
+          /> -->
+            <el-image
+              v-for="src in deviceData.data.src"
+              :key="src"
+              style="width: 70px; height: 90px;margin-left:5px"
+              :src="src"
+              :preview-src-list="[src]"
+              :z-index="9999999"
+            ></el-image>
+          </span>
         </template>
-        <template v-else> 
+        <template v-else>
           <span class="right">-</span>
         </template>
       </div>
@@ -178,14 +191,20 @@ export default {
       margin-left: 5px;
     }
     .img {
-      width: 300px;
-      height: 120px;
+      flex: 1;
+      width: 100%;
+      height: 90px;
+
       display: inline-block;
       vertical-align: top;
       margin-left: 5px;
+      #img,
       img {
-        width: 100%;
-        height: 100%;
+        // width: 100%;
+        width: 70px;
+        height: 90px;
+        margin-left: 5px;
+        cursor: pointer;
       }
     }
   }

danger-manage-web/src/utils/cesium/dangerArr.js

@@ -96,6 +96,18 @@
 //     src: danger,
 //   },
 // ],
+// 禁止烟火
+import jzyh from "@/assets/images/dangerPic/jzyh.png";
+// 禁止带火种
+import jzdhz from "@/assets/images/dangerPic/jzdhz.png";
+// 当心中毒
+import dxzd from "@/assets/images/dangerPic/dxzd.png";
+// 当心泄露
+import dxxl from "@/assets/images/dangerPic/dxxl.png";
+// 当心爆炸
+import dxbz from "@/assets/images/dangerPic/dxbz.png";
+// 必须戴防毒面具
+import bxdfdmj from "@/assets/images/dangerPic/bxdfdmj.png";
 
 export const dangerArr = [
   {
@@ -122,7 +134,6 @@ export const dangerArr = [
       gkzrr: "张三",
       gl: "公司建立有奖惩制度，安全巡检制度，及时制止违章操作，开对为长者进行适量触发，锅炉工持证上岗，定期接受安全培训",
       gcjs: "根据作业活动风险分析，指定适用的安全作业规程",
-      // src: danger,
     },
   },
   {
@@ -146,7 +157,9 @@ export const dangerArr = [
       [114.08188193141116, 38.24996130073124],
       [114.08037480953207, 38.249932590119556],
     ],
-    data: {},
+    data: {
+      src: [jzyh, jzdhz, dxzd, dxxl, dxbz, bxdfdmj],
+    },
     colorNum: 1,
   },
   {