/* NY 问卷考试系统数据平台 - 前端逻辑 */ (function () { 'use strict'; const $ = (s, r) => (r || document).querySelector(s); const $$ = (s, r) => Array.prototype.slice.call((r || document).querySelectorAll(s)); const state = { projects: [], questions: [], rows: [], absent: [], unmatched: [], roster: [], // 完整名单(含班级),用于按班级重算统计 prevMap: {}, // sid -> 摘要,用于高亮变化 prevSids: new Set(), // 上一次刷新出现的 sid newSids: new Set(), // 本次刷新新增的 sid(绿色底纹) hasPrev: false, fullScore: 100, sortKey: 'submit_ts', sortAsc: false, timer: null, loading: false, lastSig: '', connFail: 0, historyDisplay: 'click', // click=点击成员弹窗查看历史;inline=成绩明细内全部展开 exportSort: 'time', // time=按提交时间;sid=按学号 highlight: new Set(), // 出现过新提交/新数据的学号,绿色底纹 hlTimer: null, // 自动清除高亮的定时器 hlAutoClearSec: 30, // 新数据高亮每隔多少秒自动清除一次 _sorted: null, // 虚拟滚动:最近一次排序后的完整行数组(缓存,避免重复排序) _kwDebounce: null, // 搜索框防抖定时器 csrf: '', // CSRF token(来自 config_get),写请求自动附带 _authRedirecting: false, // 鉴权失败已接管(防止并发请求重复跳登录页) _authStopped: false, // 鉴权失败已停自动刷新(等用户处理,不再定时重试) }; /* ---------------- 本地存储 ---------------- */ // 浏览器关闭后仍然保留,账号/密码等敏感配置除外;进入页面时优先读缓存,再后台异步刷新 const LS = { get(k, def) { try { const v = localStorage.getItem(k); return v == null ? def : JSON.parse(v); } catch (e) { return def; } }, set(k, v) { try { localStorage.setItem(k, JSON.stringify(v)); } catch (e) { /* 隐私模式 */ } }, del(k) { try { localStorage.removeItem(k); } catch (e) {} } }; const LS_PROJECTS = 'ny_projects'; const LS_LASTPID = 'ny_last_pid'; const LS_LASTQID = 'ny_last_qid'; const LS_FILTERS = 'ny_filters'; // {cls, grp} -> 跟随 projectId const LS_LAYOUT = 'ny_layout'; const LS_INTERVAL = 'ny_interval'; // 用户手动调整的刷新间隔(跟随本机) const LS_ROSTER = 'ny_roster_cache'; // 名单 cache(用于首屏补齐班级/组别下拉) const dataKey = pid => 'ny_data_' + pid; /* ---------------- 通用 ---------------- */ async function api(action, opts) { opts = opts || {}; const init = { method: opts.method || 'GET' }; if (opts.body) { init.headers = { 'Content-Type': 'application/json' }; // 写操作附带 CSRF token(在 body 内,后端 ny_csrf_ok 会从 JSON 里读取 _csrf) if (state.csrf) opts.body._csrf = state.csrf; init.body = JSON.stringify(opts.body); } if (opts.form) { init.method = 'POST'; if (state.csrf) opts.form.append('_csrf', state.csrf); init.body = opts.form; } if (opts.method === 'POST' && state.csrf) { init.headers = init.headers || {}; init.headers['X-CSRF-Token'] = state.csrf; } let url = 'api.php?action=' + encodeURIComponent(action); if (opts.params) { for (const k in opts.params) { if (opts.params[k] !== '' && opts.params[k] != null) { url += '&' + k + '=' + encodeURIComponent(opts.params[k]); } } } const res = await fetch(url, init); const text = await res.text(); let json; try { json = JSON.parse(text); } catch (e) { throw new Error('服务端返回异常(可能 PHP 报错):' + text.slice(0, 300)); } if (!json.ok) { const err = new Error(json.msg || '请求失败'); // 401 = 本系统会话已失效,与"卷王鉴权失败"同样需要重新登录; // handleAuthError 里的防死循环闸门会保证"刚登录完又失败"时不再反复跳转。 err.auth = !!(json.extra && json.extra.auth) || res.status === 401; err.extra = json.extra || null; throw err; } return json.data; } function esc(s) { return String(s == null ? '' : s).replace(/[&<>"']/g, c => ({ '&': '&', '<': '<', '>': '>', '"': '"', "'": ''' }[c])); } /* ---------------- Toast 顶部飘窗通知(替代旧 inline alert) ---------------- */ let toastTimer = null; const TOAST_DURATION = 3500; // 默认显示 3.5 秒 const TOAST_LIMIT = 5; // 最多同时展示 5 条(旧消息优先被挤掉) function showToast(msg, type) { if (msg === '' || msg == null) return; // 空消息不弹(showAlert('') 兼容旧调用 → 静默返回) // type: ''=默认(蓝) | 'info'=绿 | 'error'=红 | 'warn'=橙 const el = document.getElementById('toastContainer') || (function () { const c = document.createElement('div'); c.id = 'toastContainer'; c.style.cssText = 'position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none;max-width:calc(100vw - 32px);width:560px'; document.body.appendChild(c); return c; })(); // 限流:超过上限移除最旧 while (el.children.length >= TOAST_LIMIT) { el.firstChild.remove(); } const t = document.createElement('div'); const cls = type === 'error' ? 'toast-error' : (type === 'warn' ? 'toast-warn' : (type === 'info' ? 'toast-ok' : 'toast')); t.className = 'toast ' + cls; t.innerHTML = '' + esc(msg).replace(/\n/g, '
') + '
'; t.style.cssText = 'pointer-events:auto;padding:10px 16px;border-radius:10px;font-size:13px;line-height:1.55;box-shadow:0 8px 30px rgba(15,23,42,.18);animation:toastIn .25s ease;white-space:pre-wrap;word-break:break-word'; el.appendChild(t); // 点击关闭 t.addEventListener('click', () => { t.style.animation='toastOut .2s ease forwards'; setTimeout(() => t.remove(), 200); }); // 自动消失 setTimeout(() => { if (t.parentNode) { t.style.animation='toastOut .2s ease forwards'; setTimeout(() => t.remove(), 200); } }, TOAST_DURATION); } /** 兼容旧调用:showAlert 现在走 toast(type 映射) */ function showAlert(msg, type) { if (msg === '' || msg == null) return; // 旧版 showAlert('') 用于"清空内联提示",toast 无需此操作 const t = type === 'info' ? 'ok' : (type === 'error' ? 'error' : ''); showToast(msg, t); } function setConn(cls, text) { const el = $('#conn'); el.className = 'conn ' + cls; el.innerHTML = '' + esc(text) + ''; } // 导出提示:说明本次导出的筛选范围 function exportTip(what, cls, grp) { const parts = []; if (cls) parts.push(cls + (cls.indexOf('班') >= 0 ? '' : '班')); if (grp) parts.push(grp + (grp.indexOf('组') >= 0 ? '' : '组')); return '已导出' + what + (parts.length ? '(' + parts.join(' / ') + ')' : '(全部班级 / 组别)'); } /* ---------------- 鉴权失败处理(含防死循环) ---------------- * 死循环场景:登录页登录成功 → 进主页 → 拉数据仍报"未配置账号/登录失败" → 自动跳登录页 → 再登录…… * 用户看到的就是"一直让重新登录、根本用不了"。这里加两道闸门: * 1) 刚登录完(120 秒内)又鉴权失败 → 不再自动跳转,直接把服务端真实原因 + 落盘诊断摊开给用户 * 2) 同一会话已自动跳转过 2 次 → 同样停在页面报错 */ const AUTH_FRESH_MS = 120000; const AUTH_MAX_JUMPS = 2; function authJustLoggedIn() { try { const t = parseInt(sessionStorage.getItem('ny_login_at') || '0', 10); return t > 0 && (Date.now() - t) < AUTH_FRESH_MS; } catch (e) { return false; } } function authJumpCount() { try { return parseInt(sessionStorage.getItem('ny_auth_jumps') || '0', 10) || 0; } catch (e) { return 0; } } function stopAutoRefresh() { if (state.timer) { clearTimeout(state.timer); state.timer = null; } if (state.hlTimer) { clearInterval(state.hlTimer); state.hlTimer = null; } state._authStopped = true; } function forceRelogin() { stopAutoRefresh(); // 必须先清服务端会话,否则 login.php 发现会话还在会把人踢回 index.php,跳不过去 fetch('logout.php', { method: 'POST', credentials: 'same-origin' }) .catch(() => {}) .finally(() => { window.location.href = 'login.php'; }); } function diagLines(diag) { if (!diag) return []; const yn = v => (v ? '是' : '否'); return [ '配置来源:' + (diag.storage || '-') + '(配置文件可写=' + yn(diag.cfg_writable) + ')', '数据目录:' + (diag.data_dir || '-') + '(可写=' + yn(diag.dir_writable) + ')', '数据库:' + (diag.db_connected ? ('已连接(可写=' + yn(diag.db_writable) + ')') : ('未连接 ' + (diag.db_error || ''))), '已存账号:' + (diag.has_username ? (diag.username || '已设置') : '空 ← 这就是「未配置账号」的原因'), '已存密码:' + (diag.has_password ? '已保存' : '空'), diag.save_error ? ('保存异常:' + diag.save_error) : '', ].filter(Boolean); } function showAuthFailure(e) { const lines = diagLines(e && e.extra ? e.extra.diag : null); const box = document.createElement('div'); box.className = 'modal open'; box.innerHTML = ''; document.body.appendChild(box); box.querySelector('[data-auth-retry]').onclick = () => { box.remove(); state._authRedirecting = false; state._authStopped = false; refresh(false, true); // 非静默 + 强制拉取 }; box.querySelector('[data-auth-settings]').onclick = () => { box.remove(); const b = document.getElementById('btnSettings'); if (b) b.click(); }; box.querySelector('[data-auth-relogin]').onclick = () => { box.remove(); forceRelogin(); }; } /** * 统一处理鉴权类错误;返回 true 表示已接管(调用方直接 return)。 */ function handleAuthError(e) { if (state._authRedirecting) return true; state._authRedirecting = true; const jumps = authJumpCount(); if (authJustLoggedIn() || jumps >= AUTH_MAX_JUMPS) { stopAutoRefresh(); showAuthFailure(e); return true; } try { sessionStorage.setItem('ny_auth_jumps', String(jumps + 1)); } catch (err) {} showAlert('卷王账号未配置或登录已失效,正在跳转登录页…', 'error'); forceRelogin(); return true; } /* ---------------- 问卷列表 ---------------- */ // 把数组渲染到 #projectSel(抽出便于缓存复用) function renderProjects() { const sel = $('#projectSel'); const keep = sel.value; sel.innerHTML = ''; if (!state.projects.length) { sel.innerHTML = ''; } else { const ph = document.createElement('option'); ph.value = ''; ph.textContent = '请选择问卷 / 考试'; sel.appendChild(ph); // 双策略识别文件夹: // 1) mode 字段含 'folder'(卷王默认) // 2) 被其他项目作为 parent_id 引用(部分版本无 mode 字段,回退推断) const isFolder = p => (p.mode || '').toLowerCase().includes('folder'); const parentIds = new Set(); state.projects.forEach(p => { const pid = (p.parent_id || '0'); if (pid && pid !== '0' && pid !== '') parentIds.add(pid); }); const folderSet = new Set(); state.projects.forEach(p => { if (isFolder(p) || parentIds.has(p.id)) folderSet.add(p.id); }); const childOf = fid => state.projects.filter(p => !folderSet.has(p.id) && (p.parent_id || '0') === fid); const mkOpt = p => { const o = document.createElement('option'); o.value = p.id; o.textContent = (p.mode ? '[' + p.mode + '] ' : '') + p.name + '(' + (p.total || 0) + '份)'; return o; }; // 根项(不在任何文件夹里的) state.projects.filter(p => !folderSet.has(p.id)) .forEach(p => sel.appendChild(mkOpt(p))); // 文件夹及子项(空文件夹不显示,避免点击报错) state.projects.filter(p => folderSet.has(p.id)).forEach(f => { const kids = childOf(f.id); if (!kids.length) return; const og = document.createElement('optgroup'); og.label = '📁 ' + f.name; kids.forEach(p => og.appendChild(mkOpt(p))); sel.appendChild(og); }); } if (keep && state.projects.some(p => p.id === keep)) sel.value = keep; else if (state.deeplinkProject && state.projects.some(p => p.id === state.deeplinkProject)) sel.value = state.deeplinkProject; else { const last = LS.get(LS_LASTPID, ''); if (last && state.projects.some(p => p.id === last)) sel.value = last; } const surveyCount = state.projects.filter(p => !((p.mode || '').toLowerCase().includes('folder'))).length; setConn('conn-on', (state._fromCache ? '缓存 · ' : '') + '已连接 · ' + surveyCount + ' 个问卷'); showAlert(''); if (sel.value) refresh(); } async function loadProjects() { setConn('conn-load', '连接中…'); // 1) 先读本地缓存 → 立刻渲染,避免空白 const cached = LS.get(LS_PROJECTS, []); if (Array.isArray(cached) && cached.length) { state.projects = cached; state._fromCache = true; renderProjects(); } // 2) 再异步刷新 try { const list = await api('projects'); state.projects = list || []; state._fromCache = false; LS.set(LS_PROJECTS, state.projects); renderProjects(); } catch (e) { if (e.auth) { handleAuthError(e); return; } if (!cached || !cached.length) { setConn('conn-err', '连接失败'); showAlert('无法连接卷王系统:' + e.message + '\n请点击右上角【设置】检查系统地址、接口前缀与账号密码。'); } else { showAlert('⚠️ 后台刷新失败,已显示本地缓存:' + e.message); } } } /* ---------------- 数据刷新 ---------------- */ /** 行指纹:任一字段变化都算"有新数据" */ function rowSig(r) { return [ r.sid, r.score, r.submit_at, r.attempts || 1, r.last_submit_ts || 0, ].join('|'); } /** * 整份数据指纹:仅覆盖"会影响 DOM 渲染"的字段。 * 用于 applyData 的无变化守卫——自动刷新拿到与屏幕完全一致的数据时,跳过昂贵整表重绘。 * 含 project id/name 防止"不同项目数据恰好相同"导致误跳过。 */ function dataSig(d) { const rows = d.rows || []; const roster = d.roster || []; const unmatched = d.unmatched || []; const questions = d.questions || []; const rs = rows.map(rowSig).join('|'); const ros = roster.map(r => (r.sid || '') + ':' + (r.cls || '') + ':' + (r.grp || '')).join('|'); const um = unmatched.map(u => (u.name || '') + ':' + (u.score == null ? '-' : u.score)).join('|'); const q = questions.length + ':' + questions.map(q => q.id).join(','); const proj = (d.project && (d.project.id || d.project.name)) || ''; return [ proj, d.updated_at || '', rows.length, rs, ros, um, q, (d.absent || []).length, d.whitelist_driven ? 1 : 0, d.whitelist_total || 0, ].join('§'); } function applyData(d, opts) { opts = opts || {}; const fromCache = !!opts.fromCache; state.questions = d.questions || []; state.rows = d.rows || []; state.absent = d.absent || []; state.unmatched = d.unmatched || []; state.roster = d.roster || []; state.whitelistDriven = !!d.whitelist_driven; state.whitelistTotal = (d.whitelist_total || 0); state.fullScore = (d.config && d.config.full_score) ? (parseInt(d.config.full_score, 10) || 100) : 100; state.passRate = (d.config && d.config.pass_rate != null) ? (parseFloat(d.config.pass_rate) || 60) : 60; // 性能守卫:数据指纹未变化则跳过昂贵整表重绘(自动刷新拿到与屏幕一致的数据时不再每轮重建 DOM)。 // 缓存预渲染路径照常保留——刷新间隙保持视觉稳定;仅当屏幕上已是同一份数据时才跳过。 const sig = dataSig(d); if (sig === state._renderedSig) { if (!fromCache) { // 真实刷新且数据未变:仅刷新轻量元信息,不重建 DOM state.hasPrev = true; // 维持指纹基准,供下次 diff $('#lastUpdate').textContent = d.updated_at || '—'; state.projectName = (d.project && d.project.name) || ''; setConn('conn-on', '实时 · ' + (d.project && d.project.name || '')); showAlert(''); } return; } // 变更检测:学号/成绩/提交时间/考试次数/最近提交时间 任一变化即视为"有新数据" // (纳入 attempts 与 last_submit_ts 才能发现"重考但分数更低"这种提交) const cur = new Set(state.rows.map(r => r.sid).filter(Boolean)); // 缓存渲染不参与变更检测:本地缓存可能是旧数据,与上一轮真实数据比对会产生假高亮 if (state.hasPrev && !fromCache) { state.newSids = new Set(Array.from(cur).filter(s => !state.prevSids.has(s))); state.rows.forEach(r => { const sid = String(r.sid || ''); if (sid === '') return; const prev = state.prevMap[sid]; if (prev === undefined || prev !== rowSig(r)) { state.highlight.add(sid); // 累积:一直常亮到用户清除或切换项目 } }); } else if (!state.hasPrev) { state.newSids = new Set(); } if (!fromCache) state.hasPrev = true; renderNameFields(d); renderStats(); // 仅真实数据才更新指纹基准(缓存可能是旧数据,不能作为比对基准) if (!fromCache) { const map = {}; state.rows.forEach(r => { map[String(r.sid)] = rowSig(r); }); state.prevMap = map; state.prevSids = cur; } // 仅在有新数据时做 FLIP 行动画(新行滑入、其它行下移);搜索/排序重排不触发 const flipPrev = (state.newSids.size > 0) ? captureFlip($('#tbody')) : null; renderTable(); if (flipPrev) playFlip($('#tbody'), flipPrev); populateClasses(); populateGroups(); renderAbsent(); renderUnmatched(); renderHints(); $('#lastUpdate').textContent = d.updated_at || '—'; state.projectName = (d.project && d.project.name) || ''; setConn('conn-on', (fromCache ? '缓存 · ' : '') + '实时 · ' + (d.project && d.project.name || '')); if (!fromCache) showAlert(''); state._renderedSig = sig; // 记录当前屏幕指纹,下次相同则跳过整表重绘 } async function refresh(silent, force) { const pid = $('#projectSel').value; if (!pid) return; if (state.loading && !silent) return; state.loading = true; if (!silent) setConn('conn-load', force ? '重新拉取数据…' : '拉取数据…'); // 1) 先读本地缓存 → 立即渲染,刷新期间保持视觉稳定 const cached = LS.get(dataKey(pid), null); if (cached && cached.updated_at) { try { applyData(cached, { fromCache: true }); } catch (e) { /* 旧格式缓存忽略 */ } } // 2) 后台异步拉真实数据 try { const params = { projectId: pid, nameQid: $('#nameFieldSel').value }; if (force) params.force = 1; const d = await api('data', { params }); applyData(d); state.connFail = 0; LS.set(dataKey(pid), d); LS.set(LS_LASTPID, pid); LS.set(LS_LASTQID, $('#nameFieldSel').value || ''); // 名单缓存一份(便于刷新前/失败时仍能渲染班级/组别下拉) LS.set(LS_ROSTER, { ts: Date.now(), students: d.roster || [] }); } catch (e) { if (e.auth) { handleAuthError(e); return; } if (!cached) { if (!silent) setConn('conn-err', '数据获取失败'); showAlert(e.message); } else { // 后台静默刷新失败:保留缓存数据,但把连接指示转为"中断"告警,成功即恢复 state.connFail++; if (state.connFail >= 1) setConn('conn-warn', '⚠️ 实时刷新中断 · 已显示本地缓存'); showAlert('⚠️ 后台刷新失败,已显示本地缓存:' + e.message); } } finally { state.loading = false; $('#liveDot').classList.add('on'); setTimeout(() => $('#liveDot').classList.remove('on'), 900); // 自动刷新是 setTimeout 链:每轮结束重新排下一轮(成功复位、失败按退避延长) schedule(); } } function renderNameFields(d) { const sel = $('#nameFieldSel'); const keep = sel.value; sel.innerHTML = ''; const cands = d.name_candidates || []; cands.forEach(q => { const o = document.createElement('option'); o.value = q.id; o.textContent = '姓名题:' + (q.title || q.id); sel.appendChild(o); }); (d.questions || []).forEach(q => { if (cands.some(c => c.id === q.id)) return; const o = document.createElement('option'); o.value = q.id; o.textContent = (q.title || q.id) + '(' + (q.type || '') + ')'; sel.appendChild(o); }); const lastQid = LS.get(LS_LASTQID, ''); if (keep) sel.value = keep; else if (state.deeplinkQid) sel.value = state.deeplinkQid; else if (lastQid && (cands.some(c => c.id === lastQid) || (d.questions || []).some(q => q.id === lastQid))) sel.value = lastQid; else if (d.name_qid) sel.value = d.name_qid; } function populateClasses() { const sel = $('#clsSel'); const cur = sel.value; const set = new Set(); (state.roster || []).forEach(s => { if (s.cls) set.add(s.cls); }); const vals = Array.from(set).sort((a, b) => a.localeCompare(b, 'zh', { numeric: true })); sel.innerHTML = '' + vals.map(v => '').join(''); // 优先保留用户当前已选项;否则按本地缓存恢复(跟随 projectId) const pid = $('#projectSel').value; const cache = pid ? (LS.get(LS_FILTERS, {})[pid] || {}) : {}; if (vals.indexOf(cur) >= 0) sel.value = cur; else if (cache.cls && vals.indexOf(cache.cls) >= 0) sel.value = cache.cls; else sel.value = ''; } // 组别下拉:仅显示当前所选班级内出现的组别("全部班级" 时显示所有组别) function populateGroups() { const cls = $('#clsSel').value; const grpSel = $('#grpSel'); if (!grpSel) return; const cur = grpSel.value; const set = new Set(); (state.roster || []).forEach(s => { if (cls && (s.cls || '') !== cls) return; if (s.grp) set.add(s.grp); }); const vals = Array.from(set).sort(); grpSel.innerHTML = '' + vals.map(v => '').join(''); const pid = $('#projectSel').value; const cache = pid ? (LS.get(LS_FILTERS, {})[pid] || {}) : {}; if (vals.indexOf(cur) >= 0) grpSel.value = cur; else if (cache.grp && vals.indexOf(cache.grp) >= 0) grpSel.value = cache.grp; else grpSel.value = ''; } function rememberFilters() { const pid = $('#projectSel').value; if (!pid) return; const all = LS.get(LS_FILTERS, {}); all[pid] = { cls: $('#clsSel').value, grp: $('#grpSel').value, ts: Date.now() }; LS.set(LS_FILTERS, all); } // 按当前所选班级 + 组别(或无)客户端重算统计卡片 function computeDisplayStats(cls, grp) { const allStudents = state.roster || []; let students = cls ? allStudents.filter(s => (s.cls || '') === cls) : allStudents; let rows = cls ? state.rows.filter(r => (r.cls || '') === cls) : state.rows; if (grp) { students = students.filter(s => (s.grp || '') === grp); rows = rows.filter(r => (r.grp || '') === grp); } const total = students.length; const submitted = rows.length; const absent = Math.max(0, total - submitted); const rate = total > 0 ? Math.round(submitted / total * 1000) / 10 : 0; const scores = rows.map(r => r.score).filter(v => v !== null && v !== undefined); const avg = scores.length ? Math.round(scores.reduce((a, b) => a + b, 0) / scores.length * 100) / 100 : null; const full = state.fullScore || 100; const pr = (state.passRate == null ? 60 : state.passRate); // 合格率阈值可配 const passCount = rows.filter(r => r.score !== null && r.score !== undefined && r.score >= (pr / 100) * full).length; const passRate = submitted > 0 ? Math.round(passCount / submitted * 1000) / 10 : 0; let maxScore = null, minScore = null; const maxNames = [], minNames = []; rows.forEach(r => { if (r.score === null || r.score === undefined) return; if (maxScore === null || r.score > maxScore) { maxScore = r.score; maxNames.length = 0; maxNames.push(r.name); } else if (r.score === maxScore) maxNames.push(r.name); if (minScore === null || r.score < minScore) { minScore = r.score; minNames.length = 0; minNames.push(r.name); } else if (r.score === minScore) minNames.push(r.name); }); const durs = rows.map(r => r.duration).filter(v => v !== null && v !== undefined); const avgDur = durs.length ? Math.round(durs.reduce((a, b) => a + b, 0) / durs.length) : null; return { total, submitted, absent, rate, avg, passRate, maxScore, minScore, maxNames, minNames, avgDur }; } function renderStats() { const cls = $('#clsSel').value; const grp = $('#grpSel').value; const st = computeDisplayStats(cls, grp); const set = (id, v) => { const el = $(id); if (el) el.textContent = v; }; set('#sTotal', st.total); set('#sSubmit', st.submitted); set('#sAbsent', st.absent); set('#sRate', st.rate + '%'); set('#sAvg', st.avg == null ? '-' : st.avg); set('#sMax', st.maxScore == null ? '-' : st.maxScore); set('#sMin', st.minScore == null ? '-' : st.minScore); set('#sPass', st.passRate + '%'); // 合格率阈值可配(全局或本卷独立),卡片标题实时反映当前生效值 const lbl = $('#sPassLabel'); if (lbl) lbl.textContent = '(≥' + (state.passRate == null ? 60 : state.passRate) + '%满分)'; set('#sDur', st.avgDur == null ? '-' : fmtDur(st.avgDur)); } // 各面板计数文字按所选班级 + 组别过滤(成绩明细 / 缺考名单) // 缺考数与统计卡片保持一致:过滤后名单 − 过滤后提交(而非二次过滤后端 absent 数组) function renderHints() { const cls = $('#clsSel').value; const grp = $('#grpSel').value; const rowsForCls = cls ? state.rows.filter(r => (r.cls || '') === cls) : state.rows; const rosterForCls = cls ? (state.roster || []).filter(s => (s.cls || '') === cls) : (state.roster || []); const rowsForGrp = grp ? rowsForCls.filter(r => (r.grp || '') === grp) : rowsForCls; const rosterForGrp = grp ? rosterForCls.filter(s => (s.grp || '') === grp) : rosterForCls; const absentForGrp = Math.max(0, rosterForGrp.length - rowsForGrp.length); $('#tableHint').textContent = '共 ' + rowsForGrp.length + ' 人已提交 · 名单 ' + rosterForGrp.length + ' 人'; // absentHint 由 renderAbsent 统一维护(含按班统计),此处不再重复设置 } function fmtDur(sec) { if (sec == null) return '-'; if (sec < 60) return sec + ' 秒'; const m = Math.floor(sec / 60), s = sec % 60; if (m < 60) return m + ' 分 ' + String(s).padStart(2, '0') + ' 秒'; const h = Math.floor(m / 60); return h + ' 小时 ' + String(m % 60).padStart(2, '0') + ' 分'; } /** * 成绩着色:按「占本卷满分的百分比」判断,而不是写死 90 / 60 分。 * 否则把满分改成 50 分(或卷子本身是 20 分制)时,整列都会被误判为不及格标红。 */ function scoreClass(v) { if (v == null) return ''; const full = state.fullScore || 100; if (!(full > 0)) return ''; const pct = (Number(v) / full) * 100; if (!isFinite(pct)) return ''; const pass = (state.passRate == null ? 60 : Number(state.passRate)); if (pct >= 90) return 'score-high'; if (pct >= pass) return 'score-mid'; return 'score-low'; } const TEXT_KEYS = { sid: 1, cls: 1, grp: 1, name: 1 }; function cmpText(x, y) { return String(x).localeCompare(String(y), 'zh', { numeric: true }); } /** 学号比较:纯数字按数值,否则自然排序 */ function cmpSid(a, b) { const s1 = String(a.sid == null ? '' : a.sid); const s2 = String(b.sid == null ? '' : b.sid); if (s1 !== '' && s2 !== '' && !isNaN(Number(s1)) && !isNaN(Number(s2))) { const d = Number(s1) - Number(s2); if (d !== 0) return d; } return cmpText(s1, s2); } /** 某排序键是否视为"空值"(空值恒排末尾,不受升降序影响) */ function isEmptyVal(key, v) { if (v === null || v === undefined || v === '') return true; // 时间戳 0 表示未知时间 if ((key === 'submit_ts' || key === 'last_submit_ts') && Number(v) === 0) return true; return false; } /** * 统一比较器: * - 空值恒排末尾(不再因为 -1 混在中间) * - 主键相同时按学号做次级排序,保证顺序稳定 */ function cmpBy(key, dir, a, b) { const x = a[key], y = b[key]; const xe = isEmptyVal(key, x), ye = isEmptyVal(key, y); if (xe && ye) return cmpSid(a, b) * dir; if (xe) return 1; // 空值永远在后 if (ye) return -1; let d; if (TEXT_KEYS[key]) { d = cmpText(x, y); } else { const nx = Number(x), ny = Number(y); d = (isNaN(nx) || isNaN(ny)) ? cmpText(x, y) : (nx - ny); } if (d !== 0) return d * dir; return cmpSid(a, b) * dir; } /** 展开为"每次考试一行"(历史成绩全部展示模式) */ function expandAttempts(rows) { const out = []; rows.forEach(r => { const list = (r.attempts_list && r.attempts_list.length) ? r.attempts_list : null; if (!list) { out.push(Object.assign({}, r, { idx: 1, is_best: true, _att: false })); return; } list.forEach(a => { out.push({ sid: r.sid, name: r.name, cls: r.cls, grp: r.grp, score: (a.score === undefined ? null : a.score), submit_ts: a.submit_ts || 0, submit_at: a.submit_at || '-', duration: (a.duration === undefined ? null : a.duration), duration_txt: a.duration_txt || '-', attempts: r.attempts || 1, best_score: (r.best_score === undefined ? null : r.best_score), last_submit_ts: r.last_submit_ts || 0, last_submit_at: r.last_submit_at || '-', idx: a.idx || 1, is_best: !!a.is_best, answer_id: a.answer_id || '', temp_save: !!a.temp_save, _att: true, }); }); }); return out; } /** 依据筛选 + 展示模式,得到待渲染的行 */ function buildRows() { const kw = $('#kw').value.trim().toLowerCase(); const clsFilter = $('#clsSel').value; const grpFilter = $('#grpSel').value; let base = state.rows.slice(); if (clsFilter) base = base.filter(r => (r.cls || '') === clsFilter); if (grpFilter) base = base.filter(r => (r.grp || '') === grpFilter); if (kw) base = base.filter(r => String(r.sid).toLowerCase().includes(kw) || String(r.name).toLowerCase().includes(kw)); if (state.historyDisplay === 'inline') { return expandAttempts(base); } // 一人一行:提交时间显示"最近一次提交",使"按提交时间排序"= 谁最近交的 return base.map(r => Object.assign({}, r, { submit_ts: (r.last_submit_ts || r.submit_ts || 0), submit_at: (r.last_submit_at && r.last_submit_at !== '-') ? r.last_submit_at : (r.submit_at || '-'), _att: false, })); } const COL_COUNT = 8; /** 更新"清除高亮"按钮的可见性与计数 */ function renderHlBadge() { const btn = $('#btnClearHl'); const badge = $('#hlBadge'); if (!btn) return; const n = state.highlight.size; if (badge) badge.textContent = n; btn.hidden = (n === 0); } // FLIP 行动画:新数据行平滑滑动到新位置,其它行顺势下移(尊重 prefers-reduced-motion) const REDUCED_MOTION = !!(window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches); function captureFlip(container) { const m = new Map(); if (!container) return m; const trs = container.querySelectorAll('tr[data-sid]'); for (const tr of trs) { const sid = tr.getAttribute('data-sid'); if (sid) m.set(sid, tr.getBoundingClientRect().top); } return m; } function playFlip(container, prev) { if (!container || !prev || REDUCED_MOTION) return; const trs = container.querySelectorAll('tr[data-sid]'); for (const tr of trs) { const sid = tr.getAttribute('data-sid'); if (!sid) continue; const oldTop = prev.get(sid); if (oldTop === undefined) { tr.classList.add('row-drop-in'); // 全新行:轻微落入 continue; } const newTop = tr.getBoundingClientRect().top; const dy = oldTop - newTop; if (Math.abs(dy) < 1) continue; tr.style.transition = 'none'; tr.style.transform = 'translateY(' + dy + 'px)'; void tr.offsetWidth; // 强制回流,确保起始位生效 requestAnimationFrame(() => { tr.style.transition = 'transform .42s cubic-bezier(.22,.61,.36,1)'; tr.style.transform = ''; }); } } function renderTable() { const rows = buildRows(); const k = state.sortKey, dir = state.sortAsc ? 1 : -1; rows.sort((a, b) => cmpBy(k, dir, a, b)); state._sorted = rows; const tb = $('#tbody'); if (!rows.length) { tb.innerHTML = '' + (state.rows.length ? '没有匹配的记录' : '暂无提交记录') + ''; _lastRange = ''; // 空表也重置窗口签名,下次有数据必重绘 } else { renderVirtualRows(tb, rows, true); // 排序/搜索/数据变更:强制重绘 } $$('#dataTable th.sortable').forEach(th => { const isCur = th.dataset.k === state.sortKey; th.innerHTML = th.textContent.replace(/[\s↑↓]+$/, '') + (isCur ? ' ' + (state.sortAsc ? '↑' : '↓') + '' : ''); }); // 搜索时提示要跟上,否则会出现"表格只有 3 行、提示却写共 50 人"的困惑 const kwNow = ($('#kw').value || '').trim(); if (kwNow) { const base = state.rows.length; const hintEl = $('#tableHint'); if (hintEl) hintEl.textContent = '搜索「' + kwNow + '」命中 ' + rows.length + ' 人(本卷共 ' + base + ' 人已提交)'; } else { renderHints(); } renderHlBadge(); } /** 单行 HTML(与虚拟滚动共用,避免逻辑重复) */ function rowHtml(r) { const sid = String(r.sid || ''); const isNew = sid !== '' && state.newSids.has(sid); const hl = sid !== '' && state.highlight.has(sid); const attempts = (r.attempts || 1); const clsName = [hl ? 'new' : '', (_dropAnim && isNew) ? 'row-drop-in' : '', 'clickable'].filter(Boolean).join(' '); const tags = []; if (isNew) tags.push('新'); if (r._att && r.is_best && attempts > 1) tags.push('最佳'); if (r._att && r.temp_save) tags.push('暂存'); const attCell = r._att && attempts > 1 ? attempts + ' 第' + r.idx + '次' : String(attempts); return '' + '' + esc(r.sid) + '' + '' + esc(r.name) + (tags.length ? ' ' + tags.join(' ') : '') + '' + '' + esc(r.cls || '') + '' + '' + esc(r.grp || '') + '' + '' + (r.score == null ? '-' : r.score) + '' + '' + attCell + '' + '' + esc(r.submit_at) + '' + '' + esc(r.duration_txt) + '' + ''; } /** * 虚拟滚动:只渲染可视窗口内的行,用顶部/底部 spacer 撑起完整滚动高度。 * 行数很多(尤其「全部展开」历史模式下)时,避免一次性插入成千上万 DOM 节点导致卡顿。 */ const ROW_H_FALLBACK = 41; // 首帧未测量前的行高估值 const VS_OVERSCAN = 12; // 视口上下各多渲染的行数,减少快速滚动时的白屏 let measuredRowH = 0; // 实测行高(渲染后回写),CSS/字体/缩放变化都能自动适应 let _lastRange = ''; // 上次可视窗口签名(start:end:total:rh),未变化则跳过重绘,消除滚动闪烁 let _dropAnim = true; // 仅"数据/排序/搜索变更"的强制重绘才让新行播放落入动画;滚动复用 DOM 时不重播,避免滑动时一行行闪 function renderVirtualRows(tb, rows, force) { const prevDrop = _dropAnim; _dropAnim = !!force; // 滚动复用(force=false)时关闭落入动画,节点重建不再触发 replay try { const scroller = tb.closest('.table-scroll'); if (!scroller) { // 兜底:找不到滚动容器时退回全量渲染 tb.innerHTML = rows.map(rowHtml).join(''); return; } const scrollTop = scroller.scrollTop; const viewH = scroller.clientHeight; const total = rows.length; const rh = measuredRowH || ROW_H_FALLBACK; let start = Math.floor(scrollTop / rh) - VS_OVERSCAN; let end = Math.ceil((scrollTop + viewH) / rh) + VS_OVERSCAN; if (start < 0) start = 0; if (end > total) end = total; if (start >= end) start = Math.max(0, end - 1); // 可视窗口未变(含小幅滚动仍在 overscan 内)→ 直接复用现有 DOM: // 避免每帧重写 innerHTML 触发整块重绘,这是"滑一下闪一下"的根源。 const range = start + ':' + end + ':' + total + ':' + rh; if (!force && range === _lastRange && tb.firstChild) return; _lastRange = range; const frag = []; if (start > 0) { frag.push(''); } for (let i = start; i < end; i++) { frag.push(rowHtml(rows[i])); } if (end < total) { frag.push(''); } tb.innerHTML = frag.join(''); // 渲染后回写真实行高:换字体、改样式、页面缩放时窗口定位都不会漂移。 // 仅在尚未测量时回写一次,避免滚动中反复改动行高导致 spacer 高度抖动(也会造成观感闪烁)。 if (measuredRowH === 0) { const tr0 = tb.querySelector('tr[data-sid]'); if (tr0) { const h = tr0.offsetHeight; if (h > 12 && h < 300) measuredRowH = h; } } } finally { _dropAnim = prevDrop; } } window.addEventListener('resize', () => { measuredRowH = 0; _lastRange = ''; }); /** 供滚动监听调用:滚动时重算可视窗口(不重新排序,直接复用 state._sorted) */ function onTableScroll() { const tb = $('#tbody'); const rows = state._sorted; if (!tb || !rows || !rows.length) return; renderVirtualRows(tb, rows); } function renderAbsent() { const clsFilter = $('#clsSel').value; const grpFilter = $('#grpSel').value; // 与统计卡片保持一致:缺考 = 过滤后名单中未出现在提交记录里的学生(按 sid 匹配) const rowsForCls = clsFilter ? state.rows.filter(r => (r.cls || '') === clsFilter) : state.rows; const rowsForGrp = grpFilter ? rowsForCls.filter(r => (r.grp || '') === grpFilter) : rowsForCls; const submittedSids = new Set(rowsForGrp.map(r => r.sid).filter(Boolean)); const rosterForCls = clsFilter ? (state.roster || []).filter(s => (s.cls || '') === clsFilter) : (state.roster || []); const rosterForGrp = grpFilter ? rosterForCls.filter(s => (s.grp || '') === grpFilter) : rosterForCls; const list = rosterForGrp.filter(s => !submittedSids.has(s.sid)); state._absentList = list; // 供复制/打印按钮使用 const tb = $('#absentBody'); if (!list.length) { tb.innerHTML = '' + (clsFilter ? '本班全部已提交 🎉' : '全部已提交 🎉') + ''; } else { tb.innerHTML = list.map(a => '' + esc(a.sid) + '' + esc(a.name) + '' + esc(a.cls || '') + '' + esc(a.grp || '') + '').join(''); } // 按班统计缺考人数(未按班级筛选时显示概览) const hint = $('#absentHint'); if (hint) { const wlNote = state.whitelistDriven ? ('白名单应考 ' + (state.whitelistTotal || list.length) + ' 人 · ') : ''; if (!clsFilter && list.length) { const byCls = {}; list.forEach(a => { const c = (a.cls || '未分班'); byCls[c] = (byCls[c] || 0) + 1; }); const parts = Object.keys(byCls).sort().map(c => c + ' ' + byCls[c] + ' 人'); hint.textContent = wlNote + '共 ' + list.length + ' 人 · ' + parts.join(' '); } else { hint.textContent = wlNote + (list.length ? '共 ' + list.length + ' 人' : ''); } } } function renderUnmatched() { const tb = $('#unmatchedBody'); const hint = $('#unmatchedHint'); if (hint) { hint.textContent = state.unmatched.length ? ('共 ' + state.unmatched.length + ' 份 · 姓名与名单对不上,核对后可点「加入名单」补录') : '姓名不在名单中'; } if (!state.unmatched.length) { tb.innerHTML = '无'; return; } tb.innerHTML = state.unmatched.map(u => '' + '' + esc(u.name) + '' + '' + (u.score == null ? '-' : u.score) + '' + '' + esc(u.submit_at) + '' + '').join(''); } /* 历史成绩弹窗(主统计页成绩明细):任意成员都可点开,含只考过 1 次的 */ function openAttemptsModal(sid) { const r = (state.rows || []).find(x => String(x.sid) === String(sid)); if (!r) return; const attempts = (r.attempts || 1); let list = r.attempts_list || []; if (!list.length) { // 后端未返回明细时,用代表行兜底成一条 list = [{ idx: 1, is_best: true, score: r.score, submit_at: r.submit_at, submit_ts: r.submit_ts || r.last_submit_ts || 0, duration_txt: r.duration_txt, temp_save: !!r.temp_save, day: '', day_best: false, day_count: 1, }]; } // 新 -> 旧 展示(缺 submit_ts 时按 idx 倒序兜底,保证"次序"看起来合理) const desc = list.slice().sort((a, b) => { const ta = a.submit_ts || 0, tb = b.submit_ts || 0; if (ta !== tb) return tb - ta; return (b.idx || 0) - (a.idx || 0); }); // 按「提交时间年月日」分组:新的一天在前。 // 日期键由后端按服务端本地时区算好(a.day),这里仅兜底;时间未知的(ts=0)key 为 '', // 且排序里排最后,天然连续落在末尾 → 归入「未知时间」组。 const groups = []; desc.forEach(a => { const key = a.day || (a.submit_at && a.submit_at !== '-' ? String(a.submit_at).slice(0, 10) : '') || ''; let g = groups.length ? groups[groups.length - 1] : null; if (!g || g.key !== key) { g = { key: key, items: [] }; groups.push(g); } g.items.push(a); }); // 每组的最高分(未判分不参与),用于分组行显示「最高 X 分」 groups.forEach(g => { g.max = g.items.reduce( (m, a) => (a.score == null ? m : (m == null || Number(a.score) > m ? Number(a.score) : m)), null); }); const rows = groups.map(g => { const maxTxt = (g.max == null) ? '' : ' · 最高 ' + g.max + ' 分'; let html = '' + esc(g.key || '未知时间') + '共 ' + g.items.length + ' 次' + maxTxt + ''; html += g.items.map(a => { const sc = (a.score == null) ? '未判分' : esc(a.score); const best = (a.is_best && attempts > 1) ? ' 最佳' : ''; // 当日最高:仅当天有多次提交时才标,避免"一天只考一次"时每行都挂标签、反而看不出重点 const dayBest = (a.day_best && (a.day_count || 0) >= 2) ? ' 当日最高' : ''; const tmp = a.temp_save ? ' 暂存' : ''; // 时间未知(submit_ts=0)时无从判断先后,次序显示 '-',而不是误报"第 1 次" const noTxt = (attempts > 1 && a.submit_ts) ? ('第 ' + (a.idx || 1) + ' 次') : '-'; return '' + '' + noTxt + '' + '' + esc(a.submit_at || '-') + '' + '' + sc + best + dayBest + tmp + '' + '' + esc(a.duration_txt || '-') + '' + ''; }).join(''); return html; }).join(''); const bestScore = (r.best_score == null) ? r.score : r.best_score; $('#attTitle').textContent = (r.name || '') + '(' + r.sid + ') · 共 ' + attempts + ' 次考试' + (bestScore == null ? '' : ' · 最高 ' + bestScore + ' 分'); $('#attBody').innerHTML = '' + '' + '' + '' + '' + '' + rows + '
次序提交时间成绩考试时长
'; $('#attemptsModal').classList.add('open'); } /* ---------------- 自动刷新 ---------------- */ // 失败退避:连续失败时延长下次刷新间隔(1x → 2x → 4x,封顶 8x),成功后复位。 // 用 setTimeout 链而非 setInterval,便于动态调整间隔;后台标签页暂停刷新,回到前台立即补一次。 function schedule() { if (state.timer) { clearTimeout(state.timer); state.timer = null; } // 鉴权失败已停止自动刷新(handleAuthError),别再排下一轮把用户反复踢走 if (state._authStopped) return; if (!$('#autoRefresh').checked) return; const base = (parseInt($('#intervalSel').value, 10) || 15) * 1000; const backoff = Math.min(8, Math.pow(2, state.connFail)) * base; const delay = (document.hidden ? Math.max(backoff, 5000) : backoff); state.timer = setTimeout(() => { refresh(true); }, delay); } /* ---------------- 新数据高亮自动清除 ---------------- */ // 绿色高亮用于标记"有更新的成员",停留更易察觉(不再只闪一下), // 但长时间堆积会失去重点——故每 hlAutoClearSec 秒自动清除一次。 function startHlAutoClear() { if (state.hlTimer) clearInterval(state.hlTimer); const sec = state.hlAutoClearSec || 30; state.hlTimer = setInterval(() => { if (state.highlight.size === 0) return; // 无高亮时不打扰 state.highlight = new Set(); renderTable(); renderHlBadge(); }, sec * 1000); } /* ---------------- 全屏 ---------------- */ function toggleFullscreen() { const el = document.documentElement; if (!document.fullscreenElement && !document.webkitFullscreenElement) { const req = el.requestFullscreen || el.webkitRequestFullscreen; if (req) { const p = req.call(el); // 部分浏览器返回 Promise,被拒绝时静默吞掉会让用户以为"点了没反应" if (p && typeof p.catch === 'function') { p.catch(() => { showAlert('当前浏览器/环境不允许进入全屏,请按 F11 手动切换', 'warn'); }); } } } else { // exitFullscreen 挂在 document 上(documentElement.exitFullscreen 恒为 undefined) const exit = document.exitFullscreen || document.webkitExitFullscreen; if (exit) { const p = exit.call(document); if (p && typeof p.catch === 'function') p.catch(() => {}); } } } function onFsChange() { const on = !!(document.fullscreenElement || document.webkitFullscreenElement); document.body.classList.toggle('fs-on', on); const btn = $('#btnFullscreen'); if (btn) btn.textContent = on ? '⛶ 退出全屏' : '⛶ 全屏'; } /* ---------------- 布局切换 ---------------- */ function applyLayout(mode) { const m = (mode === 'side') ? 'side' : 'default'; const lay = document.getElementById('dataLayout'); if (lay) lay.setAttribute('data-layout', m); LS.set(LS_LAYOUT, m); } /* ---------------- 设置 ---------------- */ async function openSettings() { try { const c = await api('config_get'); if (c.csrf_token) state.csrf = c.csrf_token; $('#cfgPageSize').value = c.page_size || 200; $('#cfgInterval').value = c.refresh_interval || 15; $('#cfgTimeout').value = c.timeout || 20; $('#cfgKeywords').value = c.name_keywords || '姓名'; $('#cfgDedupe').checked = !!c.dedupe; $('#cfgTemp').checked = !!c.include_temp_save; $('#cfgSsl').checked = !!c.verify_ssl; // 布局 const layout = c.layout || LS.get(LS_LAYOUT, 'default'); (document.querySelector('input[name=cfgLayout][value="' + layout + '"]') || {}).checked = true; // 全局默认满分 / 合格率(每卷的独立配置移到主页面「试卷设置」) $('#cfgFull').value = c.full_score || 100; if ($('#cfgPassRate')) $('#cfgPassRate').value = (c.pass_rate == null ? 60 : c.pass_rate); // 历史成绩展示方式 + 导出排序 state.historyDisplay = (c.history_display === 'inline') ? 'inline' : 'click'; state.exportSort = (c.export_sort === 'sid') ? 'sid' : ((c.export_sort === 'score_desc') ? 'score_desc' : ((c.export_sort === 'score_asc') ? 'score_asc' : 'time')); $('#cfgHistoryDisplay').value = state.historyDisplay; $('#cfgExportSort').value = state.exportSort; if ($('#exportSortSel')) $('#exportSortSel').value = state.exportSort; // 连接信息(地址 / 前缀 / 账号可编辑;密码不回显) $('#cfgBase').value = c.base_url || ''; if ($('#cfgPrefix')) $('#cfgPrefix').value = c.api_prefix || '/api'; $('#cfgUser').value = c.username || ''; $('#cfgPass').value = ''; const conn = c.db_configured ? (c.db_connected ? '数据库:已连接 (' + (c.db_driver || '') + ')' : ('数据库:未连接 · ' + (c.db_error || '未知错误'))) : '数据库:未配置(使用文件存储)'; $('#cfgConnInfo').textContent = '配置来源:' + (c.storage || 'default') + ' · ' + conn; $('#pingResult').classList.add('hidden'); } catch (e) { showAlert(e.message); } $('#settingsModal').classList.add('open'); } /* ---------------- 名单 ---------------- */ let rosterDraft = []; const rosterSel = new Set(); // 勾选待删除的行下标(对应 rosterDraft 索引) // 更新「删除选中」按钮的可见性与计数 function updateDelSelBtn() { const btn = $('#btnDelSel'); if (!btn) return; btn.hidden = (rosterSel.size === 0); btn.textContent = '删除选中' + (rosterSel.size > 0 ? '(' + rosterSel.size + ')' : ''); } async function openRoster() { try { const d = await api('roster'); rosterDraft = d.students || []; renderRoster(); $('#rosterMeta').textContent = '共 ' + rosterDraft.length + ' 人' + (d.meta && d.meta.updated_at ? ' · 更新于 ' + d.meta.updated_at : ''); } catch (e) { showAlert(e.message); } $('#rosterModal').classList.add('open'); } function renderRoster() { const kw = $('#rosterSearch').value.trim().toLowerCase(); const rows = rosterDraft.filter(r => !kw || String(r.sid).toLowerCase().includes(kw) || String(r.name).toLowerCase().includes(kw)); const tb = $('#rosterBody'); if (!rows.length) { tb.innerHTML = '暂无名单,请上传文件'; $('#btnDelSel').hidden = true; return; } tb.innerHTML = rows.map((r, i) => { const gi = rosterDraft.indexOf(r); const checked = rosterSel.has(gi) ? ' checked' : ''; return '' + '' + '' + '' + '' + ''; }).join(''); updateDelSelBtn(); } /* ---------------- 事件绑定 ---------------- */ document.addEventListener('DOMContentLoaded', function () { $('#btnRefresh').addEventListener('click', () => refresh(false, true)); $('#btnSettings').addEventListener('click', openSettings); $('#btnRoster').addEventListener('click', openRoster); $('#btnFullscreen').addEventListener('click', toggleFullscreen); document.addEventListener('fullscreenchange', onFsChange); if (document.webkitFullscreenEnabled === undefined && !document.documentElement.requestFullscreen && !document.documentElement.webkitRequestFullscreen) { $('#btnFullscreen').style.display = 'none'; } // 搜索框防抖:连续输入时只渲染最后一次,避免每个字符都全量重排 $('#kw').addEventListener('input', () => { if (state._kwDebounce) clearTimeout(state._kwDebounce); state._kwDebounce = setTimeout(() => { renderTable(); }, 200); }); $('#clsSel').addEventListener('change', () => { populateGroups(); rememberFilters(); renderStats(); renderTable(); renderAbsent(); renderHints(); }); $('#grpSel').addEventListener('change', () => { rememberFilters(); renderStats(); renderTable(); renderAbsent(); renderHints(); }); $('#nameFieldSel').addEventListener('change', () => { state.prevMap = {}; state.prevSids = new Set(); state.hasPrev = false; state.highlight = new Set(); // 换了姓名题,旧高亮无意义 LS.set(LS_LASTQID, $('#nameFieldSel').value || ''); refresh(); }); $('#projectSel').addEventListener('change', () => { // 切换项目后清掉前一项目的 prevMap 与高亮缓存 state.prevMap = {}; state.prevSids = new Set(); state.hasPrev = false; state.highlight = new Set(); // 换项目,绿色高亮归零 // 用缓存数据先快速渲染,再后台拉新数据 refresh(); }); $('#intervalSel').addEventListener('change', () => { LS.set(LS_INTERVAL, parseInt($('#intervalSel').value, 10) || 15); schedule(); }); $('#autoRefresh').addEventListener('change', e => { if (e.target.checked) { schedule(); refresh(true); } else if (state.timer) { clearTimeout(state.timer); state.timer = null; } }); // 后台标签页暂停自动刷新(省流量/CPU);回到前台立即补一次并重置倒计时 document.addEventListener('visibilitychange', () => { if (document.hidden) { if (state.timer) { clearTimeout(state.timer); state.timer = null; } } else { if ($('#autoRefresh').checked) { refresh(true); schedule(); } } }); $$('#dataTable th.sortable').forEach(th => { th.addEventListener('click', () => { if (state.sortKey === th.dataset.k) state.sortAsc = !state.sortAsc; else { state.sortKey = th.dataset.k; state.sortAsc = true; } renderTable(); }); }); // 虚拟滚动:滚动成绩表时按需渲染可视窗口(throttle 到 rAF 避免高频抖动) (function () { const scroller = $('#tbody') && $('#tbody').closest('.table-scroll'); if (!scroller) return; let ticking = false; scroller.addEventListener('scroll', () => { if (ticking) return; ticking = true; requestAnimationFrame(() => { onTableScroll(); ticking = false; }); }); // 窗口尺寸变化(缩放/布局切换)时重算可视行 if (window.ResizeObserver) { new ResizeObserver(() => { if (!ticking) { ticking = true; requestAnimationFrame(() => { onTableScroll(); ticking = false; }); } }) .observe(scroller); } })(); /* 成绩明细行点击 → 历史成绩弹窗(事件委托,避免内联 onclick 找不到 IIFE 内函数) 注意:先绑 tbody 的 click,再绑 document 的 modal-close click;事件冒泡到 tbody 时就处理掉, 让 modal-close 只对弹窗自身 / [data-close] 元素生效,避免误关。 */ $('#tbody').addEventListener('click', e => { const tr = e.target.closest('tr[data-sid]'); if (!tr) return; // 仅响应"打开成员历史"动作;表头排序 sortable 在 #dataTable 上另行处理 if (tr.parentNode && tr.parentNode.id !== 'tbody') return; const sid = tr.getAttribute('data-sid'); if (sid) openAttemptsModal(sid); }); /* 清除高亮 */ $('#btnClearHl').addEventListener('click', () => { state.highlight = new Set(); renderTable(); renderHlBadge(); showAlert('已清除新数据高亮', 'info'); }); /* 导出排序切换(即时保存到服务端配置) */ $('#exportSortSel').addEventListener('change', async () => { state.exportSort = $('#exportSortSel').value; if ($('#cfgExportSort')) $('#cfgExportSort').value = state.exportSort; try { await api('config_save', { method: 'POST', body: { export_sort: state.exportSort } }); } catch (e) { /* 静默:本地已生效 */ } }); // 导出跟随当前班级 / 组别筛选(统计卡片与表格显示什么,就导出什么) $('#btnExport').addEventListener('click', () => { const pid = $('#projectSel').value; if (!pid) return showAlert('请先选择问卷 / 考试'); const cls = $('#clsSel').value, grp = $('#grpSel').value; const sort = (state.exportSort === 'sid') ? 'sid' : ((state.exportSort === 'score_desc') ? 'score_desc' : ((state.exportSort === 'score_asc') ? 'score_asc' : 'time')); // 导出提示文案(与排序方式对应,让用户看清"这次按什么排") const sortLabel = (sort === 'sid') ? '按学号' : (sort === 'score_desc') ? '按成绩降序' : (sort === 'score_asc') ? '按成绩升序' : '按提交时间'; const latest = ($('#exportLatest') && $('#exportLatest').checked) ? 'latest' : 'all'; const split = ($('#exportSplit') && $('#exportSplit').checked) ? 'cls' : ''; const qs = 'api.php?action=export&projectId=' + encodeURIComponent(pid) + '&nameQid=' + encodeURIComponent($('#nameFieldSel').value) + '&cls=' + encodeURIComponent(cls) + '&grp=' + encodeURIComponent(grp) + '&sort=' + sort + '&mode=' + latest + (split ? '&split=' + split : ''); location.href = qs; const modeLabel = (latest === 'latest') ? '(每人一行·最新成绩)' : '(每次考试一行)'; const splitLabel = (split === 'cls') ? ',按班级分表' : ''; showAlert(exportTip('成绩明细', cls, grp) + ',排序:' + sortLabel + splitLabel + modeLabel, 'info'); }); $('#btnExportAbsent').addEventListener('click', () => { const pid = $('#projectSel').value; if (!pid) return showAlert('请先选择问卷 / 考试'); const cls = $('#clsSel').value, grp = $('#grpSel').value; location.href = 'api.php?action=export_absent&projectId=' + encodeURIComponent(pid) + '&nameQid=' + encodeURIComponent($('#nameFieldSel').value) + '&cls=' + encodeURIComponent(cls) + '&grp=' + encodeURIComponent(grp); showAlert(exportTip('缺考名单', cls, grp), 'info'); }); /* ---------------- 多考试对比导出 ---------------- */ // 仅列出真正的"考试"(排除文件夹型项目,folder 或被其他项目作为父级引用) function nonFolderProjects() { const isFolder = p => (p.mode || '').toLowerCase().includes('folder'); const parentIds = new Set(); state.projects.forEach(p => { const pid = (p.parent_id || '0'); if (pid && pid !== '0' && pid !== '') parentIds.add(pid); }); const folderSet = new Set(); state.projects.forEach(p => { if (isFolder(p) || parentIds.has(p.id)) folderSet.add(p.id); }); return state.projects.filter(p => !folderSet.has(p.id)); } function renderMultiExportModal() { const body = $('#meBody'); const list = nonFolderProjects(); body.innerHTML = ''; if (!list.length) { body.innerHTML = '(暂无可导出的考试,请先在右上角刷新问卷列表)'; } else { const cur = $('#projectSel').value; list.forEach((p, i) => { const tr = document.createElement('tr'); const checked = (p.id === cur) ? ' checked' : ''; tr.innerHTML = '' + '' + (i + 1) + '' + '' + esc(p.name) + ''; body.appendChild(tr); }); } updMeMeta(); } function updMeMeta() { const n = $$('#meBody .me-chk').filter(c => c.checked).length; $('#meMeta').textContent = '已选 ' + n + ' 场'; const all = $$('#meBody .me-chk'); $('#meCheckAll').checked = all.length > 0 && all.every(c => c.checked); } $('#btnExportMulti').addEventListener('click', () => { if (!state.projects.length) return showAlert('请先刷新问卷列表'); renderMultiExportModal(); $('#multiExportModal').classList.add('open'); }); $('#meCheckAll').addEventListener('change', () => { $$('#meBody .me-chk').forEach(c => { c.checked = $('#meCheckAll').checked; }); updMeMeta(); }); $('#btnMeSelAll').addEventListener('click', () => { $$('#meBody .me-chk').forEach(c => { c.checked = true; }); $('#meCheckAll').checked = true; updMeMeta(); }); $('#btnMeClear').addEventListener('click', () => { $$('#meBody .me-chk').forEach(c => { c.checked = false; }); $('#meCheckAll').checked = false; updMeMeta(); }); $('#meBody').addEventListener('change', e => { if (e.target && e.target.classList.contains('me-chk')) updMeMeta(); }); $('#btnMeExport').addEventListener('click', () => { const ids = $$('#meBody .me-chk').filter(c => c.checked).map(c => c.value); if (!ids.length) return showAlert('请至少勾选一场考试'); const scoreMode = (document.querySelector('input[name=meScoreMode]:checked') || {}).value || 'latest'; const qs = 'api.php?action=export_multi&projectIds=' + encodeURIComponent(ids.join(',')) + '&nameQid=' + encodeURIComponent($('#nameFieldSel').value) + '&scoreMode=' + encodeURIComponent(scoreMode) + '&sort=sid'; $('#multiExportModal').classList.remove('open'); location.href = qs; showAlert('正在导出 ' + ids.length + ' 场考试成绩对比(' + (scoreMode === 'highest' ? '最高成绩' : '最新成绩') + ',按学号排序)', 'info'); }); /* 弹窗关闭:只关最上层那一个(新增学生等弹窗是叠在名单管理之上的, 关全部会连带把底层弹窗一起关掉,不符合预期) */ function closeTopModal() { const open = $$('.modal.open'); if (!open.length) return false; open[open.length - 1].classList.remove('open'); return true; } document.addEventListener('click', e => { if (e.target.matches('[data-close]') || e.target.classList.contains('modal')) { closeTopModal(); } }); // Esc 关闭最上层弹窗 document.addEventListener('keydown', e => { if (e.key === 'Escape' || e.key === 'Esc') closeTopModal(); }); /* 设置保存 */ $('#btnSaveCfg').addEventListener('click', async () => { const btnSave = $('#btnSaveCfg'); btnSave.disabled = true; btnSave.textContent = '保存中…'; const pass = $('#cfgPass').value; const payload = { page_size: parseInt($('#cfgPageSize').value, 10) || 200, refresh_interval: parseInt($('#cfgInterval').value, 10) || 15, timeout: parseInt($('#cfgTimeout').value, 10) || 20, name_keywords: $('#cfgKeywords').value.trim(), dedupe: $('#cfgDedupe').checked, include_temp_save: $('#cfgTemp').checked, verify_ssl: $('#cfgSsl').checked, full_score: parseInt($('#cfgFull').value, 10) || 100, pass_rate: (function () { const v = $('#cfgPassRate') ? parseFloat($('#cfgPassRate').value) : NaN; return (isNaN(v) || v < 1 || v > 100) ? 60 : v; })(), layout: (document.querySelector('input[name=cfgLayout]:checked') || {}).value || 'default', base_url: $('#cfgBase').value.trim(), api_prefix: ($('#cfgPrefix') ? $('#cfgPrefix').value.trim() : '/api') || '/api', username: $('#cfgUser').value.trim(), history_display: $('#cfgHistoryDisplay').value, export_sort: $('#cfgExportSort').value, }; if (pass !== '') payload.password = pass; // 留空 = 不修改 let resp; try { resp = await api('config_save', { method: 'POST', body: payload }); } catch (e) { showAlert(e.message); btnSave.disabled = false; btnSave.textContent = '保存'; return; } $('#cfgPass').value = ''; // 提交后清空密码框 const note = (resp && resp.conn_changed) ? '账号/连接已更新' : '设置已保存'; if (resp && resp.ping) { if (resp.ping.ok) { showAlert(note + ',测连接成功(' + resp.ping.projects + ' 个项目 / ' + resp.ping.elapsed + 'ms)', 'info'); } else { showAlert(note + ',但测连接失败:' + resp.ping.msg, 'error'); } } else { showAlert(note, 'info'); } // 应用布局偏好(写入容器 + localStorage) applyLayout(payload.layout); const iv = payload.refresh_interval; const opts = $$('#intervalSel option').map(o => parseInt(o.value, 10)); let best = opts[0]; opts.forEach(v => { if (Math.abs(v - iv) < Math.abs(best - iv)) best = v; }); $('#intervalSel').value = String(best); schedule(); // 仅连接信息变化时才重新加载项目列表(避免非连接设置保存触发破坏性刷新) if (resp && resp.conn_changed) { loadProjects(); } // 展示方式可能变化 → 立即重渲染表格(不重新拉数据) state.historyDisplay = payload.history_display; state.exportSort = payload.export_sort; if ($('#exportSortSel')) $('#exportSortSel').value = state.exportSort; renderTable(); // ping 失败时保留弹窗,让用户能立即改回 if (!resp || !resp.ping || resp.ping.ok) { $('#settingsModal').classList.remove('open'); } btnSave.disabled = false; btnSave.textContent = '保存'; }); /* 独立测试连接(使用弹窗内尚未保存的账号/密码,不落盘) */ async function testConnection() { const btn = $('#btnTestConn'); const box = $('#pingResult'); if (!btn || !box) return; btn.disabled = true; btn.textContent = '测试中…'; box.classList.remove('hidden', 'err'); box.classList.add('loading'); box.textContent = '正在连接卷王系统测试…'; try { // 全部连接字段都从弹窗当前值取(未保存也能测) const r = await api('config_test', { method: 'POST', body: { base_url: $('#cfgBase').value.trim(), api_prefix: ($('#cfgPrefix') ? $('#cfgPrefix').value.trim() : '/api') || '/api', username: $('#cfgUser').value.trim(), password: $('#cfgPass').value, verify_ssl: $('#cfgSsl').checked } }); box.classList.remove('loading'); if (r && r.connected) { box.classList.remove('err'); box.textContent = '✅ 连接成功:检测到 ' + r.projects + ' 个问卷 / 用时 ' + r.elapsed + 'ms'; } else { box.classList.add('err'); box.textContent = '❌ 连接失败:' + ((r && r.msg) || '未知错误'); } } catch (e) { box.classList.remove('loading'); box.classList.add('err'); box.textContent = '❌ 测试请求异常:' + e.message; } finally { btn.disabled = false; btn.textContent = '测试连接'; } } $('#btnTestConn').addEventListener('click', testConnection); // 收集"各试卷独立满分" -> {projectId: score} /* 名单上传 */ const zone = $('#dropZone'), fileInput = $('#rosterFile'); zone.addEventListener('click', () => fileInput.click()); zone.addEventListener('dragover', e => { e.preventDefault(); zone.classList.add('over'); }); zone.addEventListener('dragleave', () => zone.classList.remove('over')); zone.addEventListener('drop', e => { e.preventDefault(); zone.classList.remove('over'); if (e.dataTransfer.files.length) uploadRoster(e.dataTransfer.files[0]); }); fileInput.addEventListener('change', () => { if (fileInput.files.length) uploadRoster(fileInput.files[0]); fileInput.value = ''; }); async function uploadRoster(file) { const fd = new FormData(); fd.append('file', file); const mode = (document.querySelector('input[name=impMode]:checked') || {}).value || 'append'; fd.append('mode', mode); try { const d = await api('roster_import', { form: fd }); rosterDraft = d.students || []; renderRoster(); $('#rosterMeta').textContent = '共 ' + rosterDraft.length + ' 人 · 导入完成'; $('#rosterBadge').textContent = rosterDraft.length; } catch (e) { showAlert(e.message); } } $('#rosterSearch').addEventListener('input', renderRoster); // 下载名单导入模板(CSV,带 BOM 便于 Excel 正确识别 UTF-8) $('#btnTpl').addEventListener('click', () => { const header = ['学号', '姓名', '班级', '组别', '登陆账号']; const sample = ['2024001', '张三', '高一(1)班', 'A', 'zhangsan']; const csv = '' + [header.join(','), sample.join(',')].join('\r\n'); const blob = new Blob([csv], { type: 'text/csv;charset=utf-8' }); const a = document.createElement('a'); a.href = URL.createObjectURL(blob); a.download = '名单导入模板.csv'; document.body.appendChild(a); a.click(); a.remove(); setTimeout(() => URL.revokeObjectURL(a.href), 1000); }); // 新增学生:弹出表单,填写后追加(不再直接在表格底部插入空行) $('#btnAddRow').addEventListener('click', () => { $('#addSid').value = ''; $('#addName').value = ''; $('#addCls').value = ''; $('#addGrp').value = ''; $('#addLogin').value = ''; $('#addStudentHint').textContent = ''; $('#addStudentModal').classList.add('open'); $('#addSid').focus(); }); $('#btnAddStudentOk').addEventListener('click', () => { const sid = $('#addSid').value.trim(); const name = $('#addName').value.trim(); if (!sid || !name) { $('#addStudentHint').textContent = '学号和姓名必填'; return; } // 学号去重提示(不强制拦截,仅提醒) if (rosterDraft.some(s => String(s.sid).trim() === sid)) { $('#addStudentHint').textContent = '⚠️ 该学号已存在,仍会添加(请确认)'; } rosterDraft.push({ sid, name, cls: $('#addCls').value.trim(), grp: $('#addGrp').value.trim(), login: $('#addLogin').value.trim(), }); renderRoster(); $('#addStudentModal').classList.remove('open'); showAlert('已添加学生:' + sid + ' ' + name, 'info'); }); $('#btnClearRoster').addEventListener('click', async () => { if (!confirm('确定清空全部名单?此操作不可撤销。')) return; try { const d = await api('roster_clear', { method: 'POST' }); rosterDraft = []; rosterSel.clear(); renderRoster(); $('#rosterBadge').textContent = '0'; $('#rosterMeta').textContent = '共 0 人'; } catch (e) { showAlert(e.message); } }); // 删除选中(多选 + 二次确认) $('#btnDelSel').addEventListener('click', () => { const n = rosterSel.size; if (!n) return; if (!confirm('确定删除选中的 ' + n + ' 名学生?此操作需点击「保存名单」后才会落盘。')) return; const idx = Array.from(rosterSel).sort((a, b) => b - a); // 从大到小删,避免下标错位 idx.forEach(i => rosterDraft.splice(i, 1)); rosterSel.clear(); renderRoster(); showAlert('已删除 ' + n + ' 名学生(记得保存名单)', 'info'); }); // 全选 / 取消全选 $('#rosterCheckAll').addEventListener('change', e => { rosterSel.clear(); if (e.target.checked) { rosterDraft.forEach((_, i) => rosterSel.add(i)); } renderRoster(); }); $('#rosterBody').addEventListener('input', e => { const tr = e.target.closest('tr'); if (!tr) return; const i = parseInt(tr.dataset.i, 10); if (isNaN(i)) return; rosterDraft[i][e.target.dataset.f] = e.target.value; }); // 勾选 / 取消勾选(事件委托;input 事件会冒泡到这里时已被上面的 input 处理,这里只处理 checkbox) $('#rosterBody').addEventListener('change', e => { if (!e.target.classList || !e.target.classList.contains('roster-cb')) return; const i = parseInt(e.target.dataset.i, 10); if (isNaN(i)) return; if (e.target.checked) rosterSel.add(i); else rosterSel.delete(i); updateDelSelBtn(); }); $('#btnSaveRoster').addEventListener('click', async () => { try { const d = await api('roster_save', { method: 'POST', body: { students: rosterDraft } }); rosterDraft = d.students || []; renderRoster(); $('#rosterBadge').textContent = rosterDraft.length; $('#rosterMeta').textContent = '共 ' + rosterDraft.length + ' 人 · 已保存'; if ($('#projectSel').value) refresh(true); } catch (e) { showAlert(e.message); } }); /* 未匹配答卷 → 加入名单(映射到学号) */ let mapUmName = ''; $('#unmatchedBody').addEventListener('click', e => { const name = e.target.getAttribute && e.target.getAttribute('data-map'); if (name == null) return; mapUmName = name; $('#mapUmName').textContent = name; $('#mapUmSid').value = ''; $('#mapUmCls').value = ''; $('#mapUmGrp').value = ''; $('#mapUmHint').textContent = ''; $('#mapUnmatchedModal').classList.add('open'); $('#mapUmSid').focus(); }); $('#btnMapUmOk').addEventListener('click', async () => { const sid = $('#mapUmSid').value.trim(); if (!sid) { $('#mapUmHint').textContent = '请输入学号'; return; } try { const d = await api('unmatched_map', { method: 'POST', body: { name: mapUmName, sid, cls: $('#mapUmCls').value.trim(), grp: $('#mapUmGrp').value.trim(), }}); $('#mapUnmatchedModal').classList.remove('open'); showAlert('已将「' + mapUmName + '」映射到学号 ' + sid + ' 并加入名单', 'info'); if ($('#rosterBadge')) $('#rosterBadge').textContent = (d.students || []).length; // 刷新数据,让该答卷从「未匹配」归位到成绩明细 if ($('#projectSel').value) refresh(false, true); } catch (err) { showAlert(err.message); } }); function curPid() { return $('#projectSel').value; } /* 成绩明细打印:默认按成绩降序,可选按班级/组别分组对比 */ /* ============ 打印(统一出口) ============ * 用隐藏 iframe 输出而不是 window.open:不会被浏览器的弹窗拦截挡掉, * 也不会多开一个标签页。打印内容独立于页面排序,默认按成绩降序。 */ function printDoc(title, bodyHtml, opts) { opts = opts || {}; const orient = opts.orient === 'landscape' ? 'landscape' : 'portrait'; const css = '@page{size:A4 ' + orient + ';margin:14mm 10mm}' + 'html,body{margin:0;padding:0}' + 'body{font-family:"Microsoft YaHei","微软雅黑",sans-serif;color:#000;font-size:12px;line-height:1.5}' + 'h2{margin:0 0 6px;font-size:17px;text-align:center}' + '.sub{text-align:center;font-size:12px;color:#444;margin-bottom:4px}' + '.meta{font-size:11px;color:#444;margin:0 0 10px;padding-bottom:6px;border-bottom:1px solid #999}' + 'table{border-collapse:collapse;width:100%;font-size:11px;margin-bottom:8px}' + 'thead{display:table-header-group}' + // 跨页自动重复表头 'tr{page-break-inside:avoid}' + 'th,td{border:1px solid #555;padding:4px 6px;text-align:left;vertical-align:middle}' + 'th{background:#eaeaea;font-weight:700;white-space:nowrap}' + 'td.c,th.c{text-align:center}' + 'td.score{font-weight:700}' + 'td.fail{color:#b00}' + 'h3.grp{font-size:13px;margin:14px 0 5px;padding:5px 8px;background:#f2f2f2;border-left:4px solid #333;page-break-after:avoid}' + 'h3.grp small{font-weight:400;color:#555}' + '.sign{margin-top:16px;font-size:12px;color:#333;page-break-inside:avoid}' + '.foot{margin-top:8px;font-size:10px;color:#777;text-align:center}'; const html = '' + '' + esc(title) + '' + bodyHtml + ''; const old = document.getElementById('__nyPrintFrame'); if (old && old.parentNode) old.parentNode.removeChild(old); const f = document.createElement('iframe'); f.id = '__nyPrintFrame'; f.setAttribute('title', '打印'); f.style.cssText = 'position:fixed;right:0;bottom:0;width:0;height:0;border:0;visibility:hidden'; document.body.appendChild(f); const doc = f.contentWindow && f.contentWindow.document; if (!doc) { // 极端情况兜底 const w = window.open('', '_blank'); if (!w) return showAlert('打印失败,请允许弹窗后重试', 'error'); w.document.write(html); w.document.close(); return; } doc.open(); doc.write(html); doc.close(); setTimeout(function () { try { f.contentWindow.focus(); f.contentWindow.print(); } catch (e) { window.print(); } }, 250); } function printMetaLine(extra) { const cls = $('#clsSel').value, grp = $('#grpSel').value; const scope = [cls ? (cls + '班') : '', grp ? (grp + '组') : ''].filter(Boolean).join(' · '); return [ scope ? ('范围:' + scope) : '范围:全部', '打印时间:' + new Date().toLocaleString(), ].concat(extra || []).join(' | '); } // 展开每位学生的每次提交为独立一行(用于「打印全部记录」),与 buildRows 内的 expandAttempts 区分命名避免覆盖 function expandAttemptsForPrint(rows, desc) { const out = []; rows.forEach(r => { const list = (r.attempts_list || []); if (!list.length) { const one = Object.assign({}, r); one.idx = 1; one.is_best = true; out.push(one); return; } list.forEach(a => { out.push({ sid: r.sid, name: r.name, cls: r.cls, grp: r.grp, score: a.score, submit_ts: a.submit_ts, submit_at: a.submit_at, duration: a.duration, duration_txt: a.duration_txt, answer_id: a.answer_id, temp_save: a.temp_save, attempts: r.attempts, best_score: r.best_score, idx: a.idx, is_best: a.is_best, last_submit_ts: r.last_submit_ts, last_submit_at: r.last_submit_at, }); }); }); out.sort((x, y) => { let d = (y.submit_ts || 0) - (x.submit_ts || 0); if (!desc) d = -d; if (d !== 0) return d; const a = String(x.sid || ''), b = String(y.sid || ''); const na = /^\d+$/.test(a), nb = /^\d+$/.test(b); if (na && nb) return Number(a) - Number(b); return a.localeCompare(b, 'zh'); }); return out; } function printTable() { const scope = $('#ptScope').value; let rows = (scope === 'all') ? expandAttemptsForPrint(state._sorted || [], true) : (state._sorted || []).slice(); if (!rows.length) return showAlert('当前没有可打印的成绩', 'warn'); const sortMode = $('#ptSort').value; const groupBy = $('#ptGroup').value; // none | cls | grp const showRank = $('#ptRank').checked; const showAtt = $('#ptAttempts').checked; const showPass = $('#ptPass').checked; const withAbsent= $('#ptAbsent').checked; const orient = $('#ptOrient').value; const full = state.fullScore || 100; const passRate = (state.passRate == null ? 60 : state.passRate); const passLine = Math.round((passRate / 100) * full * 10) / 10; const sidCmp = (a, b) => String(a.sid || '').localeCompare(String(b.sid || ''), 'zh', { numeric: true }); // 排序:打印独立于页面排序;无成绩恒排末尾;同分按学号,便于核对 rows.sort((a, b) => { const an = (a.score == null), bn = (b.score == null); if (an && bn) return sidCmp(a, b); if (an) return 1; if (bn) return -1; if (sortMode === 'score_desc') return (b.score - a.score) || sidCmp(a, b); if (sortMode === 'score_asc') return (a.score - b.score) || sidCmp(a, b); if (sortMode === 'sid') return sidCmp(a, b); return ((b.submit_ts || 0) - (a.submit_ts || 0)) || sidCmp(a, b); // time }); const passOf = r => (r.score != null && r.score >= passLine); const statOf = list => { const sc = list.map(r => r.score).filter(v => v != null); const avg = sc.length ? (sc.reduce((x, y) => x + y, 0) / sc.length) : null; const pass = list.filter(passOf).length; return { n: list.length, avg: avg == null ? '—' : avg.toFixed(1), max: sc.length ? Math.max.apply(null, sc) : '—', min: sc.length ? Math.min.apply(null, sc) : '—', pass: pass, passRate: list.length ? Math.round(pass / list.length * 1000) / 10 : 0, }; }; const head = '' + (showRank ? '名次' : '') + '学号姓名' + (groupBy === 'none' ? '班级组别' : '') + '成绩' + (showPass ? '是否合格' : '') + (showAtt ? '考试次数' : '') + '提交时间'; // 名次:整份名单连续编号(分组时也连续),无成绩不参与排名 let seq = 0; const renderRows = list => list.map(r => { const ranked = (r.score != null); if (ranked) seq++; const ok = passOf(r); return '' + (showRank ? '' + (ranked ? seq : '—') + '' : '') + '' + esc(r.sid || '') + '' + '' + esc(r.name || '') + '' + (groupBy === 'none' ? '' + esc(r.cls || '') + '' + esc(r.grp || '') + '' : '') + '' + (r.score == null ? '—' : r.score) + '' + (showPass ? '' + (r.score == null ? '—' : (ok ? '合格' : '不合格')) + '' : '') + (showAtt ? '' + (r.attempts || 1) + '' : '') + '' + esc(r.submit_at || '—') + ''; }).join(''); let html = ''; if (groupBy === 'none') { html = '' + head + '' + renderRows(rows) + '
'; } else { const keyOf = (groupBy === 'cls') ? (r => (r.cls || '未分班')) : (r => (r.grp || '未分组')); const groups = {}; rows.forEach(r => { const k = keyOf(r); (groups[k] = groups[k] || []).push(r); }); Object.keys(groups).sort((a, b) => String(a).localeCompare(String(b), 'zh', { numeric: true })) .forEach(k => { const list = groups[k]; const st = statOf(list); html += '

' + esc(k) + ' (' + st.n + ' 人 · 平均 ' + st.avg + ' · 最高 ' + st.max + ' · 最低 ' + st.min + ' · 合格 ' + st.pass + ' 人 / ' + st.passRate + '%)

'; html += '' + head + '' + renderRows(list) + '
'; }); } const all = statOf(rows); const proj = state.projectName || ''; const title = ($('#ptTitle').value.trim() || (proj ? proj + ' 成绩明细' : '成绩明细')); let body = '

' + esc(title) + '

' + (proj ? '
' + esc(proj) + '
' : '') + '
' + esc(printMetaLine([ (scope === 'all' ? '共 ' + all.n + ' 条记录' : '共 ' + all.n + ' 人'), '平均 ' + all.avg, '最高 ' + all.max + ' / 最低 ' + all.min, '合格 ' + all.pass + ' 人(' + all.passRate + '%)', '合格线 ' + passLine + ' 分(满分的 ' + passRate + '%)', ])) + '
' + html; if (withAbsent) { const absent = state._absentList || []; body += '

缺考名单 (' + absent.length + ' 人)

'; if (!absent.length) { body += '

无缺考学生。

'; } else { body += '' + '' + absent.map(a => '').join('') + '
学号姓名班级组别备注
' + esc(a.sid || '') + '' + esc(a.name || '') + '' + esc(a.cls || '') + '' + esc(a.grp || '') + '
'; } } body += '
教师签字:____________  教研组长:____________  日期:____ 年 ____ 月 ____ 日
'; printDoc(title, body, { orient: orient }); showAlert('已调起打印,如未弹出请在打印对话框中选择正确打印机', 'info'); } $('#btnPrintTable').addEventListener('click', () => { if (!curPid()) return showAlert('请先选择问卷 / 考试'); const n = (state._sorted || []).length; const a = (state._absentList || []).length; $('#ptHint').textContent = '当前可打印 ' + n + ' 名学生的成绩' + (a ? '(可附带 ' + a + ' 名缺考学生)' : '') + ';弹窗中可切换为「打印全部记录」'; if (!$('#ptTitle').value.trim() && state.projectName) { $('#ptTitle').value = state.projectName + ' 成绩明细'; } $('#printTableModal').classList.add('open'); }); $('#btnPtPrint').addEventListener('click', () => { $('#printTableModal').classList.remove('open'); printTable(); }); /* 试卷独立设置(满分 / 合格率 / 免考名单)——仅对当前选中试卷生效 */ async function openProjCfg() { const pid = curPid(); if (!pid) return showAlert('请先选择问卷 / 考试'); const pname = (($('#projectSel').selectedOptions && $('#projectSel').selectedOptions[0]) || {}).textContent || ''; $('#projCfgSub').textContent = pname ? ('· ' + pname) : ''; try { const d = await api('project_config', { params: { projectId: pid } }); const cfg = d.cfg || {}, eff = d.effective || {}, g = d.global || {}; $('#pcFull').value = (cfg.full_score == null ? '' : cfg.full_score); $('#pcPassRate').value = (cfg.pass_rate == null ? '' : cfg.pass_rate); $('#pcExempt').value = (cfg.exempt || []).join('\n'); $('#pcFullHint').textContent = '当前生效:' + (eff.full_score || '-') + '(全局默认 ' + (g.full_score || '-') + ')'; $('#pcPassHint').textContent = '当前生效:' + (eff.pass_rate || '-') + '%(全局默认 ' + (g.pass_rate || '-') + '%)'; } catch (e) { showAlert(e.message); return; } $('#projCfgModal').classList.add('open'); } $('#btnProjCfg').addEventListener('click', openProjCfg); $('#btnPcSave').addEventListener('click', async () => { const pid = curPid(); if (!pid) return showAlert('请先选择问卷 / 考试'); try { await api('project_config_save', { method: 'POST', params: { projectId: pid }, body: { full_score: $('#pcFull').value.trim(), pass_rate: $('#pcPassRate').value.trim(), exempt: $('#pcExempt').value, }}); $('#projCfgModal').classList.remove('open'); showAlert('本卷设置已保存(仅对当前试卷生效)', 'info'); refresh(false, true); // 免考会改变名单/缺考口径,需强制重拉 } catch (e) { showAlert(e.message); } }); $('#btnPcReset').addEventListener('click', async () => { const pid = curPid(); if (!pid) return; if (!confirm('确定清除本卷的全部独立设置(恢复跟随全局默认)?')) return; try { await api('project_config_save', { method: 'POST', params: { projectId: pid }, body: { full_score: '', pass_rate: '', exempt: '', }}); $('#projCfgModal').classList.remove('open'); showAlert('本卷设置已清除', 'info'); refresh(false, true); } catch (e) { showAlert(e.message); } }); /* 缺考名单增强:复制学号 / 复制姓名 / 打印 */ function copyText(text, what) { const done = () => showAlert(what + '已复制到剪贴板', 'info'); const fail = () => showAlert('复制失败,请手动复制', 'error'); if (navigator.clipboard && navigator.clipboard.writeText) { navigator.clipboard.writeText(text).then(done, fail); } else { // 兜底:临时 textarea + execCommand const ta = document.createElement('textarea'); ta.value = text; ta.style.position = 'fixed'; ta.style.opacity = '0'; document.body.appendChild(ta); ta.select(); try { document.execCommand('copy'); done(); } catch (e) { fail(); } document.body.removeChild(ta); } } $('#btnCopySids').addEventListener('click', () => { const list = state._absentList || []; if (!list.length) return showAlert('当前没有缺考学生', 'warn'); copyText(list.map(a => a.sid).join(','), '学号'); }); $('#btnCopyNames').addEventListener('click', () => { const list = state._absentList || []; if (!list.length) return showAlert('当前没有缺考学生', 'warn'); copyText(list.map(a => a.name).join('、'), '姓名'); }); $('#btnPrintAbsent').addEventListener('click', () => { const list = (state._absentList || []).slice(); if (!list.length) return showAlert('当前没有缺考学生', 'warn'); const sidCmp = (a, b) => String(a.sid || '').localeCompare(String(b.sid || ''), 'zh', { numeric: true }); list.sort((a, b) => { const ac = String(a.cls || ''), bc = String(b.cls || ''); if (ac !== bc) return ac.localeCompare(bc, 'zh', { numeric: true }); return sidCmp(a, b); }); const proj = state.projectName || ''; const title = (proj ? proj + ' · ' : '') + '缺考名单(' + list.length + ' 人)'; const rowHtml = r => '' + esc(r.sid || '') + '' + esc(r.name || '') + '' + esc(r.cls || '') + '' + esc(r.grp || '') + ''; // 按班级分组,班内按学号;无班级时不分组 const hasCls = list.some(r => String(r.cls || '') !== ''); let body = ''; if (hasCls) { const groups = {}; list.forEach(r => { const k = String(r.cls || '未分班'); (groups[k] = groups[k] || []).push(r); }); Object.keys(groups).sort((a, b) => a.localeCompare(b, 'zh', { numeric: true })).forEach(k => { body += '

' + esc(k) + ' (' + groups[k].length + ' 人)

' + '' + '' + groups[k].map(rowHtml).join('') + '
学号姓名班级组别备注
'; }); } else { body = '' + '' + list.map(rowHtml).join('') + '
学号姓名班级组别备注
'; } const meta = '

' + esc(title) + '

' + (proj ? '
' + esc(proj) + '
' : '') + '
' + esc(printMetaLine(['共 ' + list.length + ' 人'])) + '
'; const sign = '
教师签字:____________  日期:____ 年 ____ 月 ____ 日
' + '
' + esc(NY.appName || '') + ' · 缺考名单,请核对后签字确认
'; printDoc(title, meta + body + sign, { orient: 'portrait' }); showAlert('已调起打印,如未弹出请在打印对话框中选择正确打印机', 'info'); }); /* 启动 */ // 1) 恢复布局偏好(仅样式,不涉及数据) applyLayout(LS.get(LS_LAYOUT, 'default')); // 2) 支持 ?projectId=xxx&nameQid=yyy 直接打开某份问卷 const qs = new URLSearchParams(location.search); if (qs.get('interval')) $('#intervalSel').value = qs.get('interval'); else { const iv = LS.get(LS_INTERVAL, 0); if (iv) { const opts = $$('#intervalSel option').map(o => parseInt(o.value, 10)); if (opts.indexOf(iv) >= 0) $('#intervalSel').value = String(iv); } } state.deeplinkProject = qs.get('projectId') || ''; state.deeplinkQid = qs.get('nameQid') || ''; // 退出登录:跳转到独立 logout.php(清服务端会话) $('#btnLogout').addEventListener('click', () => { location.href = 'logout.php'; }); // 3) 支持 index.php#roster 直接打开名单管理(随机抽取页的「名单管理」入口用) if (location.hash === '#roster') { openRoster(); if (history.replaceState) history.replaceState(null, '', location.pathname + location.search); } // 启动:主界面在 PHP 端已做会话校验(未登录会跳到 login.php),此处直接加载数据 schedule(); startHlAutoClear(); // 新数据高亮每 30s 自动清除一次 loadProjects(); // 4) 读取展示偏好(历史成绩展示方式 / 导出排序),避免必须打开设置弹窗才生效 (async () => { try { const c = await api('config_get'); if (c.csrf_token) state.csrf = c.csrf_token; // 提前拿到 CSRF token,写请求才能通过校验 state.historyDisplay = (c.history_display === 'inline') ? 'inline' : 'click'; state.exportSort = (c.export_sort === 'sid') ? 'sid' : ((c.export_sort === 'score_desc') ? 'score_desc' : ((c.export_sort === 'score_asc') ? 'score_asc' : 'time')); if ($('#cfgHistoryDisplay')) $('#cfgHistoryDisplay').value = state.historyDisplay; if ($('#cfgExportSort')) $('#cfgExportSort').value = state.exportSort; if ($('#exportSortSel')) $('#exportSortSel').value = state.exportSort; renderTable(); } catch (e) { /* 用默认值即可 */ } })(); }); })();