Home.vue 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. <style lang="scss">
  2. @import '../style/home.scss';
  3. .head{
  4. width:30px;
  5. height:30px;
  6. border-radius:50%;
  7. float:left;
  8. margin:10px;
  9. }
  10. </style>
  11. <template>
  12. <el-container>
  13. <el-header class="header">
  14. <img class="logo" src="../images/logo.png" alt="">
  15. <div class="settings">
  16. <span><img width="16" src="../images/msg.png" alt=""> 肖</span>
  17. <span>退出登录</span>
  18. </div>
  19. </el-header>
  20. <el-container class="main">
  21. <!-- 左侧菜单 -->
  22. <el-aside class="left-aside" width="210px">
  23. <el-menu :default-active="$route.path" router class="left-menue" active-text-color="#ffffff">
  24. <template v-for="(item, index) in $router.options.routes">
  25. <el-menu-item v-if='item.show&&item.isLeaf' :index="item.path" :key='index'>
  26. <i class="el-icon-menu"></i>
  27. <span slot="title">{{item.name}}</span>
  28. </el-menu-item>
  29. <el-submenu v-if='item.show&&!item.isLeaf' :index="'index_'+index" :key='index'>
  30. <template slot="title">
  31. <i class="el-icon-location"></i>
  32. <span>{{item.name}}</span>
  33. </template>
  34. <el-menu-item-group >
  35. <el-menu-item v-for="(child,idx) in item.children" :key="index+'_'+idx" :index="child.path" v-show='!child.hide'>
  36. {{child.name}}
  37. </el-menu-item>
  38. </el-menu-item-group>
  39. </el-submenu>
  40. </template>
  41. </el-menu>
  42. </el-aside>
  43. <!-- 右侧内容 -->
  44. <el-container>
  45. <el-main>
  46. <transition name="fade" mode="out-in"><router-view :info='info' :community='community'></router-view></transition>
  47. </el-main>
  48. <!-- <el-footer>Footer</el-footer> -->
  49. </el-container>
  50. </el-container>
  51. </el-container>
  52. </template>
  53. <script>
  54. export default {
  55. name: 'home',
  56. data() {
  57. return {
  58. menuList:[],
  59. path:'',
  60. info:{},
  61. community_list:[],
  62. community:{}
  63. };
  64. },
  65. methods: {
  66. },
  67. created(){
  68. }
  69. };
  70. </script>