add class username

src/oj/submission/list.vue

@@ -357,7 +357,7 @@ const flowchartColumns: DataTableColumn<FlowchartSubmissionListItem>[] = [
         <n-form-item>
           <n-input
             :disabled="query.myself === '1'"
-            style="width: 140px;"
+            style="width: 140px"
             clearable
             v-model:value="query.username"
             placeholder="用户"
@@ -365,7 +365,7 @@ const flowchartColumns: DataTableColumn<FlowchartSubmissionListItem>[] = [
         </n-form-item>
         <n-form-item>
           <n-input
-            style="width: 120px;"
+            style="width: 120px"
             clearable
             v-model:value="query.problem"
             placeholder="题号"

src/shared/api.ts

@@ -33,3 +33,7 @@ export function getCaptcha() {
 export function getHitokoto() {
   return http.get("hitokoto")
 }
+
+export function getClassUsernames(classroom: string) {
+  return http.get("class_usernames", { params: { classroom: classroom } })
+}

src/shared/components/Login.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { login } from "../api"
+import { getClassUsernames, login } from "../api"
 import { storeToRefs } from "pinia"
 import { useAuthModalStore } from "../store/authModal"
 import { useConfigStore } from "../store/config"
@@ -18,6 +18,8 @@ const {
   loginError: msg,
 } = storeToRefs(authStore)
 const loginRef = ref()
+const classUserOptions = ref<SelectOption[]>([])
+const classUserLoading = ref(false)
 const classList = computed<SelectOption[]>(() => {
   const defaults = [{ label: "没有我所在的班级", value: "" }]
   const configs =
@@ -28,7 +30,9 @@ const classList = computed<SelectOption[]>(() => {
   return [...defaults, ...configs]
 })
 const rules: FormRules = {
-  username: [{ required: true, message: "用户名必填", trigger: "blur" }],
+  username: [
+    { required: true, message: "用户名必填", trigger: ["blur", "change"] },
+  ],
   password: [
     { required: true, message: "密码必填", trigger: "blur" },
     { min: 6, max: 20, message: "长度在 6 到 20 位之间", trigger: "input" },
@@ -73,6 +77,34 @@ function goSignup() {
   authStore.switchToSignup()
 }
 
+async function loadClassUsernames(selectedClass: string) {
+  classUserLoading.value = true
+  try {
+    const res = await getClassUsernames(selectedClass)
+    classUserOptions.value = res.data.map((name: string) => ({
+      label: name,
+      value: name,
+    }))
+  } catch {
+    classUserOptions.value = []
+  } finally {
+    classUserLoading.value = false
+  }
+}
+
+watch(
+  () => form.value.class,
+  (selectedClass) => {
+    classUserOptions.value = []
+    form.value.username = ""
+    if (!selectedClass) {
+      classUserLoading.value = false
+      return
+    }
+    loadClassUsernames(selectedClass.slice(2))
+  },
+)
+
 onMounted(() => {
   authStore.clearLoginError()
 })
@@ -107,7 +139,19 @@ onMounted(() => {
         />
       </n-form-item>
       <n-form-item label="用户名" path="username">
+        <n-select
+          v-if="form.class"
+          v-model:value="form.username"
+          :options="classUserOptions"
+          :loading="classUserLoading"
+          clearable
+          filterable
+          name="username"
+          id="login-username"
+          placeholder="请选择姓名"
+        />
         <n-input
+          v-else
           v-model:value="form.username"
           autofocus
           clearable

src/shared/components/LoginSummaryModal.vue

@@ -17,7 +17,6 @@ const lastLoginTime = computed(() => {
 })
 
 const hasAnalysis = computed(() => !!loginSummaryStore.analysis)
-
 </script>
 
 <template>
@@ -58,7 +57,9 @@ const hasAnalysis = computed(() => !!loginSummaryStore.analysis)
           <n-gi>
             <n-statistic
               label="流程图提交"
-              :value="loginSummaryStore.summary?.flowchart_submission_count ?? 0"
+              :value="
+                loginSummaryStore.summary?.flowchart_submission_count ?? 0
+              "
             />
           </n-gi>
         </n-grid>
@@ -75,10 +76,7 @@ const hasAnalysis = computed(() => !!loginSummaryStore.analysis)
           v-if="hasAnalysis"
           :model-value="loginSummaryStore.analysis"
         />
-        <n-empty
-          v-else
-          description="期间提交数少于 3 次，暂不生成 AI 分析"
-        />
+        <n-empty v-else description="期间提交数少于 3 次，暂不生成 AI 分析" />
       </n-flex>
     </n-spin>
   </n-modal>