65 lines
4.2 KiB
Markdown
65 lines
4.2 KiB
Markdown
# 2026-05-28 记录
|
||
|
||
## 关爱模式（Care Mode）开发日志
|
||
|
||
### 已完成
|
||
|
||
#### 基础设施
|
||
- [x] `stores/careMode.js` — Pinia store，state 含 enabled，action 含 toggle/enable/disable/restore，持久化到 uni.setStorageSync
|
||
- [x] JS 注入 CSS 变量方案：store `_syncRootClass()` 对 `document.documentElement.style.setProperty()` 逐条注入 px 值，绕过 uni-app H5 编译 rpx 问题
|
||
- [x] `restore()` 在 `App.vue onLaunch` 调用，加载持久化状态并同步 DOM
|
||
- [x] `uni.scss` 重构：`:root` 为基础变量，`:root.care-mode` 为 1.5x 覆盖；去掉了 `page` 选择器防止继承链断裂
|
||
- [x] 常量 `NORMAL_VARS` / `CARE_VARS` 定义在模块顶层，含完整 CSS 变量集（font-size, spacing, color, btn-min-height, input-height, border-radius 等）
|
||
- [x] 辅助函数 `getRpxRatio()` (screenWidth / 750) 和 `buildPxVars()` 动态转 px
|
||
- [x] `uni.scss` 中所有 H5 CSS 变量值用 px（非 rpx），因浏览器不认 rpx 作为 CSS 变量值
|
||
- [x] 调试用全局函数 `__toggleCareMode()` 挂载到 window，可在 console 直接调用
|
||
- [x] `stores/index.js` 中 export careMode
|
||
- [x] 登录按钮使用 computed `buttonStyle`（因 `u-button` `custom-style` 不支持 CSS 变量）
|
||
|
||
#### 登录页 (`pages/login/login.vue`)
|
||
- [x] 所有硬编码样式 -> `var(--xxx)` 替换（~11 处）
|
||
- [x] 登录按钮 width 使用 `buttonWidth: '80%'`（不变），font-size/input-height 通过 CSS 变量控制
|
||
|
||
#### 首页 (`pages/index/index.vue`)
|
||
- [x] 53 处 `var(--)` 替换
|
||
- [x] `showMoreActions()` 使用 ActionSheet：两选项「开启/关闭关爱模式」「退出登录」
|
||
- [x] 文字描述全部 1.5x 显示
|
||
|
||
#### 入库出库选器改造（4 个文件）
|
||
- [x] `pages/inbound/production.vue` — 68 处 CSS 变量，生产入库（无价格逻辑）
|
||
- [x] `pages/inbound/purchase.vue` — 90 处 CSS 变量，采购入库（含价格/金额/供应商选器）
|
||
- [x] `pages/outbound/material.vue` — 68 处 CSS 变量，领料出库（无价格逻辑）
|
||
- [x] `pages/outbound/sales.vue` — 93 处 CSS 变量，销售出库（含价格/金额/客户选器）
|
||
|
||
### 技术决策
|
||
- **CSS class → JS 注入转换**：因 `:root.care-mode` 在 uni-app H5 编译后 `page` 元素阻断了继承链，改用 JS 对 `document.documentElement.style.setProperty()` 直接注入
|
||
- **删除 `uni.scss` 的 `page` 选择器**：`page` 作为中间元素接收 CSS 变量但不会传递给子元素，导致页面 `var(--)` 都落在 fallback
|
||
- **1.5x 缩放系数**：用户指定的比值；`CARE_VARS = NORMAL_VARS × 1.5`
|
||
- **`u-button` custom-style 不支持 CSS 变量**：改用 computed 返回样式对象
|
||
|
||
### 待办
|
||
- [ ] 7 个已回滚页面需要重新 CSS 变量改造（首页和 4 个选器已重做完成，仍需检查 stocktake, inventory 等）
|
||
- [ ] 检查 `/pages/inbound/history`, `/pages/inventory/inventory`, `/pages/inventory/stock`, `/pages/supplier/index`, `/pages/supplier/supplierDetail`, `/pages/outbound/history`, `/pages/inventory/warehouse` 是否需要 Care Mode 支持
|
||
- [ ] 添加其他页面的 manual toggle 入口（actionSheet）
|
||
- [ ] 小程序 `<page-meta>` 支持（未来事项）
|
||
|
||
### 当前焦点
|
||
用户已确认登录页 OK，首页改造完成，4 个入库出库选器改造完成。等待用户反馈看 H5 效果，再决定下一步。
|
||
#### 入库出库历史记录（2 个文件）
|
||
- [x] `pages/inbound/history.vue` — 67 处 CSS 变量，含搜索、卡片列表、撤销按钮、空状态
|
||
- [x] `pages/outbound/history.vue` — 66 处 CSS 变量，含客户/价格/金额展示
|
||
|
||
#### 库存与安全库存（2 个文件）
|
||
- [x] `pages/inventory/index.vue` — 42 处 CSS 变量，含搜索、分类筛选、库存卡片、低库存 tag
|
||
- [x] `pages/inventory/safe-stock.vue` — 30 处 CSS 变量，含信息卡片、表单输入、保存/删除按钮
|
||
|
||
#### 库存盘点（2 个文件）
|
||
- [x] `pages/stocktake/index.vue` — 75 处 CSS 变量，含搜索、分类筛选、盘点卡片、实盘输入、底部操作栏
|
||
- [x] `pages/stocktake/history.vue` — 60 处 CSS 变量，含时间筛选 tabs、历史卡片、空状态
|
||
|
||
### 未检查页面（待确认是否需要 Care Mode 支持）
|
||
- `/pages/inventory/stock` (不存在)
|
||
- `/pages/inventory/warehouse` (不存在)
|
||
- `/pages/supplier/index`
|
||
- `/pages/supplier/supplierDetail`
|