二级菜单

src/pages/modules/errormanage/ErrorDeal.vue

@@ -1,5 +1,5 @@
 <template>
-  <section>
+  <div class="main-container">
     <div class="con1">
       <div class="desc">当前状态</div>
       <div class="status"></div>
@@ -27,7 +27,7 @@
         <span class="txt">{{dataInfo.task_num}}</span>
       </div>
     </div>
-  </section>
+  </div>
 </template>
 
 <script>

src/pages/modules/errormanage/ErrorInfo.vue

@@ -1,4 +1,5 @@
 <template>
+<div class="main-container">
   <div class="tasklist">
     <div class="con1">
       <table class="filter-table">
@@ -20,6 +21,7 @@
       </table>
     </div>
   </div>
+</div>
 </template>
 
 <script>

src/pages/modules/home/home.vue

@@ -1,5 +1,5 @@
 <template>
-  <section>
+  <div class="main-container">
     <div class="con1">
       <button v-if="dataInfo.button_name" @click="clickSave">{{dataInfo.button_name}}</button>
     </div>
@@ -35,7 +35,7 @@
         <span class="txt">{{dataInfo.agv_error}}</span>
       </div>
     </div>
-  </section>
+  </div>
 </template>
 
 <script>

src/pages/modules/login/login.vue

@@ -125,7 +125,7 @@ export default {
         let obj = {}
         obj = Object.assign({}, res)
         this.$store.dispatch('userInfo', JSON.stringify(obj))
-        this.$router.push('/homehome')
+        this.$router.push('/index/home')
       } catch (err) {
         this.disabled = false
       }

src/pages/modules/systemmanage/developer.vue

@@ -1,4 +1,5 @@
 <template>
+<div class="main-container">
   <div class="right_side">
     <div class="tabs_container">
       <div class="tabs_header">
@@ -20,6 +21,7 @@
       </div>
     </div>
   </div>
+</div>
 </template>
 
 <script>

src/pages/modules/systemmanage/role.vue

@@ -1,4 +1,5 @@
 <template>
+<div class="main-container">
   <div class="right_side">
     <div class="buttons_wrapper">
       <div class="row">
@@ -77,6 +78,7 @@
     <div v-if="type === '3'" class="form_wraper">确定删除该用户吗？</div>
     </jxDialog>
   </div>
+</div>
 </template>
 
 <script>

src/pages/modules/systemmanage/system.vue

@@ -1,4 +1,5 @@
 <template>
+<div class="main-container">
   <div class="right_side">
     <div class="buttons_wrapper">
       <div class="row">
@@ -72,6 +73,7 @@
     <div v-if="type === '3'" class="form_wraper">确定删除吗？</div>
     </jxDialog>
   </div>
+</div>
 </template>
 
 <script>

src/pages/modules/systemmanage/user.vue

@@ -1,4 +1,5 @@
 <template>
+<div class="main-container">
   <div class="right_side">
     <div class="buttons_wrapper">
       <div class="row">
@@ -101,6 +102,7 @@
     <div v-if="type === '4'" class="form_wraper">确定删除该用户吗？</div>
     </jxDialog>
   </div>
+</div>
 </template>
 
 <script>

src/pages/modules/taskmanage/CarryPoint.vue

@@ -1,4 +1,5 @@
 <template>
+<div class="main-container">
   <div class="movepoint">
     <div class="con">
       <div class="box1">
@@ -12,6 +13,7 @@
       </div>
     </div>
   </div>
+</div>
 </template>
 
 <script>

src/pages/modules/taskmanage/TaskLists.vue

@@ -1,5 +1,5 @@
 <template>
-  <section>
+  <div class="main-container">
     <div class="clear">
       <!-- <div class="fl left_side">
         <site-nav default_active="1" active="1-2"></site-nav>
@@ -25,7 +25,7 @@
         </table>
       </div>
     </div>
-  </section>
+  </div>
 </template>
 
 <script>

src/pages/modules/taskmanage/TaskOperates.vue

@@ -1,5 +1,5 @@
 <template>
-  <section>
+  <div class="main-container">
     <div class="clear">
       <!-- <div class="fl left_side">
         <test-nav :array="testData" @change="handleChange"></test-nav>
@@ -24,7 +24,7 @@
       </div>
     </div>
     <div class="modal"></div> -->
-  </section>
+  </div>
 </template>
 
 <script>

src/pages/modules/vehicleinformation/vehiclecontrol.vue

@@ -1,4 +1,5 @@
 <template>
+<div class="main-container">
   <div class="right_side">
     <div class="content_wrap">
       <div class="content_wrap_inner content_wrap_inner_1">
@@ -110,6 +111,7 @@
     </div>
     <div v-show="show" class="modal"></div>
   </div>
+</div>
 </template>
 
 <script>

src/pages/modules/vehicleinformation/vehiclestatus.vue

@@ -1,4 +1,5 @@
 <template>
+<div class="main-container">
   <div class="right_side">
     <div class="content_wrap">
       <div class="state_wrap">
@@ -77,6 +78,7 @@
       </div>
     </div>
   </div>
+</div>
 </template>
 
 <script>

src/pages/shells/index/index.vue

@@ -5,8 +5,8 @@
         <img src="../../../images/aio/logo_1.png" alt="诺力">
       </div>
       <div class="horizontal-menu-container">
-        <el-menu :default-active="$route.path" mode="horizontal" @select="handleSelect">
+        <el-menu :default-active="$route.meta.jumpPath" mode="horizontal" @select="handleSelect">
-          <el-menu-item :index="menu.router" v-for="menu in menus" :key="menu.index">{{menu.label}}</el-menu-item>
+          <el-menu-item :index="menu.index" v-for="menu in menus" :key="menu.index">{{menu.label}}</el-menu-item>
         </el-menu>
       </div>
       <div class="header-wraper__right">
@@ -46,7 +46,14 @@
         </div>
       </div>
     </div>
-    <router-view></router-view>
+    <div class="body-conatiner">
+      <div v-show="$route.path !== '/index/teach'" class="side-bar-container">
+        <el-menu :default-active="$route.meta.guidePath" @select="handleSelectChild">
+          <el-menu-item :index="menu.index" v-for="menu in childmenus" :key="menu.index">{{menu.label}}</el-menu-item>
+        </el-menu>
+      </div>
+      <router-view></router-view>
+    </div>
     <jxDialog
     ref="child"
     title="修改密码"
@@ -98,27 +105,80 @@ export default {
       menus: [{
         label: '首页',
         index: '1',
-        router: '/homehome'
+        router: '',
+        children: [{
+          label: '首页',
+          index: '1',
+          router: '/index/home'
+        }]
       }, {
         label: '任务管理',
         index: '2',
-        router: '/CarryPoint'
+        router: '',
+        children: [{
+          label: '搬运站点',
+          index: '1',
+          router: '/index/carrypoint'
+        }, {
+          label: '任务列表',
+          index: '2',
+          router: '/index/tasklists'
+        }, {
+          label: '任务操作',
+          index: '3',
+          router: '/index/taskoperates'
+        }]
       }, {
         label: '故障管理',
         index: '3',
-        router: '/ErrorInfo'
+        router: '',
+        children: [{
+          label: '故障信息',
+          index: '1',
+          router: '/index/errorinfo'
+        }, {
+          label: '故障处理',
+          index: '2',
+          router: '/index/errordeal'
+        }]
       }, {
         label: '车辆信息',
         index: '4',
-        router: '/vehiclestatus'
+        router: '',
+        children: [{
+          label: '车辆状态',
+          index: '1',
+          router: '/index/vehiclestatus'
+        }, {
+          label: '车辆控制',
+          index: '2',
+          router: '/index/vehiclecontrol'
+        }]
       }, {
         label: '示教',
         index: '5',
-        router: '/teach'
+        router: '/index/teach'
       }, {
         label: '系统管理',
         index: '6',
-        router: '/user'
+        router: '',
+        children: [{
+          label: '用户管理',
+          index: '1',
+          router: '/index/user'
+        }, {
+          label: '角色管理',
+          index: '2',
+          router: '/index/role'
+        }, {
+          label: '系统参数',
+          index: '3',
+          router: '/index/system'
+        }, {
+          label: '开发者选项',
+          index: '4',
+          router: '/index/developer'
+        }]
       }],
       dropdown: false,
       oldpassword: '',
@@ -127,6 +187,14 @@ export default {
       unclick: false
     }
   },
+  computed: {
+    routerPath () {
+      return this.$route.meta.jumpPath
+    },
+    childmenus () {
+      return this.menus[Number(this.$route.meta.jumpPath) - 1].children
+    }
+  },
   watch: {
     oldpassword (val) {
       if (val === '' || this.newpassword1 === '' || this.newpassword2 === '') {
@@ -150,11 +218,31 @@ export default {
       }
     }
   },
+  created () {
+    this.menus.map(el => {
+      if (el.router === this.$route.path) {
+        this.childmenus = el.children
+      }
+    })
+  },
   methods: {
     handleSelect (key) {
       this.dropdown = false
-      this.$router.push({
+      this.menus.map(el => {
-        path: key
+        if (el.router === '' && el.index === key) {
+          this.$router.push({ path: el.children[0].router })
+        }
+        if (key === '5') {
+          this.$router.push({ path: el.router })
+        }
+      })
+    },
+    handleSelectChild (key) {
+      this.dropdown = false
+      this.childmenus.map(el => {
+        if (el.index === key) {
+          this.$router.push({ path: el.router })
+        }
       })
     },
     showDropdown () {
@@ -235,9 +323,11 @@ export default {
   height 100%
   padding 0 10px
 >>>.el-menu--horizontal>.el-menu-item
-  line-height 79px
+  line-height 80px
-  height 79px
+  height 80px
   font-size 18px
+>>>.el-menu.el-menu--horizontal
+  border-bottom 0
 .time-container
   _fj()
 .state-item
@@ -296,9 +386,11 @@ export default {
 .header_dropdown_wraper
   position absolute
   top 90%
-  left 0
+  left 50%
+  transform translateX(-50%)
   z-index 1000
   width 100%
+  min-width 100px
   background-color #fff
   border 1px solid #ebeef5
   border-radius 4px
@@ -322,7 +414,8 @@ export default {
   border-width: 6px;
   filter: drop-shadow(0 2px 12px rgba(0,0,0,.03))
   top: -6px;
-  left: 32px;
+  left: 50%;
+  transform: translateX(-6px)
   margin-right: 3px;
   border-top-width: 0;
   border-bottom-color: #ebeef5;
@@ -339,6 +432,13 @@ export default {
     margin-left: -6px;
     border-top-width: 0;
     border-bottom-color: #fff;
+.side-bar-container
+    >>>.el-menu-item a
+        color #909399
+    >>>.is-active
+        background-color: #ecf5ff
+    >>>.is-active a
+        color #409EFF
 @media only screen and (max-width: 1620px) {
 .title-container {
   width 150px

src/router/index.js

@@ -7,32 +7,27 @@ const Setup = r => require.ensure([], () => r(require('@page/Setup')), 'Setup')
 
 const IndexComponent = r => require.ensure([], () => r(require('@page/shells/index/index.vue')), 'shells')
 
-const IndexHome = r => require.ensure([], () => r(require('@page/modules/home/index.vue')), 'modules')
+const Home = r => require.ensure([], () => r(require('@page/modules/home/home.vue')), 'modules')
-const HomeHome = r => require.ensure([], () => r(require('@page/modules/home/home.vue')), 'modules')
 
-const TaskManageTab = r => require.ensure([], () => r(require('@page/modules/taskmanage/index.vue')), 'modules')
 const CarryPoint = r => require.ensure([], () => r(require('@page/modules/taskmanage/CarryPoint.vue')), 'modules')
 const TaskLists = r => require.ensure([], () => r(require('@page/modules/taskmanage/TaskLists.vue')), 'modules')
 const TaskOperates = r => require.ensure([], () => r(require('@page/modules/taskmanage/TaskOperates.vue')), 'modules')
 
-const ErrorManageTab = r => require.ensure([], () => r(require('@page/modules/errormanage/index.vue')), 'modules')
 const ErrorInfo = r => require.ensure([], () => r(require('@page/modules/errormanage/ErrorInfo.vue')), 'modules')
 const ErrorDeal = r => require.ensure([], () => r(require('@page/modules/errormanage/ErrorDeal.vue')), 'modules')
 
-const VehicleInformation = r => require.ensure([], () => r(require('@page/modules/vehicleinformation/index.vue')), 'modules')
 const VehicleStatus = r => require.ensure([], () => r(require('@page/modules/vehicleinformation/vehiclestatus.vue')), 'modules')
 const VehicleControl = r => require.ensure([], () => r(require('@page/modules/vehicleinformation/vehiclecontrol.vue')), 'modules')
 
 const Teach = r => require.ensure([], () => r(require('@page/modules/teach/teach.vue')), 'modules')
 
-const SystemManage = r => require.ensure([], () => r(require('@page/modules/SystemManage/index.vue')), 'modules')
 const User = r => require.ensure([], () => r(require('@page/modules/SystemManage/user.vue')), 'modules')
 const Role = r => require.ensure([], () => r(require('@page/modules/SystemManage/role.vue')), 'modules')
 const System = r => require.ensure([], () => r(require('@page/modules/SystemManage/system.vue')), 'modules')
 const Developer = r => require.ensure([], () => r(require('@page/modules/SystemManage/developer.vue')), 'modules')
 
 // carry
-const Home = r => require.ensure([], () => r(require('@page/Home')), 'Home')
+// const Home = r => require.ensure([], () => r(require('@page/Home')), 'Home')
 const MovePoint = r => require.ensure([], () => r(require('@page/MovePoint')), 'MovePoint')
 const TaskList = r => require.ensure([], () => r(require('@page/TaskList')), 'TaskList')
 const TaskManage = r => require.ensure([], () => r(require('@page/TaskManage')), 'TaskManage')
@@ -73,75 +68,59 @@ export default new Router({
       path: '/index',
       component: IndexComponent,
       children: [{
-        path: '/indexhome',
+        path: 'home',
-        component: IndexHome,
+        component: Home,
-        children: [{
+        meta: {jumpPath: '1', guidePath: '1'}
-          path: '/homehome',
+      }, {
-          component: HomeHome
+        path: 'carrypoint',
-        }]
+        component: CarryPoint,
-      },
+        meta: {jumpPath: '2', guidePath: '1'}
-      {
+      }, {
-        path: '/TaskManageTab',
+        path: 'tasklists',
-        component: TaskManageTab,
+        component: TaskLists,
-        children: [{
+        meta: {jumpPath: '2', guidePath: '2'}
-          path: '/CarryPoint',
+      }, {
-          component: CarryPoint
+        path: 'taskoperates',
-        }, {
+        component: TaskOperates,
-          path: '/TaskLists',
+        meta: {jumpPath: '2', guidePath: '3'}
-          component: TaskLists
+      }, {
-        }, {
+        path: 'errorinfo',
-          path: '/TaskOperates',
+        component: ErrorInfo,
-          component: TaskOperates
+        meta: {jumpPath: '3', guidePath: '1'}
-        }]
+      }, {
-      },
+        path: 'errordeal',
-      {
+        component: ErrorDeal,
-        path: '/ErrorManageTab',
+        meta: {jumpPath: '3', guidePath: '2'}
-        component: ErrorManageTab,
+      }, {
-        children: [{
+        path: 'vehiclestatus',
-          path: '/ErrorInfo',
+        component: VehicleStatus,
-          component: ErrorInfo
+        meta: {jumpPath: '4', guidePath: '1'}
-        }, {
+      }, {
-          path: '/ErrorDeal',
+        path: 'vehiclecontrol',
-          component: ErrorDeal
+        component: VehicleControl,
-        }]
+        meta: {jumpPath: '4', guidePath: '2'}
-      },
+      }, {
-      {
+        path: 'teach',
-        path: '/vehicleinformation',
+        component: Teach,
-        component: VehicleInformation,
+        meta: {jumpPath: '5', guidePath: '1'}
-        children: [{
+      }, {
-          path: '/vehiclestatus',
+        path: 'user',
-          component: VehicleStatus
+        component: User,
-        }, {
+        meta: {jumpPath: '6', guidePath: '1'}
-          path: '/vehiclecontrol',
+      }, {
-          component: VehicleControl
+        path: 'role',
-        }]
+        component: Role,
-      },
+        meta: {jumpPath: '6', guidePath: '2'}
-      {
+      }, {
-        path: '/teach',
+        path: 'system',
-        component: Teach
+        component: System,
-      },
+        meta: {jumpPath: '6', guidePath: '3'}
-      {
+      }, {
-        path: '/systemmanage',
+        path: 'developer',
-        component: SystemManage,
+        component: Developer,
-        children: [{
+        meta: {jumpPath: '6', guidePath: '4'}
-          path: '/user',
-          component: User
-        }, {
-          path: '/role',
-          component: Role
-        }, {
-          path: '/system',
-          component: System
-        }, {
-          path: '/developer',
-          component: Developer
-        }]
       }]
     },
-    {
-      path: '/home',
-      component: Home
-    },
     {
       path: '/movepoint',
       component: MovePoint