var tmpl=`
<el-menu  style="border:none"
 :collapse="collapse"
 :mode="md"
 default-active="1"
 :background-color="backcolor"
text-color="#eee"
 active-text-color="#ffd04b"
 @select="onselectMenu"
>
  <template v-for="treeItem in rsData">
      <el-submenu class="menuhover" :index="treeItem.code" v-if="treeItem.isSubmenu && !treeItem.hidden" :index="treeItem.code">
         <template slot="title">
           <i   v-if="treeItem.icon" :class="treeItem.icon"  style="font-size:28px"></i>
           <img v-if="!treeItem.icon" class="el-icon-menu" style="width:30px;height:30px" :src="format(treeItem)"></img>
           <span>{{treeItem.label}}</span>
         </template>
         <template v-for="(subItem,si) in treeItem.children">
           <el-submenu :key="subItem.code+si"   :index="subItem.code+si" v-if="subItem.isGroup && !subItem.hidden">
               <template slot="title">
                 <i   v-if="subItem.icon" :class="subItem.icon"  style="font-size:28px"></i>
                 <img v-if="!subItem.icon" class="el-icon-menu" :src="format(subItem)"></img>
                 <span :key="subItem.code">{{format(subItem,subItem.label)}}</span>
               </template>
              <el-menu-item v-if="groupItem.isMenu==true && !groupItem.hidden" :index="groupItem.path" v-for="groupItem in subItem.children">
                  {{format(groupItem,groupItem.label)}}
              </el-menu-item>
           </el-submenu >
         </template>
      </el-submenu>
      <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" style="font-size:28px"></i>
          <img v-if="!treeItem.icon" class="el-icon-menu" :src="format(treeItem)"></img>
          <span slot="title" class="nav_color">{{treeItem.label}}</span>
      </el-menu-item>
  </template>
</el-menu>
`
module.exports=
`{
   template:'${tmpl}',
   props:['formatprop',"collapse","bkcolor","txtcolor","mode"],
   data:function(){
     return {
        rsData:[],
        backcolor:this.bkcolor?this.bkcolor:"black",
        fontcolor:this.txtcolor?this.txtcolor:"#eee",
        md:this.mode?this.mode:"vertical",
     };
   },
   mounted:function(){

   },
   created:function(){

   },
   methods:{
     fetchMetaData:function(){
       this.$root.getReq("/web/metaCtl/getRsConfig",null).then(cfg=>{
          console.log(".....config...........................=====================.");
          console.log(cfg);
          if(cfg){
            this.rsData=[];
            cfg.data.children.forEach(r=>{
              this.rsData.push(r);
            })
          }
       });
     },
     onselectMenu:function(index,indexPath){
        this.$emit("menuselect",index);
     },
     format:function(treeItem,label){
       return this.$root[this.formatprop](treeItem,label);
     }
   },
   vname:"gsb-menu"
}`
