學校禮堂、專科教室及IPAD平板車線上預約借用系統，支援查詢與查詢借用時段。
- Glassmorphism Design - 引入毛玻璃特效與鮮豔漸層，提升視覺質感與操作聚焦度
- Vibrant Gradients - 使用高飽和度漸層色區分重要資訊與操作按鈕
- RWD Optimization - 手機版彈窗寬度適配與按鈕觸控區優化
- Self-Cancellation - 支援使用者自助取消預約（綁定裝置 ID），無需管理員權限
- 智慧衝突解析 - 偵測已被預約時段，一鍵觸發 AI 分析
- 多維度建議策略 - 同時提供「鄰近日期」、「換場地」與「換時段」三種最佳解藥
- 平板車專屬媒合 - 智慧在不同年級平板車間進行互推建議，效率大幅提升
- 互動 UI 優化 - 沉浸式彩虹光譜與自動捲動效果，視覺與操作感全面升級
- Bento Grid 佈局 - 現代化網格設計，數據卡片整齊排列，完美支援手機版顯示
- Rainbow Spectrum - 「今日預約熱度」圖表採用全光譜漸層色，視覺繽紛且易於識別
- Glassmorphism - 儀表板 Modal 引入毛玻璃背景效果，提升質感
- 互動呼吸燈 - 使用中場地顯示紅色光暈呼吸動畫，狀態一目了然
- RWD 優化 - 圖表支援水平捲動，解決手機版擠壓問題
- GitHub Actions 整合 - 實現自動化 CI/CD 流程，推送代碼後自動部署至 GitHub Pages
- Secrets 安全管理 - 移除硬編碼金鑰，全面改用 GitHub Repository Secrets 注入環境變數
- 建置流程優化 - 抽離配置生成邏輯，確保部署環境與開發環境配置一致
- 自動化安全盤查 - 整合 API Key 域名限制檢查，防止金鑰遭惡意盜用
- 自動擴大範圍 - 自動搜尋未來 180 天內的預約，無需手動調整日期
- 關鍵字搜尋 - 支援同時搜尋「預約者姓名」與「預約理由」
- 詳細資訊顯示 - 月曆格子直接顯示預約節次與借用者
- 節次簡稱 - 自動簡化節次名稱以節省空間
- 更多提示 - 單日預約過多時自動摺疊
- 半年預約 - 支援查詢與預約未來 180 天內的時段
- 歷史記錄查詢 - 按月份查看過去預約記錄
- 批次預約功能 - 支援一次選擇多個日期進行預約
- 日曆多選模式 - 視覺化選擇多個預約日期
- 快速搜尋 - 按預約者姓名搜尋
- 節次篩選 - 指定特定節次過濾
- 日期範圍 - 結合日期選擇器篩選
- 搜尋高亮 - 關鍵字高亮顯示
- 快速跳轉 - 點擊結果直接跳轉至該週
- 全新配色系統 - 紫藍漸層主色調，更現代活力
- 彩色陰影效果 - 元件陰影帶有主題色彩
- 優化圓角設計 - 更柔和的視覺效果
- 預約卡片美化 - 紫色漸層背景
- Firestore 規則強化 - 完整欄位驗證，防止惡意資料注入
- Rate Limiting - 每小時/每天預約次數限制，防止濫用
- 裝置識別 - 追蹤預約來源裝置
- 微互動動畫 - 視圖切換淡入淡出、彈窗縮放動畫、按鈕點擊回饋
- 骨架屏 (Skeleton Loading) - 資料載入時顯示閃爍骨架，提升感知效能
- 週視圖 / 月視圖 - 靈活切換檢視模式
- 多節次預約 - 支援單日多時段預約
- 重複預約 - 可設定每週重複預約
- 預約詳情 - 點擊已預約時段查看詳細資訊
- Firebase 驗證 - 安全的管理員登入機制
- 取消預約 - 已登入管理員可取消預約
- 資料管理 - Firestore 雲端資料庫儲存
- 節次使用率 - 視覺化圓餅圖呈現
- 預約者排行 - 顯示預約次數最多的使用者
- 趨勢圖表 - 本月預約趨勢分析
- 匯出 CSV - 預約資料匯出功能
- 手機端優化 - 週曆垂直排列，易於上下滑動檢視
- 底部預約按鈕 - 手機端專用的大型預約按鈕
- 觸控友善 - 適合觸控螢幕操作
- 前端: HTML5, CSS3, Vanilla JavaScript
- 後端: Firebase Firestore (資料庫)
- 驗證: Firebase Authentication
- 部署: GitHub Actions (CI/CD) -> GitHub Pages / Firebase Hosting
- 安全性: GitHub Secrets & API Key Isolation
- 🐛 修復預約熱度圖顯示錯誤
- 修正「今日預約熱度」在無預約時仍顯示彩色長條的問題
- 優化空值狀態下的視覺呈現 (灰色細線)
- 📱 PWA 安裝體驗優化
- 全新 Glassmorphism 玻璃擬態安裝提示，搭配漸層與動畫效果
- RWD 響應式設計：手機版 Bottom Sheet、電腦版 Toast 懸浮
- 🛠️ 歷史記錄管理
- 新增「強制刪除」功能，允許管理員/本人清除異常預約資料
- 修復歷史記錄過濾邏輯與刪除後列表刷新問題
- 📊 數據匯出
- 新增 CSV 全量匯出功能
- 新增月報表生成功能
- 🎨 系統優化
- 升級 CSS 版本至 v2.36.0 以解決快取問題
- 修復語法錯誤與潛在 Bug
- 📊 管理員儀表板視覺大升級
- 新增 Bento Grid 現代化佈局與 Rainbow Spectrum 全光譜漸層圖表
- 引入 Glassmorphism 毛玻璃效果與互動呼吸燈動畫
- 優化 RWD 手機版顯示與圖表水平捲動支援
- 🚀 整合 GitHub Actions，實現自動化部署流程
- 🔐 強化安全性：全面使用 GitHub Secrets 管理敏感資訊 (Firebase Config)
- 🛠️ 優化部署邏輯：確保自動化打包與部屬的配置準確性
- 🛠️ 新增管理員自定義「不開放時段」功能
- 🔒 預約選單禁排時段自動鎖定與灰階顯示
- 📱 優化首頁按鈕群組 RWD 排版
- 🎨 強化 Firestore 安全性規則
- 🚀 再放寬預約頻率限制：每小時 30 次、每天 100 次預約，解決大量預約時的限制困擾。
- 🔄 強制快取刷新：更新 Service Worker 版本以確保老師們能立即套用最新限制設定。
- 🎨 優化控制面板 UI：繽紛配色與現代化設計
- 🎨 美化日期選擇器與下拉選單
- 🔍 優化搜尋功能：自動搜尋未來 180 天範圍
- 🔍 擴大關鍵字搜尋：支援搜尋預約理由
- 🗓️ 優化月視圖：顯示詳細預約資訊（節次+借用者）
- 📅 放寬預約間隔限制：從 30 天增加至 180 天（半年）
- 🎨 新增月視圖預約標籤樣式
- 📜 新增歷史記錄查詢功能：按月份查看預約記錄
- 📜 新增批次預約功能：一次選擇多個日期
- 📜 新增日曆多選介面
- 🔍 新增進階搜尋功能：預約者姓名搜尋
- 🔍 新增節次篩選下拉選單
- 🔍 搜尋結果高亮顯示
- 🔍 點擊結果快速跳轉至該週日曆
- 🎨 全新紫藍漸層配色系統 (#667eea → #764ba2)
- 🎨 彩色陰影效果優化
- 🎨 預約卡片紫色漸層美化
- 🎨 圓角設計優化 (8/12/20px)
- 🔐 Firestore 安全規則強化：完整欄位驗證、長度限制、格式驗證
- 🔐 新增 Rate Limiting：每小時 20 次、每天 50 次預約限制
- 🔐 新增裝置識別碼 (deviceId) 追蹤預約來源
- ✨ 新增視圖切換與彈窗動畫 (Fade-in / Scale-in)
- ✨ 新增資料載入骨架屏 (Skeleton Loading)
- ✨ 優化按鈕點擊微互動效果 (Active Scale)
- ✅ 優化 Header UI：標題置中、加大字體與陰影效果
- ✅ 優化管理員按鈕：增加邊框與懸停效果，提升辨識度
- ✅ 修復 HTML 結構損壞導致的樣式崩潰問題
- ✅ 修復 JavaScript 初始化錯誤
- ✅ 修正手機端週曆視圖切換後排版錯誤問題 (強制垂直排列)
- ✅ 移除 JavaScript 中與 CSS 衝突的行內樣式
- ✅ 優化視圖切換邏輯
- ✅ 修正手機端切換月曆視圖時週曆仍顯示的問題
- ✅ 切換視圖時自動滾動到日曆區域
- ✅ 改用 class 控制顯示/隱藏以避免 CSS 覆蓋問題
- ✅ 優化手機端 RWD 排版
- ✅ 週曆卡片改為垂直排列
- ✅ 移除水平捲動，改為上下滑動
- ✅ 新增手機端底部預約按鈕
- 初始版本發布
- 週/月視圖切換
- 預約 CRUD 功能
- 管理員驗證
- 統計圖表
- CSV 匯出
# 啟動本地伺服器
npx http-server -p 8080 -c-1
# 開啟瀏覽器
http://127.0.0.1:8080firebase deploy推送至 main 分支即自動部署。
© 2026 學校禮堂預約系統