update

src/oj/contest/list.vue

@@ -130,36 +130,42 @@ function rowProps(row: Contest) {
 </script>
 <template>
   <n-flex vertical size="large">
-    <n-space>
-      <n-form :show-feedback="false" label-placement="left" inline>
-        <n-form-item label="比赛状态">
-          <n-select
-            style="width: 120px"
-            :options="options"
-            v-model:value="query.status"
-          />
-        </n-form-item>
-        <n-form-item label="标签">
-          <n-select class="select" :options="tags" v-model:value="query.tag" />
-        </n-form-item>
-      </n-form>
-      <n-form :show-feedback="false" label-placement="left" inline>
-        <n-form-item>
-          <n-input
-            style="width: 200px"
-            clearable
-            v-model:value="query.keyword"
-            placeholder="比赛标题"
-          />
-        </n-form-item>
-        <n-form-item>
-          <n-flex>
-            <n-button @click="search(query.keyword)">搜索</n-button>
-            <n-button @click="clear" quaternary>重置</n-button>
-          </n-flex>
-        </n-form-item>
-      </n-form>
-    </n-space>
+    <n-card embedded>
+      <n-space>
+        <n-form :show-feedback="false" label-placement="left" inline>
+          <n-form-item label="比赛状态">
+            <n-select
+              style="width: 120px"
+              :options="options"
+              v-model:value="query.status"
+            />
+          </n-form-item>
+          <n-form-item label="标签">
+            <n-select
+              style="width: 120px"
+              :options="tags"
+              v-model:value="query.tag"
+            />
+          </n-form-item>
+        </n-form>
+        <n-form :show-feedback="false" label-placement="left" inline>
+          <n-form-item>
+            <n-input
+              style="width: 200px"
+              clearable
+              v-model:value="query.keyword"
+              placeholder="比赛标题"
+            />
+          </n-form-item>
+          <n-form-item>
+            <n-flex>
+              <n-button @click="search(query.keyword)">搜索</n-button>
+              <n-button @click="clear" quaternary>重置</n-button>
+            </n-flex>
+          </n-form-item>
+        </n-form>
+      </n-space>
+    </n-card>
     <n-data-table
       :bordered="false"
       :columns="columns"

src/oj/problem/list.vue

@@ -195,9 +195,9 @@ function rowProps(row: ProblemFiltered) {
 
 <template>
   <n-flex vertical size="large">
-    <n-flex justify="space-between">
-      <n-flex>
-        <div>
+    <n-card embedded>
+      <n-flex justify="space-between">
+        <n-space>
           <n-form :show-feedback="false" inline label-placement="left">
             <n-form-item label="难度">
               <n-select
@@ -210,8 +210,6 @@ function rowProps(row: ProblemFiltered) {
               <AuthorSelect v-model:value="query.author" />
             </n-form-item>
           </n-form>
-        </div>
-        <div>
           <n-form :show-feedback="false" inline label-placement="left">
             <n-form-item>
               <n-input
@@ -241,10 +239,10 @@ function rowProps(row: ProblemFiltered) {
               </n-button>
             </n-form-item>
           </n-form>
-        </div>
+        </n-space>
+        <Hitokoto v-if="isDesktop" />
       </n-flex>
-      <Hitokoto v-if="isDesktop" />
-    </n-flex>
+    </n-card>
     <n-collapse-transition :show="showTag">
       <n-flex>
         <n-tag

src/oj/submission/list.vue

@@ -240,82 +240,84 @@ const columns = computed(() => {
 </script>
 <template>
   <n-flex vertical size="large">
-    <n-space>
-      <n-form :show-feedback="false" inline label-placement="left">
-        <n-form-item v-if="isDesktop && userStore.isAuthed" label="只看自己">
-          <n-switch
-            v-model:value="query.myself"
-            checked-value="1"
-            unchecked-value="0"
-          />
-        </n-form-item>
-        <n-form-item label="状态">
-          <n-select
-            class="select"
-            v-model:value="query.result"
-            :options="resultOptions"
-          />
-        </n-form-item>
-        <n-form-item label="语言" v-if="route.name !== 'contest submissions'">
-          <n-select
-            class="select"
-            v-model:value="query.language"
-            :options="languageOptions"
-          />
-        </n-form-item>
-      </n-form>
-      <n-form :show-feedback="false" inline label-placement="left">
-        <n-form-item>
-          <n-input
-            class="input"
-            clearable
-            v-model:value="query.username"
-            placeholder="用户"
-          />
-        </n-form-item>
-        <n-form-item>
-          <n-input
-            class="input"
-            clearable
-            v-model:value="query.problem"
-            placeholder="题号"
-          />
-        </n-form-item>
-      </n-form>
-      <n-form :show-feedback="false" inline label-placement="left">
-        <n-form-item v-if="isMobile && userStore.isAuthed" label="只看自己">
-          <n-switch
-            v-model:value="query.myself"
-            checked-value="1"
-            unchecked-value="0"
-          />
-        </n-form-item>
-        <n-form-item>
-          <n-button @click="search(query.username, query.problem)">
-            搜索
-          </n-button>
-        </n-form-item>
-        <n-form-item>
-          <n-button @click="clear" quaternary>重置</n-button>
-        </n-form-item>
-        <n-form-item
-          v-if="userStore.isSuperAdmin && route.name === 'submissions'"
-        >
-          <IconButton
-            icon="streamline-emojis:bar-chart"
-            tip="数据统计"
-            @click="toggleStatisticPanel(true)"
-          />
-        </n-form-item>
-      </n-form>
-      <n-form :show-feedback="false" inline label-placement="left">
-        <n-form-item v-if="todayCount > 0">
-          <component :is="isDesktop ? NH2 : NText" class="todayCount">
-            <n-gradient-text>今日提交数：{{ todayCount }}</n-gradient-text>
-          </component>
-        </n-form-item>
-      </n-form>
-    </n-space>
+    <n-card embedded>
+      <n-space>
+        <n-form :show-feedback="false" inline label-placement="left">
+          <n-form-item v-if="isDesktop && userStore.isAuthed" label="只看自己">
+            <n-switch
+              v-model:value="query.myself"
+              checked-value="1"
+              unchecked-value="0"
+            />
+          </n-form-item>
+          <n-form-item label="状态">
+            <n-select
+              class="select"
+              v-model:value="query.result"
+              :options="resultOptions"
+            />
+          </n-form-item>
+          <n-form-item label="语言" v-if="route.name !== 'contest submissions'">
+            <n-select
+              class="select"
+              v-model:value="query.language"
+              :options="languageOptions"
+            />
+          </n-form-item>
+        </n-form>
+        <n-form :show-feedback="false" inline label-placement="left">
+          <n-form-item>
+            <n-input
+              class="input"
+              clearable
+              v-model:value="query.username"
+              placeholder="用户"
+            />
+          </n-form-item>
+          <n-form-item>
+            <n-input
+              class="input"
+              clearable
+              v-model:value="query.problem"
+              placeholder="题号"
+            />
+          </n-form-item>
+        </n-form>
+        <n-form :show-feedback="false" inline label-placement="left">
+          <n-form-item v-if="isMobile && userStore.isAuthed" label="只看自己">
+            <n-switch
+              v-model:value="query.myself"
+              checked-value="1"
+              unchecked-value="0"
+            />
+          </n-form-item>
+          <n-form-item>
+            <n-button @click="search(query.username, query.problem)">
+              搜索
+            </n-button>
+          </n-form-item>
+          <n-form-item>
+            <n-button @click="clear" quaternary>重置</n-button>
+          </n-form-item>
+          <n-form-item
+            v-if="userStore.isSuperAdmin && route.name === 'submissions'"
+          >
+            <IconButton
+              icon="streamline-emojis:bar-chart"
+              tip="数据统计"
+              @click="toggleStatisticPanel(true)"
+            />
+          </n-form-item>
+        </n-form>
+        <n-form :show-feedback="false" inline label-placement="left">
+          <n-form-item v-if="todayCount > 0">
+            <component :is="isDesktop ? NH2 : NText" class="todayCount">
+              <n-gradient-text>今日提交数：{{ todayCount }}</n-gradient-text>
+            </component>
+          </n-form-item>
+        </n-form>
+      </n-space>
+    </n-card>
     <n-data-table :bordered="false" :columns="columns" :data="submissions" />
   </n-flex>
   <Pagination

src/shared/components/Hitokoto.vue

@@ -32,7 +32,7 @@ onMounted(receive)
 }
 
 .hitokoto .sentence {
-  max-width: 500px;
+  max-width: 400px;
   text-overflow: ellipsis;
   overflow: hidden;
   word-break: break-all;