| | |
| | | <template> |
| | | <div class="app-sidebar"> |
| | | <div class="box"> |
| | | <div class="logo-view"> |
| | | <el-image :src="require('@/assets/logo.png')"></el-image> |
| | | </div> |
| | | <el-menu |
| | | router |
| | | unique-opened |
| | |
| | | text-color="#bfcbd9" |
| | | active-text-color="#fff" |
| | | > |
| | | <el-submenu index="1"> |
| | | <el-submenu v-for="item in menus" :key="item.id" :index="item.id.toString()"> |
| | | <template slot="title"> |
| | | <i class="el-icon-money icon"></i> |
| | | <span>供应商管理</span> |
| | | <span>{{item.title}}</span> |
| | | </template> |
| | | <el-menu-item index="/supplierManage/supplier">供应商</el-menu-item> |
| | | <el-menu-item v-for="itm in item.children" :key="itm.id" :index="itm.path">{{itm.title}}</el-menu-item> |
| | | </el-submenu> |
| | | <el-submenu index="2"> |
| | | <template slot="title"> |
| | | <i class="el-icon-phone-outline icon"></i> |
| | | <span>采购管理</span> |
| | | </template> |
| | | <el-menu-item index="/sales/salesOpportunity">采购订单</el-menu-item> |
| | | <el-menu-item index="/sales/quotation">采购质检单</el-menu-item> |
| | | <el-menu-item index="/sales/masterOrder">采购入库单</el-menu-item> |
| | | <el-menu-item index="/sales/subOrder">采购退货单</el-menu-item> |
| | | </el-submenu> |
| | | <el-submenu index="3"> |
| | | <template slot="title"> |
| | | <i class="el-icon-service icon"></i> |
| | | <span>产品管理</span> |
| | | </template> |
| | | <el-menu-item index="/productManage/product">产品管理</el-menu-item> |
| | | </el-submenu> |
| | | |
| | | </el-menu> |
| | | <el-empty v-if="this.menus===null||this.menus===undefined||this.menus.length===0" :image-size="130" description="没有侧栏菜单"></el-empty> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | name: "AppSidebar", |
| | | props: {}, |
| | | data() { |
| | | return {} |
| | | return { |
| | | } |
| | | }, |
| | | watch: {}, |
| | | created() { |
| | | this.initNavMenu() |
| | | this.getMenuTreeByRole() |
| | | }, |
| | | methods: { |
| | | getMenuTreeByRole(){ |
| | | this.menus=this.$store.state.menus.menus |
| | | }, |
| | | // 监听路由 |
| | | initNavMenu() { |
| | | // console.log(this.$route.name) |
| | |
| | | <!-- Add "scoped" attribute to limit CSS to this component only --> |
| | | <style lang="scss" scoped> |
| | | @import "./index.scss"; |
| | | ::v-deep .el-empty{ |
| | | .el-empty__description{ |
| | | p{ |
| | | color: #dddd; |
| | | } |
| | | } |
| | | } |
| | | </style> |