工程規格與改動清單

1 · 票券資料模型（核心）

目前票券只有名稱與價格，缺少「販售時間」與「數量」。建議把 feeItems 從 { name, price } 擴充為完整票券物件。

// 建議的票券型別（新增 data/ticket.ts，或擴充 activity.ts）
interface Ticket {
  id: string;
  name: string;            // 票種名稱
  price: number;           // 0 = 免費
  quantity: number | null;  // + 數量上限，null = 不限
  sold: number;             // + 已售（後端維護，前端唯讀）
  saleStart: Timestamp;     // + 販售開始
  saleEnd: Timestamp;       // + 販售結束
  description?: string;
  order: number;           // 排序用
}

狀態由系統計算，不另存欄位

報名端與編輯端共用同一個函式，避免主辦方手動上下架。

function ticketStatus(t: Ticket, now = new Date()) {
  if (t.quantity != null && t.sold >= t.quantity) return 'soldout';  // 已售完
  if (now < t.saleStart) return 'soon';                            // 尚未開賣
  if (now > t.saleEnd)   return 'ended';                           // 販售已截止
  return 'live';                                                  // 販售中（唯一可購買）
}

2 · 表單驗證調整

activity-form-schema.ts 的 feeItems.validation 需加上時間與數量檢查：

原本獨立的 feeAmount（單一費用）與 參加名額上限（schema:371）可由票券模型取代；保留與否視既有報名資料相容性決定。

3 · 報名表單排序：用拖曳（@dnd-kit）

npm i @dnd-kit/core @dnd-kit/sortable @dnd-kit/utilities

// FormPreview：用 SortableContext 包欄位，handleReorderFields 不用改
<DndContext onDragEnd={({ active, over }) => {
  if (over && active.id !== over.id) {
    const from = fields.findIndex(f => f.id === active.id);
    const to   = fields.findIndex(f => f.id === over.id);
    handleReorderFields(from, to);   // 既有函式直接重用
  }
}}>
  <SortableContext items={fields.map(f => f.id)}>
    {fields.map(f => <SortableFieldRow key={f.id} field={f} />)}
  </SortableContext>
</DndContext>
// SortableFieldRow 用 useSortable({id}) 取得把手 listeners，套到 grip 圖示上。

系統必填欄位（姓名 / Email）標記 locked：不給拖曳把手、固定最上方，並用 dnd-kit 的 modifiers 限制不可被拖到其上方。完整步驟見 INTEGRATION.md。

4 · 改動檔案清單

5 · 驗收標準