模型动画bug解决

src/layouts/default/header/index.vue

@@ -4,6 +4,7 @@
     <div :class="`${prefixCls}-left`">
       <!-- logo -->
       <!-- <AppLogo v-if="getShowHeaderLogo || getIsMobile" :class="`${prefixCls}-logo`" :theme="getHeaderTheme" :style="getLogoWidth" /> -->
+      <AppLogo  :class="`${prefixCls}-logo`" :theme="getHeaderTheme" :style="getLogoWidth" />
       <div v-if="!currentRoute.path.startsWith('/monitorChannel/monitor-')" style="margin-top: 5px; color: #aaa; margin-left: 10px; font-weight: 600"
         >/{{ currentRoute.meta.title }}</div
       >

src/views/vent/monitorManager/fanLocalMonitor/fanLocal.three.ts

@@ -265,21 +265,25 @@ export const addCssText = () => {
   }
   if (!group.getObjectByName('text4')) {
     const element = document.getElementById('gateBox') as HTMLElement;
-    const fanLocalCSS3D = new CSS3DObject(element);
-    fanLocalCSS3D.name = 'text4';
-    fanLocalCSS3D.scale.set(0.04, 0.04, 0.04);
-    fanLocalCSS3D.rotation.y = -Math.PI / 2;
-    fanLocalCSS3D.position.set(-73.13, 8.44, -23.52);
-    group.add(fanLocalCSS3D);
+    if (element) {
+      const fanLocalCSS3D = new CSS3DObject(element);
+      fanLocalCSS3D.name = 'text4';
+      fanLocalCSS3D.scale.set(0.04, 0.04, 0.04);
+      fanLocalCSS3D.rotation.y = -Math.PI / 2;
+      fanLocalCSS3D.position.set(-73.13, 8.44, -23.52);
+      group.add(fanLocalCSS3D);
+    }
   }
   if (!group.getObjectByName('text5')) {
     const element = document.getElementById('windownBox') as HTMLElement;
-    const fanLocalCSS3D = new CSS3DObject(element);
-    fanLocalCSS3D.name = 'text5';
-    fanLocalCSS3D.scale.set(0.07, 0.07, 0.07);
-    fanLocalCSS3D.rotation.y = -Math.PI / 2;
-    fanLocalCSS3D.position.set(-28.44, 9.78, -40.42);
-    group.add(fanLocalCSS3D);
+    if (element) {
+      const fanLocalCSS3D = new CSS3DObject(element);
+      fanLocalCSS3D.name = 'text5';
+      fanLocalCSS3D.scale.set(0.07, 0.07, 0.07);
+      fanLocalCSS3D.rotation.y = -Math.PI / 2;
+      fanLocalCSS3D.position.set(-28.44, 9.78, -40.42);
+      group.add(fanLocalCSS3D);
+    }
   }
 };
 

src/views/vent/monitorManager/fanLocalMonitor/index.vue

@@ -23,13 +23,13 @@
             <p>回风侧瓦斯浓度：{{ selectData.gas3 ? selectData.gas3 : '-' }}</p>
           </div>
         </div>
-        <div class="elementTag" id="gateBox">
+        <div v-if="selectRowIndex > 0" class="elementTag" id="gateBox">
           <div class="elementContent">
-            <p>风门状态：关</p>
+            <p>风门状态：关{{ selectRowIndex }}</p>
             <p>风门过风面积：{{ selectData.gas1 ? selectData.gas1 : '-' }}</p>
           </div>
         </div>
-        <div class="elementTag" id="windownBox">
+        <div v-if="selectRowIndex == 0" class="elementTag" id="windownBox">
           <div class="elementContent">
             <p>风窗开度：{{ selectData.getRotate1 ? selectData.getRotate1 : '-' }}</p>
             <p>过风面积：{{ selectData.getRotate2 ? selectData.getRotate2 : '-' }}</p>

src/views/vent/monitorManager/mainFanMonitor/index.vue

@@ -386,12 +386,17 @@
       loading.value = false;
     });
     const data = dataSource.value[baseDataIndex];
-    mainWindIsShow1.value = 'stop';
-    mainWindIsShow2.value = 'stop';
-    if (data['fanStart1'] == 1) {
+    if (data['Fan1StartStatus'] == 1) {
       mainWindIsShow1.value = 'open';
-    } else if (data['fanStart2'] == 1) {
+      frontMonitorIsShow.value = true
+    } else if (data['Fan2StartStatus'] == 1) {
       mainWindIsShow2.value = 'open';
+      backMonitorIsShow.value = true
+    } else {
+      frontMonitorIsShow.value = false
+      backMonitorIsShow.value = false
+      mainWindIsShow1.value = 'stop';
+      mainWindIsShow2.value = 'stop';
     }
     // play('initiatePlay', 'front', frequencyVal.value, 'open', 'tubPositivePath');
     return;
@@ -438,6 +443,17 @@
       }
     }
   };
+  // 根据实时监测的数据执行动画
+  const getState = (data) => {
+    // 根据监测数据判断哪个风机在运行
+    if (data['fanStart1'] == 1) {
+      mainWindIsShow1.value = 'open';
+    } else if (data['fanStart2'] == 1) {
+      mainWindIsShow2.value = 'open';
+    }
+
+  }
+
   // 风机操作
   // const handleOk = (e: MouseEvent) => {
   //   if (passWord.value !== '123456') {
@@ -493,6 +509,7 @@
   //   modalIsShow.value = false;
   // };
 
+  
   const handleOk = (e: MouseEvent) => {
     if (modalType.value == 'startSmoke') {
       if (mainWindIsShow1.value === 'open' && mainWindIsShow2.value === 'stop') {
@@ -556,7 +573,7 @@
     mountedThree(player1.value).then(async () => {
       // await setModelType('mainWindRect');
       getMonitor();
-      // addText('mainWindRect');
+      addText('mainWindRect');
       // play('initiatePlay', 'front', frequencyVal.value, 'open', 'tubPositivePath');
     });
   });

src/views/vent/monitorManager/mainFanMonitor/main.threejs.ts

@@ -140,6 +140,7 @@ export const play = (controlType, deviceType, frequencyVal?, state?, smokeDirect
 export const playAnimate = async (selectData, duration?) => {
   if (modalType === 'mainWindRect') {
     if (selectData) {
+      debugger;
       if (selectData.Fan1WindowOpen !== undefined) {
         // 主风机水平窗开启
         if (selectData.Fan1WindowOpen == 1) mainWindObj.openOrCloseWindow('front', 'openWindow');
@@ -159,50 +160,55 @@ export const playAnimate = async (selectData, duration?) => {
           mainWindObj.openOrCloseValve('front', 'close', duration);
         }
       }
+      if (selectData.Fan2ButterflyOpen !== undefined) {
+        if (selectData.Fan2ButterflyOpen == 1) {
+          // 主风机蝶阀打开
+          mainWindObj.openOrCloseValve('back', 'open', duration);
+        } else {
+          // 主风机蝶阀关闭
+          mainWindObj.openOrCloseValve('back', 'close', duration);
+        }
+      }
+
       if (selectData.Fan1FreqHz !== undefined) {
         // 主风机频率设置
         mainWindObj.resetSmokeParam('front', selectData.Fan1FreqHz, duration);
       }
+      if (selectData.Fan2FreqHz !== undefined) {
+        // 主风机频率设置
+        mainWindObj.resetSmokeParam('back', selectData.Fan2FreqHz, duration);
+      }
       if (selectData.Fan1StartStatus) {
         if (selectData.Fan1StartStatus == 1) {
           // 主风机开启
           mainWindObj.lookMotor('front', 'open', duration);
 
-          if (selectData.Fan1FreqForwardRun && selectData.Fan1FreqForwardRun == 1) {
-            // 主风机正转
-            await mainWindObj.setSmokeDirection('front', 'tubPositivePath');
-          } else if (selectData.Fan1FreqReverseRun && selectData.Fan1FreqReverseRun == 1) {
-            // 主风机反转
-            await mainWindObj.setSmokeDirection('front', 'tubInversePath');
-          }
-          if (mainWindObj.frontSmoke.frameId) mainWindObj.frontSmoke.startSmoke(duration);
+          // if (selectData.Fan1FreqForwardRun && selectData.Fan1FreqForwardRun == 1) {
+          //   // 主风机正转
+          //   await mainWindObj.setSmokeDirection('front', 'tubPositivePath');
+          // } else if (selectData.Fan1FreqReverseRun && selectData.Fan1FreqReverseRun == 1) {
+          //   // 主风机反转
+          //   await mainWindObj.setSmokeDirection('front', 'tubInversePath');
+          // }
+          // 齿轮转动
+          mainWindObj.startGearAnimation('front', 'open', 'tubPositivePath', selectData.Fan1FreqHz, duration);
+          await mainWindObj.setSmokeDirection('front', 'tubPositivePath');
+          if (!mainWindObj.frontSmoke.frameId) mainWindObj.frontSmoke.startSmoke(duration);
         } else {
           mainWindObj.lookMotor('front', 'close', duration);
         }
       }
-      if (selectData.Fan2ButterflyOpen !== undefined) {
-        if (selectData.Fan2ButterflyOpen == 1) {
-          // 主风机蝶阀打开
-          mainWindObj.openOrCloseVal('back', 'open', duration);
-        } else {
-          // 主风机蝶阀关闭
-          mainWindObj.openOrCloseVal('back', 'close', duration);
-        }
-      }
-
-      if (selectData.Fan2FreqHz) {
-        // 备风机频率设置
-        mainWindObj.resetSmokeParam('back', selectData.Fan1FreqHz, duration);
-      }
       if (selectData.Fan2StartStatus) {
         if (selectData.Fan2StartStatus == 1) {
           // 备风机开启
           mainWindObj.lookMotor('back', 'open', duration);
-          if (selectData.Fan2FreqForwardRun && selectData.Fan2FreqForwardRun == 1) {
-            // 主风机正转
-          } else if (selectData.Fan2FreqReverseRun && selectData.Fan2FreqReverseRun == 1) {
-            // 主风机反转
-          }
+          // if (selectData.Fan2FreqForwardRun && selectData.Fan2FreqForwardRun == 1) {
+          //   // 主风机正转
+          // } else if (selectData.Fan2FreqReverseRun && selectData.Fan2FreqReverseRun == 1) {
+          //   // 主风机反转
+          // }
+          await mainWindObj.setSmokeDirection('back', 'tubPositivePath');
+          if (!mainWindObj.backSmoke.frameId) mainWindObj.backSmoke.startSmoke(duration);
         } else {
           mainWindObj.lookMotor('back', 'close', duration);
         }
@@ -240,7 +246,6 @@ export const setModelType = (type) => {
 export const mountedThree = (playerVal1) => {
   return new Promise(async (resolve) => {
     model = new UseThree('#main3D', '#main3DCSS');
-
     model.setEnvMap('test1');
     model.renderer.toneMappingExposure = 1;
     addLight();

src/views/vent/monitorManager/windowMonitor/index.vue

@@ -316,7 +316,7 @@
   onMounted(() => {
     loading.value = true;
     mountedThree(player1.value).then(async () => {
-      await setModelType('singleWindow');
+      // await setModelType('singleWindow');
       loading.value = false;
       addFmText(selectData);
       getMonitor();

src/views/vent/monitorManager/windrectMonitor/longmen.threejs.ts

@@ -225,14 +225,25 @@ class lmWindRect {
   initAnimation() {
     const windGroup = new THREE.Group();
     windGroup.name = 'lmTanTou';
-    this.group?.children.forEach((obj) => {
-      if (obj.type === 'Mesh' && obj.name && obj.name.startsWith('LMtantou')) {
-        if (obj.name.startsWith('LMtantou')) {
-          windGroup.add(obj.clone());
-          this.group?.remove(obj);
-        }
+    // this.group?.children.forEach((obj) => {
+    //   if (obj.type === 'Mesh' && obj.name && obj.name.startsWith('LMtantou')) {
+    //     if (obj.name.startsWith('LMtantou')) {
+    //       windGroup.add(obj.clone());
+    //       this.group?.remove(obj);
+    //     }
+    //   }
+    // });
+    if (this.group?.children.length) {
+      for (let i = this.group?.children.length - 1; i > -1; i--) {
+        const obj = this.group?.children[i];
+          if (obj.type === 'Mesh' && obj.name && obj.name.startsWith('LMtantou')) {
+            if (obj.name.startsWith('LMtantou')) {
+              windGroup.add(obj.clone());
+              this.group?.remove(obj);
+            }
+          }
       }
-    });
+    }
     this.group?.add(windGroup);
   }