diff --git a/src/App.vue b/src/App.vue
index 5ccaa21573addfa62220e52dddd535b8d570bbda..fa0d1ae72d5605acabb275e1f2ccb1083a785985 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,46 +1,27 @@
 <template>
-  <SideBar v-if="account" />
-  <div class="app_right">
-    <Top v-if="account"/>
-    <router-view></router-view>
-  </div>
+  <router-view></router-view>
 </template>
 
 <script>
-import SideBar from './components/container/SideBar.vue'
-import Top from './components/container/Top.vue'
-import {ref, onMounted} from 'vue'
-import {useRoute} from 'vue-router'
+import { onUpdated } from '@vue/runtime-core';
+import {useRouter} from 'vue-router'
 export default {
   name: "App",
-  components: {
-    SideBar,
-    Top
-  },
   setup(){
-    let account = ref(true)
-    const route = useRoute()
-    // const uid = route
-    // let routeScan = reactive({routescan:this.$route.path})
-    onMounted(()=>{
-      // if(localStorage.getItem()){
-
-      // }
-      console.log(route.path);
-      // if (this.$route.path.includes('account')) {
-      //   console.log('false');
-      //   this.account = false
-      // }else{
-      //   this.account = true
-      //   console.log('true');
-      // }
-    }) 
-    return {
-      account,
-      // routeScan
-      route
-    }
-  },
+    const router = useRouter()
+    onUpdated(()=>{
+      if(localStorage.getItem('token') !== null &&
+       !router.currentRoute.value.path.includes('/home')){
+        router.replace('/home/dash_board/work_bench')
+      }
+    })
+    // 未登录禁止入内
+    router.beforeEach(to=>{
+      if(to.path.includes('/home') && localStorage.getItem('token') == null){
+        return false
+      }
+    })
+  }
 };
 </script>
 
diff --git a/src/components/container/Home.vue b/src/components/container/Home.vue
new file mode 100644
index 0000000000000000000000000000000000000000..3b8091ebcc0c02b577b1fc46799220c366d5cbdc
--- /dev/null
+++ b/src/components/container/Home.vue
@@ -0,0 +1,21 @@
+<template>
+  <SideBar />
+  <div class="app_right">
+    <Top />
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+import SideBar from "./SideBar.vue";
+import Top from "./Top.vue";
+export default {
+  components: {
+    SideBar,
+    Top,
+  }
+};
+</script>
+
+<style>
+</style>
\ No newline at end of file
diff --git a/src/components/container/SideBar.vue b/src/components/container/SideBar.vue
index db84373257d641c65e3a2ff8232eb995f1e6a234..67290d960e0f770e542c9e526b746c8f1ce852ff 100644
--- a/src/components/container/SideBar.vue
+++ b/src/components/container/SideBar.vue
@@ -51,18 +51,16 @@ export default {
     let isCollapse = ref(false);
     let router = useRouter()
     function click(e,tagname){
-      router.replace(e.index)
+      router.replace('/home'+e.index)
       mitt.emit('navitem',{
         path:e.index,
         tagname
-      })
-      
+      })  
     }
     onMounted(()=>{
       mitt.on('isfold',()=>{
         isCollapse.value = !isCollapse.value
       })
-
     })
     return {
       isCollapse,
@@ -79,7 +77,6 @@ export default {
 
 <style lang="less">
 .sideBar_P {
-  // width: 220px;
   background-color: rgb(1, 28, 54);
   .logo {
     text-align: center;
@@ -95,9 +92,6 @@ export default {
     color: rgb(192, 192, 192);
   }
   // ...为什么要用你的类才可以？ API呢
-  // .el-sub-menu{
-  //   width: 220px;
-  // }
   .is-active{
     background-color: #0960bd;
   }
diff --git a/src/components/container/Top.vue b/src/components/container/Top.vue
index bb748d60fc145e7ae5ee1c993aa557ab08143438..a8e8617eea8ba93a5eb8f716bd6cb30ffe6e8c80 100644
--- a/src/components/container/Top.vue
+++ b/src/components/container/Top.vue
@@ -66,7 +66,7 @@ export default {
         // 计算面包屑字符串数组
     preArr = computed({
       get(){
-        let preArr = reactive(router.currentRoute).value.path.slice(1).split('/')
+        let preArr = reactive(router.currentRoute).value.path.slice(6).split('/')
         for(let i = 0;i<preArr.length;i++){
           preArr[i] = pathMap.get(preArr[i])
         }
@@ -76,8 +76,8 @@ export default {
     // 退出登录
     function quit(){
       if(confirm('确认登出账号?')){
-        // 登出
-        //...清空本地token 或
+        // 登出,清除本地token,跳转
+        localStorage.removeItem('token')
         router.replace('/account/login')
       }else{
         return
diff --git a/src/components/page/account/Login.vue b/src/components/page/account/Login.vue
index 357509991895e656c6aed2b8bdd8065ba76adbe7..18f96e160b521b073788e830bc7194d6341309e8 100644
--- a/src/components/page/account/Login.vue
+++ b/src/components/page/account/Login.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="login_P">
     <div class="title">
       <img src="../../../assets/images/title.png" alt="" />
     </div>
@@ -78,7 +78,6 @@ export default {
     }
     function login() {
       // 调用登录接口
-      // let res = await req()
       if (account.value != "" && password.value != "" && code.value != "") {
         api("/api/base/login", "post", {
           account: account.value,
@@ -86,11 +85,10 @@ export default {
           captcha: code.value,
           captchaId: id.value,
         }).then((res) => {
-          console.log(res);
           if (res.data.code == 0) {
             localStorage.setItem("token", res.data.data.token);
             ElMessage.success("登录成功");
-            router.replace("/dash_board/work_bench");
+            router.replace("/home/dash_board/work_bench");
           } else {
             ElMessage.error(res.data.msg);
           }
@@ -132,6 +130,9 @@ export default {
 </script>
 
 <style scoped>
+.login_P{
+  margin: auto;
+}
 .title {
   width: 100%;
 }
@@ -146,7 +147,6 @@ export default {
   width: 100%;
   height: 100%;
   z-index: -10;
-  /* object-fit: none; */
 }
 .regist {
   color: aliceblue;
diff --git a/src/components/page/systemManage/MenuManage.vue b/src/components/page/systemManage/MenuManage.vue
index 8723b4a6d8dfc96486740d1a3a46ff91bd64c6b5..3b08a9e5490c056513c61608f0d2c63d52285375 100644
--- a/src/components/page/systemManage/MenuManage.vue
+++ b/src/components/page/systemManage/MenuManage.vue
@@ -37,7 +37,7 @@
         <div class="table1">
             <span>菜单列表</span>
             <div class="table11">
-                <el-button  color="#0000ff" bg="bule" @click="drawer = true">新增菜单</el-button>   <!--和下边的input 组成右边的抽屉-->
+                <el-button  color="#0000ff" :bg="true" @click="drawer = true">新增菜单</el-button>   <!--和下边的input 组成右边的抽屉-->
                 <div></div>
                 <el-button  @click="gettabledata" >
                     <el-icon size="32px"><Refresh  /></el-icon>
diff --git a/src/router/index.js b/src/router/index.js
index 09de8d119a0280ad1ac866eb40b224e68411e2b7..0a76801412d6868701920c84ec16e4ea3138f376 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,47 +1,54 @@
 // Top组件对路由有依赖，如更改路由，请前往更新
-import {createRouter,createWebHashHistory} from 'vue-router'
+import { createRouter, createWebHashHistory } from 'vue-router'
 
 export default createRouter({
-   history:createWebHashHistory(),
-   routes:[
+   history: createWebHashHistory(),
+   routes: [
       // redirect
       {
-         path:'/:catchAll(.*)',
-         redirect:'/404',
-         component:()=>import('../components/404')
+         path: '/:catchAll(.*)',
+         redirect: '/home/404',
+         component: () => import('../components/404')
       },
       {
-         path:'/',
-         redirect:'/account/login',
-         component:()=>import('../components/page/account/Login')
+         path: '/',
+         redirect: '/account/login',
+         component: () => import('../components/page/account/Login')
       },
-      // 404
-      {
-         path:'/404',
-         component:()=>import('../components/404')
-      },
-      // dash_board
-      {
-         path:'/dash_board/work_bench',
-         component:()=>import('../components/page/dashBoard/WorkBench')
-      },
-      // system_manage
-      {
-         path:'/system_manage/account_manage',
-         component:()=>import('../components/page/systemManage/AccountManage')
-      },
-      {
-         path:'/system_manage/menu_manage',
-         component:()=>import('../components/page/systemManage/MenuManage')
+      // home
+      {
+         path: '/home',
+         component: () => import('../components/container/Home'),
+         children: [
+            // 404
+            {
+               path: '404',
+               component: () => import('../components/404')
+            },
+            // dash_board
+            {
+               path: 'dash_board/work_bench',
+               component: () => import('../components/page/dashBoard/WorkBench')
+            },
+            // system_manage
+            {
+               path: 'system_manage/account_manage',
+               component: () => import('../components/page/systemManage/AccountManage')
+            },
+            {
+               path: 'system_manage/menu_manage',
+               component: () => import('../components/page/systemManage/MenuManage')
+            },
+         ]
       },
       // account
       {
-         path:'/account/login',
-         component:()=>import('../components/page/account/Login')
+         path: '/account/login',
+         component: () => import('../components/page/account/Login')
       },
       {
-         path:'/account/register',
-         component:()=>import('../components/page/account/Register')
+         path: '/account/register',
+         component: () => import('../components/page/account/Register')
       }
    ]
 })
\ No newline at end of file