訂閱管理工具
網頁介紹:訂閱管理工具
功能簡介:
這是一個簡單而實用的 訂閱管理工具,可以幫助使用者管理各種訂閱服務,方便追蹤每月花費及檢視各服務的費用比例。
主要功能:
- 新增訂閱服務
- 使用者可以輸入服務名稱、每月費用及扣款日期,新增到訂閱清單中。
- 表單支援即時檢查,提醒使用者填寫完整資訊。
- 取消訂閱服務
- 每個訂閱條目旁都有「取消訂閱」按鈕,點擊後可以直接移除該項目。
- 總金額計算
- 自動計算所有訂閱的每月總費用,並在頁面上實時顯示。
- 視覺化圖表
- 使用 Chart.js 呈現每項訂閱的費用分佈圖,讓使用者一目了然。
- 圖表位於頁面最下方,隨訂閱資料更新即時刷新。
- 資料持久化
- 使用
localStorage
存儲訂閱資料,確保使用者關閉網頁後資料不會遺失。
- 使用
頁面結構:
- 訂閱清單區塊
列出所有已新增的訂閱服務,包含服務名稱、費用、扣款日期以及取消按鈕。 - 新增訂閱表單
隱藏式表單,點擊「新增訂閱」按鈕後顯示,用於輸入新服務資訊。 - 視覺化圖表
圖表位於頁面最下方,顯示每項服務費用的分佈。