fix

src/oj/contest/components/ContestInfo.vue

@@ -10,7 +10,6 @@ const contestStore = useContestStore()
 <template>
   <n-popover
     v-if="contestStore.contest"
-    trigger="click"
     placement="bottom-end"
     :show-arrow="false"
   >

src/oj/contest/components/ContestMenu.vue

@@ -46,7 +46,7 @@ const options: DropdownOption[] = [
         比赛排名
       </n-button>
     </n-space>
-    <n-dropdown v-else :options="options" trigger="click" @select="goto">
+    <n-dropdown v-else :options="options" @select="goto">
       <n-button>菜单</n-button>
     </n-dropdown>
   </div>

src/oj/contest/list.vue

@@ -91,12 +91,20 @@ function clear() {
 onMounted(listContests)
 watch(() => query.page, routerPush)
 watch(
-  () => [query.limit, query.keyword, query.status],
+  () => [query.limit, query.status],
   () => {
     query.page = 1
     routerPush()
   },
 )
+watchDebounced(
+  () => [query.keyword],
+  () => {
+    query.page = 1
+    routerPush()
+  },
+  { debounce: 500, maxWait: 1000 },
+)
 watch(
   () => route.name === "contests" && route.query,
   (newVal) => {
@@ -129,7 +137,11 @@ function rowProps(row: Contest) {
           />
         </n-form-item>
         <n-form-item>
-          <n-input clearable @change="search" placeholder="比赛标题" />
+          <n-input
+            clearable
+            v-model:value="query.keyword"
+            placeholder="比赛标题"
+          />
         </n-form-item>
       </n-form>
       <n-form :show-feedback="false" label-placement="left" inline>

src/oj/problem/components/Submit.vue

@@ -203,7 +203,6 @@ watch(
 
 <template>
   <n-popover
-    trigger="click"
     placement="bottom-end"
     scrollable
     :show-arrow="false"

src/oj/problem/components/TestCat.vue

@@ -19,7 +19,6 @@ function clear() {
 </script>
 <template>
   <n-popover
-    trigger="click"
     placement="bottom-end"
     scrollable
     :show-arrow="false"

src/oj/problem/list.vue

@@ -110,15 +110,21 @@ async function getRandom() {
 }
 
 watch(() => query.page, routerPush)
-
 watch(
-  () => [query.tag, query.difficulty, query.limit, query.keyword],
+  () => [query.tag, query.difficulty, query.limit],
   () => {
     query.page = 1
     routerPush()
   },
 )
-
+watchDebounced(
+  () => [query.keyword],
+  () => {
+    query.page = 1
+    routerPush()
+  },
+  { debounce: 500, maxWait: 1000 },
+)
 watch(
   () => query.tag,
   () => {
@@ -128,7 +134,6 @@ watch(
     }))
   },
 )
-
 watch(
   () => route.path === "/" && route.query,
   (newVal) => {
@@ -199,7 +204,11 @@ function rowProps(row: ProblemFiltered) {
           />
         </n-form-item>
         <n-form-item>
-          <n-input clearable @change="search" placeholder="题号或者标题" />
+          <n-input
+            clearable
+            v-model:value="query.keyword"
+            placeholder="题号或者标题"
+          />
         </n-form-item>
       </n-form>
       <n-form :show-feedback="false" inline label-placement="left">

src/oj/submission/components/ButtonWithSearch.vue

@@ -0,0 +1,17 @@
+<script lang="ts" setup>
+import Filter from "~/shared/icons/Filter.vue"
+
+defineEmits(["click", "search"])
+</script>
+<template>
+  <n-flex align="center">
+    <n-button text type="info" @click="$emit('click')"><slot></slot></n-button>
+    <n-button text @click="$emit('search')">
+      <template #icon>
+        <n-icon color="#ccc">
+          <Filter />
+        </n-icon>
+      </template>
+    </n-button>
+  </n-flex>
+</template>

src/oj/submission/list.vue

@@ -13,6 +13,7 @@ import { adminRejudge, getSubmissions } from "oj/api"
 import { isDesktop } from "~/shared/composables/breakpoints"
 import { useUserStore } from "~/shared/store/user"
 import { LANGUAGE_SHOW_VALUE } from "~/utils/constants"
+import ButtonWithSearch from "./components/ButtonWithSearch.vue"
 
 interface Query {
   username: string
@@ -81,14 +82,6 @@ function routerPush() {
   })
 }
 
-function searchUser(value: string) {
-  query.username = value
-}
-
-function searchProblem(value: string) {
-  query.problem = value
-}
-
 function search(username: string, problem: string) {
   query.username = username
   query.problem = problem
@@ -107,22 +100,38 @@ async function rejudge(submissionID: string) {
   listSubmissions()
 }
 
+function problemClicked(row: Submission) {
+  if (route.name === "contest submissions") {
+    router.push({
+      name: "contest problem",
+      params: {
+        problemID: row.problem,
+      },
+    })
+  } else {
+    router.push("/problem/" + row.problem)
+  }
+}
+
 watch(() => query.page, routerPush)
 
 watch(
-  () => [
-    query.limit,
-    query.myself,
-    query.username,
-    query.result,
-    query.problem,
-  ],
+  () => [query.limit, query.myself, query.result],
   () => {
     query.page = 1
     routerPush()
   },
 )
 
+watchDebounced(
+  () => [query.username, query.problem],
+  () => {
+    query.page = 1
+    routerPush()
+  },
+  { debounce: 500, maxWait: 1000 },
+)
+
 watch(
   () =>
     (route.name === "submissions" || route.name === "contest submissions") &&
@@ -176,22 +185,10 @@ const columns = computed(() => {
       width: 120,
       render: (row) =>
         h(
-          NButton,
+          ButtonWithSearch,
           {
-            text: true,
-            type: "info",
-            onClick: () => {
-              if (route.name === "contest submissions") {
-                router.push({
-                  name: "contest problem",
-                  params: {
-                    problemID: row.problem,
-                  },
-                })
-              } else {
-                router.push("/problem/" + row.problem)
-              }
-            },
+            onClick: () => problemClicked(row),
+            onSearch: () => (query.problem = row.problem),
           },
           () => row.problem,
         ),
@@ -220,11 +217,10 @@ const columns = computed(() => {
       minWidth: 120,
       render: (row) =>
         h(
-          NButton,
+          ButtonWithSearch,
           {
-            text: true,
-            type: "info",
             onClick: () => router.push("/user?name=" + row.username),
+            onSearch: () => (query.username = row.username),
           },
           () => row.username,
         ),
@@ -267,10 +263,14 @@ const columns = computed(() => {
       </n-form>
       <n-form :show-feedback="false" inline label-placement="left">
         <n-form-item>
-          <n-input clearable @change="searchUser" placeholder="用户" />
+          <n-input
+            clearable
+            v-model:value="query.username"
+            placeholder="用户"
+          />
         </n-form-item>
         <n-form-item>
-          <n-input clearable @change="searchProblem" placeholder="题号" />
+          <n-input clearable v-model:value="query.problem" placeholder="题号" />
         </n-form-item>
       </n-form>
       <n-form :show-feedback="false" inline label-placement="left">