update and fix

Author: NeserCode

server/db.js

@@ -4,7 +4,7 @@ module.exports = {
         host: '127.0.0.1',          //mysql连接ip地址
         user: 'root',
         password: '648363',               //mySql用户名密码
-        database: 'user_system',               //mySql数据库名
+        database: 'team',               //mySql数据库名
         port: '3306',               //mysql连接端口
     }
 }

src/components/CheckDays/Rank/index.vue

@@ -5,25 +5,31 @@
 			class="mainContainer"
 			v-for="(item, index) in rankers"
 			:key="item.nickname"
-			v-loading="isLoading.single"
+			v-loading="isLoading"
 		>
-			<Card class="card" :author="item" />
-			<span class="time">{{
-				new Date(item.timeStamp).toLocaleString()
-			}}</span>
 			<span class="th"
-				>{{ index + 1 }}&nbsp;<sup>{{ thString(index + 1) }}</sup></span
+				>{{ index + 1 }}<sup>{{ thString(index + 1) }}</sup></span
 			>
+			<el-icon class="icon avatar" v-if="!item.avatar"><User /></el-icon>
+			<Avatar
+				class="avatar"
+				:image="item.avatar"
+				:is-dot="false"
+				v-else
+			/>
+			<span class="info">
+				<span class="nickname">{{ item.nickname }}</span>
+			</span>
 		</div>
 	</div>
 </template>
 
 <script>
-import Card from "@/components/UserAssets/Card/index.vue"
+import Avatar from "@/components/UserAssets/Avatar/index.vue"
 
 export default {
 	name: "Rank",
-	components: { Card },
+	components: { Avatar },
 	data() {
 		return {
 			isLoading: true,
@@ -114,29 +120,31 @@ export default {
 	font-family: "HanSerif";
 }
 .mainContainer {
-	@apply relative py-4 my-2 max-w-xs;
+	@apply relative inline-flex justify-center items-center py-4 w-full;
 }
 
-.card {
-	@apply flex-col px-4;
+.avatar {
+	@apply inline-block w-24 ml-2;
 }
-.time {
-	@apply text-xs font-bold opacity-60;
+.icon {
+	@apply text-4xl inline-block h-full px-2;
+}
+.info {
+	@apply relative inline-flex flex-col justify-center w-full ml-2;
+}
+
+.info .nickname {
+	@apply block text-base truncate font-semibold;
+	max-width: 12ch;
 }
 
 .th {
-	@apply inline-block absolute top-0 right-8 font-semibold text-lg;
+	@apply inline-block text-xl w-6;
 }
 
 @media (prefers-color-scheme: dark) {
-	.title {
-		@apply bg-gray-800;
-	}
 }
 
 @media (prefers-color-scheme: light) {
-	.title {
-		@apply bg-gray-100;
-	}
 }
 </style>

src/components/Frameworks/Navigation/index.vue

@@ -1,12 +1,17 @@
 <template>
 	<div class="navigation">
 		<UserAvatar
-			class="avatar"
+			class="avatar comp"
 			@click="handleOpenUserArea"
 			v-show="isLogined"
 			:image="avatarUrl"
 			:isDot="false"
+			:isMe="true"
+			v-if="avatarUrl"
 		/>
+		<span class="avatar icon" @click="handleOpenUserArea" v-else>
+			<el-icon><User /></el-icon
+		></span>
 		<div class="shiftOperations">
 			<span class="color-mode" @click="switchColorMode">
 				<el-icon v-if="isMatchColorMode('light')"><Sunny /></el-icon>
@@ -65,8 +70,9 @@ export default {
 		}
 	},
 	beforeCreate() {
-		this.$public.on("update-main-user-info-upto-app", () => {
+		this.$public.on("update-main-user-info-upto-app", ({ detail }) => {
 			this.isLogined = true
+			this.avatarUrl = detail.avatar ?? localStorage.getItem("avatar")
 		})
 		this.$public.on("clear-user-sign-status", () => {
 			this.isLogined = false
@@ -167,7 +173,15 @@ export default {
 }
 
 .avatar {
-	@apply w-11 h-11 absolute left-2;
+	@apply inline-flex justify-center items-center w-11 h-11 absolute left-2
+	hover:bg-gray-200 dark:hover:bg-gray-600 rounded-full cursor-pointer transition-all;
+}
+
+.avatar:not(.comp) {
+	@apply inline-flex justify-center items-center w-11 h-11 p-2.5 absolute left-2
+	hover:bg-gray-200 dark:hover:bg-gray-600 rounded-full
+	border-2 border-gray-300 dark:border-gray-600
+	cursor-pointer transition-all;
 }
 
 .shiftOperations {