Co-authored-by: factory-droid[bot] <138933559+factory-droid[bot]@users.noreply.github.com>
370 lines
16 KiB
HTML
370 lines
16 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>供需会智能分析系统 — 架构图(Word粘贴版)</title>
|
||
<style>
|
||
body { font-family: "Microsoft YaHei", "PingFang SC", sans-serif; max-width: 800px; margin: 40px auto; color: #333; }
|
||
h2 { color: #1a5276; border-bottom: 2px solid #2980b9; padding-bottom: 6px; margin-top: 50px; }
|
||
h3 { color: #2c3e50; margin-top: 30px; }
|
||
|
||
/* 四层架构图 */
|
||
.arch-layer { border: 2px solid #2c3e50; border-radius: 6px; margin-bottom: 0; padding: 14px 16px; }
|
||
.arch-layer + .arch-layer { border-top: 2px dashed #7f8c8d; border-top-left-radius: 0; border-top-right-radius: 0; margin-top: -2px; }
|
||
.arch-layer:first-child { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
|
||
.layer-title { font-weight: bold; font-size: 15px; color: #fff; background: #2c3e50; display: inline-block; padding: 3px 12px; border-radius: 3px; margin-bottom: 10px; }
|
||
.layer-title.blue { background: #2980b9; }
|
||
.layer-title.green { background: #27ae60; }
|
||
.layer-title.orange { background: #e67e22; }
|
||
.layer-title.gray { background: #7f8c8d; }
|
||
|
||
.card-row { display: flex; gap: 10px; flex-wrap: wrap; }
|
||
.card { border: 1px solid #bdc3c7; border-radius: 4px; padding: 10px 14px; background: #f8f9fa; flex: 1; min-width: 150px; }
|
||
.card-title { font-weight: bold; font-size: 14px; color: #2c3e50; margin-bottom: 6px; }
|
||
.card ul { margin: 0; padding-left: 16px; font-size: 13px; color: #555; }
|
||
.card ul li { margin-bottom: 2px; }
|
||
|
||
.module-tag { display: inline-block; border: 1px solid #bdc3c7; border-radius: 4px; padding: 6px 14px; background: #f8f9fa; font-size: 13px; margin: 3px; text-align: center; }
|
||
|
||
/* 流程图 */
|
||
.flow { text-align: center; padding: 20px 0; }
|
||
.flow-step { display: inline-block; border: 2px solid #2980b9; border-radius: 6px; padding: 10px 20px; background: #ebf5fb; font-weight: bold; color: #1a5276; margin: 4px 0; }
|
||
.flow-step.green { border-color: #27ae60; background: #eafaf1; color: #1e8449; }
|
||
.flow-step.orange { border-color: #e67e22; background: #fef5e7; color: #ca6f1e; }
|
||
.flow-step.gray { border-color: #7f8c8d; background: #f2f3f4; color: #566573; }
|
||
.flow-arrow { display: block; font-size: 22px; color: #7f8c8d; line-height: 1.2; }
|
||
.flow-arrow-right { display: inline-block; font-size: 20px; color: #7f8c8d; margin: 0 6px; vertical-align: middle; }
|
||
.flow-branch { display: flex; justify-content: center; gap: 16px; margin: 6px 0; flex-wrap: wrap; }
|
||
.flow-sub { font-size: 12px; color: #777; margin-top: 2px; }
|
||
|
||
/* JD解析示例 */
|
||
.jd-box { border: 2px solid #2980b9; border-radius: 8px; overflow: hidden; max-width: 520px; margin: 0 auto; }
|
||
.jd-section { padding: 14px 18px; }
|
||
.jd-section.input { background: #fef9e7; border-bottom: 2px solid #2980b9; }
|
||
.jd-section.process { background: #2980b9; color: #fff; text-align: center; font-weight: bold; padding: 10px; font-size: 15px; }
|
||
.jd-section.output { background: #eafaf1; }
|
||
.jd-label { font-weight: bold; font-size: 13px; color: #7f8c8d; margin-bottom: 6px; }
|
||
.jd-text { font-size: 14px; line-height: 1.7; color: #333; }
|
||
.jd-result { font-size: 13px; line-height: 1.8; color: #333; }
|
||
.jd-result strong { color: #1a5276; }
|
||
|
||
/* 匹配示例表 */
|
||
.match-table { width: 100%; border-collapse: collapse; font-size: 14px; }
|
||
.match-table th { background: #2c3e50; color: #fff; padding: 10px; text-align: center; }
|
||
.match-table td { padding: 10px; border: 1px solid #ddd; text-align: center; }
|
||
.match-table tr:nth-child(even) { background: #f8f9fa; }
|
||
.tag-high { background: #27ae60; color: #fff; padding: 2px 10px; border-radius: 10px; font-size: 12px; }
|
||
.tag-mid { background: #f39c12; color: #fff; padding: 2px 10px; border-radius: 10px; font-size: 12px; }
|
||
.tag-low { background: #e74c3c; color: #fff; padding: 2px 10px; border-radius: 10px; font-size: 12px; }
|
||
.tag-gap { background: #8e44ad; color: #fff; padding: 2px 10px; border-radius: 10px; font-size: 12px; }
|
||
|
||
/* 课程建议示例 */
|
||
.advice-box { border: 2px solid #27ae60; border-radius: 8px; padding: 18px; background: #eafaf1; max-width: 600px; margin: 10px auto; }
|
||
.advice-title { font-weight: bold; color: #1e8449; font-size: 15px; margin-bottom: 10px; }
|
||
.advice-body { font-size: 14px; color: #333; line-height: 1.8; }
|
||
|
||
/* 能力图谱 */
|
||
.skill-table { width: 100%; border-collapse: collapse; font-size: 14px; }
|
||
.skill-table th { background: #1a5276; color: #fff; padding: 8px; text-align: center; }
|
||
.skill-table td { padding: 8px; border: 1px solid #ddd; text-align: center; }
|
||
.stars { color: #f39c12; letter-spacing: 2px; }
|
||
.cover-ok { color: #27ae60; font-weight: bold; }
|
||
.cover-partial { color: #f39c12; font-weight: bold; }
|
||
.cover-lack { color: #e74c3c; font-weight: bold; }
|
||
|
||
/* 部署架构 */
|
||
.deploy-box { border: 2px solid #2c3e50; border-radius: 8px; padding: 20px; background: #f8f9fa; max-width: 450px; margin: 0 auto; }
|
||
.deploy-title { text-align: center; font-weight: bold; color: #2c3e50; font-size: 15px; margin-bottom: 14px; border-bottom: 1px solid #bdc3c7; padding-bottom: 8px; }
|
||
|
||
/* 排期甘特 */
|
||
.gantt { width: 100%; border-collapse: collapse; font-size: 13px; }
|
||
.gantt th { background: #2c3e50; color: #fff; padding: 10px; text-align: center; width: 25%; }
|
||
.gantt td { padding: 12px; border: 1px solid #ddd; vertical-align: top; }
|
||
.gantt .ms-title { font-weight: bold; color: #1a5276; font-size: 14px; margin-bottom: 6px; }
|
||
.gantt .ms-sub { color: #7f8c8d; font-size: 12px; }
|
||
.gantt ul { margin: 6px 0 0 0; padding-left: 16px; }
|
||
.gantt ul li { margin-bottom: 3px; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<h2>图2.1 — 系统总体架构图</h2>
|
||
|
||
<div class="arch-layer">
|
||
<span class="layer-title blue">应用展示层</span>
|
||
<div class="card-row">
|
||
<div class="card">
|
||
<div class="card-title">学院工作台</div>
|
||
<ul><li>专业分析</li><li>报告导出</li><li>企业推荐</li><li>就业指导</li></ul>
|
||
</div>
|
||
<div class="card">
|
||
<div class="card-title">校级管理台</div>
|
||
<ul><li>全校总览</li><li>缺口汇总</li><li>材料导出</li><li>大屏管理</li></ul>
|
||
</div>
|
||
<div class="card">
|
||
<div class="card-title">系统管理台</div>
|
||
<ul><li>数据管理</li><li>用户权限</li><li>系统运维</li><li>分析任务</li></ul>
|
||
</div>
|
||
<div class="card">
|
||
<div class="card-title">展示大屏</div>
|
||
<ul><li>供需总览</li><li>匹配排行</li><li>缺口地图</li><li>薪资对比</li></ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="arch-layer">
|
||
<span class="layer-title green">AI 智能分析引擎</span>
|
||
<div class="card-row">
|
||
<div class="module-tag">JD智能解析</div>
|
||
<div class="module-tag">岗位匹配引擎</div>
|
||
<div class="module-tag">缺口识别引擎</div>
|
||
<div class="module-tag">报告生成引擎</div>
|
||
</div>
|
||
<div class="card-row" style="margin-top:6px;">
|
||
<div class="module-tag">技能图谱构建</div>
|
||
<div class="module-tag">薪资分析引擎</div>
|
||
<div class="module-tag">课程建议 AI生成</div>
|
||
</div>
|
||
</div>
|
||
<div class="arch-layer">
|
||
<span class="layer-title orange">数据治理层</span>
|
||
<div class="card-row">
|
||
<div class="module-tag">数据清洗</div>
|
||
<div class="module-tag">岗位归一</div>
|
||
<div class="module-tag">质量监控</div>
|
||
<div class="module-tag">数据仓库</div>
|
||
</div>
|
||
</div>
|
||
<div class="arch-layer">
|
||
<span class="layer-title gray">数据源层</span>
|
||
<div class="card-row">
|
||
<div class="card">
|
||
<div class="card-title">校内数据</div>
|
||
<ul><li>实习平台(含工资)</li><li>就业管理系统</li></ul>
|
||
</div>
|
||
<div class="card">
|
||
<div class="card-title">外部数据</div>
|
||
<ul><li>杭州就业网</li><li>杭州本地人才网</li><li>政策 / 行业报告</li></ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<h2>图3.1 — 数据治理流程</h2>
|
||
|
||
<div class="flow">
|
||
<div class="flow-step gray">原始数据</div>
|
||
<span class="flow-arrow">▼</span>
|
||
<div class="flow-step">数据清洗</div>
|
||
<div class="flow-sub">去重去噪 · 格式标准化 · 缺失值处理</div>
|
||
<span class="flow-arrow">▼</span>
|
||
<div class="flow-step">岗位归一</div>
|
||
<div class="flow-sub">统一分类 · 别名映射 · 待审核队列</div>
|
||
<span class="flow-arrow">▼</span>
|
||
<div class="flow-step">质量检验</div>
|
||
<div class="flow-sub">完整度检查 · 异常值检测 · 质量评分</div>
|
||
<span class="flow-arrow">▼</span>
|
||
<div class="flow-step green">数据仓库</div>
|
||
</div>
|
||
|
||
<h2>图3.2 — 分析引擎工作流程</h2>
|
||
|
||
<div class="flow">
|
||
<div class="flow-step gray">数据仓库</div>
|
||
<span class="flow-arrow">▼</span>
|
||
<div class="flow-branch">
|
||
<div class="flow-step" style="font-size:13px;">校内就业数据</div>
|
||
<div class="flow-step" style="font-size:13px;">市场需求数据</div>
|
||
<div class="flow-step orange" style="font-size:13px;">招聘信息原文<br><span style="font-size:11px;font-weight:normal;">→ AI智能解析</span></div>
|
||
</div>
|
||
<span class="flow-arrow">▼</span>
|
||
<div class="flow-step green" style="padding:14px 30px;">
|
||
多维度分析引擎<br>
|
||
<span style="font-size:12px;font-weight:normal;">岗位匹配 · 缺口识别 · 薪资对标 · 技能图谱 · 企业推荐 · 课程建议</span>
|
||
</div>
|
||
<span class="flow-arrow">▼</span>
|
||
<div class="flow-step" style="font-size:13px;">分析结果库(版本化存储)</div>
|
||
<span class="flow-arrow">▼</span>
|
||
<div class="flow-branch">
|
||
<div class="flow-step green" style="font-size:13px;">报告生成</div>
|
||
<div class="flow-step" style="font-size:13px;">数据看板</div>
|
||
<div class="flow-step orange" style="font-size:13px;">大屏展示</div>
|
||
</div>
|
||
</div>
|
||
|
||
<h2>图4.1 — JD智能解析示例</h2>
|
||
|
||
<div class="jd-box">
|
||
<div class="jd-section input">
|
||
<div class="jd-label">原始JD文本(输入)</div>
|
||
<div class="jd-text">"招聘Python后端开发工程师,要求熟悉Django/Flask框架,有Redis/MySQL经验,了解Docker容器化部署,薪资15-25K..."</div>
|
||
</div>
|
||
<div class="jd-section process">▼ 大模型解析 ▼</div>
|
||
<div class="jd-section output">
|
||
<div class="jd-label">结构化结果(输出)</div>
|
||
<div class="jd-result">
|
||
<strong>岗位类别:</strong>互联网 / 软件开发 / 后端开发<br>
|
||
<strong>核心技能:</strong>Python, Django, Flask, Redis, MySQL, Docker<br>
|
||
<strong>技能层级:</strong>熟悉(Django/Flask/Redis)、了解(Docker)<br>
|
||
<strong>薪资范围:</strong>15K - 25K<br>
|
||
<strong>经验要求:</strong>推断为1-3年
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<h2>图4.2 — AI岗位匹配示例</h2>
|
||
|
||
<table class="match-table">
|
||
<tr>
|
||
<th>校内就业岗位</th>
|
||
<th></th>
|
||
<th>市场需求岗位</th>
|
||
<th>匹配结果</th>
|
||
</tr>
|
||
<tr>
|
||
<td>"程序员"</td>
|
||
<td>→ AI匹配 →</td>
|
||
<td>"后端开发工程师"</td>
|
||
<td><span class="tag-high">✅ 高匹配</span></td>
|
||
</tr>
|
||
<tr>
|
||
<td>"网页设计"</td>
|
||
<td>→ AI匹配 →</td>
|
||
<td>"UI/UX设计师"</td>
|
||
<td><span class="tag-mid">✅ 中匹配</span></td>
|
||
</tr>
|
||
<tr>
|
||
<td>"文员"</td>
|
||
<td>→ AI匹配 →</td>
|
||
<td>"数据分析师"</td>
|
||
<td><span class="tag-low">❌ 低匹配</span></td>
|
||
</tr>
|
||
<tr>
|
||
<td style="color:#999;">(无对应)</td>
|
||
<td></td>
|
||
<td>"算法工程师"</td>
|
||
<td><span class="tag-gap">⚠️ 缺口</span></td>
|
||
</tr>
|
||
</table>
|
||
|
||
<h2>图4.3 — AI课程建议生成流程</h2>
|
||
|
||
<div class="flow">
|
||
<div class="flow-branch">
|
||
<div class="flow-step" style="font-size:12px;">技能图谱<br><span style="font-weight:normal;">市场要求 vs 课程覆盖</span></div>
|
||
<div class="flow-step" style="font-size:12px;">供需匹配偏差数据</div>
|
||
<div class="flow-step" style="font-size:12px;">现有课程设置清单</div>
|
||
</div>
|
||
<span class="flow-arrow">▼ 输入 ▼</span>
|
||
<div class="flow-step green" style="padding:12px 24px;">
|
||
大模型推理<br>
|
||
<span style="font-size:12px;font-weight:normal;">
|
||
① 识别技能覆盖盲区 → ② 关联到岗位需求 → ③ 评估市场趋势<br>
|
||
→ ④ 生成课程建议 → ⑤ 给出数据支撑和优先级
|
||
</span>
|
||
</div>
|
||
<span class="flow-arrow">▼ 输出 ▼</span>
|
||
</div>
|
||
<div class="advice-box">
|
||
<div class="advice-title">建议【高优先级】:新增"容器化与云原生"课程方向</div>
|
||
<div class="advice-body">
|
||
<strong>依据:</strong>Docker/K8s技能在后端开发岗位JD中出现率从2024年的42%上升至2026年的78%,而当前课程体系中仅在"Linux基础"课程中简要提及容器概念。<br><br>
|
||
<strong>建议措施:</strong>新增1门32学时选修课,覆盖Docker基础、容器编排、CI/CD流水线等内容。
|
||
</div>
|
||
</div>
|
||
|
||
<h2>图4.4 — 专业能力图谱示例</h2>
|
||
|
||
<h3 style="text-align:center;color:#1a5276;">计算机科学与技术 · 能力图谱</h3>
|
||
|
||
<table class="skill-table">
|
||
<tr>
|
||
<th>技能</th>
|
||
<th>市场需求强度</th>
|
||
<th>课程覆盖状态</th>
|
||
</tr>
|
||
<tr><td>Java</td><td class="stars">★★★★★</td><td class="cover-ok">覆盖充足 ✓</td></tr>
|
||
<tr><td>Python</td><td class="stars">★★★★☆</td><td class="cover-ok">覆盖充足 ✓</td></tr>
|
||
<tr><td>Spring</td><td class="stars">★★★★★</td><td class="cover-partial">部分覆盖 △</td></tr>
|
||
<tr><td>MySQL</td><td class="stars">★★★★☆</td><td class="cover-ok">覆盖充足 ✓</td></tr>
|
||
<tr><td>Linux</td><td class="stars">★★★★☆</td><td class="cover-ok">覆盖充足 ✓</td></tr>
|
||
<tr><td>Git</td><td class="stars">★★★★☆</td><td class="cover-partial">部分覆盖 △</td></tr>
|
||
<tr><td style="font-weight:bold;color:#e74c3c;">Docker</td><td class="stars">★★★☆☆</td><td class="cover-lack">严重不足 ✗</td></tr>
|
||
<tr><td style="font-weight:bold;color:#e74c3c;">Redis</td><td class="stars">★★★☆☆</td><td class="cover-lack">严重不足 ✗</td></tr>
|
||
</table>
|
||
|
||
<h2>图5.2 — 部署架构图</h2>
|
||
|
||
<div class="deploy-box">
|
||
<div class="deploy-title">学校数据中心 / 云服务器</div>
|
||
<div class="card-row">
|
||
<div class="module-tag" style="flex:1;text-align:center;">Web前端</div>
|
||
<div class="module-tag" style="flex:1;text-align:center;">后端服务</div>
|
||
</div>
|
||
<div class="card-row" style="margin-top:6px;">
|
||
<div class="module-tag" style="flex:1;text-align:center;">数据库</div>
|
||
<div class="module-tag" style="flex:1;text-align:center;">缓存服务</div>
|
||
</div>
|
||
<div class="card-row" style="margin-top:6px;">
|
||
<div class="module-tag" style="flex:1;text-align:center;background:#eafaf1;border-color:#27ae60;">AI模型服务<br><span style="font-size:11px;color:#777;">可选私有化部署或对接云端</span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<h2>图6.1 — 分期交付计划</h2>
|
||
|
||
<table class="gantt">
|
||
<tr>
|
||
<th>月份1</th>
|
||
<th>月份2</th>
|
||
<th>月份3</th>
|
||
<th>月份4</th>
|
||
</tr>
|
||
<tr>
|
||
<td>
|
||
<div class="ms-title">里程碑1 · 数据跑通</div>
|
||
<ul>
|
||
<li>数据源对接</li>
|
||
<li>数据清洗归一</li>
|
||
<li>岗位分类体系</li>
|
||
<li>用户权限</li>
|
||
</ul>
|
||
<div class="ms-sub">✓ 验收:数据链路跑通,样本数据可查</div>
|
||
</td>
|
||
<td>
|
||
<div class="ms-title">里程碑2 · 核心功能上线</div>
|
||
<ul>
|
||
<li>AI分析引擎</li>
|
||
<li>院级/专业分析</li>
|
||
<li>32份基础报告</li>
|
||
<li>全校总览</li>
|
||
<li>材料包导出</li>
|
||
</ul>
|
||
<div class="ms-sub">✓ 验收:系统可用于报告生成和导出</div>
|
||
</td>
|
||
<td>
|
||
<div class="ms-title">里程碑3 · 系统就绪</div>
|
||
<ul>
|
||
<li>技能图谱</li>
|
||
<li>薪资对标</li>
|
||
<li>缺口分析</li>
|
||
<li>大屏配置+展示</li>
|
||
<li>报告内容丰富</li>
|
||
</ul>
|
||
<div class="ms-sub">✓ 验收:完整分析+大屏</div>
|
||
</td>
|
||
<td>
|
||
<div class="ms-title">里程碑4 · 持续迭代</div>
|
||
<ul>
|
||
<li>AI课程建议</li>
|
||
<li>政策聚合</li>
|
||
<li>改进跟踪</li>
|
||
<li>企业推荐</li>
|
||
<li>就业去向</li>
|
||
<li>大屏进阶</li>
|
||
</ul>
|
||
<div class="ms-sub">✓ 验收:全功能交付</div>
|
||
</td>
|
||
</tr>
|
||
</table>
|
||
|
||
</body>
|
||
</html>
|