20260628215623
This commit is contained in:
oneao committed
1 parent
51622a4b1a
commit
e687846eb4
68 files changed
+2234
-1591
No files matched your search
@@ -0,0 +1,55 @@
|
||||
# 2026-06-27
|
||||
|
||||
## EmptyStatus loading 状态改用主题色
|
||||
- 修改文件：`app-rn/src/components/EmptyStatus.tsx`
|
||||
- LoadingVisual 中三处颜色改为主题色（accent = oklch(0.76 0.12 170)，对应祖母绿 #10B981）：
|
||||
- 脉冲圆背景：`bg-foreground/10` → `bg-accent/10`
|
||||
- 内圆背景：`bg-foreground/5` → `bg-accent/5`
|
||||
- 加载图标颜色：`color="#111827"` → `color={accentColor}`（通过 `useThemeColor("accent")` 获取）
|
||||
- 新增 import：`useThemeColor` from `heroui-native`
|
||||
- 参考：项目中 tabbar.tsx、DateTimeRange.tsx、tools/index.tsx 均使用 `useThemeColor("accent")` 获取主题色实际值
|
||||
|
||||
## 记账 home 列表样式优化
|
||||
- 修改文件：`app-rn/src/app/finance/(tabs)/home/index.tsx`
|
||||
- 列表不贴边：SectionView 的 contentContainerStyle 增加 `paddingHorizontal: 16`，白色列表项两侧留 16px 间距
|
||||
- 日期单行：section header 日期从「MM月DD日 + YYYY年」两行改为 `YYYY年MM月DD日` 一行
|
||||
- 收支单行：section header 收支合计从两行改为一行 `-¥支出 +¥收入`，去掉「支出/收入」文字标签
|
||||
- 列表项简化：移除金额下方的「收入/支出」子标签（+/- 符号已表达类型），同时删除不再使用的 `getCategoryTypeLabel` 函数
|
||||
|
||||
## 记账统计页（analysis）优化
|
||||
- 修改文件：`app-rn/src/app/finance/(tabs)/analysis/index.tsx`
|
||||
- 收支趋势图增加数值显示：在图表下方新增 3 个白色卡片小条：
|
||||
- 支出峰值：金额 + 峰值日期
|
||||
- 收入峰值：金额 + 峰值日期
|
||||
- 日均支出：金额 + 共 N 天
|
||||
数据来自新增的 `trendSummary` useMemo（maxExpense/maxIncome/对应 day、totalExpense/totalIncome、nonZeroDays）
|
||||
- 筛选条件扩展：FilterState 加上 `categoryId / memberId / type / keyword`，新增 `loadFilterOptions` 一次性加载 `b_finance_category`（status=1）和 `b_family_member`（join b_user 取 nickname）作为下拉选项
|
||||
- 使用 BottomSheet 筛选：照搬 home 模式，标题「筛选分析」+ 重置 + 日期范围 + 收支类型（全部/支出/收入）+ 成员 chips + 分类 chips + 备注关键词 + 取消/应用；筛选 chips 选中态用主题色 `bg-accent/10 border-accent` + `text-accent`
|
||||
- 筛选按钮改用主题色：原本 `bg-gray-900` → `bg-accent`（home 页和 analysis 页同步）
|
||||
- 移除「分析范围」字样：直接显示日期范围文本（与 home 保持一致）
|
||||
- SQL 增加过滤：categoryId → `f.category_id = ?`、memberId → `f.create_by = ?`、type → `c.type = ?`、keyword → `coalesce(f.remark,'') like ?`；trend/category/member 统计也跟随筛选条件变化
|
||||
- 移除未使用的 `useThemeColor` import（统一走 className `bg-accent`）
|
||||
|
||||
|
||||
## 统计页趋势图坐标轴修复 + 成员统计移除
|
||||
- 修改文件：`app-rn/src/app/finance/(tabs)/analysis/index.tsx`
|
||||
- 趋势图坐标轴标签显示修复：
|
||||
- 下载 `Inter-Regular.ttf`（299KB）到 `app-rn/src/assets/fonts/`
|
||||
- 通过 `useFont` 加载字体并传入 `CartesianChart` 的 `axisOptions.font`
|
||||
- 调整 `chartPadding` 给轴标签留空间
|
||||
- 移除成员统计区块，保留 filter 中的成员筛选
|
||||
- 分类展示用列表 + 进度条（CategoryRow 组件）
|
||||
|
||||
## 统计页趋势图改回折线 + 自定义 SVG 饼图
|
||||
- 删除字体文件 app-rn/src/assets/fonts/Inter-Regular.ttf 和 useFont 引用（用户要求不加载字体）
|
||||
- 趋势图改为双折线图：支出（#FB7185）+ 收入（#10B981），X 轴日期（MM/DD），Y 轴金额
|
||||
- 用 react-native-svg 自定义 CategoryPieChart 组件
|
||||
- 分类占比图例百分比按饼图自身总额计算
|
||||
|
||||
## Home 刷新按钮 + 分析页筛选标签
|
||||
- **home**: 日期行新增刷新按钮（RotateCcwIcon），点击调用 handleRefresh
|
||||
- **home**: 分类/备注 chip 行移到日期行下方、合计卡片上方
|
||||
- **home**: chip 文本追加 numberOfLines={1} 防溢出
|
||||
- **analysis**: 日期行新增刷新按钮（替代原 reset 按钮，reset 仍在 BottomSheet 中可用）
|
||||
- **analysis**: 日期行下方新增 `activeFilterLabels` chip 行（分类/成员/类型/备注），溢出省略号
|
||||
- **analysis**: 折线图修复：Line 移除 chartBounds 传参、开启 connectMissingData={true}
|
||||
@@ -0,0 +1,20 @@
|
||||
## 2026-06-28
|
||||
|
||||
- **SQL 模板字面量 Metro 解析错误修复**：Expo/Babel 在 `.tsx` 文件中会将模板字面量中的 `id` 关键字误解析为 JSX 属性，报 `Missing semicolon`。根因是 `@babel/plugin-transform-typescript` 的 TSX 模式 bug。最终方案：将所有 SQL 模板字面量改为字符串拼接（`+` 连接），避免了模板字面量 → TSX 解析路径。涉及文件：
|
||||
- `app-rn/src/app/finance/(tabs)/analysis/index.tsx` — 3 处 SQL
|
||||
- `app-rn/src/app/finance/(tabs)/home/index.tsx` — 1 处 SQL
|
||||
- `app-rn/src/app/finance/detail/[id].tsx` — 1 处 SQL
|
||||
- 注意：仅提取为变量不够（`const sql = \`...\`` 仍然触发），必须完全避免模板字面量
|
||||
- **中文乱码修复**：修复了以下文件中因编码转换导致的大量中文乱码（UTF-8 被误当 GBK/CP1252 解析导致的 mojibake）：
|
||||
- `app-rn/src/app/finance/(tabs)/analysis/index.tsx` — 约 50 处乱码修复（注释、UI 标签、¥ 符号）
|
||||
- `app-rn/src/app/finance/(tabs)/home/index.tsx` — 约 20 处乱码修复（toast 消息、UI 标签、¥ 符号）
|
||||
- `app-rn/src/app/finance/category/index.tsx` — 约 12 处乱码修复（toast 消息、表单标签）
|
||||
- `app-rn/src/app/finance/add/index.tsx` — 约 15 处乱码修复（UI 标签、toast 消息、¥ 符号）
|
||||
- **修复 DateTime/DateTimeRange 乱码和日历外边距**：修正了中文注释和按钮标签乱码，日历容器添加 `px-4`
|
||||
- **移除 BottomSheet 默认内边距**：gorhom 的 `BottomSheetView` 自带 `padding: 16`，在 `AppBottomSheetContent` 中通过 `style={[{ padding: 0 }]}` 消除。补偿了 `family/settings.tsx` 中一个缺少 `px-4` 的 BottomSheet 使用处
|
||||
- **BottomSheet 内 input 键盘避让修复**：`family/user.tsx` 中 sheet 内的 heroui `<Input>`（底层原生 TextInput）被键盘遮挡。根因有三层：
|
||||
1. `BottomSheet.tsx` 封装时 `keyboardBehavior="extend"` 是错的——gorhom 源码（BottomSheet.js L585）显示 `extend` 只是把 sheet 拉到最高 snap point，**根本不上移**。应改为 gorhom 默认值 `"interactive"`（L602-608：`highestDetentPosition - keyboardHeightInContainer`，sheet 上移到键盘上方）。
|
||||
2. `android_keyboardInputMode="adjustResize"` 在 Android 上会导致 `interactive` 模式被**跳过**（L605: `!(Platform.OS === 'android' && android_keyboardInputMode === 'adjustResize')`）。应改为 gorhom 默认值 `"adjustPan"`。
|
||||
3. heroui `<Input>` 底层是原生 `TextInput`，未注册到 sheet 内部 context，sheet 感知不到 focus。
|
||||
- 最终方案（最优）：`BottomSheet.tsx` 改 `keyboardBehavior="interactive"` + `android_keyboardInputMode="adjustPan"`。`AppBottomSheetInput` 封装改用 heroui 原生 `Input` + `useBottomSheetAwareHandlers`（heroui-native 提供），hook 内部调用 gorhom `useBottomSheetInternal(true)` 把 focus/blur 注册到 `animatedKeyboardState`。这样保留 heroui Input 全部样式和 API，无需用 `BottomSheetTextInput`。
|
||||
- 全项目 sheet 内 `<Input>` 统一替换为 `<BottomSheet.Input>`：`family/user.tsx`(2处)、`family/settings.tsx`(2处)、`finance/add/index.tsx`(2处)、`finance/category/index.tsx`(1处)、`finance/(tabs)/home/index.tsx`(1处)、`finance/(tabs)/analysis/index.tsx`(1处)。
|
||||
@@ -16,3 +16,12 @@
|
||||
- 不要卡片套卡片（no card nesting）
|
||||
- 子应用 icon 不设彩色背景
|
||||
- Section 标题统一用 `SectionLabel` 组件（13px semibold text-gray-800）
|
||||
|
||||
## 已知库问题
|
||||
- **BottomSheet 初始化闪烁**：gorhom bottom-sheet 默认 `animateOnMount=true`，即使 `index=-1`（关闭状态）mount 时也会触发动画，首帧显示底部面板。修复：`<BottomSheet.Content animateOnMount={false}>`。**不要用 `{isOpen && <Content>}` 条件渲染**，会导致 `BottomSheetContentContainer` 的 `useRef(isOpen)` 捕获错误初始值，首次打开时 `snapToIndex` 永远不会触发。
|
||||
- **模板字面量 `id` 解析错误**：Expo/Babel 在 `.tsx` 文件中会把模板字面量内的 `id,` 误解析为 JSX 属性，报 `Missing semicolon`。**规则：`.tsx` 文件中禁止在模板字面量（反引号）内使用 `id` 关键字**，必须改用字符串拼接（`'...' + '...'`）。仅提取为变量不够，必须完全避免模板字面量。
|
||||
- **BottomSheet 内 input 键盘避让**：三层根因，缺一不可：
|
||||
1. `keyboardBehavior` 必须是 `"interactive"`（gorhom 默认值），不能用 `"extend"`。gorhom 源码：`extend` 只拉到最高 snap point 不上移；`interactive` 才会 `highestDetent - keyboardHeight` 上移避让。
|
||||
2. `android_keyboardInputMode` 必须是 `"adjustPan"`（gorhom 默认值），不能用 `"adjustResize"`。源码 L605：Android + adjustResize 会**跳过** interactive 模式。
|
||||
3. sheet 内输入框必须接入 sheet 的键盘状态。最优方案：用 heroui 原生 `Input` + `useBottomSheetAwareHandlers`（从 `heroui-native` 导出），hook 内部调用 gorhom `useBottomSheetInternal(true)` 把 focus/blur 注册到 `animatedKeyboardState`。项目已封装为 `BottomSheet.Input`。
|
||||
**规则：BottomSheet 内部的所有输入框统一用 `BottomSheet.Input`，`BottomSheet.tsx` 中 `keyboardBehavior="interactive"` + `android_keyboardInputMode="adjustPan"` 保持 gorhom 默认值。**
|
||||
Reference in new issue
Block a user