优化模型加载及切换

src/pages/components/Bottom.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="bottom" style="z-index: 1000;">
         <div style="display: flex; justify-content: left; flex-flow: row;height: 100%;">
-            <div :class="item.active?'btn active':'btn'" v-for="item in navlist" :style="{backgroundImage: item.active?`url(${btnFrontBg})`:''}" @click="loadNavModel(item);">
+            <div :class="item.active?'btn active':'btn'" :title="ClickTimeLong>0?'正在努力加载模型，请稍候':''" v-for="item in navlist" :style="{backgroundImage: item.active?`url(${btnFrontBg})`:''}" @click="loadNavModel(item);">
                 <img :src="item.active?item.img1:item.img" :key="item.code" :t='item.code' :class="item.active?'active':''">
                 <div>{{ item.name }}</div>
             </div>
@@ -23,13 +23,13 @@ export default {
     },
     setup(props,{emit}) {
         let clickTime = 0;
-        let ClickTimeLong = 2;//导航间隔时长
+        const ClickTimeLong = ref(10);//导航间隔时长，单位：秒.为0表示不控制操作间隔
         let clickTimer = null;
         const showIndexData = ref('');
         let dataTimer = null;
         const btnFrontBg = require('@/assets/image/nav_btn_front.png');
         let navlist=ref([
-            {"code":"FAC","name":"全厂","active":true,"img":require('@/assets/image/nav_ico_fac1.png'),"img1":require('@/assets/image/nav_ico_fac2.png')},
+            {"code":"FAC","name":"全厂","active":false,"img":require('@/assets/image/nav_ico_fac1.png'),"img1":require('@/assets/image/nav_ico_fac2.png')},
             {"code":"IN02","name":"经编","active":false,"img":require('@/assets/image/nav_ico_in021.png'),"img1":require('@/assets/image/nav_ico_in022.png')},
             //{"code":"IN04","name":"前整","active":false,"img":require('@/assets/image/nav_ico_in041.png'),"img1":require('@/assets/image/nav_ico_in042.png')},
             {"code":"IN03","name":"染整","active":false,"img":require('@/assets/image/nav_ico_in031.png'),"img1":require('@/assets/image/nav_ico_in032.png')},
@@ -46,6 +46,7 @@ export default {
                         navlist.value[i].active=true;
                     }else navlist.value[i].active=false;
                 }
+                ClickTimeLong.value = 0;//菜单可以操作了
                 clickTimeCal();
             }
         },{deep:true,immediate:true})
@@ -75,17 +76,18 @@ export default {
         //const emit = defineEmits(['call']);
 
         function clickTimeCal(){
+            if(ClickTimeLong.value==0) return;
             clickTime = 0;
             window.clearInterval(clickTimer);
             clickTimer = setInterval(function(){
                 clickTime++; //切换间隔时长计数器
-                if(clickTime>10000) clickTime = ClickTimeLong;//达到一定时长时后，初始化为最大间隔时长
+                if(clickTime>10000) clickTime = ClickTimeLong.value;//达到一定时长时后，初始化为最大间隔时长
             },1000)
         }
 
         function loadNavModel(item){
-            if(clickTime<ClickTimeLong){
-                //切换间隔小于4秒时，不响应
+            if(ClickTimeLong.value>0 && clickTime<ClickTimeLong.value){
+                //切换间隔小于N秒时，不响应
                 return;
             }
             for(let i=0;i<navlist.value.length;i++){
@@ -109,6 +111,7 @@ export default {
         return{
             navlist,
             btnFrontBg,
+            ClickTimeLong,
             loadNavModel
         }
     }

src/pages/components/Fac.vue

@@ -177,6 +177,7 @@ export default {
                 //模型加载完成
                 console.log('全厂模型加载完成')
                 try{
+                    backMasterViewByFac();
                     if(MarkerMapFac["FAC"]!=null && player!=null && player.Native!=null){
                         for(let key in MarkerMapFac["FAC"]){
                             player.Native.GisMarker.destroy(key)
@@ -184,7 +185,7 @@ export default {
                     }
                     MarkerMapFac["FAC"] = {};
                     loadmarkers();
-                    backMasterViewByFac();
+                    
                 }catch(e){
                     window.location.reload();
                 }
@@ -251,18 +252,17 @@ export default {
             }
         }
         //全局厂房最佳视图
-        function backMasterViewByFac(){
+        async function backMasterViewByFac(){
+            console.log(window.CurrentTargetType);
             if(window.CurrentTargetType!='FAC') return;
             // player.Native.Camera.moveTo([235.678127000173, 13.38107286701451, 74.13573809425804], [-1248.3191825020908, -262.59031050373517, -409.93944372657353], [-0.30023176822741604, -0.055832565112502126, 0.9522308596238611], 1);
-            player.Native.Camera.moveTo([132.11876502209185, -440.46670198759625, 492.25734718993556],
+            await player.Native.Camera.moveTo([132.11876502209185, -440.46670198759625, 492.25734718993556],
             [-640.8528070063287, 2116.1462138868947, -2471.4015229045867],
-            [-0.2149817792494004, 0.7110548607426664, 0.6694653236762824], 1);
-            // 使用异步函数
-            (async () => {
-                setTimeout(function() {
-                    if(window.CurrentTargetType=='FAC') player.Native.Camera.setAnchorPos([-45.87571144104003, -44.632896423339844, 43.90447044372559]);
-                }, 3000);
-            })();
+            [-0.2149817792494004, 0.7110548607426664, 0.6694653236762824], 1);            
+            // 使用异步函数，应该是需要等待模型相机变化完成后才能定位          
+            setTimeout(async()=> {
+                if(window.CurrentTargetType=='FAC') await player.Native.Camera.setAnchorPos([-45.87571144104003, -44.632896423339844, 43.90447044372559]);
+            }, 2000);
         }
 
         async function updateMarkerData(){
@@ -1095,7 +1095,6 @@ export default {
             clearTimeout(getDataTimer4);
             DataFull.GetFacData();
             DataFull.GetDeviceStat();
-            backMasterViewByFac();
         });
         onUnmounted(()=>{
             clearTimeout(getDataTimer);

src/pages/components/In02.vue

@@ -759,7 +759,7 @@ export default {
             (async () => {
                 setTimeout(function() {
                     if(window.CurrentTargetType=='IN02') player.Native.Camera.setAnchorPos([-18.374309539794922, -20.014415740966797, 0]);
-                }, 3000);
+                }, 2000);
             })();
         }
         //更改指示灯状态.版本2：更改设备标号牌旁边的指示灯模型

src/pages/components/In03.vue

@@ -637,7 +637,7 @@ export default {
             (async () => {
                 setTimeout(function() {
                     if(window.CurrentTargetType=='IN03') player.Native.Camera.setAnchorPos([-80.69618225097656,21.59876251220703,11.815500259399414]);
-                }, 3000);
+                }, 2000);
             })();
         }
         onMounted(()=>{

src/pages/main/index.vue

@@ -5,7 +5,7 @@
         <div v-if="!isLoaded" ref="loading" id="loading">正在加载模型中...</div>
         <div v-if="reconnect" class="reconnect">网络连接中断，正在进行重连...</div>
         <video ref="EngineContent" autoplay muted style="width: 1920px;height:1080px;">浏览器不支持</video>
-        <Fac v-if="currentTargetType=='FAC'" user-role="index" :fac-model-load-state="isLoaded"  @markerLClick="facMarkerLClick" @OpenIframeWin="OpenIframeWin"></Fac>
+        <Fac v-if="currentTargetType=='FAC'" user-role="index" :fac-model-load-state="facModelLoadState"  @markerLClick="facMarkerLClick" @OpenIframeWin="OpenIframeWin"></Fac>
         <In02 ref="In02Ele" v-if="currentTargetType=='IN02'" user-role="index" :click-event="In02ClickEvent" :in02-model-load-state="in02modelloadstate" :user-timeout="AutoPlayer"  @OpenIframeWin="OpenIframeWin"></In02>
         <In03 ref="In03Ele" v-if="currentTargetType=='IN03'" user-role="index" :click-event="In03ClickEvent" :in03-model-load-state="in03modelloadstate" :user-timeout="AutoPlayer"  @OpenIframeWin="OpenIframeWin"></In03>
         <!--
@@ -255,7 +255,7 @@ export default {
                         break;
                 }                
                 //调整视角，使其达到最佳初始效果
-                backMasterView();
+                //backMasterView();
                 //player.Native.Camera.moveToItem(lastPtr,1);
 
                 Native.ModelTree.EventBrowseLClick.connect((event) => {
@@ -337,6 +337,7 @@ export default {
         }
         async function loadFacModel(Native){
             if(currentTargetType.value=="FAC") return;
+            isLoaded.value=false;
             currentTargetType.value="FAC";
             await player.Native.Model.setModelVisible("IN02",false);
             await player.Native.Model.setModelVisible("IN03",false);
@@ -346,15 +347,14 @@ export default {
                 var cf = "data://models/T_ALL.pr";
                 var errStr = await PlayerUtils.call(Native.Model.loadModel, currentTargetType.value, cf);
                 modelLoadState[currentTargetType.value] = true;
-            }
-            facModelLoadState.value=true;//全厂模型加载完成
+            }            
             await player.Native.Settings.set('ambientIndenty', 'float', 0.39);//初始化环境光补偿
             await player.Native.Settings.set('diffuseIntensity', 'float', 1.2);//初始化光线强度
             await player.Native.Settings.set('specularIntensity', 'float', 0.64);//初始化高光强度
             await player.Native.Model.setModelVisible(currentTargetType.value,true);
-            await player.Native.CameraAnimation.clearKeyFrame();
-            isLoaded.value=true;
-            setTimeout(async() => {
+            facModelLoadState.value=true;//全厂模型加载完成
+            await player.Native.CameraAnimation.clearKeyFrame();            
+            setTimeout(async() => {                
                 var cf = "data://models/T_02.pr";
                 await PlayerUtils.call(Native.Model.loadModel, 'IN02', cf);
                 modelLoadState['IN02']=true;
@@ -362,8 +362,9 @@ export default {
                 var cf = "data://models/T_03.pr";
                 await PlayerUtils.call(Native.Model.loadModel, 'IN03', cf);
                 modelLoadState['IN03']=true;
-                await player.Native.Model.setModelVisible('IN03',false);
-            }, 500);
+                await player.Native.Model.setModelVisible('IN03',false);                
+                isLoaded.value=true;//所有模型加载，通知导航菜单可以进行切换操作了
+            }, 100);
         }
         //后整
         async function loadIn05Model(Native){
@@ -413,6 +414,7 @@ export default {
             player.Native.Settings.set('diffuseIntensity', 'float', 2.5);//初始化光线强度
             player.Native.Settings.set('specularIntensity', 'float', 0.6);//初始化高光强度
             if(currentTargetType.value=="IN03") return;
+            isLoaded.value=false;
             currentTargetType.value="IN03";
             await player.Native.Model.setModelVisible("FAC",false);
             await player.Native.Model.setModelVisible("IN02",false);
@@ -437,6 +439,7 @@ export default {
             player.Native.Settings.set('diffuseIntensity', 'float', 0.8);//初始化光线强度
             player.Native.Settings.set('specularIntensity', 'float', 0.64);//初始化高光强度
             if(currentTargetType.value=="IN02") return;
+            isLoaded.value=false;
             currentTargetType.value="IN02";
             await player.Native.Model.setModelVisible("FAC",false);
             await player.Native.Model.setModelVisible("IN03",false);