From 5cfeba57ba3e6e0f5f247cb2dfbafead9f072368 Mon Sep 17 00:00:00 2001
From: SunWuyuan <sun@wuyuan.dev>
Date: Sun, 2 Mar 2025 15:34:27 +0800
Subject: [PATCH] 1

---
 src/pages/index.vue    | 292 +++++++++------------
 src/pages/settings.vue | 584 ++++++++++++-----------------------------
 src/utils/settings.js  |   4 +-
 3 files changed, 283 insertions(+), 597 deletions(-)

diff --git a/src/pages/index.vue b/src/pages/index.vue
index 4ad2b8e..005d09f 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -24,7 +24,6 @@
       <v-menu
         v-model="datePickerDialog"
         :close-on-content-click="false"
-
       >
         <template v-slot:activator="{ props }">
           <v-btn
@@ -60,150 +59,94 @@
       fluid
     >
       <div v-if="showNoDataMessage && !isToday" class="no-data-message">
-        <v-card class="text-center pa-4" variant="outlined">
-          <v-card-title class="text-h6">{{ noDataMessage }}</v-card-title>
+        <v-card class="text-center pa-4" >
+          <v-card-title class="text-h6">别看未来的作业了</v-card-title>
           <v-card-text>
-            <div class="text-body-1">该日期未上传作业数据</div>
+            <div class="text-body-1">{{ noDataMessage }}</div>
           </v-card-text>
         </v-card>
       </div>
 
       <template v-else>
-        <div v-if="showNoDataMessage && isToday" class="no-data-message">
-          <v-card class="text-center pa-4" variant="outlined">
-            <v-card-title class="text-h6">开始今天的作业</v-card-title>
-            <v-card-text>
-              <div class="text-body-1 mb-4">今天还没有上传作业哦～</div>
-              <v-btn
-                color="primary"
-                @click="initializeAndOpenDialog"
-              >
-                开始添加作业
-              </v-btn>
-            </v-card-text>
-          </v-card>
+        <div class="grid-masonry" ref="gridContainer">
+          <div
+            v-for="item in sortedItems"
+            :key="item.key"
+            class="grid-item"
+            :class="{ 
+              'empty-card': !item.content,
+              [`grid-row-${item.rowSpan}`]: true
+            }"
+            :style="{ 
+              'grid-row-end': `span ${item.rowSpan}`,
+              order: item.order,
+              cursor: uploadLoading || downloadLoading || isPastDate ? 'not-allowed' : 'pointer',
+              opacity: uploadLoading || downloadLoading ? '0.7' : '1'
+            }"
+            @click="!uploadLoading && !downloadLoading && !isPastDate && openDialog(item.key)"
+          >
+            <v-card border height="100%">
+              <v-card-title :class="{ 'text-subtitle-1': !item.content }">
+                {{ item.name }}
+              </v-card-title>
+              <v-card-text :style="item.content ? contentStyle : null">
+                <template v-if="item.content">
+                  <v-list>
+                    <v-list-item
+                      v-for="text in splitPoint(item.content)"
+                      :key="text"
+                    >
+                      {{ text }}
+                    </v-list-item>
+                  </v-list>
+                </template>
+                <template v-else>
+                  <div class="text-center pa-2">
+                    <v-icon size="small" color="grey">mdi-plus</v-icon>
+                    <div class="text-caption text-grey">点击添加作业</div>
+                  </div>
+                </template>
+              </v-card-text>
+            </v-card>
+          </div>
         </div>
 
-        <template v-else>
-          <div class="grid-masonry" ref="gridContainer">
-            <div
-              v-for="item in sortedItems"
-              :key="item.key"
-              class="grid-item"
-              :class="{ 
-                'empty-card': !item.content,
-                [`grid-row-${item.rowSpan}`]: true
-              }"
-              :style="{ 
-                'grid-row-end': `span ${item.rowSpan}`,
-                order: item.order,
-                cursor: uploadLoading || downloadLoading ? 'not-allowed' : 'pointer',
-                opacity: uploadLoading || downloadLoading ? '0.7' : '1'
-              }"
-              @click="!uploadLoading && !downloadLoading && openDialog(item.key)"
-            >
-              <v-card border height="100%">
-                <v-card-title :class="{ 'text-subtitle-1': !item.content }">
-                  {{ item.name }}
-                </v-card-title>
-                <v-card-text :style="item.content ? contentStyle : null">
-                  <template v-if="item.content">
-                    <v-list>
-                      <v-list-item
-                        v-for="text in splitPoint(item.content)"
-                        :key="text"
-                      >
-                        {{ text }}
-                      </v-list-item>
-                    </v-list>
-                  </template>
-                  <template v-else>
-                    <div class="text-center pa-2">
-                      <v-icon size="small" color="grey">mdi-plus</v-icon>
-                      <div class="text-caption text-grey">点击添加作业</div>
-                    </div>
-                  </template>
-                </v-card-text>
-              </v-card>
-            </div>
-          </div>
-
-          <!-- 空科目按钮组 -->
-          <div v-if="emptySubjectDisplay === 'button'" class="empty-subjects-container">
-            <v-btn
-              v-for="subject in emptySubjects"
-              :key="subject.key"
-              variant="outlined"
-              color="primary"
-              class="empty-subject-btn"
-              @click="!uploadLoading && !downloadLoading && openDialog(subject.key)"
-              :disabled="uploadLoading || downloadLoading"
-            >
-              <v-icon start>mdi-plus</v-icon>
-              {{ subject.name }}
-            </v-btn>
-          </div>
-        </template>
+        <!-- 空科目按钮组 -->
+        <v-btn-group v-if="emptySubjectDisplay === 'button'" class="empty-subjects-container">
+          <v-btn
+            v-for="subject in emptySubjects"
+            :key="subject.key"
+            variant="tonal"
+            color="primary"
+            @click="!uploadLoading && !downloadLoading && openDialog(subject.key)"
+            :disabled="uploadLoading || downloadLoading"
+          >
+            <v-icon start>mdi-plus</v-icon>
+            {{ subject.name }}
+          </v-btn>
+        </v-btn-group>
       </template>
     </v-container>
 
     <!-- 出勤统计区域 -->
-    <v-navigation-drawer
-      v-if="studentList.length > 1"
-      location="right"
-      permanent
-      width="300"
-      class="attendance-drawer"
+    <v-col
+      v-if="studentList.length"
+      class="attendance-area"
+      cols="1"
+      @click="!isPastDate ? setAttendanceArea() : null"
     >
-      <v-card
-        class="h-100 attendance-card"
-        flat
-      >
-        <v-card-text class="text-center">
-          <div class="attendance-numbers">
-            <div class="total-number mb-4">
-              <div class="text-h2 font-weight-bold">{{ studentList.length }}</div>
-              <div class="text-overline">应到</div>
-            </div>
-            
-            <div class="d-flex justify-space-around">
-              <div class="status-number text-success">
-                <div class="text-h3 font-weight-bold">
-                  {{ studentList.length - selectedSet.size - lateSet.size }}
-                </div>
-                <div class="text-overline">实到</div>
-              </div>
-              
-              <div class="status-number text-error">
-                <div class="text-h3 font-weight-bold">
-                  {{ selectedSet.size }}
-                </div>
-                <div class="text-overline">请假</div>
-              </div>
-              
-              <div class="status-number text-warning">
-                <div class="text-h3 font-weight-bold">
-                  {{ lateSet.size }}
-                </div>
-                <div class="text-overline">迟到</div>
-              </div>
-            </div>
-          </div>
-        </v-card-text>
-
-        <v-card-actions class="pa-4">
-          <v-btn
-            block
-            color="primary"
-            size="large"
-            prepend-icon="mdi-pencil"
-            @click="setAttendanceArea"
-          >
-            编辑出勤
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-navigation-drawer>
+      <h1>出勤</h1>
+      <h2>应到: {{ studentList.length }}人</h2>
+      <h2>实到: {{ studentList.length - selectedSet.size }}人</h2>
+      <h2>请假: {{ selectedSet.size }}人</h2>
+      <h3 v-for="(i, index) in selectedSet" :key="'absent-' + index">
+        {{ `${index + 1}. ${studentList[i]}` }}
+      </h3>
+      <h2>迟到: {{ lateSet.size }}人</h2>
+      <h3 v-for="(i, index) in lateSet" :key="'late-' + index">
+        {{ `${index + 1}. ${studentList[i]}` }}
+      </h3>
+    </v-col>
   </div>
   <v-container fluid>
     <v-btn
@@ -232,7 +175,9 @@
   >
     <v-card border>
       <v-card-title>{{ dialogTitle }}</v-card-title>
-      <v-card-subtitle>写完后点击上传谢谢喵</v-card-subtitle>
+      <v-card-subtitle>
+        {{ autoSave ? "喵？喵呜！" : "写完后点击上传谢谢喵" }}
+      </v-card-subtitle>
       <v-card-text>
         <v-textarea
           ref="inputRef"
@@ -420,13 +365,6 @@
 .empty-subjects-container {
   display: flex;
   flex-wrap: wrap;
-  gap: 8px;
-  margin-top: 16px;
-}
-
-.empty-subject-btn {
-  flex: 1;
-  min-width: 120px;
 }
 
 @media (max-width: 1199px) {
@@ -440,10 +378,6 @@
     grid-template-columns: 1fr;
   }
   
-  .empty-subject-btn {
-    min-width: 100px;
-  }
-  
   .empty-card {
     transform: scale(0.95);
   }
@@ -635,12 +569,15 @@ export default {
           return true;
         });
 
-      // 根据排序模式选择不同的排序方法
-      if (this.dynamicSort) {
-        return this.optimizeGridLayout(items);
-      } else {
-        return this.fixedGridLayout(items);
-      }
+      // Sort items: prioritize non-empty content first
+      return items.sort((a, b) => {
+        // If one item has content and the other does not, prioritize the one with content
+        if (a.content && !b.content) return -1;
+        if (!a.content && b.content) return 1;
+
+        // If both have content or both are empty, sort by order
+        return a.order - b.order;
+      });
     },
     attendanceVisible() {
       return this.studentList.length > 0;
@@ -670,6 +607,14 @@ export default {
     dynamicSort() {
       return getSetting('display.dynamicSort');
     },
+    isPastDate() {
+      const selectedDate = new Date(this.dateString);
+      const today = new Date();
+      // 将时间部分归零以进行比较
+      selectedDate.setHours(0, 0, 0, 0);
+      today.setHours(0, 0, 0, 0);
+      return selectedDate < today; // 如果选择的日期在今天之前，则返回 true
+    },
   },
 
   async mounted() {
@@ -806,12 +751,29 @@ export default {
 
           this.synced = true;
         } else {
-          // Handle the error case
-          this.showNoDataMessage = true;
-          this.noDataMessage = res.data.msg || '未找到数据';
-          this.homeworkData = {};
-          this.selectedSet.clear();
-          this.lateSet.clear();
+          // Handle the error case for today's date
+          if (this.isToday && res.data.status == false) {
+            this.showNoDataMessage = false; // Ensure we show the empty data
+            this.homeworkData = {
+              "语文": { name: "语文", content: "" },
+              "数学": { name: "数学", content: "" },
+              "英语": { name: "英语", content: "" },
+              "物理": { name: "物理", content: "" },
+              "化学": { name: "化学", content: "" },
+              "生物": { name: "生物", content: "" },
+              "历史": { name: "历史", content: "" },
+              "地理": { name: "地理", content: "" },
+              "政治": { name: "政治", content: "" },
+            };
+            this.noDataMessage = ''; // Clear any previous message
+          } else {
+            // Handle other error cases
+            this.showNoDataMessage = true;
+            this.noDataMessage = res.data.msg || '未找到数据';
+            this.homeworkData = {};
+            this.selectedSet.clear();
+            this.lateSet.clear();
+          }
         }
       } catch (error) {
         console.error('下载数据失败:', error);
@@ -1076,24 +1038,6 @@ export default {
       }));
     },
 
-    initializeAndOpenDialog() {
-      // 初始化作业数据
-      this.initializeHomeworkData();
-      this.showNoDataMessage = false;
-      this.synced = false; // 设置为未同步状态
-      
-      // 如果启用了自动保存，初始化后自动上传
-      if (this.autoSave) {
-        this.uploadData();
-      }
-      
-      // 打开第一个科目的对话框
-      const firstSubject = Object.keys(this.homeworkData)[0];
-      if (firstSubject) {
-        this.openDialog(firstSubject);
-      }
-    },
-
     setAllPresent() {
       this.selectedSet.clear();
       this.lateSet.clear();
diff --git a/src/pages/settings.vue b/src/pages/settings.vue
index 818e064..423bfbd 100644
--- a/src/pages/settings.vue
+++ b/src/pages/settings.vue
@@ -1,19 +1,14 @@
 <template>
   <v-app-bar elevation="1">
     <template #prepend>
-      <v-btn
-        icon="mdi-arrow-left"
-        variant="text"
-        @click="$router.push('/')"
-        class="mr-2"
-      />
+      <v-btn icon="mdi-arrow-left" variant="text" @click="$router.push('/')" class="mr-2" />
     </template>
     <v-app-bar-title class="text-h6 font-weight-medium">设置</v-app-bar-title>
   </v-app-bar>
 
   <v-container class="py-4">
     <v-row>
-      <v-col cols="12" md="6">
+      <v-col cols="12" md="4">
         <v-card elevation="2" class="rounded-lg">
           <v-card-item>
             <template v-slot:prepend>
@@ -21,46 +16,26 @@
             </template>
             <v-card-title class="text-h6">服务器设置</v-card-title>
           </v-card-item>
-          
+
           <v-card-text>
-            <v-text-field
-              v-model="settings.server.domain"
-              label="服务器域名"
-              placeholder="例如: http://example.com"
-              prepend-inner-icon="mdi-web"
-              variant="outlined"
-              density="comfortable"
-              class="mb-4"
-              required
-            />
-            <v-text-field
-              v-model="settings.server.classNumber"
-              label="班号"
-              placeholder="例如: 1 或 A"
-              prepend-inner-icon="mdi-account-group"
-              variant="outlined"
-              density="comfortable"
-              required
-              :rules="[v => !!v || '班号不能为空', v => /^[A-Za-z0-9]+$/.test(v) || '班号只能包含字母和数字']"
-            />
+            <v-text-field v-model="settings.server.domain" label="服务器域名" placeholder="例如: http://example.com"
+              prepend-inner-icon="mdi-web" variant="outlined" density="comfortable" class="mb-4" required />
+            <v-text-field v-model="settings.server.classNumber" label="班号" placeholder="例如: 1 或 A"
+              prepend-inner-icon="mdi-account-group" variant="outlined" density="comfortable" required
+              :rules="[v => !!v || '班号不能为空', v => /^[A-Za-z0-9]+$/.test(v) || '班号只能包含字母和数字']" />
           </v-card-text>
 
           <v-card-actions class="px-4 pb-4">
-            <v-btn
-              color="primary"
-              prepend-icon="mdi-content-save"
-              block
-              @click="saveSettings('server')"
-            >
+            <v-btn color="primary" prepend-icon="mdi-content-save" block @click="saveSettings('server')">
               保存设置
             </v-btn>
           </v-card-actions>
         </v-card>
       </v-col>
 
-      
 
-      <v-col cols="12" md="6">
+
+      <v-col cols="12" md="4">
         <v-card elevation="2" class="rounded-lg">
           <v-card-item>
             <template v-slot:prepend>
@@ -68,44 +43,25 @@
             </template>
             <v-card-title class="text-h6">自动刷新设置（不建议启用）</v-card-title>
           </v-card-item>
-          
+
           <v-card-text>
-            <v-switch
-              v-model="settings.refresh.auto"
-              label="启用自动刷新"
-              color="primary"
-              hide-details
-              class="mb-4"
-            />
-            <v-text-field
-              v-model="settings.refresh.interval"
-              type="number"
-              label="刷新间隔"
-              suffix="秒"
-              :disabled="!settings.refresh.auto"
-              variant="outlined"
-              density="comfortable"
-              :rules="[
+            <v-switch v-model="settings.refresh.auto" label="启用自动刷新" color="primary" hide-details class="mb-4" />
+            <v-text-field v-model="settings.refresh.interval" type="number" label="刷新间隔" suffix="秒"
+              :disabled="!settings.refresh.auto" variant="outlined" density="comfortable" :rules="[
                 v => v >= 10 || '刷新间隔不能小于10秒',
                 v => v <= 3600 || '刷新间隔不能大于3600秒'
-              ]"
-            />
+              ]" />
           </v-card-text>
 
           <v-card-actions class="px-4 pb-4">
-            <v-btn
-              color="primary"
-              prepend-icon="mdi-content-save"
-              block
-              @click="saveSettings('refresh')"
-            >
+            <v-btn color="primary" prepend-icon="mdi-content-save" block @click="saveSettings('refresh')">
               保存设置
             </v-btn>
           </v-card-actions>
         </v-card>
       </v-col>
 
-      <v-col cols="12" md="6">
+      <v-col cols="12" md="4">
         <v-card elevation="2" class="rounded-lg">
           <v-card-item>
             <template v-slot:prepend>
@@ -113,46 +69,28 @@
             </template>
             <v-card-title class="text-h6">字体设置</v-card-title>
           </v-card-item>
-          
+
           <v-card-text>
-            <v-text-field
-              v-model="settings.font.size"
-              type="number"
-              label="字体大小"
-              suffix="px"
-              variant="outlined"
-              density="comfortable"
-              class="mb-4"
-              :rules="[
+            <v-text-field v-model="settings.font.size" type="number" label="字体大小" suffix="px" variant="outlined"
+              density="comfortable" class="mb-4" :rules="[
                 v => v >= 16 || '字体大小不能小于16px',
                 v => v <= 100 || '字体大小不能大于100px'
-              ]"
-            />
+              ]" />
           </v-card-text>
 
           <v-card-actions class="px-4 pb-4">
-            <v-btn
-              color="error"
-              variant="outlined"
-              prepend-icon="mdi-refresh"
-              class="flex-grow-1"
-              @click="resetFontSize"
-            >
+            <v-btn color="error" variant="outlined" prepend-icon="mdi-refresh" class="flex-grow-1"
+              @click="resetFontSize">
               重置
             </v-btn>
-            <v-btn
-              color="primary"
-              prepend-icon="mdi-content-save"
-              class="flex-grow-1"
-              @click="saveSettings('font')"
-            >
+            <v-btn color="primary" prepend-icon="mdi-content-save" class="flex-grow-1" @click="saveSettings('font')">
               保存设置
             </v-btn>
           </v-card-actions>
         </v-card>
       </v-col>
 
-      <v-col cols="12" md="6">
+      <v-col cols="12" md="4">
         <v-card elevation="2" class="rounded-lg">
           <v-card-item>
             <template v-slot:prepend>
@@ -160,45 +98,24 @@
             </template>
             <v-card-title class="text-h6">编辑设置</v-card-title>
           </v-card-item>
-          
+
           <v-card-text>
-            <v-switch
-              v-model="settings.edit.autoSave"
-              label="启用自动保存"
-              color="primary"
-              hide-details
-              class="mb-4"
-            >
+            <v-switch v-model="settings.edit.autoSave" label="启用自动保存" color="primary" hide-details class="mb-4">
               <template v-slot:append>
                 <v-tooltip location="right">
                   <template v-slot:activator="{ props }">
-                    <v-icon
-                      v-bind="props"
-                      icon="mdi-help-circle-outline"
-                      size="small"
-                      class="ml-2"
-                    />
+                    <v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
                   </template>
                   编辑完成后自动上传到服务器
                 </v-tooltip>
               </template>
             </v-switch>
 
-            <v-switch
-              v-model="settings.edit.refreshBeforeEdit"
-              label="编辑前自动刷新"
-              color="primary"
-              hide-details
-            >
+            <v-switch v-model="settings.edit.refreshBeforeEdit" label="编辑前自动刷新" color="primary" hide-details>
               <template v-slot:append>
                 <v-tooltip location="right">
                   <template v-slot:activator="{ props }">
-                    <v-icon
-                      v-bind="props"
-                      icon="mdi-help-circle-outline"
-                      size="small"
-                      class="ml-2"
-                    />
+                    <v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
                   </template>
                   打开编辑框前自动从服务器获取最新数据
                 </v-tooltip>
@@ -207,117 +124,76 @@
           </v-card-text>
 
           <v-card-actions class="px-4 pb-4">
-            <v-btn
-              color="primary"
-              prepend-icon="mdi-content-save"
-              block
-              @click="saveSettings('edit')"
-            >
+            <v-btn color="primary" prepend-icon="mdi-content-save" block @click="saveSettings('edit')">
               保存设置
             </v-btn>
           </v-card-actions>
         </v-card>
-      </v-col>  <v-col cols="12" md="6">
-      <v-card elevation="2" class="rounded-lg">
-        <v-card-item>
-          <template v-slot:prepend>
-            <v-icon icon="mdi-card-outline" size="large" class="mr-2" />
-          </template>
-          <v-card-title class="text-h6">显示设置</v-card-title>
-        </v-card-item>
-        
-        <v-card-text>
-          <v-switch
-            v-model="settings.display.dynamicSort"
-            label="启用动态排序"
-            hint="动态排序会根据内容长度自动调整卡片位置以优化显示效果"
-            persistent-hint
-            class="mb-4"
-            @change="saveSettings('display')"
-          >
-            <template v-slot:append>
-              <v-tooltip location="right">
-                <template v-slot:activator="{ props }">
-                  <v-icon
-                    v-bind="props"
-                    icon="mdi-help-circle-outline"
-                    size="small"
-                    class="ml-2"
-                  />
-                </template>
-                <div>
-                  <p>启用：根据内容长度动态调整位置</p>
-                  <p>关闭：按语数英/物化生/政史地固定排列</p>
-                </div>
-              </v-tooltip>
+      </v-col> <v-col cols="12" md="4">
+        <v-card elevation="2" class="rounded-lg">
+          <v-card-item>
+            <template v-slot:prepend>
+              <v-icon icon="mdi-card-outline" size="large" class="mr-2" />
             </template>
-          </v-switch>
+            <v-card-title class="text-h6">显示设置</v-card-title>
+          </v-card-item>
 
-          <v-divider class="my-4" />
-
-          <v-radio-group
-            v-model="settings.display.emptySubjectDisplay"
-            label="空作业显示方式"
-            class="mt-4"
-            @change="saveSettings('display')"
-          >
-            <v-radio
-              value="card"
-              label="显示为空卡片"
-            >
-              <template v-slot:label>
-                <div class="d-flex align-center">
-                  显示为空卡片
-                  <v-tooltip location="right">
-                    <template v-slot:activator="{ props }">
-                      <v-icon
-                        v-bind="props"
-                        icon="mdi-help-circle-outline"
-                        size="small"
-                        class="ml-2"
-                      />
-                    </template>
-                    在主界面中显示为可点击的空白卡片
-                  </v-tooltip>
-                </div>
+          <v-card-text>
+            <v-switch v-model="settings.display.dynamicSort" label="启用动态排序" hint="动态排序会根据内容长度自动调整卡片位置以优化显示效果"
+              persistent-hint class="mb-4" @change="saveSettings('display')">
+              <template v-slot:append>
+                <v-tooltip location="right">
+                  <template v-slot:activator="{ props }">
+                    <v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
+                  </template>
+                  <div>
+                    <p>启用：根据内容长度动态调整位置</p>
+                    <p>关闭：按语数英/物化生/政史地固定排列</p>
+                  </div>
+                </v-tooltip>
               </template>
-            </v-radio>
-            <v-radio
-              value="button"
-              label="显示为按钮组"
-            >
-              <template v-slot:label>
-                <div class="d-flex align-center">
-                  显示为按钮组
-                  <v-tooltip location="right">
-                    <template v-slot:activator="{ props }">
-                      <v-icon
-                        v-bind="props"
-                        icon="mdi-help-circle-outline"
-                        size="small"
-                        class="ml-2"
-                      />
-                    </template>
-                    在主界面底部显示为一组添加按钮
-                  </v-tooltip>
-                </div>
-              </template>
-            </v-radio>
-          </v-radio-group>
-        </v-card-text>
+            </v-switch>
 
-        <v-card-actions class="px-4 pb-4">
-          <v-btn
-            color="primary"
-            prepend-icon="mdi-content-save"
-            block
-            @click="saveSettings('display')"
-          >
-            保存设置
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-col>
+            <v-divider class="my-4" />
+
+            <v-radio-group v-model="settings.display.emptySubjectDisplay" label="空作业显示方式" class="mt-4"
+              @change="saveSettings('display')">
+              <v-radio value="card" label="显示为空卡片">
+                <template v-slot:label>
+                  <div class="d-flex align-center">
+                    显示为空卡片
+                    <v-tooltip location="right">
+                      <template v-slot:activator="{ props }">
+                        <v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
+                      </template>
+                      在主界面中显示为可点击的空白卡片
+                    </v-tooltip>
+                  </div>
+                </template>
+              </v-radio>
+              <v-radio value="button" label="显示为按钮组">
+                <template v-slot:label>
+                  <div class="d-flex align-center">
+                    显示为按钮组
+                    <v-tooltip location="right">
+                      <template v-slot:activator="{ props }">
+                        <v-icon v-bind="props" icon="mdi-help-circle-outline" size="small" class="ml-2" />
+                      </template>
+                      在主界面底部显示为一组添加按钮
+                    </v-tooltip>
+                  </div>
+                </template>
+              </v-radio>
+            </v-radio-group>
+          </v-card-text>
+
+          <v-card-actions class="px-4 pb-4">
+            <v-btn color="primary" prepend-icon="mdi-content-save" block @click="saveSettings('display')">
+              保存设置
+            </v-btn>
+          </v-card-actions>
+        </v-card>
+      </v-col>
       <v-col cols="12">
         <v-card elevation="2" class="rounded-lg">
           <v-card-item>
@@ -326,32 +202,17 @@
             </template>
             <v-card-title class="text-h6">学生列表设置</v-card-title>
             <template v-slot:append>
-              <v-btn
-                :color="showAdvancedEdit ? 'primary' : undefined"
-                variant="text"
-                prepend-icon="mdi-code-braces"
-                @click="showAdvancedEdit = !showAdvancedEdit"
-              >
+              <v-btn :color="showAdvancedEdit ? 'primary' : undefined" variant="text" prepend-icon="mdi-code-braces"
+                @click="showAdvancedEdit = !showAdvancedEdit">
                 {{ showAdvancedEdit ? '返回基础编辑' : '高级编辑' }}
               </v-btn>
             </template>
           </v-card-item>
 
           <v-card-text>
-            <v-progress-linear
-              v-if="studentsLoading"
-              indeterminate
-              color="primary"
-              class="mb-4"
-            />
+            <v-progress-linear v-if="studentsLoading" indeterminate color="primary" class="mb-4" />
 
-            <v-alert
-              v-if="studentsError"
-              type="error"
-              variant="tonal"
-              closable
-              class="mb-4"
-            >
+            <v-alert v-if="studentsError" type="error" variant="tonal" closable class="mb-4">
               {{ studentsError }}
             </v-alert>
 
@@ -359,137 +220,68 @@
               <div v-if="!showAdvancedEdit">
                 <v-row class="mb-6">
                   <v-col cols="12" sm="6" md="4">
-                    <v-text-field
-                      v-model="newStudent"
-                      label="添加学生"
-                      placeholder="输入学生姓名后回车添加"
-                      prepend-inner-icon="mdi-account-plus"
-                      variant="outlined"
-                      hide-details
-                      @keyup.enter="addStudent"
-                    >
+                    <v-text-field v-model="newStudent" label="添加学生" placeholder="输入学生姓名后回车添加"
+                      prepend-inner-icon="mdi-account-plus" variant="outlined" hide-details @keyup.enter="addStudent">
                       <template #append>
-                        <v-btn
-                          icon="mdi-plus"
-                          variant="text"
-                          color="primary"
-                          :disabled="!newStudent.trim()"
-                          @click="addStudent"
-                        />
+                        <v-btn icon="mdi-plus" variant="text" color="primary" :disabled="!newStudent.trim()"
+                          @click="addStudent" />
                       </template>
                     </v-text-field>
                   </v-col>
                 </v-row>
 
                 <v-row>
-                  <v-col
-                    v-for="(student, index) in studentsList"
-                    :key="index"
-                    cols="12"
-                    sm="6"
-                    md="4"
-                    lg="3"
-                  >
+                  <v-col v-for="(student, index) in studentsList" :key="index" cols="12" sm="6" md="4" lg="3">
                     <v-hover v-slot="{ isHovering, props }">
-                      <v-card
-                        v-bind="props"
-                        :elevation="isMobile ? 1 : (isHovering ? 4 : 1)"
-                        :class="[
-                          'student-card',
-                          {
-                            'bg-primary-subtle': isHovering && !isMobile,
-                            'mobile': isMobile
-                          }
-                        ]"
-                        border
-                      >
+                      <v-card v-bind="props" :elevation="isMobile ? 1 : (isHovering ? 4 : 1)" :class="[
+                        'student-card',
+                        {
+                          'bg-primary-subtle': isHovering && !isMobile,
+                          'mobile': isMobile
+                        }
+                      ]" border>
                         <v-card-text class="d-flex align-center pa-3">
-                          <v-menu
-                            location="bottom"
-                            :open-on-hover="!isMobile"
-                            :open-on-long-press="isMobile"
-                          >
+                          <v-menu location="bottom" :open-on-hover="!isMobile" :open-on-long-press="isMobile">
                             <template v-slot:activator="{ props: menuProps }">
-                              <v-btn
-                                variant="tonal"
-                                size="small"
-                                class="mr-3 font-weight-medium"
-                                v-bind="menuProps"
-                              >
+                              <v-btn variant="tonal" size="small" class="mr-3 font-weight-medium" v-bind="menuProps">
                                 {{ index + 1 }}
                               </v-btn>
                             </template>
                             <v-list density="compact" nav>
-                              <v-list-item
-                                prepend-icon="mdi-arrow-up-bold"
-                                :disabled="index === 0"
-                                @click="moveToTop(index)"
-                              >
+                              <v-list-item prepend-icon="mdi-arrow-up-bold" :disabled="index === 0"
+                                @click="moveToTop(index)">
                                 置顶
                               </v-list-item>
                               <v-divider />
-                              <v-list-item
-                                prepend-icon="mdi-arrow-up"
-                                :disabled="index === 0"
-                                @click="moveStudent(index, 'up')"
-                              >
+                              <v-list-item prepend-icon="mdi-arrow-up" :disabled="index === 0"
+                                @click="moveStudent(index, 'up')">
                                 上移
                               </v-list-item>
-                              <v-list-item
-                                prepend-icon="mdi-arrow-down"
-                                :disabled="index === studentsList.length - 1"
-                                @click="moveStudent(index, 'down')"
-                              >
+                              <v-list-item prepend-icon="mdi-arrow-down" :disabled="index === studentsList.length - 1"
+                                @click="moveStudent(index, 'down')">
                                 下移
                               </v-list-item>
                               <v-divider />
-                              <v-list-item
-                                prepend-icon="mdi-format-list-numbered"
-                                @click="setStudentNumber(index)"
-                              >
+                              <v-list-item prepend-icon="mdi-format-list-numbered" @click="setStudentNumber(index)">
                                 设置序号
                               </v-list-item>
                             </v-list>
                           </v-menu>
 
-                          <v-text-field
-                            v-if="editingIndex === index"
-                            v-model="editingName"
-                            density="compact"
-                            variant="underlined"
-                            hide-details
-                            class="flex-grow-1"
-                            @keyup.enter="saveEdit"
-                            @blur="saveEdit"
-                            autofocus
-                          />
-                          <span
-                            v-else
-                            class="text-body-1 flex-grow-1"
+                          <v-text-field v-if="editingIndex === index" v-model="editingName" density="compact"
+                            variant="underlined" hide-details class="flex-grow-1" @keyup.enter="saveEdit"
+                            @blur="saveEdit" autofocus />
+                          <span v-else class="text-body-1 flex-grow-1"
                             @click="isMobile ? startEdit(index, student) : null"
-                            @dblclick="!isMobile ? startEdit(index, student) : null"
-                          >
+                            @dblclick="!isMobile ? startEdit(index, student) : null">
                             {{ student }}
                           </span>
 
-                          <div 
-                            class="d-flex gap-1 action-buttons"
-                            :class="{'opacity-100': isHovering || isMobile}"
-                          >
-                            <v-btn
-                              icon="mdi-pencil"
-                              variant="text"
-                              color="primary"
-                              size="small"
-                              @click="startEdit(index, student)"
-                            />
-                            <v-btn
-                              icon="mdi-delete"
-                              variant="text"
-                              color="error"
-                              size="small"
-                              @click="confirmDelete(index)"
-                            />
+                          <div class="d-flex gap-1 action-buttons" :class="{ 'opacity-100': isHovering || isMobile }">
+                            <v-btn icon="mdi-pencil" variant="text" color="primary" size="small"
+                              @click="startEdit(index, student)" />
+                            <v-btn icon="mdi-delete" variant="text" color="error" size="small"
+                              @click="confirmDelete(index)" />
                           </div>
                         </v-card-text>
                       </v-card>
@@ -501,39 +293,19 @@
 
             <v-expand-transition>
               <div v-if="showAdvancedEdit" class="pt-2">
-                <v-textarea
-                  v-model="students"
-                  label="批量编辑学生列表"
-                  placeholder="每行输入一个学生姓名"
-                  hint="使用文本编辑模式批量编辑学生名单"
-                  persistent-hint
-                  variant="outlined"
-                  rows="10"
-                />
+                <v-textarea v-model="students" label="批量编辑学生列表" placeholder="每行输入一个学生姓名" hint="使用文本编辑模式批量编辑学生名单"
+                  persistent-hint variant="outlined" rows="10" />
               </div>
             </v-expand-transition>
 
             <v-row class="mt-6">
               <v-col cols="12" class="d-flex gap-2">
-                <v-btn
-                  color="primary"
-                  prepend-icon="mdi-content-save"
-                  size="large"
-                  :loading="studentsLoading"
-                  :disabled="studentsLoading"
-                  @click="saveStudents"
-                >
+                <v-btn color="primary" prepend-icon="mdi-content-save" size="large" :loading="studentsLoading"
+                  :disabled="studentsLoading" @click="saveStudents">
                   保存学生列表
                 </v-btn>
-                <v-btn
-                  color="error"
-                  variant="outlined"
-                  prepend-icon="mdi-refresh"
-                  size="large"
-                  :loading="studentsLoading"
-                  :disabled="studentsLoading"
-                  @click="reloadStudentList"
-                >
+                <v-btn color="error" variant="outlined" prepend-icon="mdi-refresh" size="large"
+                  :loading="studentsLoading" :disabled="studentsLoading" @click="reloadStudentList">
                   重置列表
                 </v-btn>
               </v-col>
@@ -554,45 +326,25 @@
             <v-row justify="center" align="center">
               <v-col cols="12" md="8" class="text-center">
                 <v-avatar size="120" class="mb-4">
-                  <v-img
-                    src="https://avatars.githubusercontent.com/u/88357633?v=4"
-                    alt="作者头像"
-                  />
+                  <v-img src="https://avatars.githubusercontent.com/u/88357633?v=4" alt="作者头像" />
                 </v-avatar>
                 <h2 class="text-h5 mb-2">HomeworkPage</h2>
                 <p class="text-body-1 mb-4">
-                  由 <a
-                    href="https://github.com/sunwuyuan"
-                    target="_blank"
-                    class="text-decoration-none font-weight-medium"
-                  >Sunwuyuan</a> 开发
+                  由 <a href="https://github.com/sunwuyuan" target="_blank"
+                    class="text-decoration-none font-weight-medium">Sunwuyuan</a> 开发
                 </p>
                 <div class="d-flex justify-center gap-2 flex-wrap">
-                  <v-btn
-                    color="primary"
-                    variant="outlined"
-                    href="https://github.com/SunWuyuan/homeworkpage-frontend"
-                    target="_blank"
-                    prepend-icon="mdi-github"
-                  >
+                  <v-btn color="primary" variant="outlined" href="https://github.com/SunWuyuan/homeworkpage-frontend"
+                    target="_blank" prepend-icon="mdi-github">
                     前端 GitHub
                   </v-btn>
-                  <v-btn
-                    color="primary"
-                    variant="outlined"
-                    href="https://github.com/SunWuyuan/homeworkpage-backend"
-                    target="_blank"
-                    prepend-icon="mdi-github"
-                  >
+                  <v-btn color="primary" variant="outlined" href="https://github.com/SunWuyuan/homeworkpage-backend"
+                    target="_blank" prepend-icon="mdi-github">
                     后端 GitHub
                   </v-btn>
-                  <v-btn
-                    color="primary"
-                    variant="outlined"
-                    href="https://github.com/SunWuyuan/homeworkpage-backend/issues"
-                    target="_blank"
-                    prepend-icon="mdi-bug"
-                  >
+                  <v-btn color="primary" variant="outlined"
+                    href="https://github.com/SunWuyuan/homeworkpage-backend/issues" target="_blank"
+                    prepend-icon="mdi-bug">
                     报告问题
                   </v-btn>
                 </div>
@@ -622,11 +374,7 @@
         <v-btn color="primary" variant="text" @click="deleteDialog = false">
           取消
         </v-btn>
-        <v-btn
-          color="error"
-          variant="text"
-          @click="removeStudent(studentToDelete?.index)"
-        >
+        <v-btn color="error" variant="text" @click="removeStudent(studentToDelete?.index)">
           删除
         </v-btn>
       </v-card-actions>
@@ -637,17 +385,11 @@
     <v-card>
       <v-card-title>设置序号</v-card-title>
       <v-card-text>
-        <v-text-field
-          v-model="newPosition"
-          type="number"
-          label="新序号"
-          :rules="[
-            v => !!v || '序号不能为空',
-            v => v > 0 || '序号必须大于0',
-            v => v <= studentsList.length || `序号不能大于${studentsList.length}`
-          ]"
-          @keyup.enter="applyNewPosition"
-        />
+        <v-text-field v-model="newPosition" type="number" label="新序号" :rules="[
+          v => !!v || '序号不能为空',
+          v => v > 0 || '序号必须大于0',
+          v => v <= studentsList.length || `序号不能大于${studentsList.length}`
+        ]" @keyup.enter="applyNewPosition" />
       </v-card-text>
       <v-card-actions>
         <v-spacer />
@@ -665,7 +407,7 @@
 <script>
 import axios from 'axios';
 import { useDisplay } from 'vuetify';
-import { 
+import {
   getSetting,
   setSetting,
   resetSetting,
@@ -720,7 +462,7 @@ export default {
       studentsError: null,
     };
   },
-  
+
   mounted() {
     this.loadAllSettings();
     this.unwatchSettings = watchSettings(() => {
@@ -810,7 +552,7 @@ export default {
 
         const domain = getSetting('server.domain');
         const classNum = getSetting('server.classNumber');
-        
+
         if (!domain || !classNum) {
           throw new Error('请先设置服务器域名和班号');
         }
@@ -835,7 +577,7 @@ export default {
       try {
         const domain = getSetting('server.domain');
         const classNum = getSetting('server.classNumber');
-        
+
         if (!domain || !classNum) {
           throw new Error('请先设置服务器域名和班号');
         }
@@ -871,7 +613,7 @@ export default {
       if (this.editingIndex !== -1 && this.editingIndex !== index) {
         this.saveEdit();
       }
-      
+
       this.editingIndex = index;
       this.editingName = name;
     },
@@ -901,9 +643,9 @@ export default {
     moveStudent(index, direction) {
       const newIndex = direction === 'up' ? index - 1 : index + 1;
       if (newIndex >= 0 && newIndex < this.studentsList.length) {
-        [this.studentsList[index], this.studentsList[newIndex]] = 
-        [this.studentsList[newIndex], this.studentsList[index]];
-        
+        [this.studentsList[index], this.studentsList[newIndex]] =
+          [this.studentsList[newIndex], this.studentsList[index]];
+
         if (this.settings.edit.autoSave) {
           this.saveStudents();
         }
@@ -939,7 +681,7 @@ export default {
         const student = this.studentsList[index];
         this.studentsList.splice(index, 1);
         this.studentsList.unshift(student);
-        
+
         if (this.settings.edit.autoSave) {
           this.saveStudents();
         }
@@ -1006,7 +748,7 @@ export default {
   .v-container {
     padding: 12px;
   }
-  
+
   .v-col {
     padding: 8px;
   }
@@ -1029,11 +771,11 @@ export default {
   .v-col {
     padding: 6px !important;
   }
-  
+
   .student-card {
     margin-bottom: 4px;
   }
-  
+
   .action-buttons {
     opacity: 1;
   }
@@ -1046,4 +788,4 @@ export default {
 .student-card:active {
   background-color: rgb(var(--v-theme-primary), 0.05);
 }
-</style> 
\ No newline at end of file
+</style>
\ No newline at end of file
diff --git a/src/utils/settings.js b/src/utils/settings.js
index fc2ece0..aacc3b4 100644
--- a/src/utils/settings.js
+++ b/src/utils/settings.js
@@ -72,12 +72,12 @@ const settingsDefinitions = {
   // 编辑设置
   'edit.autoSave': {
     type: 'boolean',
-    default: false,
+    default: true,
     description: '是否启用自动保存'
   },
   'edit.refreshBeforeEdit': {
     type: 'boolean',
-    default: false,
+    default: true,
     description: '编辑前是否自动刷新'
   }
 };