tw-menu-picker｜今天吃什麼？隨機選餐器
「早餐要吃什麼？」「中午便當誰要訂？」每天都要想一次。
把店家菜單放進來，按一個按鈕，這個網頁就幫你：
- 隨機配一組：主餐＋飲料（或只要主餐、只要飲料），附價格明細
- 依條件篩選：主餐類別、飲料類型、總價上限、不要的食材／過敏
- 絕不超過預算；最近抽過的組合會盡量避開，「再抽一次」不會一直抽到同一組
- 團體訂餐：輸入人數和總預算，一次排出全辦公室的訂單，附「叫餐彙總」（每樣幾份），直接打電話給店家
- 收藏組合、最近選擇、一鍵複製文字貼到 LINE
- 飲料店可以隨機附上甜度、冰塊
- 深色模式、手機好操作
免安裝、免伺服器：雙擊 index.html 就能用。收藏和紀錄只存在你這台電腦的瀏覽器。
線上試用（示範資料）：https://larryveryhandsome.github.io/tw-menu-picker/
內建三份菜單：示範早餐店、示範便當店、示範飲料店。店名、品項、價格、電話（0900-000-001～003）全部是假的。
這是什麼
一個純網頁的「隨機選餐器」。菜單可以是內建的，也可以把 Excel 菜單直接複製貼上；
選好條件按「幫我選！」，就會在符合條件、而且不超過預算的所有組合裡，公平地隨機抽一組。
條件太嚴抽不出來時（例如預算 30 元但最便宜的組合要 45 元），會直接告訴你差多少，不會當掉。
適合誰
- 店家：放在官網、LINE 官方帳號選單、桌上 QR code，讓選擇困難的客人玩，順便看到整份菜單
- 辦公室：每天訂便當／飲料，人數和預算一輸入就排好，複製貼到群組
- 選擇困難的人：把常去那幾家的菜單存起來，每天交給它決定
5 分鐘開始
- 下載這個專案（綠色 Code 按鈕 → Download ZIP），解壓縮。
- 雙擊
index.html，先用內建的示範菜單玩玩看。
- 上方「菜單」可以切換早餐店／便當店／飲料店；「團體訂餐」分頁可以一次排好多人份。
- 要換成真的菜單，看下一節。
換成你的菜單（Excel → CSV）
方法一：直接貼上（最快）
- 打開
data/menu.example.csv（可用 Excel 開），照格式改成你的菜單。
- 把整張表（含第一列欄位名稱）選起來 → 複製。
- 網頁最下面展開「換成我的菜單」→ 貼上 → 按「套用這份菜單」。
也可以按「選擇 CSV／JSON 檔」。用 Excel 存檔時請選「另存新檔 → CSV UTF-8（逗號分隔）」，不然中文會變亂碼。
匯入的菜單會存在這台電腦的瀏覽器裡，下次打開還在；要給別人用，請用方法二。
欄位
| 欄位 | 必填 | 說明 |
|---|
| 類別 | | 例如 漢堡、蛋餅、便當；用來篩選主餐。空白會歸到「其他」 |
| 品名 | ✔ | |
| 價格 | ✔ | 0 以上的整數。35、35元、NT$35 都可以 |
| 標籤 | | 食材或特色，用頓號分開，例如 蛋、豬、辣；客人可以勾「不要」 |
| 是否飲料 | | 是／否。沒填時，類別或飲料類型看起來像飲料（茶、咖啡、豆漿…）就當飲料 |
| 飲料類型 | | 例如 茶、奶茶、咖啡、果汁；用來篩選飲料 |
| 備註 | | 自己看的，不影響抽選 |
格式有問題的列（沒品名、價格不是整數）會被略過，畫面會列出是第幾列、什麼問題。
方法二：內建到網頁（給店家官網用）
- 照方法一匯入後，按「匯出目前菜單 JSON」。
- 用記事本打開
data/menus.js，照裡面的格式加一份菜單（或直接改「示範早餐店」那份）。
- 把整個資料夾放上網站（GitHub Pages、任何虛擬主機都可以）。
設定（config.js）
用記事本打開 config.js：
| 設定 | 說明 |
|---|
title | 網頁標題 |
shop.name | 店名 |
shop.address | 地址，可留空；有填會出現「Google 地圖」連結 |
shop.phone | 電話，可留空；手機上點一下就能撥 |
shop.hours | 營業時間 |
shop.note | 頁尾說明，例如「價格與品項原則上以店家現場為準」 |
defaultMenu | 一打開先顯示哪份菜單（data/menus.js 的 id） |
noRepeatLast | 最近幾次抽過的組合盡量不要再抽到（預設 3） |
historyMax | 「最近選擇」保留幾筆 |
defaultBudget | 預設預算，空字串＝不限 |
defaultPeople | 團體訂餐預設人數 |
data/menus.js 裡每份菜單也可以有自己的 shop（覆蓋上面的店家資訊）和 extras（飲料隨機附加的選項，例如甜度、冰塊）。
怎麼抽的
- 先依條件篩出可以選的主餐和飲料，再列出所有不超過預算的組合，從裡面平均隨機抽一組，所以永遠不會超過預算。
- 最近 N 次（
noRepeatLast）抽過的組合會先排除；如果條件太嚴、只剩這幾組，才會重複，並在畫面上註明。
- 團體訂餐：每抽一個人，都先保留「剩下的人各點最便宜那組」需要的錢，所以只要預算一開始夠，就一定排得完，總價不會超過預算；選擇夠多時每個人盡量不一樣。
- 「不要的食材」會比對標籤，也會比對品名裡的字（例如輸入「蛋餅」就不會抽到任何蛋餅）。過敏請以店家實際說明為準，標籤只是參考。
給開發者
index.html 畫面
css/style.css 樣式（含深色模式、手機版）
config.js 店家資訊與設定
data/menus.js 內建示範菜單（window.MENUS，雙擊 index.html 也讀得到）
data/menu.example.csv CSV 範本（和「示範早餐店」內容相同，測試會檢查）
js/picker.js 核心：CSV 解析、菜單檢查、篩選、可重現的隨機抽選、團體訂餐、文字格式（純函式，UMD）
js/app.js 畫面邏輯
tests/ 單元測試（node:test，不用裝任何套件）
npm test
- 隨機數由外部傳入：
Picker.pickCombo(items, { rng: Picker.makeRng(42), budget: 80 })，同一個種子結果完全一樣，方便測試。
- 測試用固定種子跑 1000 次，確認從來不超過預算；也檢查篩選、不重複、不可能的條件、CSV（BOM、引號、Excel Tab）、團體訂餐、資料檔沒有真實電話或 email。
- 不載入任何外部 CDN，也不發出任何網路請求（唯一的外部連結是使用者自己點的 Google 地圖）。
注意事項
- 內建菜單、店名、電話都是虛構的示範資料。
- 價格與品項原則上以店家現場為準；過敏原請直接向店家確認。
🔑 需要金鑰嗎？
不需要。 沒有任何 API 金鑰、帳號或付費服務：抽選都在你的瀏覽器裡計算，Google 地圖只是一個開新分頁的連結（不呼叫 API）。詳見 docs/金鑰申請.md。
授權
Apache License 2.0
🛠️ 需要客製化？
這個工具是開源的，可以免費使用。如果你想要：
- 改成符合你們公司的流程、欄位或品牌
- 串接你現在在用的系統（LINE、Google 表單、POS、會計軟體……）
- 幫你安裝、架站、教學，或長期維護
歡迎加 LINE 跟我們聊。我們會依需求的範圍與複雜度報價，原則上以實際報價單為準。
- 💬 LINE：林其衞（請註明「隨機選餐器 客製化」）
- 🏢 留白事務所：網頁設計、AI 自動化、房仲遠端助理
- 👤 作者：留白事務所
