var tmpl=`
<el-menu  style="border:none" class="spechorizotal"
menu-trigger="hover"
 :collapse="collapse"
 :mode="md"
 default-active="1"
 :background-color="backcolor"
text-color="white"
 active-text-color="transparent"
 @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 style="width:120px;text-align:center;" :id="treeItem.bizCode" class="menuhover" v-if="treeItem.isMenu==true && treeItem.hidden==false && menuvisable(treeItem)" :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","mnuvisble"],
   data:function(){
     return {
        rsData:[],
        backcolor:this.bkcolor?this.bkcolor:"white",
        fontcolor:this.txtcolor?this.txtcolor:"#eee",
        md:this.mode?this.mode:"vertical",
        menuvisable:this.mnuvisble?this.mnuvisble:this.menufunc,
     };
   },
   mounted:function(){

   },
   created:function(){

   },
   methods:{
     menufunc:function(){
         return true;
     },
     fetchMetaData:function(cbk){
       if(global_rsconfig){
                cfg=global_rsconfig;
                          if(cfg){
                            this.rsData=[];
                            cfg.children.forEach(r=>{
                              if(r.istop){
                                  this.rsData.push(r);
                              }

                            });
                            if(cbk){
                                cbk();
                            }
                          
                          }
       }else{
                this.$root.getReq("/web/metaCtl/getRsConfig",null).then(cfg=>{
                global_rsconfig=cfg;
                if(cfg){
                  this.rsData=[];
                  cfg.children.forEach(r=>{
                    if(r.istop){
                        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-topmenu"
}`
