前端答辩级改造：错误中文化、证据弹窗可读化、图谱默认岗位子图、演化报告化、匹配60/40、六步导览
- cnFetch 统一网络层，业务化错误文案+原位重试，屏蔽内部文件名 - 证据弹窗：结论/来源平台·企业·日期/原文/命中依据+翻页 - 图谱默认 Java 岗位子图；详情面板四区块（结论/能力清单/近期变化/证据操作） - 演化页本期结论块（需求指数口径）+近8季默认视图 - 匹配页输入区 60/40 + 岗位信息卡 + 结论分档文案 + 缺口折叠 - 学习路径空状态引导+阶段语义化命名；六步导览浮动条 - tests/test_frontend_logic.js 21 用例
This commit is contained in:
RoyirinRosmontis
+60
-25
@@ -4,7 +4,7 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>CareerNexus 职联 · 岗位与能力图谱平台</title>
|
||||
<link rel="stylesheet" href="/static/style.css?v=20260803">
|
||||
<link rel="stylesheet" href="/static/style.css?v=20260813">
|
||||
</head>
|
||||
<body>
|
||||
<!-- ============ 顶部栏 56px ============ -->
|
||||
@@ -15,6 +15,12 @@
|
||||
</span>
|
||||
<span class="brand-name">CareerNexus <b>职联</b></span>
|
||||
</div>
|
||||
<div class="topbar-left-actions">
|
||||
<button class="btn btn-primary btn-sm" id="btn-demo-tour">
|
||||
<svg viewBox="0 0 24 24"><polygon points="6 3 20 12 6 21 6 3"/></svg>
|
||||
开始演示</button>
|
||||
<span class="demo-badge" id="demo-badge" title="运行状态（点击查看设置）"><i class="dot"></i><span id="demo-badge-text">演示模式</span></span>
|
||||
</div>
|
||||
<div class="page-title" id="page-title">数据驾驶舱</div>
|
||||
<div class="topbar-right">
|
||||
<div class="global-search">
|
||||
@@ -22,10 +28,6 @@
|
||||
<input id="global-search-input" type="text" placeholder="搜索岗位 / 技能 / 场景…" autocomplete="off">
|
||||
<div id="global-search-drop" class="search-drop hidden"></div>
|
||||
</div>
|
||||
<button class="btn btn-primary btn-sm" id="btn-demo-tour">
|
||||
<svg viewBox="0 0 24 24"><polygon points="6 3 20 12 6 21 6 3"/></svg>
|
||||
开始演示</button>
|
||||
<span class="demo-badge" id="demo-badge" title="运行状态（点击查看设置）"><i class="dot"></i><span id="demo-badge-text">演示模式</span></span>
|
||||
<span class="badge badge-version" id="data-version" title="图谱数据版本">数据版本 —</span>
|
||||
<button class="icon-btn" id="btn-config" title="系统设置" aria-label="系统设置">
|
||||
<svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 11-2.83 2.83l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 11-4 0v-.09a1.65 1.65 0 00-1-1.51 1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 11-2.83-2.83l.06-.06a1.65 1.65 0 00.33-1.82 1.65 1.65 0 00-1.51-1H3a2 2 0 110-4h.09a1.65 1.65 0 001.51-1 1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 112.83-2.83l.06.06a1.65 1.65 0 001.82.33h.01a1.65 1.65 0 001-1.51V3a2 2 0 114 0v.09a1.65 1.65 0 001 1.51h.01a1.65 1.65 0 001.82-.33l.06-.06a2 2 0 112.83 2.83l-.06.06a1.65 1.65 0 00-.33 1.82v.01a1.65 1.65 0 001.51 1H21a2 2 0 110 4h-.09a1.65 1.65 0 00-1.51 1z"/></svg>
|
||||
@@ -257,6 +259,10 @@
|
||||
<!-- 统计条 -->
|
||||
<div class="evo-stats" id="evo-stats"></div>
|
||||
|
||||
<!-- 本期结论（最近两个季度的新增/增强/减弱/退出） -->
|
||||
<div class="evo-chart-title text-aux text-secondary">本期结论（最近两个季度）</div>
|
||||
<div class="evo-summary" id="evo-summary"><div class="empty small">加载中…</div></div>
|
||||
|
||||
<!-- 时点对比器 -->
|
||||
<div class="evo-compare">
|
||||
<div class="evo-compare-head">
|
||||
@@ -280,8 +286,14 @@
|
||||
<div class="evo-chart-title text-aux text-secondary">技能生命周期（横条 = 技能在画像中的生效区间，圆点 = 变更事件）</div>
|
||||
<div class="evo-gantt" id="evo-gantt"></div>
|
||||
|
||||
<!-- 热度走势（限高） -->
|
||||
<div class="evo-chart-title text-aux text-secondary">技能热度走势（活跃技能关系数）</div>
|
||||
<!-- 热度走势（限高，默认近 8 个季度，纵轴为活跃技能关系数） -->
|
||||
<div class="evo-chart-title text-aux text-secondary evo-heat-head">
|
||||
<span>技能热度走势（纵轴：活跃技能关系数）</span>
|
||||
<span class="seg seg-sm" id="evo-heat-range">
|
||||
<button data-range="8" class="active">近 8 季</button>
|
||||
<button data-range="all">全部</button>
|
||||
</span>
|
||||
</div>
|
||||
<div class="evo-heat-wrap"><canvas id="evo-heat-canvas"></canvas></div>
|
||||
|
||||
<!-- 事件时间轴 -->
|
||||
@@ -306,22 +318,31 @@
|
||||
<div class="step" data-step="3"><i>3</i><span>诊断结果</span></div>
|
||||
</div>
|
||||
|
||||
<!-- 第 1 步 -->
|
||||
<!-- 第 1 步：60/40 布局（左：简历输入；右：目标岗位信息卡） -->
|
||||
<div class="match-pane" id="match-pane-1">
|
||||
<div class="form-row">
|
||||
<label class="form-label">目标岗位</label>
|
||||
<select id="match-job-select" class="select w-320"></select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label class="form-label">简历文本</label>
|
||||
<textarea id="resume-text" class="textarea" rows="10" placeholder="粘贴简历全文（将自动脱敏与技能抽取），或点击下方按钮上传 / 载入示例简历"></textarea>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<button class="btn btn-secondary" id="btn-load-sample">载入示例简历</button>
|
||||
<label class="btn btn-secondary" for="resume-file">上传简历文件</label>
|
||||
<input type="file" id="resume-file" accept=".txt,.md,.docx,.pdf" class="hidden">
|
||||
<span class="text-aux text-weak">支持 .txt / .docx / .pdf，≤5MB</span>
|
||||
<button class="btn btn-primary" id="btn-parse-resume">解析简历</button>
|
||||
<div class="match-input-grid">
|
||||
<div class="match-input-left">
|
||||
<div class="form-row">
|
||||
<label class="form-label">目标岗位</label>
|
||||
<select id="match-job-select" class="select w-320"></select>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<label class="form-label">简历文本</label>
|
||||
<textarea id="resume-text" class="textarea" rows="10" placeholder="粘贴简历全文（将自动脱敏与技能抽取），或点击下方按钮上传 / 载入示例简历"></textarea>
|
||||
</div>
|
||||
<div class="form-actions">
|
||||
<button class="btn btn-secondary" id="btn-load-sample">载入示例简历</button>
|
||||
<label class="btn btn-secondary" for="resume-file">上传简历文件</label>
|
||||
<input type="file" id="resume-file" accept=".txt,.md,.docx,.pdf" class="hidden">
|
||||
<span class="text-aux text-weak">支持 .txt / .docx / .pdf，≤5MB</span>
|
||||
<button class="btn btn-primary" id="btn-parse-resume">开始解析</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="match-input-right">
|
||||
<div class="job-info-card" id="match-job-info">
|
||||
<div class="text-weak text-aux">岗位信息加载中…</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -374,6 +395,7 @@
|
||||
<div class="gauge-text"><b id="gauge-score">0</b><span>综合匹配分</span></div>
|
||||
</div>
|
||||
<div class="match-verdict" id="match-verdict"></div>
|
||||
<div class="match-advice" id="match-advice"></div>
|
||||
<canvas id="radar-canvas" width="340" height="280"></canvas>
|
||||
</div>
|
||||
<div class="mrg-right">
|
||||
@@ -491,7 +513,8 @@
|
||||
<div class="path-flow" id="path-result">
|
||||
<div class="empty">
|
||||
<svg viewBox="0 0 24 24"><circle cx="6" cy="19" r="2.5"/><circle cx="18" cy="5" r="2.5"/><path d="M8 17.5C12 14 8 10 12 7.5c1.5-1 3-1.2 4-1.3"/></svg>
|
||||
<p>在左侧选择目标岗位并标记已掌握技能<br>点击「生成学习路径」查看分阶段路线</p>
|
||||
<p>尚未生成学习路径<br>先完成一次人岗诊断，再生成个性化路径（将自动带入岗位与技能缺口）</p>
|
||||
<button class="btn btn-primary btn-sm" id="path-goto-match">去完成人岗诊断</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -515,7 +538,19 @@
|
||||
</div>
|
||||
<div class="toast-wrap" id="toast-wrap"></div>
|
||||
|
||||
<script src="/static/app.js?v=20260803"></script>
|
||||
<script src="/static/graph.js?v=20260803"></script>
|
||||
<!-- 评委演示导览浮动条（右上角固定） -->
|
||||
<div class="tour-bar hidden" id="tour-bar">
|
||||
<span class="tour-prog" id="tour-prog">演示 1/6</span>
|
||||
<span class="tour-text">
|
||||
<b id="tour-title"></b>
|
||||
<span class="tour-desc" id="tour-desc"></span>
|
||||
</span>
|
||||
<button class="btn btn-secondary btn-sm" id="tour-prev">上一步</button>
|
||||
<button class="btn btn-primary btn-sm" id="tour-next">下一步</button>
|
||||
<button class="btn btn-text btn-sm" id="tour-exit">退出</button>
|
||||
</div>
|
||||
|
||||
<script src="/static/app.js?v=20260813"></script>
|
||||
<script src="/static/graph.js?v=20260813"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user