Home.vue 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  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. <h1>巴中逸沣安全培训</h1>
  15. <!-- <img class="logo" src="../images/logo.png" alt=""> -->
  16. <div class="settings">
  17. <span>
  18. <!-- <img width="16" src="../images/msg.png" alt=""> -->
  19. {{info.name}}</span>
  20. <span @click="logout">退出登录</span>
  21. </div>
  22. </el-header>
  23. <el-container class="main">
  24. <!-- 左侧菜单 -->
  25. <el-aside class="left-aside" width="210px">
  26. <el-menu :default-active="$route.path" router class="left-menue" active-text-color="#ffffff">
  27. <template v-for="(item, index) in $router.options.routes">
  28. <el-menu-item v-if='item.show&&item.isLeaf' :index="item.path" :key='index'>
  29. <i :class="item.icon"></i>
  30. <span slot="title">{{item.name}}</span>
  31. </el-menu-item>
  32. <el-submenu v-if='item.show&&!item.isLeaf' :index="'index_'+index" :key='index'>
  33. <template slot="title">
  34. <i :class="item.icon"></i>
  35. <span>{{item.name}}</span>
  36. </template>
  37. <el-menu-item-group >
  38. <el-menu-item v-for="(child,idx) in item.children" :key="index+'_'+idx" :index="child.path" v-show='!child.hide'>
  39. {{child.name}}
  40. </el-menu-item>
  41. </el-menu-item-group>
  42. </el-submenu>
  43. </template>
  44. </el-menu>
  45. </el-aside>
  46. <!-- 右侧内容 -->
  47. <el-container>
  48. <el-main>
  49. <transition name="fade" mode="out-in"><router-view :info='info' :community='community'></router-view></transition>
  50. </el-main>
  51. <!-- <el-footer>Footer</el-footer> -->
  52. </el-container>
  53. </el-container>
  54. </el-container>
  55. </template>
  56. <script>
  57. export default {
  58. name: 'home',
  59. data() {
  60. return {
  61. menuList:[],
  62. path:'',
  63. info:{},
  64. community_list:[],
  65. community:{}
  66. };
  67. },
  68. methods: {
  69. logout(){
  70. this.$api.logout().then(res=>{
  71. this.$router.push({path:'/login'})
  72. })
  73. },
  74. getData(){
  75. this.$api.getInfo().then(res=>{
  76. this.info=res.data.data
  77. })
  78. }
  79. },
  80. $route(to){
  81. },
  82. created(){
  83. this.getData()
  84. // if(this.$route.path.indexOf('add')>=0){
  85. // this.path=this.$route.path.split('/add')[0]
  86. // }else if(this.$route.path.indexOf('edit')>=0){
  87. // this.path=this.$route.path.split('/edit')[0]
  88. // }else if(this.$route.path.indexOf('detail')>=0){
  89. // this.path=this.$route.path.split('/detail')[0]
  90. // }else{
  91. // this.path=this.$route.path
  92. // }
  93. }
  94. };
  95. </script>