refactor(tunnel): 重构隧道页面

- 移除了图像热点区域和相关逻辑
-调整了页面布局和样式- 优化了部分组件的使用方式

src/views/tunnel/index.vue

@@ -1,18 +1,5 @@
 <template>
   <div id="main">
-
-    <div class="img-box" id="imghot">
-      <!--        @/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;" >
-        <img src="/images/img.png" alt="" class="imgModel" id="imgModel" usemap="#image" @click="getInfo()"/>
-      </div>
-      <map name="image" id="image">
-        <area shape="poly" v-for="(item,index) in coordsList" :coords="item.coords" :key="index" alt=""
-              :title="item.title" :href="'/' + item.tunnelId + '/' + siteId" @click="clickHot(item.tunnelId)">
-      </map>
-    </div>
     <div class="box-top">
       <manage-btn
           v-model="selectIndex"
@@ -66,16 +53,16 @@
     </div>
     <!-- <tunnel-scene id="tunnel-box" :isedit="false" /> -->
     <!-- 一进去的话应该是预览模式，所以引入这个组件1 -->
-<!--    <preview-scene-->
-<!--      id="tunnel-box"-->
-<!--      :isedit="false"-->
-<!--      :tunnelId="tunnelId"-->
-<!--      :key="tunnelId"-->
-<!--      :tunnelLen="tunnelLen"-->
-<!--      :largeScreen="largeScreen"-->
-<!--      :fanList="socketData.leftData"-->
-<!--      :devRealtimeData="socketData"-->
-<!--    ></preview-scene>-->
+    <preview-scene
+        id="tunnel-box"
+        :isedit="false"
+        :tunnelId="tunnelId"
+        :key="tunnelId"
+        :tunnelLen="tunnelLen"
+        :largeScreen="largeScreen"
+        :fanList="socketData.leftData"
+        :devRealtimeData="socketData"
+    ></preview-scene>
     <div class="left">
       <el-drawer
           v-model="drawerLeft"
@@ -327,24 +314,7 @@ const routeList = ref([]);
 let socket = reactive("");
 let pattern = reactive(new RegExp("[A-Za-z]+"));
 let isTunnel = reactive(false);
-const coordsList = ref([
-  {
-    //厂房
-    tunnelId: 98,
-    title: '厂房',
-    coords: '163,487,153,483,217,480,170,644,111,640,145,483',
-  }, {
-  //2#尾水
-    tunnelId: 1,
-    title: '2#尾水隧洞',
-    coords: '335,548,1029,183,1079,71,1098,78,1044,192,344,567,335,548'
-  }, {
-  //5#支洞
-    tunnelId: 109,
-    title: '5#支洞',
-    coords: '1046,85,1029,76,1020,45,1004,45,1014,88,1045,103,1046,85'
-  }
-])
+// const equipmentOption = ref([])
 const btnList = ref([
   {
     route: "/site",
@@ -374,28 +344,6 @@ const btnList = ref([
 ]);
 const serialNumber = ref("");
 const roleKey = ref("");
-function convertCoordsToArray(coordsArray) {
-  return coordsArray.map(point => `${point.x},${point.y}`).join(',');
-}
-
-// 示例使用：
-const coordsData = [
-  { x: 163, y: 487 },
-  { x: 153, y: 483 },
-  { x: 217, y: 480 },
-  { x: 170, y: 644 },
-  { x: 111, y: 640 },
-  { x: 145, y: 483 }
-];
-
-const result = convertCoordsToArray(coordsData);
-console.log(result);
-// 输出: "163,487,153,483,217,480,170,644,111,640,145,483"
-const clickHot = (id) => {
-  console.log('点击热区===============')
-  router.push('/' + id + '/' + siteId)
-}
-
 let token = getToken();
 let send = {
   type: "ping",
@@ -875,26 +823,11 @@ const initWebSocket = () => {
 #main {
   height: 100%;
   width: 100%;
-  //background-color: #072348;
-  background-image: url('/images/background/background.png');
+  background-color: #072348;
 
   #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{
-    width: 1040px;
-    height: 646px;
-  }
 }
 
 .alarm-dialog {