diff --git a/src/App.vue b/src/App.vue
index b7c397085b30f7637eab3bdd2615f175fe1f3fb5..5d5ed41d468d5a0a1d8b38d6c40a371bfb9fc8d6 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,6 +1,6 @@
 <template>
-    <SideBar/>
-    <div class="right">
+    <SideBar v-if="account"/>
+    <div v-if="account" class="app_right">
         <Top/>
         <router-view></router-view>
     </div>
@@ -9,24 +9,45 @@
 <script>
 import SideBar from './components/container/SideBar.vue'
 import Top from './components/container/Top.vue'
+import {ref} from 'vue'
 export default {
   name: "App",
   components: {
     SideBar,
     Top
   },
+  setup(){
+    let account = ref(true)
+    return {
+      account
+    }
+  },
+  updated() {
+    if (this.$route.path.includes('account')) {
+      console.log('false');
+      this.account = false
+    }else{
+      this.account = true
+      console.log('true');
+    }
+  }
 };
 </script>
 
-<style lang="less">
+<style lang="less" >
 * {
   margin: 0;
   padding: 0;
 }
 #app{
-    display: flex;
-    .right{
-      // flex: 1;
-    }
+  display: flex;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  .app_right{
+    flex: 1;
+  }
 }
 </style>
diff --git a/src/assets/avatar.jpg b/src/assets/avatar.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..4164686a03e46e7522154069ae9bd3cbff2dfb3e
Binary files /dev/null and b/src/assets/avatar.jpg differ
diff --git a/src/components/container/SideBar.vue b/src/components/container/SideBar.vue
index 3e0e5e42223dbbf7aad0e223b25b2ab7eacad1b2..268c343dd553781e161c780ea08295ad4227da4c 100644
--- a/src/components/container/SideBar.vue
+++ b/src/components/container/SideBar.vue
@@ -1,7 +1,6 @@
 // 左侧菜单menu
 <template>
-  <div class="sideBar_P">
-    <el-col :span="24">
+    <div class="sideBar_P">
       <div class="logo">
         <img src="" alt="" />
         <span class="logo_title"> 疫情物资信息平台-后台管理 </span>
@@ -42,8 +41,7 @@
           </el-sub-menu>
         </el-menu>
       </div>
-    </el-col>
-  </div>
+    </div>
 </template>
 
 <script>
@@ -74,20 +72,14 @@ export default {
 
 <style lang="less">
 .sideBar_P {
-  background-color: rgb(42, 212, 65);
-  margin: 0;
-  box-sizing: border-box;
-  // height: 100%;
+  width: 221px;
+  background-color: rgb(0,21,41);
   .logo {
     text-align: center;
     height: 68px;
     .logo_title {
       line-height: 68px;
-    }
-  }
-  .menu {
-    .tac {
-      // width: 220px;
+      color: #fff;
     }
   }
 }
diff --git a/src/components/container/Tags.vue b/src/components/container/Tags.vue
index 48cd3bab754c153ef9e6adcf3d392deb3d027e05..c63043457a7454535a54b96904850bf5db395ede 100644
--- a/src/components/container/Tags.vue
+++ b/src/components/container/Tags.vue
@@ -1,10 +1,10 @@
 // 顶部标签组件
 <template>
-   <el-row class="Tags_P">
+  <el-row class="Tags_P">
     <el-check-tag :checked="checkedArr" @change="onChange">Tog</el-check-tag>
     <el-check-tag :checked="checkedArr" @change="onChange">Tog</el-check-tag>
     <el-check-tag :checked="checkedArr" @change="onChange">Tog</el-check-tag>
-   </el-row>
+  </el-row>
 </template>
 
 <script>
@@ -23,7 +23,9 @@ export default {
 </script>
 
 <style lang="less">
-.Tags_P{
-     background-color: rgb(86, 17, 17);
+.Tags_P {
+  height: 28px;
+  line-height: 28px;
+  border: 1px solid rgb(236, 234, 236);
 }
 </style>
\ No newline at end of file
diff --git a/src/components/container/Top.vue b/src/components/container/Top.vue
index 0daac8d2a2c679d9317f378d17d8d00c52c4b324..b53433666cfcaf058a839aada89c52ba7fca45b7 100644
--- a/src/components/container/Top.vue
+++ b/src/components/container/Top.vue
@@ -1,11 +1,12 @@
 // 顶部组件,内含Tags.vue
 <template>
   <div class="Top_P">
-      <el-row class="top" :span="24">
-         <div class="icons">
-            <el-icon v-if="fold"><Fold /></el-icon>
-            <el-icon else><Expand /></el-icon>
-         </div>
+    <div class="top">
+      <div class="left">
+        <div class="icons">
+          <el-icon v-if="fold"><Fold /></el-icon>
+          <el-icon else><Expand /></el-icon>
+        </div>
         <el-dropdown>
           <span class="el-dropdown-link">
             Dropdown List
@@ -23,30 +24,34 @@
         <el-breadcrumb separator="/">
           <el-breadcrumb-item :to="{ path: '/' }">homepage</el-breadcrumb-item>
         </el-breadcrumb>
-         <div class="icons">
-            <el-icon size="20px"><search /></el-icon>
-            <el-icon size="20px"><bell /></el-icon>
-         </div>
-        
-        <el-dropdown>
-          <div class="user">
-            <img src="" alt="" class="avatar">
-            <span class="nick_name"></span>
-          </div>
-          <template #dropdown>
-            <el-dropdown-menu>
-              <el-dropdown-item>工作台</el-dropdown-item>
-            </el-dropdown-menu>
-          </template>
-        </el-dropdown>
-      </el-row>
+      </div>
+
+      <div class="right">
+        <div class="icons">
+          <el-icon size="20px"><search /></el-icon>
+          <el-icon size="20px"><bell /></el-icon>
+        </div>
+      <el-dropdown>
+        <div class="user">
+          <img src="../../assets/avatar.jpg" alt="" class="avatar" />
+          <span class="nick_name">管理员</span>
+        </div>
+        <template #dropdown>
+          <el-dropdown-menu>
+            <el-dropdown-item>工作台</el-dropdown-item>
+          </el-dropdown-menu>
+        </template>
+      </el-dropdown>
+      </div>
+
+    </div>
     <Tags />
   </div>
 </template>
 
 <script>
 import Tags from "./Tags.vue";
-import { ArrowDown, Search, Bell,Fold,Expand } from "@element-plus/icons-vue";
+import { ArrowDown, Search, Bell, Fold, Expand } from "@element-plus/icons-vue";
 export default {
   name: "Top_P",
   components: {
@@ -55,28 +60,45 @@ export default {
     Search,
     Bell,
     Fold,
-    Expand
+    Expand,
   },
 };
 </script>
 
 <style lang="less">
 .Top_P {
-  height: 100px;
+  height: 76px;
   .top {
-    height: 60px;
-    background-color: rgb(21, 168, 55);
-    .icons{
-      
+    display: flex;
+    height: 48px;
+    justify-content:space-between;
+    
+    .left{
+      display: flex;
+    }
+    .icons {
       display: flex;
       align-items: center;
-      .el-icon{
-         margin:0 15px;
+      .el-icon {
+        margin: 0 15px;
       }
     }
-    *{
-       line-height: 60px;
-   }
+    .right{
+      display: flex;
+      .user{
+        padding-right: 20px;
+        display: flex;
+        .avatar {
+          padding:11px;
+          width: 26px;
+          height: 26px;
+          border-radius: 50%;
+        }
+      }
+    }
+    * {
+        line-height: 48px;
+      }
   }
 }
 </style>
\ No newline at end of file