add user homepage style

Signed-off-by: zhangtianli2006 <49156174+zhangtianli2006@users.noreply.github.com>

Author: ZTL-UwU

src/components/lib/AjaxTable.vue

@@ -44,7 +44,7 @@ export default {
           this.loading = false;
         })
         .catch(err => {
-          this.$message.error('[Ajax Table] Request Failed.');
+          this.$SegmentMessage.error(this, '[Ajax Table] Request Failed.');
           console.log(err);
         });
     }

src/components/page/navbar.vue

@@ -23,7 +23,7 @@
               </el-avatar>
           </template>
           <div v-if="this.$store.state.user.authenticated">
-            <el-menu-item>
+            <el-menu-item :index="'/account/' + $store.state.user.userid">
               {{this.$store.state.user.username}}
             </el-menu-item>
             <UserLogout v-if="$store.state.user.showlogout" />

src/components/user/content.vue

@@ -1,11 +1,27 @@
 <template>
-  <div>
-    <span class="text-extra-big">{{username}}  </span>
-    <span>{{email}}</span>
-    <br>
-    <span class="text-extra-big">Introduction</span>
-    <div class="introduction">
-      <MarkdownContainer v-if="introduction" :content="introduction"/>
+  <div id="user-content">
+    <div>
+      <el-card shadow="never">
+        <el-avatar shape="square" icon="el-icon-user-solid" :size="400"></el-avatar>
+      </el-card>
+    </div>
+    <div id="info">
+      <el-card shadow="never">
+        <div slot="header" class="clearfix">User Name</div>
+        {{username}}
+      </el-card>
+      <el-card shadow="never" class="item">
+        <div slot="header" class="clearfix">Email</div>
+        {{email}}
+      </el-card>
+      <el-card shadow="never" class="item">
+        <div slot="header" class="clearfix">Sloved</div>
+        {{solved}}
+      </el-card>
+      <el-card shadow="never" class="item">
+        <div slot="header" class="clearfix">Introduction</div>
+        <MarkdownContainer v-if="introduction" :content="introduction"/>
+      </el-card>
     </div>
   </div>
 </template>
@@ -32,6 +48,7 @@ export default {
           this.username = data.username;
           this.email = data.email;
           this.introduction = data.introduction;
+          this.solved = data.solved;
         })
         .catch(err => {
           if(err.request.status === 404) {
@@ -52,8 +69,16 @@ export default {
 </script>
 
 <style scoped>
-.introduction {
-    border: dashed 1px rgb(189, 189, 189);
-    padding: 15px;
+.item {
+    margin-top: 20px;
+}
+
+#info {
+    margin-left: 30px;
+    width: 800px;
+}
+
+#user-content {
+    display: flex;
 }
-</style>
+</style>

src/router.js

@@ -8,7 +8,7 @@ let router = new Router({
     path: '/',
     component: () => import('./components/home/page.vue')
   }, {
-    path: '/user/:id',
+    path: '/account/:id',
     component: () => import('./components/user/content.vue')
   }, {
     path: '/problem/list',