V1.0.0
Skip to content

WTimeline 组件 ​

时间线组件,基于 WinDesignNext Timeline 封装,用于垂直展示时间流信息(如就诊记录、操作日志、审批流程等)。

子组件结构:WTimeline 容器 + WTimelineItem 节点,用法类似 WCollapse + WCollapseItem。

基础用法 ​

Props API ​

WTimeline ​

属性类型默认值说明
componentstringWTimeline组件类型(必填)
reversebooleanfalse是否倒序排列
modestringstart布局模式:start / alternate / alternate-reverse / end
childrenstring[]—WTimelineItem 子组件 ID 列表

WTimelineItem ​

属性类型默认值说明
componentstringWTimelineItem组件类型(必填)
timestampstring | DataBindingValue—时间戳文字
hideTimestampbooleanfalse是否隐藏时间戳
typestring | DataBindingValue—节点类型:primary/success/warning/danger/info/error
colorstring | DataBindingValue—自定义节点颜色
sizestringnormal节点尺寸:normal / large
placementstringbottom时间戳位置:top / bottom / header
hollowbooleanfalse空心节点
childrenstring[]—节点内容子组件 ID 列表

path 支持说明 ​

组件支持 path 的属性说明
WTimeline—纯容器,属性均为静态配置
WTimelineItemtimestamp, type, color动态时间、状态类型与颜色

动态时间戳与状态 ​

json
{
  "component": "WTimelineItem",
  "timestamp": { "path": "/dischargeTime" },
  "type": { "path": "/dischargeType" },
  "children": ["text_discharge"]
}

使用场景 ​

场景推荐配置
就诊/操作记录多个 WTimelineItem + Text 内容
审批流程type: "success" / "warning" 区分状态
动态数据驱动timestamp/type 使用 path 绑定 dataModel
交替布局WTimeline mode: "alternate"

注意事项 ​

  • WTimelineItem 必须作为 WTimeline 的 children 使用
  • 节点内容通过 children 引用 Text、WText 等子组件
  • A2UI JSON 不支持 icon 组件类型属性(需静态字符串图标名)