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

This commit is contained in:
MKStoler1024 2025-04-14 16:24:23 +00:00
parent 24c6a78b6d
commit 7e6ed74f39
9 changed files with 248 additions and 104 deletions

View File

@ -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", () => {
if (!autoToggle) {
showPaperInfo = !showPaperInfo;
setCookie("showPaperInfo", showPaperInfo, 365);
currentSubjectElem.style.display = showPaperInfo ? "none" : "block";
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,7 +192,10 @@ document.addEventListener("DOMContentLoaded", () => {
statusElem.style.color = "#5ba838";
}
}
} else if (lastExam && now < new Date(lastExam.end).getTime() + 60000) {
} else {
// 非考试时间,显示表格
updateDisplay(false);
if (lastExam && now < new Date(lastExam.end).getTime() + 60000) {
if (currentSubjectElem) currentSubjectElem.textContent = `上场科目: ${lastExam.name}`;
if (examTimingElem) examTimingElem.textContent = "";
if (remainingTimeElem) remainingTimeElem.textContent = "";
@ -214,6 +235,7 @@ document.addEventListener("DOMContentLoaded", () => {
statusElem.style.color = "#3946AF";
}
}
}
examTableBodyElem.innerHTML = "";

View File

@ -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();

View File

@ -643,3 +643,29 @@ 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;
}

View File

@ -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;
@ -642,3 +631,29 @@ 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;
}

View File

@ -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;

View File

@ -668,3 +668,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;
border: 1px solid #333;
display: flex;
align-items: center;
justify-content: center;
}
.count-btn .material-icons {
font-size: 16px;
}

View File

@ -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;
@ -676,3 +665,30 @@ 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;
}

View File

@ -5,43 +5,43 @@
"examInfos": [
{
"name": "语文",
"start": "2025-03-10T07:20:00",
"end": "2025-03-10T09:50:00"
"start": "2025-04-14T07:20:00",
"end": "2025-04-14T09:50:00"
},
{
"name": "物理",
"start": "2025-03-10T10:20:00",
"end": "2025-03-10T11:50:00"
"start": "2025-04-14T10:20:00",
"end": "2025-04-14T11:50:00"
},
{
"name": "英语",
"start": "2025-03-10T14:10:00",
"end": "2025-03-10T23:15:00"
"start": "2025-04-14T14:10: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",
"end": "2025-04-12T10:22:30"
"start": "2025-04-15T07:50:00",
"end": "2025-04-15T10:22:30"
},
{
"name": "化学",
"start": "2025-04-12T11:20:00",
"end": "2025-04-12T11:50:00"
"start": "2025-04-14T11:20:00",
"end": "2025-04-15T11:50:00"
},
{
"name": "生物/政治",
"start": "2025-04-12T14:10:00",
"end": "2025-04-12T15:40:00"
"start": "2025-04-15T14:10:00",
"end": "2025-04-15T15:40:00"
},
{
"name": "地理",
"start": "2025-04-12T16:10:00",
"end": "2025-04-12T17:40:00"
"start": "2025-04-15T16:10:00",
"end": "2025-04-15T17:40:00"
}
]
}

View File

@ -36,47 +36,55 @@
<div class="paper-input-group">
<label>试卷:</label>
<div class="count-control">
<div class="count-btn-group">
<button class="count-btn" data-target="paper-count" data-action="decrease">
<span class="material-icons">remove</span>
</button>
<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>
<input type="number" id="paper-count" min="0" value="0">
</div>
<span></span>
<div class="count-control">
<div class="count-btn-group">
<button class="count-btn" data-target="paper-pages" data-action="decrease">
<span class="material-icons">remove</span>
</button>
<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>
<input type="number" id="paper-pages" min="0" value="0">
</div>
<span></span>
</div>
<div class="paper-input-group">
<label>答题卡:</label>
<div class="count-control">
<div class="count-btn-group">
<button class="count-btn" data-target="sheet-count" data-action="decrease">
<span class="material-icons">remove</span>
</button>
<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>
<input type="number" id="sheet-count" min="0" value="0">
</div>
<span></span>
<div class="count-control">
<div class="count-btn-group">
<button class="count-btn" data-target="sheet-pages" data-action="decrease">
<span class="material-icons">remove</span>
</button>
<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>
<input type="number" id="sheet-pages" min="0" value="0">
</div>
<span></span>
</div>
</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>