[Mod 0000] 主风机添加了挡板动画

src/components/vent/fourBorderBg.vue

@@ -12,65 +12,61 @@
   </div>
 </template>
 <script>
-import { defineComponent } from 'vue'
-export default defineComponent ({
-  name: 'FourBorderBg',
-  setup(){
-
-  }
-})
+  import { defineComponent } from 'vue';
+  export default defineComponent({
+    name: 'FourBorderBg',
+    setup() {},
+  });
 </script>
 
 <style lang="less" scoped>
-.four-border-bg {
-  position: relative;
-  .main-container {
-    min-width: 60px;
-    border: 1px solid #4D7AD855;
-    border-radius: 2px;
-    background-color: #001d3055;
-    // backdrop-filter: blur(2px);
-    box-shadow: 0 0 10px #5984E055 inset;
-    padding: 5px 8px;
-    color: #ffffffee;
-  }
-  .border_corner{
-    z-index: 2500;
-    position: absolute;
-    width: 10px;
-    height: 10px;
-    background-color: rgba(0,0,0,0);
-    border: 2px solid #6788CE;
-  }
-  .border_corner_left_top{
-    top: 0;
-    left: 0;
-    border-right: none;
-    border-bottom: none;
-    border-top-left-radius: 2px;
-  }
-  .border_corner_right_top{
-    top: 0;
-    right: 0;
-    border-left: none;
-    border-bottom: none;
-    border-top-right-radius: 2px;
+  .four-border-bg {
+    position: relative;
+    .main-container {
+      min-width: 60px;
+      border: 1px solid #4d7ad855;
+      border-radius: 2px;
+      background-color: #001d3055;
+      // backdrop-filter: blur(2px);
+      box-shadow: 0 0 10px #5984e055 inset;
+      padding: 5px 8px;
+      color: #ffffffee;
+    }
+    .border_corner {
+      z-index: 2500;
+      position: absolute;
+      width: 10px;
+      height: 10px;
+      background-color: rgba(0, 0, 0, 0);
+      border: 2px solid #6788ce;
+    }
+    .border_corner_left_top {
+      top: 0;
+      left: 0;
+      border-right: none;
+      border-bottom: none;
+      border-top-left-radius: 2px;
+    }
+    .border_corner_right_top {
+      top: 0;
+      right: 0;
+      border-left: none;
+      border-bottom: none;
+      border-top-right-radius: 2px;
+    }
+    .border_corner_left_bottom {
+      bottom: 0;
+      left: 0;
+      border-right: none;
+      border-top: none;
+      border-bottom-left-radius: 2px;
+    }
+    .border_corner_right_bottom {
+      bottom: 0;
+      right: 0;
+      border-left: none;
+      border-top: none;
+      border-bottom-right-radius: 2px;
+    }
   }
-  .border_corner_left_bottom{
-    bottom: 0;
-    left: 0;
-    border-right: none;
-    border-top: none;
-    border-bottom-left-radius: 2px;
-  }
-  .border_corner_right_bottom{
-    bottom: 0;
-    right: 0;
-    border-left: none;
-    border-top: none;
-    border-bottom-right-radius: 2px;
-
-  }
-}
-
 </style>

src/utils/threejs/useThree.ts

@@ -297,6 +297,15 @@ class UseThree {
                     },
                   }).then(async (data) => {
                     const arrayBuffer = await data.arrayBuffer();
+                    // 将资源存放到db
+                    const fileName = `${baseApiUrl}/sys/common/static/${file.path}`.replace(/(.*\/)*([^.]+).*/gi, '$2');
+                    const model = {
+                      modalName: fileName,
+                      modalVal: arrayBuffer,
+                      versionStr: fileName,
+                    };
+                    db.open();
+                    await db.modal.add(model);
                     gltfLoader.parse(
                       arrayBuffer,
                       '/model/glft/',

src/views/vent/deviceManager/comment/warningTabel/BaseModal.vue

@@ -30,7 +30,7 @@
     deviceId: { type: String },
     monitorType: {
       type: String,
-      default: '2,3,9',
+      default: '2,3,9,202,203,209',
     },
   });
   const emit = defineEmits(['add', 'update', 'register']);

src/views/vent/deviceManager/comment/warningTabel/BaseModal1.vue

@@ -72,7 +72,7 @@
 
   async function getDevicePointList(strtype) {
     try {
-      const result = await workFacePointList({ deviceType: strtype, valueTypes: '2,3,9' });
+      const result = await workFacePointList({ deviceType: strtype, valueTypes: '2,3,9,202,203,209' });
       devicePointList.value = result;
     } catch (error) {
       devicePointList.value = [];

src/views/vent/deviceManager/comment/warningTabel/index3.vue

@@ -21,7 +21,7 @@
       </a-table>
     </div>
   </div>
-  <BaseModal @register="register" @add="onSubmit" @update="onSubmit" :form-schemas="formSchemas" :monitor-type="'2,3,9'" />
+  <BaseModal @register="register" @add="onSubmit" @update="onSubmit" :form-schemas="formSchemas" :monitor-type="'2,3,9,202,203,209'" />
 </template>
 
 <script lang="ts" setup>

src/views/vent/deviceManager/comment/warningTabel/index4.vue

@@ -24,7 +24,7 @@
   <BasicModal @register="register" :width="800" :min-height="600" @ok="onSubmit">
     <BasicForm @register="registerForm" />
   </BasicModal>
-  <!-- <BaseModal @register="register" @add="onSubmit" @update="onSubmit" :form-schemas="formSchemas" :monitor-type="'2,3,9'" /> -->
+  <!-- <BaseModal @register="register" @add="onSubmit" @update="onSubmit" :form-schemas="formSchemas" :monitor-type="'2,3,9,202,203,209'" /> -->
 </template>
 
 <script lang="ts" setup>

src/views/vent/monitorManager/mainFanMonitor/mainWind.xj.threejs.ts

@@ -14,6 +14,8 @@ class mainXjWindRect {
   airJin2: THREE.Mesh | null = null; //风向箭头
   airChu1: THREE.Mesh | null = null; //风向箭头
   airChu2: THREE.Mesh | null = null; //风向箭头
+  frontPlane: THREE.Mesh | null = null;
+  backPlane: THREE.Mesh | null = null;
   gearFront = {
     gear1: null, //扇叶
     gear2: null, //扇叶
@@ -497,7 +499,7 @@ class mainXjWindRect {
   lookMotor(deviceType, flag, duration = 5) {
     return new Promise((resolve) => {
       const ztfjGroup = this.group?.getObjectByName('ztfj');
-      let fengJiWaiKeGoup1, fengJiWaiKeGoup2, mesh, mesh1, mesh2, motorGroup;
+      let fengJiWaiKeGoup1, fengJiWaiKeGoup2, mesh, mesh1, mesh2, motorGroup, plane;
 
       fengJiWaiKeGoup1 = ztfjGroup?.getObjectByName('FengJiWaiKe_1'); //前
       fengJiWaiKeGoup2 = ztfjGroup?.getObjectByName('FengJiWaiKe_2'); //前
@@ -507,9 +509,11 @@ class mainXjWindRect {
       if (deviceType == 'front') {
         mesh = mesh1;
         motorGroup = this.motorGroup2;
+        plane = this.frontPlane;
       } else {
         mesh = mesh2;
         motorGroup = this.motorGroup1;
+        plane = this.backPlane;
       }
       if (mesh && motorGroup) {
         if (flag == 'open') {
@@ -541,6 +545,28 @@ class mainXjWindRect {
           });
         }
       }
+      // 插板
+      if (plane) {
+        if (flag == 'open') {
+          gsap.to(plane.position, {
+            z: -70,
+            duration: duration / 2,
+            overwrite: true,
+            onComplete: function () {
+              resolve(null);
+            },
+          });
+        } else {
+          gsap.to(plane.position, {
+            z: 30,
+            duration: duration / 2,
+            overwrite: true,
+            onComplete: function () {
+              resolve(null);
+            },
+          });
+        }
+      }
     });
   }
 
@@ -737,18 +763,20 @@ class mainXjWindRect {
     this.group = new THREE.Group();
     return new Promise(async (resolve) => {
       this.model.setGLTFModel('ztfj-xj').then(async (gltf) => {
+        debugger;
         const ztfjModal = gltf[0].children[0];
         ztfjModal.name = 'ztfj';
-        gltf[0].children.forEach((item) => {
-          item.position.set(4.64, 4.11, 1.52);
-        });
+        // gltf[0].children.forEach((item) => {
+        //   item.position.set(4.64, 4.11, 1.52);
+        // });
+        gltf[0].position.set(4.64, 4.11, 1.52);
         this.group?.add(gltf[0]);
         // this.group?.position.set(4.77, 3.63, 0.63);
         this.group?.position.set(-0.44, 47.32, 22.37);
         this.initSmokeMass();
         await this.setSmokePosition();
 
-        const ztfjGroup = this.group?.getObjectByName('ztfj');
+        const ztfjGroup = gltf[0]?.getObjectByName('ztfj');
         const fengJiWaiKeGoup1 = ztfjGroup?.getObjectByName('FengJiWaiKe_1'); //前
         const mesh = fengJiWaiKeGoup1?.getObjectByName('transparent_shell02'); //前
         if (mesh && mesh.material) this.oldMaterial = mesh.material as THREE.MeshStandardMaterial;
@@ -761,8 +789,15 @@ class mainXjWindRect {
         this.airJin2 = airJinGroup.getObjectByName('pasted__Jin_2') as THREE.Mesh;
         this.airChu1 = airChuGroup.getObjectByName('pasted__Chu_1') as THREE.Mesh;
         this.airChu2 = airChuGroup.getObjectByName('pasted__Chu_2') as THREE.Mesh;
-        const loader = new THREE.TextureLoader();
 
+        debugger;
+        //挡板
+        this.frontPlane = gltf[0]?.getObjectByName('ChaBan')?.getObjectByName('ChaBan_ban_pCube8') as THREE.Mesh;
+        this.backPlane = gltf[0]?.getObjectByName('ChaBan1')?.getObjectByName('ChaBan1_ban_pCube8') as THREE.Mesh;
+        if (this.frontPlane) this.frontPlane.position.setZ(30);
+        if (this.backPlane) this.backPlane.position.setZ(30);
+
+        const loader = new THREE.TextureLoader();
         this.airTexture = loader.load('/model/img/air.png');
         this.airTexture.wrapS = THREE.RepeatWrapping;
         this.airTexture.repeat.set(1, 1.2);