Sfoglia il codice sorgente

feat:删除了用户中心的头像,同时对ui进行了一些优化

chenjiayao 1 anno fa
parent
commit
155f41dbbc
3 ha cambiato i file con 14 aggiunte e 12 eliminazioni
  1. 7 8
      src/layout/Header/Header.vue
  2. 2 0
      src/layout/Header/index.scss
  3. 5 4
      src/views/Profile.vue

+ 7 - 8
src/layout/Header/Header.vue

@@ -21,25 +21,23 @@
     </div>
     <!-- 用户头像和昵称 -->
     <div class="header-userName">
-      <el-dropdown @command="handleCommand">
+      <el-dropdown class="el-dropdown" @command="handleCommand">
         <div class="user-info">
-          <!-- 如果是登录状态 -->
-          <template v-if="store.token !== ''">
-            <!-- 用户有头像 -->
+          <!-- <template v-if="store.token !== ''">
             <template v-if="store.user.userAvatar !== ''">
               <el-avatar :size="32" :shape="'circle'" :src="store.user.userAvatar" />
             </template>
-            <!-- 用户没有头像 -->
             <template v-else>
               <el-avatar :size="32" :shape="'circle'">{{ store.user.name.charAt(0) }}</el-avatar>
             </template>
             <div class="nickName">{{ store.user.name }}</div>
           </template>
-          <!-- 如果是未登录状态 -->
-          <template v-else>
+          <template v-else>            
             <el-avatar :size="32" :shape="'circle'">U</el-avatar>
             <div class="nickName">user</div>
-          </template>
+          </template> -->
+          <el-icon><User /></el-icon>
+          <div class="nickName">{{ store.user.userAvatar !== '' ? store.user.name : "user"}}</div>
         </div>
         <template #dropdown>
           <el-dropdown-menu>
@@ -53,6 +51,7 @@
 </template>
 
 <script setup lang="ts">
+import {User} from "@element-plus/icons-vue";
 import router from "../../router/index.js";
 import { onMounted, ref } from "vue";
 import './index.scss';

+ 2 - 0
src/layout/Header/index.scss

@@ -59,10 +59,12 @@
     .user-info {
       display: flex;
       align-items: center;
+      outline: unset;
     }
 
     .nickName {
       margin-left: 10px;
     }
   }
+
 }

+ 5 - 4
src/views/Profile.vue

@@ -5,14 +5,15 @@
       <el-descriptions title="个人中心" border :column="3">
           <template #extra>
             <el-button type="primary" @click="passwordChangeVisible=true">修改密码</el-button>
-            <el-button type="primary" @click="infoChangeVisible=true">修改信息</el-button>
+            <!-- <el-button type="primary" @click="infoChangeVisible=true">修改信息</el-button> -->
           </template>
-        <el-descriptions-item :rowspan="3" :width="120" label="头像">
+        <!-- <el-descriptions-item :rowspan="3" :width="120" label="头像">
           <el-avatar align="center" style="width: 100px; height: 100px" :src="user.userAvatar"/>
-        </el-descriptions-item>
+        </el-descriptions-item> -->
         <el-descriptions-item label="姓名">{{ user.name }}</el-descriptions-item>
         <el-descriptions-item label="角色">
-          <el-tag size="small">{{ user.role == 'STUDENT' ? '学生' : '教师'}}</el-tag>
+          {{ user.role == 'STUDENT' ? '学生' : '教师'}}
+          <!-- <el-tag size="small">{{ user.role == 'STUDENT' ? '学生' : '教师'}}</el-tag> -->
         </el-descriptions-item>
         <el-descriptions-item label="账号">{{ user.officialNumber }}</el-descriptions-item>
         <el-descriptions-item label="邮箱">{{ user.officialEmail }}</el-descriptions-item>