<template>
    <div class="index-main" v-if="hackShow">
        <PRow :gutter="10" v-for="(row,rowIndex) in portalList" :key="rowIndex">
            <PCol :span="colVal" v-for="(colVal,colIndex) in row.layoutCols" :key="colIndex">
                <template v-for="(panels,panelIndex) in row.panels[colIndex]">
                    <PPortalPanel :ref="`cmpPortalPanel${rowIndex}${colIndex}${panelIndex}`" :tabList='panels.columns' :height="panels.height"></PPortalPanel> 
                </template> 
            </PCol>
        </PRow>
    </div>
</template>
<script>
import {PRow,PCol} from "@main/components/grid";
import PPortalPanel from "@main/components/portalPanel";
export default {
    props:{
        itemData:Object
    },
    data(){
        return {
            hackShow:false,
            actived:false
        }
    },
    components:{
        PRow,PCol,PPortalPanel
    },
    computed:{
        portalList(){
            let pList = this.$store.getters.portalSysList;
            return pList;
        }
    },
    methods:{ 
        doRender(){
            //强制刷新，只执行一次
            if(this.actived)return;
            this.$nextTick(r=>{
                this.hackShow = true;
                this.actived=true;//判断只执行一次
            })
            return;
            // let list = this.portalList,cols,panels;
            // for(let i=0,l=list.length;i<l;i++){
            //     cols = list[i].layoutCols;
            //     for(let j=0,k=cols.length;j<k;j++){
            //         panels = list[i].panels[j];
            //         for(let n=0,m=panels.length;n<m;n++){
            //             this.$refs[`cmpPortalPanel${i}${j}${n}`][0].doRender(); 
            //         }
            //     } 
            // }
        }
    }
}
</script>
<style lang='less' scoped>
    .index-main{
        padding:10px;
        .pl-portal-panel{
            margin-bottom:10px;
        }
    }
</style>