Files

94 lines
12 KiB
HTML
Raw Permalink Normal View History

2026-09-21 19:22:31 +08:00
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">
<title>沃林 · 学生管理系统</title><meta name="theme-color" content="#7c4bad">
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect width='40' height='40' rx='10' fill='%23322044'/%3E%3Ctext x='5' y='29' fill='%23dec5f5' font-size='28'%3EW%3C/text%3E%3C/svg%3E">
<link rel="stylesheet" href="/static/styles.css"><link rel="stylesheet" href="/static/workspace.css"><link rel="stylesheet" href="/static/ai.css"><link rel="stylesheet" href="/static/floating-assistant.css">
<script defer src="/static/app.js?v=employment-date-20260914-2"></script><script defer src="/static/ai.js"></script><script defer src="/static/floating-assistant.js"></script>
</head><body>
<aside class="sidebar"><a class="brand" href="#employment"><span class="brand-mark">W</span><span>沃林<span class="brand-sub">学生管理系统</span></span></a>
<div class="nav-label">工作空间</div><nav aria-label="主导航">
<a href="#students" class="nav-item"><span>▦</span>学生管理</a><a href="#classes" class="nav-item"><span>▥</span>班级管理</a>
<a href="#teachers" class="nav-item"><span>♧</span>教师管理</a><a href="#advisors" class="nav-item"><span>◎</span>顾问管理</a>
<a href="#scores" class="nav-item"><span>▧</span>成绩管理</a><a href="#employment" class="nav-item"><span>▤</span>就业管理</a>
<div class="nav-divider"></div><a href="#statistics" class="nav-item"><span>◴</span>统计分析</a><a href="#ai" class="nav-item"><span>✧</span>AI 助手<span class="ai-nav-badge">AI</span></a>
</nav><div class="side-bottom"><span class="side-dot"></span><div>学生成长工作台<small>教学管理 · 就业服务</small></div></div></aside>
<div class="workspace"><header class="topbar"><div class="crumb">学生发展中心 <span>/</span> <strong id="crumb-current">就业管理</strong></div><div class="top-actions"><span id="connection" class="connection">正在连接</span><a href="/docs" target="_blank" rel="noopener">接口文档 ↗</a><span class="avatar">沃</span></div></header>
<main><div class="page-heading"><div><div id="page-eyebrow" class="eyebrow">EMPLOYMENT WORKSPACE</div><h1 id="page-title">就业管理</h1><p id="page-description">记录每一次成长,跟进每一份职业机会。</p></div><button class="button primary" id="add-button">+ 新增就业信息</button></div>
<div id="page-error" class="error-banner" role="alert" hidden></div>
<section id="data-metrics" class="metrics" aria-label="实时数据概览"></section>
<section id="module-view" class="panel"><div class="panel-heading"><div><h2 id="list-title">就业信息</h2><span class="count-pill" id="record-count">— 条记录</span></div><div class="panel-actions"><button class="button subtle" id="ask-module">✧ 问问 AI</button><button class="button subtle" id="refresh-button">↻ 刷新数据</button></div></div>
<form id="filter-form" class="filter-bar"></form><div class="table-scroll"><table><thead id="table-head"></thead><tbody id="table-body"></tbody></table></div>
<div class="table-footer"><span id="list-summary">数据来自当前业务数据库</span><div class="pagination"><button class="icon-button" id="prev-page" aria-label="上一页">‹</button><span id="page-number">1 / 1</span><button class="icon-button" id="next-page" aria-label="下一页">›</button></div></div></section>
<section id="statistics-view" hidden><div class="insight-banner"><div><span class="eyebrow">DATA INSIGHTS</span><h2>从数据中,看见成长</h2><p>按班级、考试与就业情况比较,掌握每一段学习进程。</p></div><span class="insight-symbol">◴</span></div>
<div class="panel"><div class="panel-heading"><div><h2>统计分析</h2><span class="count-pill">实时计算</span></div><button class="button subtle" id="stats-refresh">↻ 刷新</button></div>
<form id="stats-form" class="stats-controls"><label>分析主题<select id="stats-kind"><option value="gender">班级性别分布</option><option value="class_scores">各班各次考试平均分</option><option value="score_rank">学生平均分排名</option><option value="fails">不及格次数统计</option><option value="salary">就业薪资排名</option><option value="duration">学生就业时长</option><option value="class_duration">各班平均就业时长</option><option value="teacher_classes">教师与班级关系</option></select></label><label id="stats-threshold-label" hidden>最少不及格次数<input id="stats-threshold" type="number" min="1" value="1"></label><button class="button primary">查看分析</button></form>
<p id="stats-note" class="stats-note"></p><div id="stats-chart" class="stats-chart"></div><div class="table-scroll"><table><thead id="stats-head"></thead><tbody id="stats-body"></tbody></table></div><div class="table-footer"><span id="stats-summary"></span><div class="pagination"><button class="icon-button" id="stats-prev" aria-label="统计上一页">‹</button><span id="stats-page">1 / 1</span><button class="icon-button" id="stats-next" aria-label="统计下一页">›</button></div></div></div></section>
<section id="ai-view" class="ai-layout" aria-label="AI助手" hidden>
<div class="ai-chat-panel">
<div class="ai-chat-header"><div class="ai-chat-identity"><span class="ai-emblem" aria-hidden="true">✧</span><div><h2>沃林 AI 助手</h2><small>全模块查询 · 关联分析 · 统计解答</small></div></div><button class="button subtle" id="ai-clear" type="button">清空问答</button></div>
<div id="ai-welcome" class="ai-welcome"><h3>今天想了解什么?</h3><p>用自然语言查询学生、班级、教师、顾问、成绩与就业信息,或了解项目需求。</p>
<div class="ai-suggestions"><button type="button" data-ai-question="查询每个班级的有效学生人数。">学生与班级<span>了解各班学生规模</span></button><button type="button" data-ai-question="查询所有有效教师和顾问的数量,并各列出前5条记录。">教师与顾问<span>查看教学与服务团队</span></button><button type="button" data-ai-question="按学生统计有效成绩的平均分,从高到低列出前5名。">考试成绩<span>掌握学习进展</span></button><button type="button" data-ai-question="查询有效就业记录中薪资最高的前3名学生,列出姓名、公司和薪资。">就业薪资<span>跟进职业发展</span></button><button type="button" data-ai-question="查询每个班级每次考试的平均分。">班级成绩分析<span>比较班级学习表现</span></button><button type="button" data-ai-question="查询教师ID为1的老师关联了哪些班级和学生。">教师关联<span>查看实际教学关系</span></button></div>
</div>
<p id="ai-empty-hint" class="ai-empty-hint">点击示例填入问题,再发送即可。</p>
<div id="ai-messages" class="ai-messages" role="log" aria-label="问答记录" aria-live="polite" aria-relevant="additions"></div>
<div id="ai-progress" class="ai-progress" role="status" hidden></div>
<form id="ai-form" class="ai-composer"><label for="ai-question">向 AI 助手提问</label><textarea id="ai-question" maxlength="2000" placeholder="例如:查询学生 ID 为 1 的就业信息。" required></textarea>
<div class="ai-composer-actions"><span><span id="ai-length">0 / 2000</span><small>Ctrl / ⌘ + Enter 发送</small></span><button class="button primary" id="ai-send" type="submit">发送问题 ↗</button></div>
<div id="ai-error" class="form-error" role="alert" hidden></div>
</form>
</div>
<aside class="ai-aside" aria-label="助手使用说明"><section class="ai-help"><h3>可以帮你做什么</h3><ul><li>查询六个模块的记录与关联信息</li><li>计算成绩、薪资排名和班级统计</li><li>解释系统功能与统计口径</li></ul><p>支持六个业务模块、教师关联关系与统计分析的只读查询。</p></section><section class="ai-help accent-help"><h3>让回答有据可查</h3><p id="ai-evidence-status">回答后可查看本次参考资料及实际查询结果。</p><p>每次问题独立处理,请写明学生或筛选条件。问答记录仅在当前页面保留,刷新后清空。</p></section></aside>
</section>
<footer class="page-footer"><span>沃林学生管理系统 · 让成长有迹可循</span><span id="last-update">正在获取最新数据</span></footer></main></div>
<dialog id="edit-dialog" aria-labelledby="edit-title"><form id="edit-form"><div class="dialog-heading"><div><span class="eyebrow">RECORD DETAILS</span><h2 id="edit-title"></h2></div><button type="button" class="icon-button" data-close="edit-dialog" aria-label="关闭表单">×</button></div><div class="dialog-body"><p id="edit-description" class="dialog-description"></p><div class="form-error" id="edit-error" role="alert" hidden></div><div id="edit-fields" class="form-grid"></div></div><div class="dialog-footer"><button type="button" class="button subtle" data-close="edit-dialog">取消</button><button class="button primary" id="save-button">保存信息</button></div></form></dialog>
<dialog id="delete-dialog" class="small-dialog" aria-labelledby="delete-title"><div class="dialog-body"><span class="delete-symbol">!</span><h2 id="delete-title">删除这条记录?</h2><p id="delete-description"></p><p class="field-hint">删除后将从有效列表隐藏,数据库记录仍保留。</p><div id="delete-error" class="form-error" role="alert" hidden></div></div><div class="dialog-footer"><button class="button subtle" data-close="delete-dialog">取消</button><button class="button danger" id="confirm-delete">确认删除</button></div></dialog>
<dialog id="detail-dialog" aria-labelledby="detail-title"><div class="dialog-heading"><h2 id="detail-title">记录详情</h2><button class="icon-button" data-close="detail-dialog" aria-label="关闭详情">×</button></div><div class="dialog-body" id="detail-content"></div></dialog>
<div class="toast" id="toast" role="status" hidden></div>
<section id="floating-ai-panel" class="floating-ai-panel" role="dialog" aria-modal="false" aria-labelledby="floating-ai-title" hidden>
<header class="floating-ai-header"><img src="/static/assets/assistant-avatar.png" alt=""><div><h2 id="floating-ai-title">沃林 AI 助手</h2><small>需求解答 · 真实数据查询</small></div><button id="floating-ai-close" class="icon-button" type="button" aria-label="收起快捷助手">×</button></header>
<div class="floating-ai-toolbar"><button id="floating-ai-clear" type="button">清空问答</button><button id="floating-ai-full" type="button">打开完整助手 ↗</button></div>
<div class="floating-ai-content"><div id="floating-ai-greeting" class="floating-ai-greeting"><strong>你好,有什么可以帮你?</strong>可以问我学生、班级、教师、顾问、成绩和就业信息。每次请写明要查询的对象。</div><div id="floating-ai-messages" role="log" aria-label="快捷问答记录" aria-live="polite" aria-relevant="additions"></div></div>
<div id="floating-ai-progress" class="floating-ai-progress" role="status" hidden>正在准备资料和回答,请稍候…</div>
<form id="floating-ai-form" class="floating-ai-form"><label for="floating-ai-question" class="floating-ai-label">快捷提问</label><textarea id="floating-ai-question" placeholder="例如:目前有多少条就业记录?" maxlength="1800" required></textarea><div id="floating-ai-error" class="floating-ai-error" role="alert" hidden></div><div><small><span id="floating-ai-count">0 / 1800</span> · Enter 发送,Shift + Enter 换行</small><button id="floating-ai-send" class="button" type="submit">发送 ↗</button></div></form>
</section>
<button id="floating-ai-trigger" class="floating-ai-trigger" type="button" aria-label="打开沃林AI快捷助手,可拖动头像调整位置" title="点击提问,拖动可移动位置" aria-controls="floating-ai-panel" aria-expanded="false"><img src="/static/assets/assistant-avatar.png" alt="" width="100" height="103"><span>问问 AI</span></button>
</body></html>