trp:设备hover回显面板数据绑定和模拟模式3d场景添加

src/components/content/tunnelScene/TunnelScene.vue

@@ -3,17 +3,34 @@
     <div id="cvs" ref="content"></div>
     <dev-info ref="info" :devInfo="devInfo" />
     <!-- 这里的预览模式需要做成不能修改的模式 -->
-    <edit-dialog ref="edit" @addEquipment="handleAddEqu" @removeEquipment="handleRemoveEqu" @cancel="handleCancel"
-      :hasDev="hasDevice" :pointNum="pointNum" :tunnelId="params.tunnelId" :position="targetP?.name"
-      :hasEquipment="hasDevice" :pointGap="pointGap" :form="params.form" />
-    <el-dialog v-model="centerDialogVisible" width="30%" destroy-on-close center :show-close="false" style="
+    <edit-dialog
+      ref="edit"
+      @addEquipment="handleAddEqu"
+      @removeEquipment="handleRemoveEqu"
+      @cancel="handleCancel"
+      :hasDev="hasDevice"
+      :pointNum="pointNum"
+      :tunnelId="params.tunnelId"
+      :position="targetP?.name"
+      :hasEquipment="hasDevice"
+      :pointGap="pointGap"
+      :form="params.form"
+    />
+    <el-dialog
+      v-model="centerDialogVisible"
+      width="30%"
+      destroy-on-close
+      center
+      :show-close="false"
+      style="
         margin: 20% auto;
         width: 569px;
         height: 330px;
         background: rgba(7, 35, 72, 0.79);
         border-radius: 20px;
         border: 2px solid #0f82af;
-      ">
+      "
+    >
       <p id="remove-title">是否确定删除该设备</p>
       <div class="btn">
         <button @click="centerDialogVisible = false">取消</button>
@@ -61,7 +78,13 @@ const loader = new OBJLoader();
 let hdrLoader = new RGBELoader();
 let backColorSet = three.sRGBEncoding;
 const modelStore = useModelSceneStore();
-const params = defineProps(["isedit", "tunnelId", "tunnelLength", "form"]); //接收参数看是不是编辑模式，如果是编辑模式，则需要做一些处理
+const params = defineProps([
+  "isedit",
+  "tunnelId",
+  "tunnelLength",
+  "form",
+  "devRealtimeData",
+]); //接收参数看是不是编辑模式，如果是编辑模式，则需要做一些处理
 
 let isedit = ref(params.isedit);
 let tunnelId = reactive(params.tunnelId);
@@ -116,11 +139,10 @@ async function handleMounted() {
     // modelList.value = await initData(params.tunnelId, params.form);
     console.log("test", modelList.value);
     demo.editTunnelInit(toRaw(modelList.value));
-    demo.SignsInf(params.form.tunnelAlias, String(params.tunnelLength))
+    demo.SignsInf(params.form.tunnelAlias, String(params.tunnelLength));
   } catch (err) {
-    console.log(err);
     ElMessage({
-      message: "场景初始化异常---！",
+      message: "场景初始化异常！",
       type: "warning",
     });
   }
@@ -134,7 +156,7 @@ function loadModel(path) {
       (obj) => {
         resolve(obj);
       },
-      (xhr) => { },
+      (xhr) => {},
       (err) => {
         reject(err);
       }
@@ -247,14 +269,13 @@ function handleConfirmAddEqu() {
         type: "success",
       });
     })
-    .catch(
-      (res) => {
-        console.log(res);
-        ElMessage({
-          message: "删除失败！",
-          type: "warning",
-        });
+    .catch((res) => {
+      console.log(res);
+      ElMessage({
+        message: "删除失败！",
+        type: "warning",
       });
+    });
 }
 // 处理取消关闭编辑框事件
 function handleCancel() {
@@ -291,6 +312,11 @@ const ThreeConfig = {
   },
   msg: "dda",
 };
+
+//=================实时更新数据
+watch(devRealtimeData, () => {
+  console.log("devRealtimeData：", devRealtimeData);
+});
 </script>
 
 <style lang="scss" scoped>