add leaderboard

src/components/Challenge.vue

@@ -19,6 +19,14 @@
             </template>
             <template #header-extra>
               <n-tag type="warning" size="small">{{ item.score }}分</n-tag>
+              <n-tag
+                v-if="myScoreMap.get(item.display)"
+                type="success"
+                size="small"
+                style="margin-left: 4px"
+              >
+                得分 {{ myScoreMap.get(item.display)!.toFixed(1) }}
+              </n-tag>
             </template>
           </n-card>
         </n-gi>
@@ -31,7 +39,7 @@ import { ref, onMounted } from "vue"
 import { Icon } from "@iconify/vue"
 import { marked } from "marked"
 import { useRouter } from "vue-router"
-import { Challenge } from "../api"
+import { Challenge, Submission } from "../api"
 import { taskTab, taskId, challengeDisplay } from "../store/task"
 import { TASK_TYPE } from "../utils/const"
 import type { ChallengeSlim } from "../utils/type"
@@ -40,6 +48,16 @@ const router = useRouter()
 const challenges = ref<ChallengeSlim[]>([])
 const currentChallenge = ref<ChallengeSlim | null>(null)
 const content = ref("")
+const myScoreMap = ref<Map<number, number>>(new Map())
+
+async function loadMyScores() {
+  try {
+    const scores = await Submission.myScores()
+    myScoreMap.value = new Map(scores.map((s) => [s.task_display, s.score]))
+  } catch {
+    // 未登录时忽略
+  }
+}
 
 async function loadList() {
   challenges.value = await Challenge.listDisplay()
@@ -72,7 +90,10 @@ function back() {
   router.push({ name: "home-challenge-list" })
 }
 
-onMounted(loadList)
+onMounted(async () => {
+  await loadList()
+  await loadMyScores()
+})
 </script>
 <style scoped>
 .container {

src/components/Task.vue

@@ -44,6 +44,12 @@
         >
           <Icon :width="16" icon="lucide:list"></Icon>
         </n-button>
+        <n-button text @click="$router.push({ name: 'leaderboard' })">
+          <Icon :width="16" icon="lucide:trophy" />
+        </n-button>
+        <n-button text v-if="isLoggedIn" @click="$router.push({ name: 'my-scores' })">
+          <Icon :width="16" icon="lucide:bar-chart-2" />
+        </n-button>
         <n-button text v-if="roleSuper" @click="edit">
           <Icon :width="16" icon="lucide:edit"></Icon>
         </n-button>
@@ -63,7 +69,7 @@ import { step } from "../store/tutorial"
 import { roleSuper } from "../store/user"
 import { taskTab, challengeDisplay } from "../store/task"
 import { useRoute, useRouter } from "vue-router"
-import { TASK_TYPE } from "../utils/const"
+import { TASK_TYPE, STORAGE_KEY } from "../utils/const"
 import Challenge from "./Challenge.vue"
 import Tutorial from "./Tutorial.vue"
 
@@ -73,6 +79,8 @@ const tutorialRef = ref<InstanceType<typeof Tutorial>>()
 
 defineEmits(["hide"])
 
+const isLoggedIn = computed(() => localStorage.getItem(STORAGE_KEY.LOGIN) === "true")
+
 const hideNav = computed(
   () =>
     taskTab.value !== TASK_TYPE.Tutorial ||