From 4df0976f73015cdc219cb10ec701647fb8dad8bd Mon Sep 17 00:00:00 2001
From: dj <1042039504@qq.com>
Date: Fri, 12 Sep 2025 12:42:42 +0800
Subject: [PATCH] =?UTF-8?q?refactor(tunnel):=20=E4=BC=98=E5=8C=96=E9=9A=A7?=
 =?UTF-8?q?=E9=81=93=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80=E5=92=8C=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

-移除 div 容器的多余样式，提高灵活性
-调整 img 元素的样式，使其适应不同尺寸的图片- 添加厂房、尾水、支洞的坐标信息
- 更新隧道图片的尺寸
---
 src/views/tunnel/index.vue | 28 ++++++++++++++++++++--------
 1 file changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/views/tunnel/index.vue b/src/views/tunnel/index.vue
index 71ae7b8..0d2e308 100644
--- a/src/views/tunnel/index.vue
+++ b/src/views/tunnel/index.vue
@@ -5,7 +5,7 @@
       <!--        @/assets/images/tunnel/img.png-->
       <!--        <img :src="'data:image/png;base64,'+siteImage" style="width:3500px;height:1789px" id="imgModel" usemap="#image"-->
       <!--             alt="" @click="clickHandler">-->
-      <div style="display: flex;justify-content: center;align-items: center;height: 100%" >
+      <div style="display: flex;justify-content: center;align-items: center;" >
         <img src="/images/img.png" alt="" class="imgModel" id="imgModel" usemap="#image" />
       </div>
       <map name="image" id="image">
@@ -329,14 +329,17 @@ let pattern = reactive(new RegExp("[A-Za-z]+"));
 let isTunnel = reactive(false);
 const coordsList = ref([
   {
+    //厂房
     tunnelId: 1,
-    coords: '767,1117,793,1182,2379,682,2437,454,2349,505,2298,666,2221,531,2153,578,2212,692,765,1126',
+    coords: '197,486,166,480,115,635,170,642,215,506,197,486',
   }, {
-    tunnelId: 1,
-    coords: '863,1475,1135,1494,2321,1078,3023,801,3214,703,3288,752,2300,1154,1560,1438,1170,1554,844,1529',
+  //2#尾水
+    tunnelId: 2,
+    coords: '335,548,1029,183,1079,71,1098,78,1044,192,344,567,335,548'
   }, {
-    tunnelId: 94,
-    coords: '1181,1364,2105,622,2005,589,1116,1324'
+  //5#支洞
+    tunnelId: 3,
+    coords: '1046,85,1029,76,1020,45,1004,45,1014,88,1045,103,1046,85'
   }
 ])
 const btnList = ref([
@@ -859,9 +862,18 @@ const initWebSocket = () => {
   #tunnel-box {
     height: 100%;
   }
+  .img-box {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
   .imgModel{
-    height: 52%;
-    width: 52%;
+    width:2048px;height:1360px
   }
 }