昨天我們做了「預算與超支提醒」,今天要解決另一個日常痛點:
帳本裡紀錄一多,光靠手動滑清單實在太麻煩。
我只想知道「上個月交通費到底花了多少」——但卻要翻很久
所以今天的目標就是:加上搜尋與篩選功能,讓使用者能快速找到特定的支出紀錄
幫我在 SwiftUI 記帳 App(已經有 Firestore、分類、圖表功能)加上「搜尋與篩選」功能,並且預設顯示本月資料。
=== 功能需求 ===
1. 篩選模型 FilterState:
- quickPreset: .all / .thisMonth / .lastMonth / .custom
- startDate, endDate(for .custom)
- selectedCategoryIds: Set<String>
2. 預設值:quickPreset = .thisMonth
- 計算當月起訖日期,當作日期區間
- UI 標題顯示「本月歷史紀錄」
3. 篩選邏輯:
- filteredExpenses = 所有 expenses → 先依日期 → 再依類別
- 若 selectedCategoryIds 為空,代表全部類別
4. UI 顯示:
- 篩選列:SegmentedControl(全部 / 本月 / 上月 / 自訂)+「套用 / 清除」
- 標題:依 quickPreset 動態切換
- 顯示「篩選總計:$xxx」;金額格式化為 TWD
5. 清單與圖表:
- 使用 filteredExpenses 計算
- 確保數字一致
6. Firestore 優化(可先 TODO):
- 若 quickPreset 為 .thisMonth / .lastMonth,改成用 whereField("date") 篩選,避免抓全部。
這功能做下來才發現,平常我們翻帳本時,最常用的就是「查詢」而不是「新增」。以前只是一股腦把錢丟進去,現在終於能快速找到自己想要的紀錄,像是「上個月餐飲 5,000?交通 2,000?」一目了然
我的程式碼放在這裡:2025ithome-ExpenseTracker
Day 9 要繼續補強基礎功能:
支出除了「金額 + 分類 + 日期」,還要能加上 備註(例如「和朋友聚餐」、「Uber 計程車」)。
這樣日後在查帳時,不會只看到冷冰冰的數字,而是能記得這筆錢到底怎麼花的。