Browse Source

退出按钮优化

zhangliang2 2 years ago
parent
commit
35c98404eb
1 changed files with 21 additions and 15 deletions
  1. 21 15
      src/views/page/breadCrumb.vue

+ 21 - 15
src/views/page/breadCrumb.vue

@@ -33,14 +33,14 @@
                 </transition-group>
             </el-breadcrumb>
         </div>
-        
+
         <div class="nameBox">
-            <div>{{$store.state.username}}</div>
+            <div>{{ $store.state.username }}</div>
             <div class="el-icon-switch-button exit" @click="exit"></div>
         </div>
-        <div class="avatarBox">
+        <!-- <div class="avatarBox">
             <img :src="imgSrc" width="100%" height="100%" />
-        </div>
+        </div> -->
     </div>
 </template>
 
@@ -61,17 +61,19 @@ export default {
         };
     },
     methods: {
-        exit(){
+        exit() {
             this.$confirm("是否确定退出系统?", "提示", {
                 confirmButtonText: "确定",
                 cancelButtonText: "取消",
                 type: "warning",
-            }).then(() => {
-                localStorage.clear()
-                let loginUrl = window.location.origin + '/login'
-                window.location.href = loginUrl
-            }).catch(() => {});
-        }
+            })
+                .then(() => {
+                    localStorage.clear();
+                    let loginUrl = window.location.origin + "/login";
+                    window.location.href = loginUrl;
+                })
+                .catch(() => {});
+        },
     },
     computed: {
         list() {
@@ -151,27 +153,31 @@ export default {
             margin: 0px 3px 0px 1px;
         }
     }
+
     .nameBox {
         position: absolute;
         top: 4px;
-        right: 100px;
+        right: 20px;
         z-index: 669;
         display: flex;
         height: 40px;
+
         div {
             height: 40px;
             line-height: 40px;
         }
+
         .exit {
-            margin-left: 10px; 
+            margin-left: 10px;
             font-size: 30px;
             cursor: pointer;
         }
+        
         .exit:hover {
             color: @themeColor;
         }
     }
-    .avatarBox {
+    /* .avatarBox {
         position: absolute;
         top: 4px;
         right: 20px;
@@ -181,6 +187,6 @@ export default {
         cursor: pointer;
         border-radius: 50%;
         overflow: hidden;
-    }
+    } */
 }
 </style>