初始化功能大致完成

src/components/content/tunnelScene/TunnelScene.vue

@@ -84,6 +84,9 @@ async function handleMounted() {
   } catch (err) {
     console.log(err);
   }
+
+  demo.tunnelModeInit();
+
 }
 
 // 每个模型加载回调
@@ -216,45 +219,32 @@ function handleCancel() {
 const ThreeConfig = {
   code: 0,
   data: {
-    tunnelThreeConfig: {
+    tunnelThreeConfig: [{
-      fan: ['point_005_tl', 'point_009_bl'],
+      equipmentId: 'fan_01',//传感器id
-      sensors: ['point_018_br', 'point_021_bl'],
+      equipmentName: '01',//设备名称
-    }
+      pointName: 'point_005_tl',//附着点名称(定位)
+      equipmentType: 'fan',//设备类型(类型可根据后端
+      equipmentValue: 23, //设备存的值
+    }, {
+      equipmentId: 'sensors_01',//传感器id
+      equipmentName: '01',//设备名称
+      pointName: 'point_009_bl',//附着点名称(定位)
+      equipmentType: 'sensors',//设备类型(类型可根据后端
+      equipmentValue: 67, //设备存的值
+    }],
   },
-  msg: "dda",
+  msg: "dda"
 }
-[{ type: 'fan', point: '' }, {}]
+//取值方便操作
-//   fan: ['point_005_tl', 'point_009_bl'],
+// const tunnelConfigEquipment = ThreeConfig.data.tunnelThreeConfig
-//   sensors: ['point_018_br', 'point_021_bl'],
-// }
-const tunnelConfigEquipment = ThreeConfig.data.tunnelThreeConfig
-const tunnelKeys = Object.keys(tunnelConfigEquipment);
-console.log(tunnelKeys);
 
-function tunnelModeInit() {
+// function tunnelModeInit() {
-  for (let key in ThreeConfig.data.tunnelThreeConfig) {
+//   for (const item of tunnelConfigEquipment) {
-    if (ThreeConfig.data.tunnelThreeConfig.hasOwnProperty(key)) {
+//     let pointmodel = demo.scene.getobjectByName(item.pointName)
-      switch (key) {
+//     console.log(pointmodel);
-        case 'fan':
+//   }
-          ThreeConfig.data.tunnelThreeConfig.fan.forEach(fan => {
+// }
-            // 对 fan 进行操作  
+// tunnelModeInit()
-            console.log(fan);
-          });
-          break;
-        case 'sensors':
-          ThreeConfig.data.tunnelThreeConfig.sensors.forEach(sensor => {
-            // 对 sensor 进行操作  
-            console.log(sensor);
-          });
-          break;
-        default:
-          // 处理其他键值对  
-          console.log(key, ThreeConfig.data.tunnelThreeConfig[key]);
-      }
-    }
-  }
-}
-tunnelModeInit()
 
 </script>
 

src/components/content/tunnelScene/editEquComp/childComps/InputNum.vue

@@ -1,12 +1,7 @@
 <template>
   <div id="input-num">
     <p>{{ params.name }}</p>
-    <input
+    <input type="text" :placeholder="params.placeholder" @input="handleChange" :disabled="params.disabled" />
-      type="text"
-      :placeholder="params.placeholder"
-      @input="handleChange"
-      :disabled="params.disabled"
-    />
   </div>
 </template>
 
@@ -34,6 +29,7 @@ function handleUnmounted() {
 <style lang="scss" scoped>
 #input-num {
   margin: 40px 30px 0px 30px;
+
   P {
     width: 130px;
     height: 35px;
@@ -42,6 +38,7 @@ function handleUnmounted() {
     color: #ffffff;
     line-height: 35px;
   }
+
   input {
     width: 284px;
     height: 51px;
@@ -55,6 +52,7 @@ function handleUnmounted() {
     padding: 0px 10px;
     overflow: hidden;
   }
+
   ::placeholder {
     color: #0f82af;
   }

src/components/content/tunnelScene/editEquComp/editDialog.vue

@@ -2,54 +2,25 @@
   <div id="edit-dialog">
     <div class="distance-back">
       <p>当前距离洞口：{{ pointDistance_str }}</p>
-      <img
+      <img src="/images/htmlEditDialog/back-icon.png" alt="" @click="handleCancel" />
-        src="/images/htmlEditDialog/back-icon.png"
-        alt=""
-        @click="handleCancel"
-      />
     </div>
     <div class="equ-info">当前风压:{{ p }}Pa</div>
     <div class="setting">
       <div class="setting-item">
         <p>传感器类型</p>
-        <el-select
+        <el-select v-model="equipmentSetting.equipmentType" :fit-input-width="true" filterable clearable
-          v-model="equipmentSetting.equipmentType"
+          placeholder="请选择设备类型">
-          :fit-input-width="true"
+          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-          filterable
-          clearable
-          placeholder="请选择设备类型"
-        >
-          <el-option
-            v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
         </el-select>
       </div>
       <div class="setting-item">
         <p>设备选择</p>
-        <el-select
+        <el-select v-model="equipmentSetting.chooseEquipment" :fit-input-width="true" filterable clearable
-          v-model="equipmentSetting.chooseEquipment"
+          placeholder="请选择设备类型">
-          :fit-input-width="true"
+          <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value" />
-          filterable
-          clearable
-          placeholder="请选择设备类型"
-        >
-          <el-option
-            v-for="item in options2"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          />
         </el-select>
       </div>
-      <input-num
+      <input-num name="阈值" placeholder="请输入阈值" @inputValue="handelInput" :disabled="isDisabledInputNum" />
-        name="阈值"
-        placeholder="请输入阈值"
-        @inputValue="handelInput"
-        :disabled="isDisabledInputNum"
-      />
     </div>
     <div class="btn">
       <button @click="removeEquipment">删除</button>
@@ -80,8 +51,7 @@ let p = ref(57);
 //计算锚点之间距离
 const pointDistance_str = computed(
   () =>
-    `${params.pointGap}米*${params.pointNum}=${
+    `${params.pointGap}米*${params.pointNum}=${params.pointGap * params.pointNum
-      params.pointGap * params.pointNum
     }米`
 );
 
@@ -183,11 +153,13 @@ const equipment = {
   z-index: 999;
   display: block;
   opacity: 0;
+
   .distance-back {
     height: 30px;
     display: flex;
     justify-content: space-between;
     margin: 20px 20px 0px 30px;
+
     p {
       width: 388px;
       height: 35px;
@@ -196,13 +168,16 @@ const equipment = {
       color: #ffffff;
       line-height: 35px;
     }
+
     img {
       cursor: pointer;
     }
+
     img:active {
       transform: scale(0.9);
     }
   }
+
   .equ-info {
     width: 190px;
     height: 35px;
@@ -212,6 +187,7 @@ const equipment = {
     line-height: 35px;
     margin: 20px 30px 0px 30px;
   }
+
   .setting {
     .setting-item {
       padding: 30px 30px 10px 30px;
@@ -226,23 +202,27 @@ const equipment = {
         margin-bottom: 20px;
       }
     }
+
     :deep(.el-select) {
       width: 284px;
       //height: 51px;
       border: transparent;
     }
+
     :deep(.el-input--suffix) {
       width: 284px;
       height: 51px;
       background: rgba(7, 35, 72, 0.79);
       border: 2px solid #0f82af;
     }
+
     :deep(.el-input__wrapper) {
       background: transparent;
       border: none !important;
       padding: 0px 12px 0px 10px;
       box-shadow: none !important;
     }
+
     :deep(.el-input__wrapper input) {
       background: transparent;
       height: 100%;
@@ -251,19 +231,23 @@ const equipment = {
       color: #08b7b8;
       line-height: 37px;
     }
+
     :deep(.el-icon) {
       color: #05feff;
       font-size: 34px;
     }
   }
+
   .btn {
     margin: 100px 40px 40px 40px;
     display: flex;
     justify-content: space-between;
+
     button {
       cursor: pointer;
       transition: transform 0.1s linear 0s;
     }
+
     & :nth-child(1) {
       width: 190px;
       height: 60px;
@@ -275,6 +259,7 @@ const equipment = {
       color: #08b7b8;
       line-height: 60px;
     }
+
     & :nth-child(2) {
       width: 190px;
       height: 60px;
@@ -286,6 +271,7 @@ const equipment = {
       color: #ffffff;
       line-height: 60px;
     }
+
     button:active {
       transform: scale(0.9);
     }

src/components/content/tunnelScene/sceneClass/demo.js

@@ -487,4 +487,38 @@ export default class Demo {
       opacityTween(0.1, 0.5, true);
     }
   }
+
+
+  ThreeConfig = {
+    code: 0,
+    data: {
+      tunnelThreeConfig: [{
+        equipmentId: 'fan_01',//传感器id
+        equipmentName: '01',//设备名称
+        pointName: 'point_005_tl',//附着点名称(定位)
+        equipmentType: 'fan',//设备类型(类型可根据后端
+        equipmentValue: 23, //设备存的值
+      }, {
+        equipmentId: 'sensors_01',//传感器id
+        equipmentName: '01',//设备名称
+        pointName: 'point_009_bl',//附着点名称(定位)
+        equipmentType: 'sensors',//设备类型(类型可根据后端
+        equipmentValue: 67, //设备存的值
+      }],
+    },
+    msg: "dda"
+  }
+  tunnelConfigEquipment = this.ThreeConfig.data.tunnelThreeConfig
+  tunnelModeInit() {
+    for (const item of this.tunnelConfigEquipment) {
+      //使用api取拿到附着点
+      let pointmodel = this.scene.getObjectByName(item.pointName)
+      let formInfo = {
+        equipmentType: item.equipmentType, //设备类型
+        chooseEquipment: item.equipmentName, //设备选择(设备名称)
+        threshold: item.equipmentValue, //阈值
+      }
+      this.addEquipment(pointmodel, formInfo);
+    }
+  }
 }

src/components/content/tunnelScene/sceneClass/editEquipment/index.js

@@ -4,6 +4,9 @@ import EquipmentTag from "../utils/EquipmentTag";
  * @param {Mesh} targetPoint
  * @param {String} equType  "fan" "sensors"
  */
+//formInfo需要的信息这里包括了
+//equipmentType、
+
 function addEquipment(targetPoint, formInfo) {
   if (targetPoint.hasDevice) {
     alert("已添加设备");