> For the complete documentation index, see [llms.txt](https://bai-da-shuspersonal-organization.gitbook.io/2025wmg/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bai-da-shuspersonal-organization.gitbook.io/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/4.0-jing-sai-zi-xun/4.2-yun-dong-zhong-lei-lie-biao/4.2.1-yun-dong-zhong-lei-nei-ye/sai-cheng-biao-qu-kuai.md).

# 賽程表區塊

### 設計規格

<figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FqiT2hQcWRkCFkSedIRQN%2FFrame%20627233.png?alt=media&amp;token=4620af78-4449-4a80-8651-4fcb4e51c0cb" alt=""><figcaption></figcaption></figure>

#### 1. 賽程日曆

<figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FkXmz7useklgzTsox0b5S%2FFrame%20627231.png?alt=media&amp;token=711821a3-69ca-49ee-8524-9274842c2f2a" alt=""><figcaption></figcaption></figure>

* 月曆列出賽事階段日期(5/17～5/30)
* 以淺紫圓形標示有安排賽程的日期，\
  如：棒球於5/18、5/24、5/25、5/27有安排賽程，則這四天均會標示淺紫圓形
* 深紫色為使用者所選取日期，或系統依照當下日期，切換至未來最近的賽程日期，\
  如：今日5/22，則預設會自動選取5/24日期，並顯示5/24的賽程內容
* 若為手機版，則改以下拉選單形式呈現

  <div align="left"><figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FKJHwjHIlCWjLxn6k5KNr%2FFrame%20627340.png?alt=media&amp;token=d200b2ef-620c-4deb-8b18-61f378f79563" alt=""><figcaption></figcaption></figure></div>

#### 2. 賽程日期

<div align="left"><figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FsH48oeX3t5X1ThiD7VxF%2F%E7%95%B6%E6%97%A5%E6%97%A5%E6%9C%9F.png?alt=media&amp;token=6a143faf-6e9e-48bb-8671-2c9257a22b73" alt=""><figcaption></figcaption></figure></div>

* 使用者或系統自動選取的賽程日期
* 賽程元件內容依照此日期顯示相對應內容

#### 3. 賽程元件

<div align="left"><figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FnwQlSK9PcCiOjAfxRfQa%2FFrame%20627348.png?alt=media&amp;token=e10aa0fa-4d57-4c48-9294-1d77ccc6269b" alt=""><figcaption></figcaption></figure></div>

* 由後台上稿該運動種類特定日期的賽程內容
* 欄位組成：
  * 賽程時間，如：10:00
  * 運動科目，如：棒球
  * 賽程內容，如：初賽A組(競賽)
  * 競賽場館，如：天母棒球場
    * 點選可前往相對應[4.4.1-競賽場館內頁](/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/4.0-jing-sai-zi-xun/4.4-jing-sai-chang-guan-lie-biao/4.4.1-jing-sai-chang-guan-nei-ye.md)
  * 內容超過寬度，則自動往下斷行排列
* 賽程元件排序\
  依照賽程時間，以N字型順序排序，如下示意：

  <figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FBtzlAwzIWnmsfcfc2vlL%2FFrame%20627347.png?alt=media&amp;token=8451acc6-fcbe-4f25-ab21-b65a33a9a5c0" alt=""><figcaption></figcaption></figure>

#### 4. 賽程列表左右切換按鈕

<div align="left"><figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FIq6lMeh1hioJZduYqccS%2F%E5%B7%A6%E5%8F%B3%E5%88%87%E6%8F%9B%E9%88%95.png?alt=media&amp;token=d82a067d-05d6-4257-a071-4256e597a209" alt=""><figcaption></figcaption></figure></div>

* 點選可左右切換賽程元件，至次頁賽程元件列表

#### 5. 前往完成賽程按鈕

<div align="left"><figure><img src="https://933433492-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FigGuRzvi7b8gTMDtYDBn%2Fuploads%2FnUEbl5fKnrN9HGWEcpo4%2FPrimary.png?alt=media&amp;token=fbca4a9d-cf90-47c7-a16d-9a54bbdfeb58" alt=""><figcaption></figcaption></figure></div>

* 點選按鈕，前往[4.1-賽程成績-競賽日程頁籤](/2025wmg/di-si-zhang-chan-pin-she-ji-gui-ge/4.0-jing-sai-zi-xun/4.1-sai-cheng-cheng-ji.md)

***

### 修訂紀錄

<table data-full-width="false"><thead><tr><th width="79" data-type="number">序號</th><th width="121">修訂時間</th><th width="300">主要修改內容</th><th width="142">修訂來源</th><th>備註</th></tr></thead><tbody><tr><td>1</td><td></td><td></td><td></td><td></td></tr><tr><td>null</td><td></td><td></td><td></td><td></td></tr></tbody></table>