时间类组件(时钟 / 计时 / 日历 / 时间选择 / 时间轴)
basic-timer/timing/calendar/timeselect/timescale,时间格式用 dayjs 记号。 返回目录:index.md;全量选项字典(最权威):widget-schema.generated.json。
10. 时间类(时钟 / 计时 / 日历 / 时间选择 / 时间轴)
时间格式全部用 dayjs 记号(
YYYY-MM-DD HH:mm:ss)。basic-timer/basic-timing/basic-card共享 basic-text 同款字体组(text-font/font-shadow-*/text-position等)。
10.1 basic-timer —— 时钟(实时时间)
- type:
basic-timer默认尺寸:[320,60]默认名: "时钟"(大屏顶栏标配) - 关键项:
time-format(YYYY-MM-DD HH:mm:ss)、time-zone(local/+8/+9/+0/-5/-8)、show-weekday(显示星期);字体组同 basic-text(渐变+发光可用)。无绑定字段。
10.2 basic-timing —— 计时器(正/倒计时)
- type:
basic-timing默认尺寸:[320,80]默认名: "计时器" - 关键项:
timing-mode(clockwise顺计/anticlockwise倒计);顺计time-begin-mode(project-firing项目启动时/custom+time-begin);倒计anticlockwise-mode(project-firing按时长+time-duration秒/custom到指定time-end);显示格式timing-unit(DD:HH:mm:ss)。无绑定字段。
10.3 basic-calendar —— 日历
- type:
basic-calendar默认尺寸:[320,300]默认名: "日历" - 用途:月历展示+选日期联动。自定义触发器:
itemClicked(选中日期)。 - 关键项:
date-format、week-start(0 周日/1 周一);头部calendar-header-height/calendar-header-font;单元格week-font/cell-font/cell-today-font/cell-other-font、选中cell-selected-bg-color/悬停cell-hover-bg-color。 - 绑定字段:
linkage-field(string,0~1) —— 选中日期与该字段联动筛选。
10.4 basic-timeselect —— 时间选择
- type:
basic-timeselect默认尺寸:[260,40]默认名: "时间选择" - 用途:选时间点/范围 → 联动筛选。自定义触发器:
itemClicked。 - 关键项:
time-type(date/datetime/time/year/month/week/daterange/datetimerange/timerange)、date-format(输出格式)、calendar-range-separator、placeholder/clearable;盒样式input-bg-color/input-text-color/input-border-color/input-radius。 - 绑定字段:
linkage-field(string,0~1)。
10.5 basic-timescale —— 时间轴
- type:
basic-timescale默认尺寸:[600,80]默认名: "时间轴" - 用途:时间刻度轴+游标(时序进度/回放定位)。自定义触发器:
timeChanged(游标变化)。 - 关键项:游标
cursor-size/cursor-img/cursor-color/cursor-offset-y;刻度scale-height/scale-width/scale-color/scale-line-*/scale-padding/scale-font。无绑定字段。