feat: 将数据集从国外员工缺勤数据替换为中国企业缺勤模拟数据
- 新增中国企业员工缺勤模拟数据集生成脚本(generate_dataset.py)，覆盖7个行业、180家企业、2600名员工 - 重构 config.py，更新特征字段为中文名称，调整目标列、员工ID、行业类型等配置 - 重构 clustering.py，简化聚类逻辑，更新聚类特征和群体命名（高压通勤型、健康波动型等） - 重构 feature_mining.py，更新相关性分析和群体比较维度（按行业、班次、婚姻状态等） - 新增 model_features.py 定义模型训练特征 - 更新 preprocessing.py 和 train_model.py 适配新数据结构 - 更新各 API 路由默认参数（model: random_forest, dimension: industry） - 前端更新主题样式和各视图组件适配中文字段 - 更新系统名称为 China Enterprise Absence Analysis System
This commit is contained in:
203
frontend/src/styles/theme.css
Normal file
203
frontend/src/styles/theme.css
Normal file
@@ -0,0 +1,203 @@
|
||||
:root {
|
||||
--bg-base: #eef3f7;
|
||||
--bg-soft: #f8fbfd;
|
||||
--surface: rgba(255, 255, 255, 0.88);
|
||||
--surface-strong: #ffffff;
|
||||
--line-soft: rgba(23, 43, 77, 0.08);
|
||||
--line-strong: rgba(23, 43, 77, 0.16);
|
||||
--text-main: #18212f;
|
||||
--text-subtle: #627086;
|
||||
--brand: #0f766e;
|
||||
--brand-strong: #115e59;
|
||||
--accent: #c2410c;
|
||||
--shadow-soft: 0 18px 50px rgba(15, 23, 42, 0.08);
|
||||
--shadow-card: 0 12px 30px rgba(15, 23, 42, 0.06);
|
||||
--radius-xl: 28px;
|
||||
--radius-lg: 22px;
|
||||
--radius-md: 16px;
|
||||
--hero-text: #f8fffd;
|
||||
--hero-text-subtle: rgba(248, 255, 253, 0.84);
|
||||
--sidebar-bg: #f3f4f6;
|
||||
--sidebar-surface: rgba(255, 255, 255, 0.72);
|
||||
--sidebar-border: rgba(15, 23, 42, 0.08);
|
||||
--sidebar-text: #1f2937;
|
||||
--sidebar-text-subtle: #6b7280;
|
||||
--sidebar-menu-hover: rgba(15, 23, 42, 0.05);
|
||||
--sidebar-menu-active: rgba(15, 118, 110, 0.12);
|
||||
}
|
||||
|
||||
:root[data-theme='dark'] {
|
||||
--bg-base: #0f172a;
|
||||
--bg-soft: #111827;
|
||||
--surface: rgba(17, 24, 39, 0.82);
|
||||
--surface-strong: #111827;
|
||||
--line-soft: rgba(148, 163, 184, 0.16);
|
||||
--line-strong: rgba(148, 163, 184, 0.26);
|
||||
--text-main: #e5eef8;
|
||||
--text-subtle: #9fb0c7;
|
||||
--brand: #34d399;
|
||||
--brand-strong: #6ee7b7;
|
||||
--accent: #fb923c;
|
||||
--shadow-soft: 0 18px 50px rgba(2, 6, 23, 0.4);
|
||||
--shadow-card: 0 12px 30px rgba(2, 6, 23, 0.26);
|
||||
--hero-text: #f8fafc;
|
||||
--hero-text-subtle: rgba(226, 232, 240, 0.84);
|
||||
--sidebar-bg: #111827;
|
||||
--sidebar-surface: rgba(255, 255, 255, 0.03);
|
||||
--sidebar-border: rgba(148, 163, 184, 0.14);
|
||||
--sidebar-text: #e5eef8;
|
||||
--sidebar-text-subtle: #94a3b8;
|
||||
--sidebar-menu-hover: rgba(255, 255, 255, 0.06);
|
||||
--sidebar-menu-active: rgba(52, 211, 153, 0.12);
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html,
|
||||
body,
|
||||
#app {
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: "Source Han Sans SC", "PingFang SC", "Microsoft YaHei UI", sans-serif;
|
||||
color: var(--text-main);
|
||||
background:
|
||||
radial-gradient(circle at top left, rgba(15, 118, 110, 0.18), transparent 32%),
|
||||
radial-gradient(circle at top right, rgba(194, 65, 12, 0.14), transparent 28%),
|
||||
linear-gradient(180deg, var(--bg-soft) 0%, var(--bg-base) 100%);
|
||||
transition: background 0.25s ease, color 0.25s ease;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.page-shell {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.page-hero {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding: 28px 30px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.45);
|
||||
border-radius: var(--radius-xl);
|
||||
background:
|
||||
linear-gradient(135deg, rgba(15, 118, 110, 0.94), rgba(21, 94, 89, 0.92) 52%, rgba(30, 41, 59, 0.92));
|
||||
box-shadow: var(--shadow-soft);
|
||||
color: var(--hero-text);
|
||||
}
|
||||
|
||||
.page-hero::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: auto -80px -120px auto;
|
||||
width: 240px;
|
||||
height: 240px;
|
||||
border-radius: 50%;
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.page-eyebrow {
|
||||
margin-bottom: 10px;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.22em;
|
||||
text-transform: uppercase;
|
||||
opacity: 0.72;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
margin: 0;
|
||||
font-size: 30px;
|
||||
line-height: 1.15;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.page-description {
|
||||
max-width: 720px;
|
||||
margin: 12px 0 0;
|
||||
font-size: 14px;
|
||||
line-height: 1.7;
|
||||
color: var(--hero-text-subtle);
|
||||
}
|
||||
|
||||
.glass-card.el-card,
|
||||
.panel-card.el-card,
|
||||
.metric-card.el-card {
|
||||
border: 1px solid var(--line-soft);
|
||||
border-radius: var(--radius-lg);
|
||||
background: var(--surface);
|
||||
box-shadow: var(--shadow-card);
|
||||
backdrop-filter: blur(14px);
|
||||
}
|
||||
|
||||
.glass-card .el-card__body,
|
||||
.panel-card .el-card__body,
|
||||
.metric-card .el-card__body {
|
||||
padding: 22px;
|
||||
}
|
||||
|
||||
.section-heading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: var(--text-main);
|
||||
}
|
||||
|
||||
.section-caption {
|
||||
margin: 6px 0 0;
|
||||
font-size: 13px;
|
||||
color: var(--text-subtle);
|
||||
}
|
||||
|
||||
.chart-frame {
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.soft-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 7px 12px;
|
||||
border-radius: 999px;
|
||||
font-size: 12px;
|
||||
color: var(--brand-strong);
|
||||
background: rgba(15, 118, 110, 0.1);
|
||||
}
|
||||
|
||||
:root[data-theme='dark'] .soft-tag {
|
||||
background: rgba(52, 211, 153, 0.14);
|
||||
}
|
||||
|
||||
.soft-grid {
|
||||
display: grid;
|
||||
gap: 18px;
|
||||
}
|
||||
|
||||
@media (max-width: 960px) {
|
||||
.page-hero {
|
||||
padding: 22px 20px;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.chart-frame {
|
||||
height: 260px;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user