[Mod 0000] 三道沟通风首页对接均压模型添加全屏功能

src/views/vent/home/configurable/ventSDG.vue

@@ -1,8 +1,25 @@
 <!-- eslint-disable vue/multi-word-component-names -->
 <template>
   <div class="company-home">
-    <div style="width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0">
+    <CustomHeader> 三道沟煤矿均压综采面智能监测与动态调控 </CustomHeader>
+    <!-- <div style="width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0">
       <VentModal />
+    </div> -->
+    <div class="bg" style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; overflow: hidden; z-index: 0">
+      <a-spin :spinning="loading" />
+      <div id="balancePress3D" v-show="!loading" style="width: 100%; height: 100%; position: absolute; overflow: hidden"> </div>
+      <!-- <div id="damper3DCSS" v-show="!loading" style="width: 100%; height: 100%; top:0; left: 0; position: absolute; overflow: hidden;">
+      <div>
+        <div ref="elementContent" class="elementContent">
+          <p><span class="data-title">压力(Pa)：</span>{{selectData.frontRearDP}}</p>
+          <p><span class="data-title">动力源压力(MPa)：</span>{{selectData.sourcePressure}}</p>
+          <p><span class="data-title">故障诊断：</span>
+            <i
+              :class="{'state-icon': true, 'open': selectData.messageBoxStatus, 'close': !selectData.messageBoxStatus}"
+            ></i>{{selectData.fault}}</p>
+        </div>
+      </div>
+    </div> -->
     </div>
     <!-- 如果是有 deviceType、type 等 query，认为是详情页，不需要展示普通模块，只需要模型 -->
     <template v-if="!route.query.deviceType">
@@ -29,8 +46,11 @@
           :module-name="cfg.moduleName"
           :device-type="cfg.deviceType"
           :data="data"
-          :visible="true"
+          :visible="showModules"
         />
+
+        <div v-if="showModules" class="switch-button icon-goto right-475px bottom-300px" @click="showModules = false"></div>
+        <div v-else class="switch-button icon-goto right-20px bottom-20px" @click="showModules = true"></div>
       </template>
       <template v-else-if="isCommon">
         <ModuleCommon
@@ -71,11 +91,11 @@
         class="switch-button report-mode right-525px"
         @click="switchDataMode"
       ></div> -->
-      <div class="switch-button icon-goto right-475px" @click="goMicroApp()"></div>
     </template>
   </div>
 </template>
 <script lang="ts" setup>
+  import CustomHeader from '/@/components/vent/customHeader.vue';
   import { onMounted, onUnmounted, ref, watch } from 'vue';
   // import { CaretDownOutlined } from '@ant-design/icons-vue';
   // import MonitorBar from './components/MonitorBar.vue';
@@ -85,6 +105,7 @@
   import ModuleCommon from './components/ModuleCommon.vue';
   // import { useRoute } from 'vue-router';
   import VentModal from '/@/components/vent/micro/ventModal.vue';
+  import { mountedThree, destroy, setModelType, updateText, play } from '/@/views/vent/monitorManager/balancePressMonitor/balancePress.threejs';
   import { list } from './configurable.api';
   import { useRoute, useRouter } from 'vue-router';
   import { useGlobSetting } from '/@/hooks/setting';
@@ -97,6 +118,8 @@
   const router = useRouter();
   const isDataRealTime = ref(sysDataType === 'monitor');
   // const showBar = ref(true);
+  const loading = ref(false);
+  const showModules = ref(true);
   let interval: number | undefined;
 
   // function switchDataMode() {
@@ -184,9 +207,16 @@
   onMounted(() => {
     refresh();
     initInterval();
+
+    mountedThree().then(async () => {
+      await setModelType('balancePressTun'); //balancePressBase
+      loading.value = false;
+      play('startSmoke', 'top', 30, 'open', 0);
+    });
   });
 
   onUnmounted(() => {
+    destroy();
     clearInterval(interval);
   });
 </script>
@@ -280,7 +310,7 @@
       height: 34px;
       position: absolute;
       // right: 5px;
-      bottom: 300px;
+      // bottom: 300px;
       z-index: 5;
       background-repeat: no-repeat;
       background-size: 100% 100%;