[Feat 0000]风门svg动画

src/views/vent/monitorManager/gateMonitor/components/GateShrinkSVG.vue

@@ -9,7 +9,7 @@
     y="0px"
     width="1920px"
     height="1080px"
-    viewBox="0 0 1920 1080"
+    viewBox="0 230 1920 1080"
   >
     <defs>
       <linearGradient id="Gradient_1" gradientUnits="userSpaceOnUse" x1="188.175" y1="25.7" x2="189.825" y2="25.7" spreadMethod="reflect">
@@ -857,9 +857,11 @@ onMounted(() => {
 });
 
 /** 根据SVG的使用场景播放动画 */
-function animate() {
+function animate(frontDoorIsOpen: boolean, middleDoorIsOpen: boolean, rearDoorIsOpen: boolean) {
   // 在SVG图片中，找到需要动起来的元素（类似<use xlink:href="#RE_L_0_Layer0_0_FILL"></use>），并填入id即可控制该元素的动画（如有）
-  // triggerAnimation(["___2_0_Layer0_0_FILL","___3_0_Layer0_0_FILL"], false);
+  // triggerAnimation(["___4_0_Layer0_0_FILL","___3_0_Layer0_0_FILL"], false);
+  triggerAnimation([`anim____2_0_Layer0_0_FILL_0${props.identify}`, `anim____2_0_Layer0_0_FILL_1${props.identify}`], !rearDoorIsOpen);
+  triggerAnimation([`anim____3_0_Layer0_0_FILL_0${props.identify}`, `anim____3_0_Layer0_0_FILL_1${props.identify}`], !frontDoorIsOpen);
 }
 
 // 导出方法以便外部调用

src/views/vent/monitorManager/gateMonitor/components/GateYeYaSVG.vue

@@ -9,7 +9,7 @@
     y="0px"
     width="1920px"
     height="1080px"
-    viewBox="0 0 1920 1080"
+    viewBox="0 230 1920 1080"
   >
     <defs>
       <linearGradient id="Gradient_1" gradientUnits="userSpaceOnUse" x1="188.175" y1="25.7" x2="189.825" y2="25.7" spreadMethod="reflect">
@@ -1200,9 +1200,11 @@ onMounted(() => {
 });
 
 /** 根据SVG的使用场景播放动画 */
-function animate() {
+function animate(frontDoorIsOpen: boolean, middleDoorIsOpen: boolean, rearDoorIsOpen: boolean) {
   // 在SVG图片中，找到需要动起来的元素（类似<use xlink:href="#RE_L_0_Layer0_0_FILL"></use>），并填入id即可控制该元素的动画（如有）
-  // triggerAnimation(["___11_0_Layer0_0_FILL","___12_0_Layer0_0_FILL","___7_0_Layer0_0_FILL","___8_0_Layer0_0_FILL"], false);
+  // triggerAnimation(["___4_0_Layer0_0_FILL","___3_0_Layer0_0_FILL"], false);
+  triggerAnimation([`anim____11_0_Layer0_0_FILL_0${props.identify}`, `anim____12_0_Layer0_0_FILL_0${props.identify}`], !rearDoorIsOpen);
+  triggerAnimation([`anim____7_0_Layer0_0_FILL_1${props.identify}`, `anim____8_0_Layer0_0_FILL_1${props.identify}`], !frontDoorIsOpen);
 }
 
 // 导出方法以便外部调用

src/views/vent/monitorManager/gateMonitor/gate.data.ts

@@ -432,7 +432,11 @@ export function getModelComponent(is2DModel: boolean = false, type?: string) {
         return getComponent('gateDualSVG');
       default:
         // return getComponent('gateTripleSVG');
-        return getComponent('gateTripleSVG');
+        // return getComponent('gateTripleSVG');
+        // return getComponent('gateSanDaoShenSuoSVG'); //三道伸缩风门
+        // return getComponent('gateXrSVG'); //行人风门
+        // return getComponent('GateYeYaSVG'); //液压风门
+        return getComponent('GateShrinkSVG'); //收缩风门
     }
   });
 }