| | |
| | | <div class="menu-wrapper"> |
| | | <template v-for="item in menu"> |
| | | <el-menu-item v-if="validatenull(item[childrenKey]) && vaildRoles(item)" |
| | | :index="item[pathKey]" |
| | | @click="open(item)" |
| | | :key="item[labelKey]" |
| | | :class="{'is-active':vaildActive(item)}"> |
| | | :class="{'is-active':vaildActive(item)}" |
| | | :index="item[pathKey]" |
| | | @click="open(item)"> |
| | | <i :class="item[iconKey]"></i> |
| | | <span slot="title" |
| | | :alt="item[pathKey]">{{generateTitle(item)}}</span> |
| | | </el-menu-item> |
| | | <el-submenu v-else-if="!validatenull(item[childrenKey])&&vaildRoles(item)" |
| | | :index="item[pathKey]" |
| | | :key="item[labelKey]"> |
| | | :key="item[labelKey]" |
| | | :index="item[pathKey]"> |
| | | <template slot="title"> |
| | | <i :class="item[iconKey]"></i> |
| | | <span slot="title" |
| | | :class="{'el-menu--display':collapse && first}">{{generateTitle(item)}}</span> |
| | | </template> |
| | | <template v-for="(child,cindex) in item[childrenKey]"> |
| | | <el-menu-item :index="child[pathKey],cindex" |
| | | @click="open(child)" |
| | | <el-menu-item v-if="validatenull(child[childrenKey])" |
| | | :key="child[labelKey]" |
| | | :class="{'is-active':vaildActive(child)}" |
| | | v-if="validatenull(child[childrenKey])" |
| | | :key="child[labelKey]"> |
| | | :index="child[pathKey],cindex" |
| | | @click="open(child)"> |
| | | <i :class="child[iconKey]"></i> |
| | | <span slot="title">{{generateTitle(child)}}</span> |
| | | </el-menu-item> |
| | | <sidebar-item v-else |
| | | :menu="[child]" |
| | | :key="cindex" |
| | | :collapse="collapse" |
| | | :menu="[child]" |
| | | :props="props" |
| | | :screen="screen" |
| | | :collapse="collapse"></sidebar-item> |
| | | :screen="screen"></sidebar-item> |
| | | </template> |
| | | </el-submenu> |
| | | </template> |
| | |
| | | } |
| | | }; |
| | | </script> |
| | | <style lang="scss" scoped> |
| | | .el-menu-item:focus, .el-menu-item:hover { |
| | | outline: 0; |
| | | background-color: #060708; |
| | | } |
| | | </style> |
| | | |