add user homepage.

src/oj/contest/pages/rank.vue

@@ -40,7 +40,15 @@ const columns = ref<DataTableColumn<ContestRank>[]>([
     fixed: "left",
     align: "center",
     render: (row) =>
-      h(NButton, { text: true, type: "info" }, () => row.user.username),
+      h(
+        NButton,
+        {
+          text: true,
+          type: "info",
+          onClick: () => router.push("/user?name=" + row.user.username),
+        },
+        () => row.user.username
+      ),
   },
   {
     title: "正确数/总提交",

src/oj/rank/list.vue

@@ -6,6 +6,7 @@ import { Rank } from "utils/types"
 import { getRank } from "oj/api"
 import { getACRate } from "utils/functions"
 
+const router = useRouter()
 const data = ref<Rank[]>([])
 const total = ref(0)
 const query = reactive({
@@ -39,7 +40,11 @@ const columns: DataTableColumn<Rank>[] = [
     render: (row) =>
       h(
         NButton,
-        { text: true, type: "info", onClick: () => {} },
+        {
+          text: true,
+          type: "info",
+          onClick: () => router.push("/user?name=" + row.user.username),
+        },
         () => row.user.username
       ),
   },

src/oj/submission/detail.vue

@@ -61,7 +61,7 @@ onMounted(init)
     >
       <n-space>
         <span>提交时间：{{ parseTime(submission.create_time) }}</span>
-        <span>语言：{{ submission.language }}</span>
+        <span>编程语言：{{ submission.language }}</span>
         <span>用户：{{ submission.username }}</span>
       </n-space>
     </n-alert>

src/oj/submission/list.vue

@@ -196,7 +196,15 @@ const columns = computed(() => {
       key: "username",
       minWidth: 120,
       render: (row) =>
-        h(NButton, { text: true, type: "info" }, () => row.username),
+        h(
+          NButton,
+          {
+            text: true,
+            type: "info",
+            onClick: () => router.push("/user?name=" + row.username),
+          },
+          () => row.username
+        ),
     },
   ]
   if (!route.params.contestID && userStore.isSuperAdmin) {

src/oj/user/index.vue

@@ -1,3 +1,84 @@
-<script setup lang="ts"></script>
-<template></template>
-<style scoped></style>
+<script setup lang="ts">
+import { getProfile } from "~/shared/api"
+import { Profile } from "~/utils/types"
+
+const route = useRoute()
+const profile = ref<Profile | null>(null)
+const problems = ref<string[]>([])
+const [loading, toggle] = useToggle()
+
+async function init() {
+  toggle(true)
+  try {
+    const res = await getProfile(route.query.name as string)
+    profile.value = res.data
+    const acm = res.data.acm_problems_status.problems || {}
+    const oi = res.data.oi_problems_status.problems || {}
+    const ac: string[] = []
+    for (let problems of [acm, oi]) {
+      Object.keys(problems).forEach((problemID) => {
+        if (problems[problemID]["status"] === 0) {
+          ac.push(problems[problemID]["_id"])
+        }
+      })
+    }
+    ac.sort()
+    problems.value = ac
+  } finally {
+    toggle(false)
+  }
+}
+
+onMounted(init)
+</script>
+<template>
+  <n-space vertical justify="center" align="center" v-if="!loading && profile">
+    <n-avatar round :size="140" :src="profile.avatar" />
+    <h2>{{ profile.user.username }}</h2>
+    <p class="desc">{{ profile.mood }}</p>
+  </n-space>
+  <n-descriptions
+    v-if="!loading && profile"
+    class="wrapper"
+    bordered
+    :column="2"
+    label-style="width: 50%"
+  >
+    <n-descriptions-item label="已解决的问题数量">
+      {{ profile.accepted_number }}
+    </n-descriptions-item>
+    <n-descriptions-item label="总提交数">
+      {{ profile.submission_number }}
+    </n-descriptions-item>
+    <n-descriptions-item v-if="problems.length" label="已解决的问题" :span="2">
+      <n-space>
+        <n-button
+          v-for="id in problems"
+          key="id"
+          @click="$router.push('/problem/' + id)"
+        >
+          {{ id }}
+        </n-button>
+      </n-space>
+    </n-descriptions-item>
+  </n-descriptions>
+  <n-empty v-if="!loading && !profile" description="该用户不存在">
+    <template #extra>
+      <n-button @click="$router.push('/')">返回主页</n-button>
+    </template>
+  </n-empty>
+</template>
+<style scoped>
+.wrapper {
+  max-width: 600px;
+  margin: 16px auto 0;
+}
+
+h2 {
+  margin: 0;
+}
+
+.desc {
+  margin: 0;
+}
+</style>