From 5a701b16a71fdc2d575a3ed712107d278e092a6d Mon Sep 17 00:00:00 2001
From: ddmt <ddmt@ddmt.top>
Date: Sun, 7 Apr 2024 17:22:43 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9B=BE=E7=89=87=E4=B8=8D=E6=8B=89=E4=BC=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/index.vue | 17 ++++++++++-------
 1 file changed, 10 insertions(+), 7 deletions(-)

diff --git a/src/views/index.vue b/src/views/index.vue
index 5f07012..2da74e2 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -3,12 +3,13 @@
     <div class="navigationBar">
       <div class="navTitle">
         <router-link to="/">
-          <img src="../assets/logo.png" alt="" />
+          <img class="img-logo" src="../assets/logo.png" alt="" />
         </router-link>
       </div>
       <div class="navUser">
-        <div class="block"><el-avatar shape="square" :size="50" :src="squareUrl"></el-avatar></div>
-        <span>{{ userName }}</span>
+        <div v-if="login" class="block"><el-avatar shape="square" :size="50" fit="cover" :src="squareUrl"></el-avatar></div>
+        <span v-if="login">{{ userName }}</span>
+        <el-button v-else type="primary" icon="el-icon-user-solid">登陆</el-button>
       </div>
     </div>
     <div class="content">
@@ -25,7 +26,7 @@
               </router-link>
             </div>
             <router-link :to="item.url">
-              <img :src="item.imgs" />
+              <img :src="item.imgs"/>
             </router-link>
           </li>
         </ul>
@@ -39,6 +40,7 @@ export default {
   name: 'HomeView',
   data () {
     return {
+      login: true,
       userName: 'ddmt',
       squareUrl: 'https://cube.elemecdn.com/9/c2/f0ee8a3c7c9638a54940382568c9dpng.png',
       parItem: [
@@ -78,7 +80,7 @@ export default {
 }
 </script>
 
-<style lang="less">
+<style lang="less" scoped>
 .navigationBar {
   width: 100%;
   height: 80px;
@@ -86,7 +88,7 @@ export default {
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
 
-  img {
+  .img-logo {
     margin-left: 5px;
     width: auto;
     height: 80px;
@@ -97,7 +99,7 @@ export default {
     float: right;
     margin-right: 100px;
 
-    .block {
+    .block, .el-button {
       display: inline-block;
       margin-top: 15px;
     }
@@ -161,6 +163,7 @@ export default {
   }
 
   li img {
+    object-fit: cover;
     width: 100%;
     height: 100%;
     display: block;