var tmpl=`
<div class="leftmenu">
<gsb-selectsubsystem ref="subsystems"  key="subsystems" class="leftmenu-subsystem" v-model="currentcode"  @initsubsystem="initsubsystem" @change="onchangesubsystem"></gsb-selectsubsystem>
<el-menu  key="lemnu"  style="border:none;"
 :collapse="collapse"
 :mode="md"
 :default-active="defaultsel"
 background-color="#535680"
 text-color="#C9CCF1"
 active-text-color="#C9CCF1"
 @select="onselectMenu"
>
  <template v-for="treeItem in rsData">
       <template v-if="treeItem.children && treeItem.children.length>0"  v-for="(subItem,si) in treeItem.children">
           <el-submenu class="" :key="subItem.code+si" :index="subItem.code+si" v-if="subItem.isGroup && !subItem.hidden && subsystem[treeItem.code]">
               <template slot="title" style="padding: 0px">
                 <div :groupid="subItem.code" @mouseleave="mleave(subItem.code)" >
                 <i v-if="subItem.icon" :class="subItem.icon" class="leftmenu-icon"></i>
                 <img v-if="!subItem.icon" class="el-icon-menu" :src="format(subItem)"></img>
                 <span :key="subItem.code" >{{format(subItem,subItem.label)}}</span>
                 </div>
               </template>
              <el-menu-item style="padding: 0px" v-if="groupItem.isMenu==true && !groupItem.hidden"  :index="groupItem.path" v-for="groupItem in subItem.children">
                 <div @click="leafclick(subItem.code)">
                  <i   v-if="groupItem.icon" :class="groupItem.icon"  class="leftmenu-icon"></i>
                 <img v-if="!groupItem.icon" class="el-icon-menu" :src="format(groupItem)"></img>
                 <span :key="groupItem.code"> {{format(groupItem,groupItem.label)}}</span>
                 </div>
              </el-menu-item>
           </el-submenu >
            <el-menu-item v-if="subItem.isMenu==true && !subItem.hidden && subsystem[treeItem.code]" :index="subItem.path">
                 <i   v-if="subItem.icon" :class="subItem.icon"  class="leftmenu-icon"></i>
                 <img v-if="!subItem.icon" class="el-icon-menu" :src="format(subItem)"></img>
                  <span :key="subItem.code"> {{format(subItem,subItem.label)}}</span>
             </el-menu-item>
      </template>
      <el-menu-item class="menuhover" v-if="treeItem.isMenu==true && treeItem.hidden==false" :index="treeItem.path?treeItem.path:treeItem.bizCode">
          <i v-if="treeItem.icon" :class="treeItem.icon" class="leftmenu-icon"></i>
          <img v-if="!treeItem.icon" class="el-icon-menu" :src="format(treeItem)"></img>
          <span slot="title">{{treeItem.label}}</span>
      </el-menu-item>
  </template>
</el-menu>
</div>
`
module.exports=
`{
   template:'${tmpl}',
   props:['formatprop',"collapse","bkcolor","txtcolor","mode"],
   data:function(){
     return {
        rsData:[],
        backcolor:this.bkcolor?this.bkcolor:"#474A6E",
        fontcolor:this.txtcolor?this.txtcolor:"black",
        md:this.mode?this.mode:"vertical",
        subsystem:{},
        currentcode:"",
        defaultsel:this.seldefault?this.seldefault:"/roleview"
     };
   },
   mounted:function(){
     if(this.codePath){
       console.log("nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnn",this.codePath);
        console.log('看看我看啊喀纳啊啊啊啊啊啊啊啊啊啊啊');
        $('#leftmenudiv').css('min-height',(document.body.clientHeight - 60));
       this.groupmenucolor(this.codePath);
     }
   },
   created:function(){
     
   },
   watch:{
     codePath:function(v){
       console.log("leftmenu.....watch........");
       console.log(v);
       this.groupmenucolor(v);
     }
   },
   methods:{
     subsystemReload(){
      this.$refs.subsystems.fetchData();
     },
     groupmenucolor(v){
       var patharray= v.split("/");
       var len=patharray.length;
       if(v.indexOf(this.currentcode)<0){
              if(len>2){
                    console.log("this.defaultselxxxxxxxxxxxxxxxxxxxxxxxxxxxxx");
                    this.currentcode=patharray[1];
                    this.onchangesubsystem(this.currentcode);
                    this.defaultsel="/"+patharray[len-1];
                    console.log("this.defaultselxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",this.defaultsel);
                    var selg="[groupid='"+patharray[len-2]+"']";
                    $("[groupid]").parent().css("background","#535680");
                    setTimeout(()=>{
                      $(selg).parent().css("background","#535680");
                    },100);
                    
              }
       }else{
              if(len>2){
                          console.log("this.defaultselxxxxxxxxxxxxxxxxxxxxxxxxxxxxx");
                          this.currentcode=patharray[1];
                          this.defaultsel="/"+patharray[len-1];
                          console.log("this.defaultselxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",this.defaultsel);
                           var selg="[groupid='"+patharray[len-2]+"']";
                            $("[groupid]").parent().css("background","#535680");
                          setTimeout(()=>{
                            $(selg).parent().css("background","#535680");
                          },100);
         
                    }
       }

     },
     mleave(evt){
        var sel="[groupid='"+evt+"']";
        if(this.codePath && this.codePath.indexOf(evt)>=0){
          this.$nextTick(()=>{
              $(sel).parent().css("background","#535680");
            });
        }
     },
     leafclick(evt){
       console.log("==============================================================");
        console.log(evt);
        var sel="[groupid='"+evt+"']";
        $(sel).parent().css("background","#535680");
        this.$nextTick(()=>{
          $(sel).parent().css("background","#535680");
        });
       
     },
     initsubsystem(ds){
       var firstCode="";
       var isexits=false;
       var lstcodeobj= this.$root.localdata("lastsubcode");
       ds.forEach(d=>{
          this.subsystem[d.subcode]=true;
          if(!lstcodeobj){
              firstCode=d.subcode;
          }else{
            if(d.subcode==lstcodeobj.codestr){
                isexits=true;
            }else{
               firstCode=d.subcode;
            }
          }
       });
       if(isexits){
        firstCode=lstcodeobj.codestr;
       }
   
       this.onchangesubsystem(firstCode);
     },
     onchangesubsystem(code){
          this.$root.localdata("lastsubcode",{codestr:code});
          Object.keys(this.subsystem).forEach(k=>{
             console.log("================================");
                console.log(k);
                this.subsystem[k]=false;
                if(k==code){
                    console.log(k);
                    this.subsystem[k]=true;
                }
              });
              this.fetchMetaData(()=>{
                  console.log( this.rsData);
                  this.currentcode=code;
              });
     },
     fetchMetaData:function(cbk){
       console.log("xxnnnnnn");
       console.log(global_rsconfig);
        if(global_rsconfig){
            var cfg=global_rsconfig;
                    if(cfg){
                      this.rsData=[];
                      cfg.children.forEach(r=>{
                        if(r.isleft){      
                          this.rsData.push(r);
                        }  
                      });
                    }
                    console.log(this.rsData);
                    if(cbk){
                      cbk();
                    }
        }else{
          this.$root.getReq("/web/common/metaCtl/getRsConfig",null).then(cfg=>{
                    global_rsconfig=cfg;
                    if(cfg){
                      this.rsData=[];
                      cfg.children.forEach(r=>{
                        if(r.isleft){      
                          this.rsData.push(r);
                        }  
                      });
                      if(cbk){
                          cbk();
                       }
                    }
                });
        }
      
     },
     onselectMenu:function(index,indexPath){
        this.$emit("menuselect",index);
     },
     format:function(treeItem,label){
       return this.$root[this.formatprop](treeItem,label);
     }
   },
   vname:"gsb-leftmenu"
}`
