v6ole/qiji
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 双主题系统 — 编辑风 + 极简亮色

Browse Source 
前端:
- 新增 Pinia theme store，localStorage 持久化，data-theme 切换
- App.vue: :root 新增 --font-*/--sidebar-* CSS 变量；新增 :root[data-theme=light] 完整配色（极简黑白金 + Noto Sans SC）
- DesktopLayout: 侧边栏 15 个变量化 + 顶栏主题切换按钮
- MobileLayout: 装饰色变量化
- Settings: 新增「界面主题」卡片
- 21 个组件 font-family 统一替换为 var(--font-*)
- 新增 utils/managerColor.ts — 12 色调色板 + 自适应文字色 + 后端自定义色优先
- WorkPlans/MiniBusiness/KeyVisits/CustomerManage: 客户经理标签色统一走共享工具
- UserManage: 编辑弹窗新增颜色选择器（仅 manager）
- LightBoard: 去标题星标图标
- ManagerWorkspace/WorkPlans/MiniBusiness/KeyVisits: 删除按钮改为实心红底白字

后端:
- User 模型新增 color 列 + lifespan 自动迁移
- users API 支持 color 字段读写
- UserOut schema 新增 color

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
v6ole
2026-07-06 16:03:13 +08:00
parent 336b60b3af
commit deeafe239f
37 changed files with 2275 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/mobile/DailyNoteForm.vue
+7 -7
View File
@@ -189,13 +189,13 @@ async function handleDelete() {
}
.form-title {
margin: 0; font-family: 'ZCOOL XiaoWei', STSong, serif;
margin: 0; font-family: var(--font-heading);
font-size: 24px; font-weight: 400; color: var(--ink);
letter-spacing: 0.06em; line-height: 1.3;
}
.form-subtitle {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
font-size: 9px; color: var(--gold); letter-spacing: 0.2em;
}
@@ -210,12 +210,12 @@ async function handleDelete() {
/* ═══ Form Labels ═══ */
.form-label {
font-family: 'ZCOOL XiaoWei', STSong, serif !important;
font-family: var(--font-heading) !important;
font-size: 14px !important; color: var(--ink) !important;
letter-spacing: 0.04em; font-weight: 500 !important;
}
.form-label-hint {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 11px; color: var(--warm-gray);
letter-spacing: 0.03em; font-weight: 400; margin-left: 6px;
}
@@ -231,7 +231,7 @@ async function handleDelete() {
background: var(--surface);
border: 1px solid var(--warm-border);
color: var(--ink);
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 13px;
letter-spacing: 0.03em;
cursor: pointer;
@@ -249,7 +249,7 @@ async function handleDelete() {
.submit-btn {
flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px;
padding: 16px; background: var(--ink); color: #fff; border: none;
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 16px; letter-spacing: 0.08em; cursor: pointer; transition: all 0.25s;
}
.submit-btn:hover { background: var(--ink-light); }
@@ -261,7 +261,7 @@ async function handleDelete() {
padding: 16px 20px;
background: var(--surface); color: var(--vermilion);
border: 1px solid var(--vermilion);
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 14px; letter-spacing: 0.04em; cursor: pointer; transition: all 0.25s;
}
.delete-btn:hover { background: var(--vermilion); color: #fff; }
frontend/src/views/mobile/Home.vue
+19 -19
View File
@@ -226,14 +226,14 @@ onMounted(loadToday)
}
.stat-label-sm {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
font-size: 10px;
letter-spacing: 0.2em;
color: var(--warm-gray);
}
.stat-date {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 12px;
color: var(--warm-gray);
letter-spacing: 0.04em;
@@ -247,7 +247,7 @@ onMounted(loadToday)
}
.stat-number {
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 56px;
color: var(--ink);
line-height: 1;
@@ -255,7 +255,7 @@ onMounted(loadToday)
}
.stat-unit {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 16px;
color: var(--warm-gray);
letter-spacing: 0.06em;
@@ -270,14 +270,14 @@ onMounted(loadToday)
}
.stat-piece {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 13px;
color: var(--warm-gray);
letter-spacing: 0.03em;
}
.stat-piece strong {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
color: var(--ink);
font-size: 15px;
}
@@ -314,7 +314,7 @@ onMounted(loadToday)
padding: 16px 12px;
border: 1px solid var(--warm-border);
cursor: pointer;
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 15px;
letter-spacing: 0.04em;
transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
@@ -365,7 +365,7 @@ onMounted(loadToday)
background: var(--surface);
border: 1px solid var(--warm-border);
color: var(--ink);
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 13px;
letter-spacing: 0.03em;
cursor: pointer;
@@ -390,7 +390,7 @@ onMounted(loadToday)
}
.section-title {
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 18px;
color: var(--ink);
letter-spacing: 0.06em;
@@ -459,7 +459,7 @@ onMounted(loadToday)
width: 22px;
height: 22px;
color: #fff;
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 13px;
flex-shrink: 0;
}
@@ -469,7 +469,7 @@ onMounted(loadToday)
}
.record-category {
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 13px;
color: var(--ink);
letter-spacing: 0.04em;
@@ -477,7 +477,7 @@ onMounted(loadToday)
}
.record-badge {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 11px;
padding: 1px 8px;
letter-spacing: 0.04em;
@@ -491,7 +491,7 @@ onMounted(loadToday)
.record-customer {
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 15px;
color: var(--ink);
letter-spacing: 0.03em;
@@ -499,7 +499,7 @@ onMounted(loadToday)
}
.record-time {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
font-size: 11px;
color: var(--warm-gray);
letter-spacing: 0.03em;
@@ -507,7 +507,7 @@ onMounted(loadToday)
}
.record-content {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 14px;
color: var(--c-text);
line-height: 1.7;
@@ -516,7 +516,7 @@ onMounted(loadToday)
}
.record-demand {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 13px;
color: var(--vermilion);
margin: 0 0 8px;
@@ -559,7 +559,7 @@ onMounted(loadToday)
}
.empty-glyph {
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 40px;
color: var(--gold);
opacity: 0.4;
@@ -567,14 +567,14 @@ onMounted(loadToday)
}
.empty-text {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 15px;
color: var(--warm-gray);
margin: 0 0 4px;
}
.empty-hint {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 12px;
color: var(--c-text-muted);
margin: 0;
frontend/src/views/mobile/KeyVisitForm.vue
+5 -5
View File
@@ -169,13 +169,13 @@ async function handleSubmit() {
.form-title-group { display: flex; flex-direction: column; gap: 0; flex: 1; }
.form-title {
margin: 0; font-family: 'ZCOOL XiaoWei', STSong, serif;
margin: 0; font-family: var(--font-heading);
font-size: 24px; font-weight: 400; color: var(--ink);
letter-spacing: 0.06em; line-height: 1.3;
}
.form-subtitle {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
font-size: 9px; color: var(--gold); letter-spacing: 0.2em;
}
@@ -189,7 +189,7 @@ async function handleSubmit() {
}
.form-label {
font-family: 'ZCOOL XiaoWei', STSong, serif !important;
font-family: var(--font-heading) !important;
font-size: 14px !important; color: var(--ink) !important;
letter-spacing: 0.04em; font-weight: 500 !important;
}
@@ -204,7 +204,7 @@ async function handleSubmit() {
padding: 10px 8px;
background: var(--surface);
border: 1px solid var(--warm-border);
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 13px; letter-spacing: 0.04em;
cursor: pointer; transition: all 0.25s;
text-align: center;
@@ -216,7 +216,7 @@ async function handleSubmit() {
.submit-btn {
width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px;
padding: 16px; background: var(--ink); color: #fff; border: none;
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 16px; letter-spacing: 0.08em; cursor: pointer; transition: all 0.25s;
margin-top: 24px;
}
frontend/src/views/mobile/MiniBusinessForm.vue
+4 -4
View File
@@ -122,13 +122,13 @@ async function handleSubmit() {
.form-title-group { display: flex; flex-direction: column; gap: 0; flex: 1; }
.form-title {
margin: 0; font-family: 'ZCOOL XiaoWei', STSong, serif;
margin: 0; font-family: var(--font-heading);
font-size: 24px; font-weight: 400; color: var(--ink);
letter-spacing: 0.06em; line-height: 1.3;
}
.form-subtitle {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
font-size: 9px; color: var(--gold); letter-spacing: 0.2em;
}
@@ -142,7 +142,7 @@ async function handleSubmit() {
}
.form-label {
font-family: 'ZCOOL XiaoWei', STSong, serif !important;
font-family: var(--font-heading) !important;
font-size: 14px !important; color: var(--ink) !important;
letter-spacing: 0.04em; font-weight: 500 !important;
}
@@ -152,7 +152,7 @@ async function handleSubmit() {
.submit-btn {
width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px;
padding: 16px; background: var(--ink); color: #fff; border: none;
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 16px; letter-spacing: 0.08em; cursor: pointer; transition: all 0.25s;
margin-top: 24px;
}
frontend/src/views/mobile/VisitForm.vue
+10 -10
View File
@@ -413,7 +413,7 @@ async function handleDelete() {
.form-title {
margin: 0;
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 24px;
font-weight: 400;
color: var(--ink);
@@ -422,7 +422,7 @@ async function handleDelete() {
}
.form-subtitle {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
font-size: 9px;
color: var(--gold);
letter-spacing: 0.2em;
@@ -448,7 +448,7 @@ async function handleDelete() {
/* ═══ Form Labels ═══ */
.form-label {
font-family: 'ZCOOL XiaoWei', STSong, serif !important;
font-family: var(--font-heading) !important;
font-size: 14px !important;
color: var(--ink) !important;
letter-spacing: 0.04em;
@@ -456,7 +456,7 @@ async function handleDelete() {
}
.form-label-hint {
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 11px;
color: var(--warm-gray);
letter-spacing: 0.03em;
@@ -478,7 +478,7 @@ async function handleDelete() {
border: 1px dashed var(--gold);
padding: 8px 14px;
color: var(--gold-dark);
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 13px;
cursor: pointer;
transition: all 0.2s;
@@ -517,7 +517,7 @@ async function handleDelete() {
}
.photo-label {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
font-size: 11px;
color: var(--warm-gray);
letter-spacing: 0.03em;
@@ -545,7 +545,7 @@ async function handleDelete() {
padding: 12px 18px;
border: 1px dashed var(--warm-border);
color: var(--warm-gray);
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 13px;
transition: all 0.2s;
letter-spacing: 0.03em;
@@ -579,7 +579,7 @@ async function handleDelete() {
background: var(--ink);
color: #fff;
border: none;
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 16px;
letter-spacing: 0.08em;
cursor: pointer;
@@ -598,7 +598,7 @@ async function handleDelete() {
background: var(--surface);
color: var(--vermilion);
border: 1px solid var(--vermilion);
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 14px;
letter-spacing: 0.04em;
cursor: pointer;
@@ -629,7 +629,7 @@ async function handleDelete() {
padding: 10px 8px;
background: var(--surface);
border: 1px solid var(--warm-border);
font-family: 'Noto Serif SC', STSong, serif;
font-family: var(--font-body);
font-size: 13px; letter-spacing: 0.04em;
cursor: pointer; transition: all 0.25s;
text-align: center;
frontend/src/views/mobile/WorkPlanForm.vue
+4 -4
View File
@@ -102,13 +102,13 @@ async function handleSubmit() {
.form-title-group { display: flex; flex-direction: column; gap: 0; flex: 1; }
.form-title {
margin: 0; font-family: 'ZCOOL XiaoWei', STSong, serif;
margin: 0; font-family: var(--font-heading);
font-size: 24px; font-weight: 400; color: var(--ink);
letter-spacing: 0.06em; line-height: 1.3;
}
.form-subtitle {
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-family: var(--font-mono);
font-size: 9px; color: var(--gold); letter-spacing: 0.2em;
}
@@ -122,7 +122,7 @@ async function handleSubmit() {
}
.form-label {
font-family: 'ZCOOL XiaoWei', STSong, serif !important;
font-family: var(--font-heading) !important;
font-size: 14px !important; color: var(--ink) !important;
letter-spacing: 0.04em; font-weight: 500 !important;
}
@@ -132,7 +132,7 @@ async function handleSubmit() {
.submit-btn {
width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px;
padding: 16px; background: var(--ink); color: #fff; border: none;
font-family: 'ZCOOL XiaoWei', STSong, serif;
font-family: var(--font-heading);
font-size: 16px; letter-spacing: 0.08em; cursor: pointer; transition: all 0.25s;
margin-top: 24px;
}