板板显示速度优化

src/pages/components/In02.vue

@@ -417,7 +417,6 @@ export default {
         let LastClickObj='';
         let dbClickTimer =null;
         let openState = false;
-        let modelsMap = {};
         let MarkerMap = {};//标记记录
         let MODEL_LOADED  = 1;
         let ALARM_DEVS=[];
@@ -570,7 +569,7 @@ export default {
         watch(() => props.in02ModelLoadState, newVal=> {
             console.log('经编模型加载状态：',newVal)
             if(newVal){
-                init();
+                //init();
             }
         },{deep:true,immediate:true})
         watch(() => props.userTimeout, newVal=> {
@@ -643,7 +642,7 @@ export default {
                         return
                     }
                     var jsondata = "," + res.data.join(",") + ",";
-                    for (var devcode in modelsMap) {
+                    for (var devcode in window.modelsMap) {
                         //判断当前设备是否在在线设备列表中
                         //设备原来未接入，现在接入了才恢复正常颜色
                         if (jsondata.indexOf("," + devcode + ",") > -1) {
@@ -675,6 +674,7 @@ export default {
                     if(res.code!=0){
                         return;
                     }
+                    DiffStatusDevList.value={};
                     res.data.detail.map(item=>{ 
                         DiffStatusDevList.value[item.device] = item;
                     });
@@ -690,20 +690,22 @@ export default {
                                 delete DiffStatusDevList.value[item.device];
                             }
                         }
-                    } 
+                    }
+                    console.log('设备变化列表：',JSON.parse( JSON.stringify( DiffStatusDevList.value)));
+                    let imgid0 = await player.Native.GisMarker.loadImage("data://icon/qietu/tip3.png");
+                    let imgidyellow = await player.Native.GisMarker.loadImage("data://icon/qietu/tip_yellow.png");
+                    let imgidred = await player.Native.GisMarker.loadImage("data://icon/qietu/tip_red.png");
                     for(var k in DiffStatusDevList.value){                         
                         let item = DiffStatusDevList.value[k];
                         //状态=0的显示生产中  蓝色，其他停机显示红色
-                        let devIten=modelsMap["C_"+item.device]||modelsMap["D_"+item.device];
-                        if(devIten==null) continue
-                        //console.log(item.device,'设备状态变化：',devIten)
+                        let devIten=window.modelsMap["C_"+item.device]||window.modelsMap["D_"+item.device];
+                        if(devIten==null) continue;
                         if(player!=null && player.Native!=null)player.Native.GisMarker.destroy(devIten['markPtr']);
                         let imgid = null;
                         let options = null;
                         if(item.status=="0"){ 
-                            continue;
                             //正常生产态                            
-                            imgid = await player.Native.GisMarker.loadImage("data://icon/qietu/tip3.png");
+                            imgid = imgid0;
                             options = {
                                 "text": " "+ k + "#"+"\r\r     正常生产中",
                                 "visible": true,
@@ -719,7 +721,7 @@ export default {
                         }else{
                             //停经 断纱 落卷 叫料 黄色
                             if(item.status=="1"||item.status=="7"||item.status=="2"||item.status=="6"){ 
-                                imgid = await player.Native.GisMarker.loadImage("data://icon/qietu/tip_yellow.png");
+                                imgid = imgidyellow;
                                 options = {
                                     "text":" "+ k + "#"+"\r\r     "+item.remark,
                                     "visible": true,
@@ -733,7 +735,7 @@ export default {
                                 }; 
                                 options.imgSize = [160, 80];
                             }else{
-                                imgid = await player.Native.GisMarker.loadImage("data://icon/qietu/tip_red.png");
+                                imgid = imgidred;
                                 options = {
                                     "text":" "+ k + "#"+"\r\r     "+item.remark,
                                     "visible": true,
@@ -750,9 +752,10 @@ export default {
                         }
                         options.imgId = imgid                        
                         options.pos = [devIten.xyz[0]+1, devIten.xyz[1]-3, 0]
-                        let markPtr = await player.Native.GisMarker.create(options);
-                        player.Native.GisMarker.update(markPtr, options);
-                        devIten['markPtr'] = markPtr;
+                        player.Native.GisMarker.create(options).then(markPtr=>{ 
+                            player.Native.GisMarker.update(markPtr, options);
+                            devIten['markPtr'] = markPtr;
+                        });                        
                     }
                     StopDevList.value = res.data.detail;                     
                 }).catch(res=>{
@@ -768,7 +771,7 @@ export default {
             }
             isshow_search_result.value=true;
             var lst = [];
-            for (var k in modelsMap) {
+            for (var k in window.modelsMap) {
                 if (k.indexOf(seachValue.value) > -1) {
                     lst.push({"code":k,"name":k.replace("C_", "小经编机").replace("D_", "大经编机")});
                 }
@@ -794,7 +797,14 @@ export default {
             }
         }
         async function init(){
-            backMasterViewBy02();
+            clearTimeout(dataTimer1);
+            clearTimeout(dataTimer2);
+            clearTimeout(dataTimer3);
+            clearTimeout(dataTimer4);
+            DataFull.GetData();
+            DataFull.GetAlarmData();
+            DataFull.GetOnlineDev();
+            backMasterViewBy02();           
             (async()=>{
                 let marklst = await player.Native.GisMarker.getMarkerList();
                 if(marklst!=null){
@@ -807,70 +817,82 @@ export default {
                 // 添加关键帧
                 player.Native.CameraAnimation.addKeyFrames([ANIMATION_DATA[i]]);
             }
-            //let cfInfo=await player.Native.Model.getInfo("all");
-            //player.Native.NodeProxy.setNodeRotation(cfInfo.nodePtr, [0,0,90]);
-            var rootItem = await player.Native.ModelTree.getRootItems();
-            var rootObj=null;
-            for (var i = 0; i < rootItem.length; i++) {
-                    if(rootItem[i].name=="T_02"){
-                        rootObj = rootItem[i]
-                        break;
-                    }
-            }
-             if(rootObj==null){
-                    console.log('未找到该模型的根节点')
-                    return;
-            }
-            var rowItems = await player.Native.ModelTree.getSubItems(rootObj.item)
-            for (var row = 0; row < rowItems.length; row++) {
-                if (rowItems[row].name.length < 2 || (rowItems[row].name.substr(0, 1) != "R" && rowItems[row].name.substr(0, 1) != "D")) continue;
-                var devItems = await player.Native.ModelTree.getSubItems(rowItems[row].item)
-                for (var i = 0; i < devItems.length; i++) {
-                    if (devItems[i].name.length < 2 || (devItems[i].name.substr(0, 2) != 'C_' && devItems[i].name.substr(0, 2) != 'D_')) continue
-                    var tmp = devItems[i];// await player.Native.ModelTree.findItemByName(name,0,true,3);
-
-                    //计算当前设备在世界坐标
-                    var xyz = await player.Native.ModelTree.calcItemAabb(tmp.item)
-                    var xyz2 = [(xyz.aabb.max[0] + xyz.aabb.min[0]) * 0.5, (xyz.aabb.max[1] + xyz.aabb.min[1]) * 0.5, (xyz.aabb.max[2] + xyz.aabb.min[2]) * 0.5];
-                    modelsMap[tmp.name] = {item: tmp.item, xyz: xyz2, rowno: rowItems[row].name.substr(1)}
-                    //console.log(tmp.name)
-                    //初始化设备状态颜色
-                    //ChangeModelAlarmState2(tmp.name);
-                        //创建指示灯标记
-                        /*
-                        var alarmColorMarker = {
-                            "text": "●",
-                            "visible": true,
-                            "maxLod": 110,
-                            "minLod": 0.1,
-                            "textFontSize": 14,
-                            "textColor": parseInt("0xffffff00") //透明色
+            //if(window.modelsMap==null){
+                window.modelsMap = {};
+                //let cfInfo=await player.Native.Model.getInfo("all");
+                //player.Native.NodeProxy.setNodeRotation(cfInfo.nodePtr, [0,0,90]);
+                var rootItem = await player.Native.ModelTree.getRootItems();
+                var rootObj=null;
+                for (var i = 0; i < rootItem.length; i++) {
+                        if(rootItem[i].name=="T_02"){
+                            rootObj = rootItem[i]
+                            break;
                         }
-                        alarmColorMarker.pos = [xyz2[0] + 0.7, xyz2[1] - 3, 0]
-                        var colormarkPtr = await player.Native.GisMarker.create(alarmColorMarker);
-                        player.Native.GisMarker.update(colormarkPtr, alarmColorMarker);
-                        modelsAlarmColorMap[tmp.name] = {itemPtr: colormarkPtr, options: alarmColorMarker}
-                        */
                 }
-            }
-            //console.log(modelsMap)
-            clearTimeout(dataTimer1);
-            clearTimeout(dataTimer2);
-            clearTimeout(dataTimer3);
-            clearTimeout(dataTimer4);
-            DataFull.GetData();
-            DataFull.GetAlarmData();
-            DataFull.GetOnlineDev();
-            DataFull.GetStopDev();
-            if (ALARM_DEVS.length > 0) {
-                for (var i = 0; i < ALARM_DEVS.length; i++) {
-                    var s = ALARM_DEVS[i].split(">")
-                    //ChangeModelColor(s[0],s[1] , s[2]);
-
-                    //ChangeModelAlarmState2(s[0], s[1]);
+                if(rootObj==null){
+                        console.log('未找到该模型的根节点')
+                        return;
                 }
-                ALARM_DEVS = [];//清除
-            }
+                var forCount={cnt:0,run:0};
+                var rowItems = await player.Native.ModelTree.getSubItems(rootObj.item)
+                function getxyz(rowItems) { 
+                        player.Native.ModelTree.getSubItems(rowItems.item).then(devItems=>{ 
+                        for (var i = 0; i < devItems.length; i++) {
+                            if (devItems[i].name.length < 2 || (devItems[i].name.substr(0, 2) != 'C_' && devItems[i].name.substr(0, 2) != 'D_')){
+                                 continue
+                            }
+                            //计算当前设备在世界坐标
+                            forCount.cnt++; //等待执行的计数器
+                            ((tmp) => {
+                                player.Native.ModelTree.calcItemAabb(tmp.item).then(xyz=>{ 
+                                    var xyz2 = [(xyz.aabb.max[0] + xyz.aabb.min[0]) * 0.5, (xyz.aabb.max[1] + xyz.aabb.min[1]) * 0.5, (xyz.aabb.max[2] + xyz.aabb.min[2]) * 0.5];
+                                    window.modelsMap[tmp.name] = {item: tmp.item, xyz: xyz2, rowno: rowItems.name.substr(1)};
+                                    forCount.run++; //已执行的计数器
+                                });   
+                            })(devItems[i]);
+                                                     
+                            //console.log(tmp.name)
+                            //初始化设备状态颜色
+                            //ChangeModelAlarmState2(tmp.name);
+                        }
+                    });
+                }
+                for (var row = 0; row < rowItems.length; row++) {
+                    if (rowItems[row].name.length < 2 || (rowItems[row].name.substr(0, 1) != "R" && rowItems[row].name.substr(0, 1) != "D")) continue;                    
+                    new getxyz(rowItems[row])
+                }
+            //}
+            var forChecktimer=null;            
+            if(forCount.cnt!=forCount.run){ 
+                forChecktimer = setInterval(() => {
+                    console.log("等待设备坐标计算完成...",forCount.cnt,"=",forCount.run)
+                     if(forCount.cnt<=forCount.run){
+                        clearInterval(forChecktimer);
+                        //console.log(modelsMap)
+                        DataFull.GetStopDev();
+                        if (ALARM_DEVS.length > 0) {
+                            for (var i = 0; i < ALARM_DEVS.length; i++) {
+                                var s = ALARM_DEVS[i].split(">")
+                                //ChangeModelColor(s[0],s[1] , s[2]);
+
+                                //ChangeModelAlarmState2(s[0], s[1]);
+                            }
+                            ALARM_DEVS = [];//清除
+                        }
+                    }
+                }, 100);
+            }  else{
+                        DataFull.GetStopDev();
+                        if (ALARM_DEVS.length > 0) {
+                            for (var i = 0; i < ALARM_DEVS.length; i++) {
+                                var s = ALARM_DEVS[i].split(">")
+                                //ChangeModelColor(s[0],s[1] , s[2]);
+
+                                //ChangeModelAlarmState2(s[0], s[1]);
+                            }
+                            ALARM_DEVS = [];//清除
+                        }
+            }          
         }
          //经编 2号楼内部最佳视图
         function backMasterViewBy02() {
@@ -902,7 +924,7 @@ export default {
         async function ChangeModelAlarmState2(name, color) {
             if(player.Native==null || window.CurrentTargetType!='IN02') return;
             color = color==null ? "" : color.toUpperCase();
-            var iteminfo = modelsMap[name]
+            var iteminfo = window.modelsMap[name]
             if (iteminfo == null) return;
             var t = (!color ||color=="00FF00"||color=="FFFFFF")?"g":(color=="FF0000"?"r":"y");
             var y_itemid=null,g_itemid=null,r_itemid=null;
@@ -933,7 +955,7 @@ export default {
         //设置设置名称或者模型id的颜色
         async function ChangeModelColor(name, color, hinttxt) {
             if(player.Native==null || window.CurrentTargetType!='IN02') return;
-            var iteminfo = modelsMap[name]
+            var iteminfo = window.modelsMap[name]
             if (iteminfo == null) return
             //var tmp = await player.Native.ModelTree.findItemByName(name,0,true,3);
             if (color == null || color == "") {
@@ -1012,7 +1034,7 @@ export default {
                 if (ty == 'NODE') p = await player.Native.NodeProxy.getNodeParent(modelsId) //节点类型的node
                 else p = await player.Native.ModelTree.getItemInfo(modelsId)
                 console.log('p:',p)
-                if (p != null &&p.name!=null && (p.name.substr(0, 2) == "C_")||p.name.substr(0, 2) == "D_") {
+                if (p != null &&p.name!=null && (p.name.substr(0, 2) == "C_"||p.name.substr(0, 2) == "D_")) {
                     devName = p.name
                     break
                 }
@@ -1041,7 +1063,7 @@ export default {
         }
         //显示设备基本信息
         async function ShowInfo(name) {
-            var se = modelsMap[name];// await player.Native.ModelTree.findItemByName(name,0,true,3);
+            var se = window.modelsMap[name];// await player.Native.ModelTree.findItemByName(name,0,true,3);
             if(se==null || player.Native==null || window.CurrentTargetType!='IN02') return;
             //选中
             player.Native.ModelTree.setSelectItem(se.item);
@@ -1689,7 +1711,7 @@ export default {
         function AlarmTable(data) {
             AlarmData.value = data;
             if (data == null || data.length == 0) {
-                for (var devcode in modelsMap) {
+                for (var devcode in window.modelsMap) {
                     if(LastAlarmDevs[devcode]==null) continue;
                     LastAlarmDevs[devcode] = null;
                     if (PanAlarm[devcode] == null) {
@@ -1719,7 +1741,7 @@ export default {
             //dev_alarm_list.value.innerHtml='<tbody>'+lst.join('')+'</tbody>';
             var noAlarmDevs = [];
 
-            for (var devcode in modelsMap) {
+            for (var devcode in window.modelsMap) {
                     if (OFFLINE_DEVS[devcode] == 1) continue;
                     var alarmInfo = alarmDev[devcode];
                     //上一次没有告警，本次有告警，需要设置成告警状态
@@ -1963,11 +1985,13 @@ export default {
             }
         }
         onMounted(() => {
-            backMasterViewBy02();
             //动态设置停机原因的top
             var ele = document.getElementById('dev_alarm');
             var style = window.getComputedStyle(ele);
             dev_stop.value.style.top= (ele.offsetTop * 1 + parseInt(style.height) + 30) + "px";
+            init()
+            /*
+            backMasterViewBy02();            
             clearTimeout(dataTimer1);
             clearTimeout(dataTimer2);
             clearTimeout(dataTimer3);
@@ -1976,6 +2000,8 @@ export default {
             DataFull.GetAlarmData();
             DataFull.GetOnlineDev();
             DataFull.GetStopDev();
+            */
+            console.log(new Date().getTime(), "  onMounted----02");
         })
         onUnmounted(()=>{
             AutoPlayer.value=false;