羽毛球分組配對器

這是一個使用 React + Vite + TypeScript 製作的網頁應用程式，用來將 A 區與 B 區成員配成羽毛球隊伍。

功能說明

• 分別輸入 A 區與 B 區名單
• 可指定要寫入資料庫的目標日期
• 每次固定產生 3 組完整配對結果
• 每一隊都由 1 位 A 區 + 1 位 B 區 組成
• 每一組都會把 A 區與 B 區名單完整分配完成
• 若某一區人數不足，系統會自動補入「那個」
• 產生配對後可用按鈕手動上傳資料到資料庫
• 若指定日期已經有資料，上傳前會先詢問是否覆蓋
• 可讀取指定日期的資料庫內容並回填到畫面
• 若指定日期沒有資料，畫面會顯示「指定日期沒有資料」
• 支援換行、半形逗號、全形逗號與頓號輸入
• 會自動去除空白與重複名稱

使用方式

npm install
npm run dev

前端開發網址預設為：

http://localhost:3500

資料庫欄位

• time: 目標日期，格式為 YYYYMMDD
• personnel: 人員清單，格式為 [[1,"A區成員"],[0,"B區成員"]]
• battlecombination: 三組隊伍搭配，格式為 {"0":[["A","B"]],"1":[...],"2":[...]}

正式建置

npm run build

Docker 部署

這個專案已提供單容器部署方式，容器啟動後會同時提供：

• 網頁前端
• /api 後端
• MariaDB 寫入功能

建立映像

docker build -t badminton-match-hub .

啟動容器

docker run -d \
  --name badminton-match-hub \
  -p 8787:8787 \
  -e PORT=8787 \
  -e DB_HOST=192.168.0.15 \
  -e DB_PORT=3307 \
  -e DB_USER=jianmiau \
  -e DB_PASSWORD=你的密碼 \
  -e DB_DATABASE=badminton \
  -e DB_TABLE=badminton \
  badminton-match-hub

NAS 上建議設定

• 容器埠使用 8787
• 對外埠可自訂，例如 8787:8787
• 環境變數請在 NAS 的 Docker 介面中填入
• 不要把本機 .env 直接打包進映像

部署完成後可直接透過：

http://NAS_IP:8787

開啟系統。

docker-compose

專案也已提供 docker-compose.yml。

docker compose up -d --build

Compose 版本預設會：

• 對外使用 3500
• 容器內部使用 3500
• 讀取 .env 內的資料庫設定

部署後可透過：

http://NAS_IP:3500

開啟系統。