cloud-ui.vusion/src/components/u-selectable-steps.vue/api.yaml

Vusion Cloud UI

- name: u-selectable-steps
  title: 步骤条
  icon: steps
  labels:
    - Selector
  description: 当操作需要分步骤时使用
  attrs:
    - name: data-source
      title: 数据源
      type: Array<Item> | Function | Object
      description: 展示数据的输入源，可设置为数据集对象或者返回数据集的逻辑
      designer-value: "[{}, {}, {}]"
      group: 数据属性
    - name: data-schema
      title: 数据类型
      type: schema
      description: 集合类型每一元素的数据类型
      group: 数据属性
      compType: dataTypeSelect
    - name: title-field
      title: 标签项标题
      type: string
      default: title
      description: 数据源集合的元素，用于显示步骤标题的属性
      group: 数据属性
      advanced: true
    - name: desc-field
      title: 描述项标题
      type: string
      default: desc
      description: 数据源集合的元素，用于显示步骤描述的属性
      group: 数据属性
      advanced: true
    - name: value
      title: 当前步骤
      type: number
      sync: true
      model: true
      default: 0
      group: 数据属性
      description: 设置当前处于选中状态的步骤
      brifeDoc: ""
      docDescription: 当前步骤数
      tooltipLink: ""
    - name: direction
      title: 步骤条方向
      type: string
      options:
        - value: horizontal
          title: 横向
        - value: vertical
          title: 竖向
      default: horizontal
      description: ""
      group: 主要属性
      brifeDoc: ""
      docDescription: 步骤条的方向，支持水平或垂直
      tooltipLink: ""
    - name: readonly
      title: 只读
      type: boolean
      default: false
      description: 正常显示，但禁止选择/输入
      group: 状态属性
      brifeDoc: ""
      docDescription: 是否只读，非只读的情况下可以选择
      tooltipLink: ""
    - name: disabled
      title: 禁用
      type: boolean
      default: false
      description: 置灰显示，且禁止任何交互（焦点、点击、选择、输入等）
      group: 状态属性
      brifeDoc: ""
      docDescription: ""
      tooltipLink: ""
    - name: size
      title: 尺寸
      type: string
      options:
        - value: auto
          title: 自适应
        - value: normal
          title: 正常
      default: normal
      description: ""
      group: 样式属性
      brifeDoc: ""
      docDescription: 设置尺寸
      tooltipLink: ""
  slots:
    - concept: Slot
      name: default
      description: 插入`<u-selectable-step>`子组件。
      support:
        - name: u-selectable-step
          title: 步骤条子组件
          snippet: '<u-selectable-step><template #title><u-text text="步骤
            N"></u-text></template></u-selectable-step>'
    - concept: Slot
      name: title
      title: 头部标题
      slotProps:
        concept: Param
        name: current
        typeAnnotation:
          concept: TypeAnnotation
          typeKind: generic
          typeNamespace: nasl.ui
          typeName: Current
          typeArguments:
            - concept: TypeAnnotation
              typeKind: typeParam
              typeName: T
    - concept: Slot
      name: desc
      title: 描述
      slotProps:
        concept: Param
        name: current
        typeAnnotation:
          concept: TypeAnnotation
          typeKind: generic
          typeNamespace: nasl.ui
          typeName: Current
          typeArguments:
            - concept: TypeAnnotation
              typeKind: typeParam
              typeName: T
  methods:
    - name: reload
      description: 重新加载数据
      params: []
  events:
    - name: before-select
      title: 选择前
      description: 选择某一步骤前触发
      advanced: true
      params:
        - name: $event
          type: object
          description: 自定义事件对象
          schema:
            $ref: "#/systemTypes/ChangeEvent"
        - name: value
          type: any
          description: 选中步骤的值
        - name: oldValue
          type: any
          description: 旧的值
        - name: itemVM
          type: SelectableStep
          description: 选中步骤实例
        - name: $event.preventDefault
          type: Function
          description: 阻止选择流程
    - name: select
      title: 选择后
      description: 选择某一步骤时触发
      params:
        - name: $event
          type: object
          description: 自定义事件对象
          schema:
            $ref: "#/systemTypes/ChangeEvent"
        - name: value
          type: any
          description: 选中步骤的值
        - name: oldValue
          type: any
          description: 旧的值
        - name: itemVM
          type: SelectableStep
          description: 选中步骤实例
    - name: change
      title: 改变后
      description: 步骤数改变后触发
      params:
        - name: $event
          type: object
          description: 自定义事件对象
          schema:
            $ref: "#/systemTypes/ChangeEvent"
        - name: value
          type: number
          description: 当前步骤数
        - name: oldValue
          type: number
          description: 旧的步骤数
- name: u-selectable-step
  title: 步骤条项
  attrs:
    - name: title
      title: 标题
      type: string
      description: 步骤标题文本
      advanced: true
    - name: desc
      title: 描述信息
      type: string
      default: ""
      description: 步骤描述信息
      advanced: true
    - name: status
      title: 状态值
      type: string
      options:
        - value: pending
          title: 等待
        - value: selected
          title: 进行中
        - value: passed
          title: 完成
        - value: failed
          title: 错误
      group: 数据属性
      description: 若不配置该属性时，会使用步骤条的当前步骤来自动指定状态；如果该属性与当前步骤指定的状态不匹配会覆盖自动匹配的状态
    - name: icon
      title: 图标
      type: icon
      default: ""
      description: ""
      group: 主要属性
      brifeDoc: ""
      docDescription: 在该步骤展示的图标
      tooltipLink: ""
    - name: readonly
      title: 只读
      type: boolean
      default: false
      description: 正常显示，但禁止选择/输入
      group: 状态属性
      brifeDoc: ""
      docDescription: 是否只读，非只读的情况下可以选择
      tooltipLink: https://help.lcap.163yun.com/99.%E5%8F%82%E8%80%83/40.%E9%A1%B5%E9%9D%A2IDE/30.%E9%A1%B5%E9%9D%A2%E7%BB%84%E4%BB%B6/05.PC%E9%A1%B5%E9%9D%A2%E5%9F%BA%E7%A1%80%E7%BB%84%E4%BB%B6/07.%E9%80%89%E6%8B%A9%E5%99%A8/170.%E6%AD%A5%E9%AA%A4%E6%9D%A1.html
    - name: disabled
      title: 禁用
      type: boolean
      default: false
      description: 置灰显示，且禁止任何交互（焦点、点击、选择、输入等）
      group: 状态属性
      brifeDoc: ""
      docDescription: 禁用该项
      tooltipLink: ""
  slots:
    - concept: Slot
      name: default
      description: 插入文本或 HTML
    - concept: Slot
      name: title
      description: 自定义标题文本
  description: 步骤条项