TimePicker 時間選擇器

選擇任意時間(時、分可自由捲動)。使用 Element Plus 的 el-time-picker。

設計準則

• 和 TimeSelect 的分工:任意時間用 TimePicker,固定檔位(每 30 分鐘一格)用 TimeSelect
• 時間一律 24 小時制;不需要秒就用 format="HH:mm" 拿掉
• 用 disabled-hours 等限制擋掉業務上不合理的時段(深夜發送),並附文字說明
• 時段起訖用 is-range

基本用法

loading

尺寸

跟著同一列元件的尺寸走:後台表單用預設,表格內、工具列用 small:

loading

時間區間

loading

限制可選時段

loading

Do / Don't

✅ Do	❌ Don't
任意時間才用 TimePicker	預約時段也用(用 TimeSelect)
擋掉不合理時段 + 文字說明	讓使用者選了 03:00 才報錯
24 小時制	上午/下午

給工程師

完整 API 見 Element Plus TimePicker 文件。 本站規範優先於 EP 文件中的視覺建議。