💻 代码预览 · 小草员工管家

1<!DOCTYPE html>
2<html lang="zh-CN">
3<head>
4<meta charset="UTF-8"/>
5<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
6<title>培训晋升 · 小草员工管家</title>
7<link rel="stylesheet" href="style.css"/>
8</head>
9<body>
10
11<header class="header"><a class="back" onclick="history.back()">‹</a><h1>培训与晋升</h1><span class="right"></span></header>
12<div class="section-title">📚 在学课程</div>
13<div id="courseList"></div>
14<div class="section-title">🏆 晋升通道</div>
15<div class="card" style="margin-top:0;font-size:12px;color:#5a6a92;line-height:2">
16  P4 → P5（工程师）→ P6（高级）→ P7（专家）→ P8（资深专家）<br/>
17  M1 → M2（经理）→ M3（总监）→ M4（VP）<br/><br/>
18  晋升条件：连续 2 个季度绩效 A 以上 · 必修课程完成率 100% · 评审答辩通过
19</div>
20<div class="section-title">👥 人才盘点（九宫格）</div>
21<div class="card" style="margin-top:0;font-size:12px;color:#5a6a92;line-height:2">
22  ⭐ 高潜人才：12 人（绩效+潜力双高）· 已制定继任者计划 8 个<br/>
23  💪 中坚力量：326 人（绩效稳定）· 规划发展路径<br/>
24  ⚠️ 待提升：28 人（绩效待改进）· 已安排辅导与培训
25</div>
26
27
28<nav class="tabbar"><a class="" href="index.html"><span class="icon">🏠</span>工作台</a><a class=" active" href="employees.html"><span class="icon">👥</span>员工</a><a class="" href="attendance.html"><span class="icon">🕐</span>考勤</a><a class="" href="recruitment.html"><span class="icon">🎯</span>招聘</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
29<script src="data.js"></script>
30<script>
31  var cl = document.getElementById('courseList');
32  var h = '';
33  window.DATA.courses.forEach(function (c) {
34    h += '<div class="course-card"><div class="cc-emoji">' + c.emoji + '</div><div class="cc-body">'
35      + '<div class="cc-name">' + c.name + '</div>'
36      + '<div class="cc-meta">' + c.meta + '</div>'
37      + '<div class="cc-progress"><i style="width:' + c.prog + '%"></i></div>'
38      + '<div class="cc-state">完成度 ' + c.prog + '% · ' + c.state + '</div>'
39      + '</div></div>';
40  });
41  cl.innerHTML = h;
42</script>
43<script src="app.js"></script>
44</body>
45</html>