feat: 添加自动切换显示功能，优化试卷和答题卡数量控制样式

exam/Scripts/examInfo.js

@@ -14,6 +14,7 @@ document.addEventListener("DOMContentLoaded", () => {
     const answerSheetsElem = document.getElementById("answer-sheets");
     let offsetTime = getCookie("offsetTime") || 0;
     let showPaperInfo = getCookie("showPaperInfo") === "true";
+    let autoToggle = getCookie("autoToggle") === "true";
 
     // 初始化显示状态
     if (showPaperInfo) {
@@ -21,11 +22,22 @@ document.addEventListener("DOMContentLoaded", () => {
         paperInfoElem.style.display = "block";
     }
 
+    // 更新显示内容
+    function updateDisplay(isExamTime) {
+        if (autoToggle) {
+            // 在考试期间显示页数，其他时间显示表格
+            paperInfoElem.style.display = isExamTime ? "block" : "none";
+            currentSubjectElem.style.display = "block";
+        }
+    }
+
     infoToggleBtn.addEventListener("click", () => {
-        showPaperInfo = !showPaperInfo;
+        if (!autoToggle) {
-        setCookie("showPaperInfo", showPaperInfo, 365);
+            showPaperInfo = !showPaperInfo;
-        currentSubjectElem.style.display = showPaperInfo ? "none" : "block";
+            paperInfoElem.style.display = showPaperInfo ? "block" : "none";
-        paperInfoElem.style.display = showPaperInfo ? "block" : "none";
+            currentSubjectElem.style.display = "block";
+            setCookie("showPaperInfo", showPaperInfo, 365);
+        }
     });
 
     function fetchData() {
@@ -106,6 +118,14 @@ document.addEventListener("DOMContentLoaded", () => {
             if (currentSubjectElem) currentSubjectElem.style.display = showPaperInfo ? "none" : "block";
 
             if (currentExam) {
+                const currentStatus = `当前科目: ${currentExam.name}`;
+                if (!showPaperInfo) {
+                    currentSubjectElem.textContent = currentStatus;
+                }
+                currentSubjectElem.style.display = "block"; // 总是显示科目信息
+                paperInfoElem.style.display = showPaperInfo ? "block" : "none";
+
+                // 加载本地存储的页数信息
                 if (showPaperInfo) {
                     // 加载本地保存的页数信息
                     const paperCount = document.getElementById('paper-count');
@@ -127,8 +147,6 @@ document.addEventListener("DOMContentLoaded", () => {
                             console.error('加载页数信息失败:', e);
                         }
                     }
-                } else if (currentSubjectElem) {
-                    currentSubjectElem.textContent = `当前科目: ${currentExam.name}`;
                 }
 
                 if (examTimingElem) {
@@ -174,44 +192,48 @@ document.addEventListener("DOMContentLoaded", () => {
                         statusElem.style.color = "#5ba838";
                     }
                 }
-            } else if (lastExam && now < new Date(lastExam.end).getTime() + 60000) {
-                if (currentSubjectElem) currentSubjectElem.textContent = `上场科目: ${lastExam.name}`;
-                if (examTimingElem) examTimingElem.textContent = "";
-                if (remainingTimeElem) remainingTimeElem.textContent = "";
-                if (statusElem) {
-                    statusElem.textContent = "状态: 已结束";
-                    statusElem.style.color = "red";
-                }
-            } else if (nextExam) {
-                const timeUntilStart = ((new Date(nextExam.start).getTime() - now.getTime()) / 1000) + 1;
-                const remainingHours = Math.floor(timeUntilStart / 3600);
-                const remainingMinutes = Math.floor((timeUntilStart % 3600) / 60);
-                const remainingSeconds = Math.floor(timeUntilStart % 60);
-                const remainingTimeText = `${remainingHours}时 ${remainingMinutes}分 ${remainingSeconds}秒`;
-
-                if (timeUntilStart <= 15 * 60) {
-                    currentSubjectElem.textContent = `即将开始: ${nextExam.name}`;
-                    remainingTimeElem.textContent = `倒计时: ${remainingTimeText}`;
-                    remainingTimeElem.style.color = "orange";
-                    remainingTimeElem.style.fontWeight = "bold";
-                    statusElem.textContent = "状态: 即将开始";
-                    statusElem.style.color = "#DBA014";
-                } else {
-                    currentSubjectElem.textContent = `下一场科目: ${nextExam.name}`;
-                    remainingTimeElem.textContent = "";
-                    statusElem.textContent = "状态: 未开始";
-                    remainingTimeElem.style.fontWeight = "normal";
-                    statusElem.style.color = "#EAEE5B";
-                }
-
-                examTimingElem.textContent = `起止时间: ${formatTimeWithoutSeconds(new Date(nextExam.start).toLocaleTimeString('zh-CN', { hour12: false }))} - ${formatTimeWithoutSeconds(new Date(nextExam.end).toLocaleTimeString('zh-CN', { hour12: false }))}`;
             } else {
-                if (currentSubjectElem) currentSubjectElem.textContent = "考试均已结束";
+                // 非考试时间，显示表格
-                if (examTimingElem) examTimingElem.textContent = "";
+                updateDisplay(false);
-                if (remainingTimeElem) remainingTimeElem.textContent = "";
+                if (lastExam && now < new Date(lastExam.end).getTime() + 60000) {
-                if (statusElem) {
+                    if (currentSubjectElem) currentSubjectElem.textContent = `上场科目: ${lastExam.name}`;
-                    statusElem.textContent = "状态: 空闲";
+                    if (examTimingElem) examTimingElem.textContent = "";
-                    statusElem.style.color = "#3946AF";
+                    if (remainingTimeElem) remainingTimeElem.textContent = "";
+                    if (statusElem) {
+                        statusElem.textContent = "状态: 已结束";
+                        statusElem.style.color = "red";
+                    }
+                } else if (nextExam) {
+                    const timeUntilStart = ((new Date(nextExam.start).getTime() - now.getTime()) / 1000) + 1;
+                    const remainingHours = Math.floor(timeUntilStart / 3600);
+                    const remainingMinutes = Math.floor((timeUntilStart % 3600) / 60);
+                    const remainingSeconds = Math.floor(timeUntilStart % 60);
+                    const remainingTimeText = `${remainingHours}时 ${remainingMinutes}分 ${remainingSeconds}秒`;
+
+                    if (timeUntilStart <= 15 * 60) {
+                        currentSubjectElem.textContent = `即将开始: ${nextExam.name}`;
+                        remainingTimeElem.textContent = `倒计时: ${remainingTimeText}`;
+                        remainingTimeElem.style.color = "orange";
+                        remainingTimeElem.style.fontWeight = "bold";
+                        statusElem.textContent = "状态: 即将开始";
+                        statusElem.style.color = "#DBA014";
+                    } else {
+                        currentSubjectElem.textContent = `下一场科目: ${nextExam.name}`;
+                        remainingTimeElem.textContent = "";
+                        statusElem.textContent = "状态: 未开始";
+                        remainingTimeElem.style.fontWeight = "normal";
+                        statusElem.style.color = "#EAEE5B";
+                    }
+
+                    examTimingElem.textContent = `起止时间: ${formatTimeWithoutSeconds(new Date(nextExam.start).toLocaleTimeString('zh-CN', { hour12: false }))} - ${formatTimeWithoutSeconds(new Date(nextExam.end).toLocaleTimeString('zh-CN', { hour12: false }))}`;
+                } else {
+                    if (currentSubjectElem) currentSubjectElem.textContent = "考试均已结束";
+                    if (examTimingElem) examTimingElem.textContent = "";
+                    if (remainingTimeElem) remainingTimeElem.textContent = "";
+                    if (statusElem) {
+                        statusElem.textContent = "状态: 空闲";
+                        statusElem.style.color = "#3946AF";
+                    }
                 }
             }
 

exam/Scripts/settings.js

@@ -12,16 +12,19 @@ document.addEventListener("DOMContentLoaded", () => {
     const configFileInput = document.getElementById("config-file");
     const clearConfigBtn = document.getElementById("clear-config-btn");
     const themeSelect = document.getElementById("theme-select");
+    const autoToggle = document.getElementById("auto-toggle");
 
     let offsetTime = getCookie("offsetTime") || 0;
     let room = getCookie("room") || "";
     let zoomLevel = getCookie("zoomLevel") || 1;
     let currentTheme = getCookie("currentTheme") || "md3";
     let theme = getCookie("theme") || "dark";
+    let isAutoToggle = getCookie("autoToggle") || false;
     let themeConfig = [];
 
     offsetTime = parseInt(offsetTime);
     roomElem.textContent = room;
+    autoToggle.checked = isAutoToggle === "true";
 
     // 初始化主题
     const currentThemePath = `Styles/${currentTheme}/${theme}.css`;
@@ -81,11 +84,13 @@ document.addEventListener("DOMContentLoaded", () => {
             zoomLevel = parseFloat(zoomInput.value);
             theme = themeToggle.checked ? "light" : "dark";
             currentTheme = themeSelect.value;
+            isAutoToggle = autoToggle.checked;
             setCookie("offsetTime", offsetTime, 365);
             setCookie("room", room, 365);
             setCookie("zoomLevel", zoomLevel, 365);
             setCookie("theme", theme, 365);
             setCookie("currentTheme", currentTheme, 365);
+            setCookie("autoToggle", isAutoToggle, 365);
             roomElem.textContent = room;
             document.body.style.zoom = zoomLevel;
             updateThemeLink();

exam/Styles/ealg/dark.css

@@ -642,4 +642,30 @@ input:checked + .slider:before {
 
 .count-btn .material-icons {
     font-size: 20px;
+}
+
+.count-btn-group {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    margin-right: 8px;
+}
+
+.count-control {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+}
+
+.count-btn {
+    width: 24px;
+    height: 24px;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.count-btn .material-icons {
+    font-size: 16px;
 }

exam/Styles/ealg/light.css

@@ -609,17 +609,6 @@ input:checked + .slider:before {
     gap: 5px;
 }
 
-.count-control input {
-    width: 60px;
-    padding: 5px;
-    font-size: 2rem;
-    text-align: center;
-    background-color: #FFFFFF;
-    color: #1C1B1F;
-    border: 2px solid #E8DEF8;
-    border-radius: 8px;
-}
-
 .count-btn {
     display: flex;
     align-items: center;
@@ -641,4 +630,30 @@ input:checked + .slider:before {
 
 .count-btn .material-icons {
     font-size: 20px;
+}
+
+.count-btn-group {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    margin-right: 8px;
+}
+
+.count-control {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+}
+
+.count-btn {
+    width: 24px;
+    height: 24px;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.count-btn .material-icons {
+    font-size: 16px;
 }

exam/Styles/md3/dark.css

@@ -611,6 +611,13 @@ input:checked + .slider:before {
     font-size: 2.5rem;
 }
 
+.count-btn-group {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    margin-right: 8px;
+}
+
 .count-control {
     display: flex;
     align-items: center;
@@ -628,6 +635,19 @@ input:checked + .slider:before {
     border-radius: 8px;
 }
 
+.count-btn {
+    width: 24px;
+    height: 24px;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.count-btn .material-icons {
+    font-size: 16px;
+}
+
 .count-btn {
     display: flex;
     align-items: center;

exam/Styles/old/dark.css

@@ -667,4 +667,31 @@ input:checked + .slider:before {
 
 .count-btn .material-icons {
     font-size: 20px;
+}
+
+.count-btn-group {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    margin-right: 8px;
+}
+
+.count-control {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+}
+
+.count-btn {
+    width: 24px;
+    height: 24px;
+    padding: 0;
+    border: 1px solid #333;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.count-btn .material-icons {
+    font-size: 16px;
 }

exam/Styles/old/light.css

@@ -643,17 +643,6 @@ theme-toggle-container {
     gap: 5px;
 }
 
-.count-control input {
-    width: 60px;
-    padding: 5px;
-    font-size: 2rem;
-    text-align: center;
-    background-color: #fff;
-    color: #333;
-    border: 2px solid #ccc;
-    border-radius: 8px;
-}
-
 .count-btn {
     display: flex;
     align-items: center;
@@ -675,4 +664,31 @@ theme-toggle-container {
 
 .count-btn .material-icons {
     font-size: 20px;
+}
+
+.count-btn-group {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    margin-right: 8px;
+}
+
+.count-control {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+}
+
+.count-btn {
+    width: 24px;
+    height: 24px;
+    padding: 0;
+    border: 1px solid #ccc;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.count-btn .material-icons {
+    font-size: 16px;
 }

exam/exam_config.json

@@ -5,43 +5,43 @@
     "examInfos": [
         {
             "name": "语文",
-            "start": "2025-03-10T07:20:00",
+            "start": "2025-04-14T07:20:00",
-            "end": "2025-03-10T09:50:00"
+            "end": "2025-04-14T09:50:00"
         },
         {
             "name": "物理",
-            "start": "2025-03-10T10:20:00",
+            "start": "2025-04-14T10:20:00",
-            "end": "2025-03-10T11:50:00"
+            "end": "2025-04-14T11:50:00"
         },
         {
             "name": "英语",
-            "start": "2025-03-10T14:10:00",
+            "start": "2025-04-14T14:10:00",
-            "end": "2025-03-10T23:15:00"
+            "end": "2025-04-14T23:15:00"
         },
         {
             "name": "历史",
-            "start": "2025-04-12T23:55:00",
+            "start": "2025-04-15T23:55:00",
             "end": "2025-04-13T01:32:00"
         },
         {
             "name": "数学",
-            "start": "2025-04-12T07:50:00",
+            "start": "2025-04-15T07:50:00",
-            "end": "2025-04-12T10:22:30"
+            "end": "2025-04-15T10:22:30"
         },
         {
             "name": "化学",
-            "start": "2025-04-12T11:20:00",
+            "start": "2025-04-14T11:20:00",
-            "end": "2025-04-12T11:50:00"
+            "end": "2025-04-15T11:50:00"
         },
         {
             "name": "生物/政治",
-            "start": "2025-04-12T14:10:00",
+            "start": "2025-04-15T14:10:00",
-            "end": "2025-04-12T15:40:00"
+            "end": "2025-04-15T15:40:00"
         },
         {
             "name": "地理",
-            "start": "2025-04-12T16:10:00",
+            "start": "2025-04-15T16:10:00",
-            "end": "2025-04-12T17:40:00"
+            "end": "2025-04-15T17:40:00"
         }
     ]
 }

exam/index.html

@@ -36,46 +36,54 @@
                             <div class="paper-input-group">
                                 <label>试卷:</label>
                                 <div class="count-control">
-                                    <button class="count-btn" data-target="paper-count" data-action="decrease">
+                                    <div class="count-btn-group">
-                                        <span class="material-icons">remove</span>
+                                        <button class="count-btn" data-target="paper-count" data-action="decrease">
-                                    </button>
+                                            <span class="material-icons">remove</span>
+                                        </button>
+                                        <button class="count-btn" data-target="paper-count" data-action="increase">
+                                            <span class="material-icons">add</span>
+                                        </button>
+                                    </div>
                                     <input type="number" id="paper-count" min="0" value="0">
-                                    <button class="count-btn" data-target="paper-count" data-action="increase">
-                                        <span class="material-icons">add</span>
-                                    </button>
                                 </div>
                                 <span>张</span>
                                 <div class="count-control">
-                                    <button class="count-btn" data-target="paper-pages" data-action="decrease">
+                                    <div class="count-btn-group">
-                                        <span class="material-icons">remove</span>
+                                        <button class="count-btn" data-target="paper-pages" data-action="decrease">
-                                    </button>
+                                            <span class="material-icons">remove</span>
+                                        </button>
+                                        <button class="count-btn" data-target="paper-pages" data-action="increase">
+                                            <span class="material-icons">add</span>
+                                        </button>
+                                    </div>
                                     <input type="number" id="paper-pages" min="0" value="0">
-                                    <button class="count-btn" data-target="paper-pages" data-action="increase">
-                                        <span class="material-icons">add</span>
-                                    </button>
                                 </div>
                                 <span>页</span>
                             </div>
                             <div class="paper-input-group">
                                 <label>答题卡:</label>
                                 <div class="count-control">
-                                    <button class="count-btn" data-target="sheet-count" data-action="decrease">
+                                    <div class="count-btn-group">
-                                        <span class="material-icons">remove</span>
+                                        <button class="count-btn" data-target="sheet-count" data-action="decrease">
-                                    </button>
+                                            <span class="material-icons">remove</span>
+                                        </button>
+                                        <button class="count-btn" data-target="sheet-count" data-action="increase">
+                                            <span class="material-icons">add</span>
+                                        </button>
+                                    </div>
                                     <input type="number" id="sheet-count" min="0" value="0">
-                                    <button class="count-btn" data-target="sheet-count" data-action="increase">
-                                        <span class="material-icons">add</span>
-                                    </button>
                                 </div>
                                 <span>张</span>
                                 <div class="count-control">
-                                    <button class="count-btn" data-target="sheet-pages" data-action="decrease">
+                                    <div class="count-btn-group">
-                                        <span class="material-icons">remove</span>
+                                        <button class="count-btn" data-target="sheet-pages" data-action="decrease">
-                                    </button>
+                                            <span class="material-icons">remove</span>
+                                        </button>
+                                        <button class="count-btn" data-target="sheet-pages" data-action="increase">
+                                            <span class="material-icons">add</span>
+                                        </button>
+                                    </div>
                                     <input type="number" id="sheet-pages" min="0" value="0">
-                                    <button class="count-btn" data-target="sheet-pages" data-action="increase">
-                                        <span class="material-icons">add</span>
-                                    </button>
                                 </div>
                                 <span>页</span>
                             </div>
@@ -136,6 +144,11 @@
                     <input type="checkbox" id="theme-toggle">
                     <span class="slider round"></span>
                 </label>
+                <label for="auto-toggle">自动切换显示:</label>
+                <label class="switch">
+                    <input type="checkbox" id="auto-toggle">
+                    <span class="slider round"></span>
+                </label>
             </div>
             <div class="button-group">
                 <button id="save-settings-btn" class="control-btn">确定</button>