新增题目完成的排名

src/components.d.ts

@@ -11,15 +11,11 @@ declare module 'vue' {
     NAlert: typeof import('naive-ui')['NAlert']
     NAvatar: typeof import('naive-ui')['NAvatar']
     NButton: typeof import('naive-ui')['NButton']
-    NButtonGroup: typeof import('naive-ui')['NButtonGroup']
     NCard: typeof import('naive-ui')['NCard']
-    NCheckbox: typeof import('naive-ui')['NCheckbox']
-    NCheckboxGroup: typeof import('naive-ui')['NCheckboxGroup']
     NCode: typeof import('naive-ui')['NCode']
     NCollapseTransition: typeof import('naive-ui')['NCollapseTransition']
     NConfigProvider: typeof import('naive-ui')['NConfigProvider']
     NDataTable: typeof import('naive-ui')['NDataTable']
-    NDatePicker: typeof import('naive-ui')['NDatePicker']
     NDescriptions: typeof import('naive-ui')['NDescriptions']
     NDescriptionsItem: typeof import('naive-ui')['NDescriptionsItem']
     NDropdown: typeof import('naive-ui')['NDropdown']
@@ -37,13 +33,10 @@ declare module 'vue' {
     NH4: typeof import('naive-ui')['NH4']
     NIcon: typeof import('naive-ui')['NIcon']
     NInput: typeof import('naive-ui')['NInput']
-    NInputNumber: typeof import('naive-ui')['NInputNumber']
     NLayout: typeof import('naive-ui')['NLayout']
     NLayoutContent: typeof import('naive-ui')['NLayoutContent']
     NLayoutHeader: typeof import('naive-ui')['NLayoutHeader']
     NLayoutSider: typeof import('naive-ui')['NLayoutSider']
-    NList: typeof import('naive-ui')['NList']
-    NListItem: typeof import('naive-ui')['NListItem']
     NMenu: typeof import('naive-ui')['NMenu']
     NMessageProvider: typeof import('naive-ui')['NMessageProvider']
     NModal: typeof import('naive-ui')['NModal']
@@ -55,14 +48,12 @@ declare module 'vue' {
     NScrollbar: typeof import('naive-ui')['NScrollbar']
     NSelect: typeof import('naive-ui')['NSelect']
     NSpace: typeof import('naive-ui')['NSpace']
-    NSplit: typeof import('naive-ui')['NSplit']
     NSwitch: typeof import('naive-ui')['NSwitch']
     NTabPane: typeof import('naive-ui')['NTabPane']
     NTabs: typeof import('naive-ui')['NTabs']
     NTag: typeof import('naive-ui')['NTag']
     NText: typeof import('naive-ui')['NText']
     NTooltip: typeof import('naive-ui')['NTooltip']
-    NUpload: typeof import('naive-ui')['NUpload']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
   }

src/oj/api.ts

@@ -89,6 +89,10 @@ export function getSubmissions(params: SubmissionListPayload) {
   return http.get(endpoint, { params })
 }
 
+export function getRankOfProblem(problem_id: string) {
+  return http.get("user_problem_rank", { params: {problem_id: problem_id} })
+}
+
 export function getTodaySubmissionCount() {
   return http.get("submissions/today_count")
 }

src/oj/problem/components/ProblemSubmission.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { NButton } from "naive-ui"
-import { getSubmissions } from "~/oj/api"
+import { getSubmissions, getRankOfProblem } from "~/oj/api"
 import Pagination from "~/shared/components/Pagination.vue"
 import SubmissionResultTag from "~/shared/components/SubmissionResultTag.vue"
 import { useConfigStore } from "~/shared/store/config"
@@ -62,6 +62,11 @@ const columns: DataTableColumn<Submission>[] = [
   },
 ]
 
+const class_name = ref("")
+const rank = ref(-1)
+const class_ac_count = ref(0)
+const all_ac_count = ref(0)
+
 const submissions = ref<Submission[]>([])
 const total = ref(0)
 const query = reactive({
@@ -93,12 +98,134 @@ async function listSubmissions() {
   submissions.value = res.data.results
   total.value = res.data.total
 }
-onMounted(listSubmissions)
+
+async function getRankOfThisProblem() {
+  const res = await getRankOfProblem(<string>route.params.problemID ?? "")
+  class_name.value = res.data.class_name
+  rank.value = res.data.rank
+  class_ac_count.value = res.data.class_ac_count
+  all_ac_count.value = res.data.all_ac_count
+}
+
+onMounted(() => {
+  listSubmissions()
+  getRankOfThisProblem()
+})
 watch(query, listSubmissions)
 </script>
 <template>
   <n-alert type="error" v-if="!showList" :title="errorMsg" />
+  <template v-if="route.name === 'problem'">
+    <template v-if="class_name">
+      <n-alert class="tip" type="success" :show-icon="false" v-if="rank !== -1">
+        <template #header>
+          <n-flex align="center">
+            <div>
+              本道题你在班上排名第 <b>{{ rank }}</b
+              >，你们班共有 <b>{{ class_ac_count }}</b> 人答案正确
+            </div>
+            <n-button
+              @click="
+                router.push({
+                  name: 'submissions',
+                  query: {
+                    problem: route.params.problemID,
+                    result: '0',
+                    page: 1,
+                    limit: 10,
+                    username: 'ks' + class_name,
+                  },
+                })
+              "
+            >
+              查看
+            </n-button>
+          </n-flex>
+        </template>
+      </n-alert>
+      <n-alert class="tip" type="error" :show-icon="false" v-else>
+        <template #header>
+          <n-flex>
+            <div>
+              本道题你还没有解决，
+              <div v-if="class_name">你们班</div>
+              共有 <b>{{ class_ac_count }}</b> 人答案正确
+            </div>
+            <n-button
+              @click="
+                router.push({
+                  name: 'submissions',
+                  query: {
+                    problem: route.params.problemID,
+                    result: '0',
+                    page: 1,
+                    limit: 10,
+                    username: 'ks' + class_name,
+                  },
+                })
+              "
+            >
+              查看
+            </n-button>
+          </n-flex>
+        </template>
+      </n-alert>
+    </template>
     <template v-else>
+      <n-alert class="tip" type="success" :show-icon="false" v-if="rank !== -1">
+        <template #header>
+          <n-flex align="center">
+            <div>
+              本道题你在全服排名第 <b>{{ rank }}</b
+              >，全服共有 <b>{{ all_ac_count }}</b> 人答案正确
+            </div>
+            <div></div>
+            <n-button
+              secondary
+              @click="
+                router.push({
+                  name: 'submissions',
+                  query: {
+                    problem: route.params.problemID,
+                    result: '0',
+                    page: 1,
+                    limit: 10,
+                  },
+                })
+              "
+            >
+              查看
+            </n-button>
+          </n-flex>
+        </template>
+      </n-alert>
+      <n-alert class="tip" type="error" :show-icon="false" v-else>
+        <template #header>
+          <n-flex align="center">
+            <div>
+              本道题你还没有解决，全服共有 <b>{{ all_ac_count }}</b> 人答案正确
+            </div>
+            <n-button
+              @click="
+                router.push({
+                  name: 'submissions',
+                  query: {
+                    problem: route.params.problemID,
+                    result: '0',
+                    page: 1,
+                    limit: 10,
+                  },
+                })
+              "
+            >
+              查看
+            </n-button>
+          </n-flex>
+        </template>
+      </n-alert>
+    </template>
+  </template>
+  <template v-if="showList">
     <n-data-table striped :columns="columns" :data="submissions" />
     <Pagination
       :total="total"
@@ -107,3 +234,9 @@ watch(query, listSubmissions)
     />
   </template>
 </template>
+
+<style scoped>
+.tip {
+  margin-bottom: 16px;
+}
+</style>