更新时间:2024-06-28 GMT+08:00

全量inputs

全量inputs类型总览

inputs类型

对应控件名称

样式

extendProp扩展

input

单行输入框

  • visibleConditions
  • disabledConditions

inputNumber

数字输入框

  • visibleConditions
  • disabledConditions

switch

开关

  • visibleConditions
  • disabledConditions

singleSelect

下拉单选框

  • options
  • apiType
  • apiOptions

multipleSelect

下拉多选框

  • options
  • apiType
  • apiOptions

keyValuePair

键值对

  • visibleConditions
  • disabledConditions

radio

单选框

options

timeInterval

时间间隔控件

  • visibleConditions
  • disabledConditions

shell

shell控件

  • visibleConditions
  • disabledConditions

endpoint:${XXX}(其中,“XXX”为扩展点“module_id”)

扩展点下拉单选框

  • visibleConditions
  • disabledConditions

控件基础字段

字段名称

含义

是否必填

备注

name

控件唯一标识。

同一基础插件内不允许重复。

label

控件标题。

-

type

控件类型。

-

defaultValue

初始值。

控件初始默认值,可为空。

description

控件描述。

控件名称右侧问号内描述信息。

required

控件是否必填。

带星号为必填。

validation

校验信息,是一个对象,包含requiredMessage、regex、regexMessage三个属性。

{
    requiredMessage: '',    // 必填项提示语
    regex: '',              // 正则校验
    regexMessage: ''        // 正则校验失败的提示语
}

extendProp

扩展字段

{
     visibleConditions: [],
     disabledConditions: []
     ...
}

针对特殊控件的功能扩展使用,详见extendProp扩展基础功能

extendProp扩展基础功能

字段名称

含义

是否必填

备注

visibleConditions

按条件显示。

格式如下,可包含多个显示条件:

[{},{},{},...]

示例:

[{comp:'key_001',symbol:'===', value: 'xxx'}]

表示如果当前控件为A,当其他控件中存在唯一标识为key_001的控件B,且控件B的值满足等于xxx这个条件时,则当前控件A显示。

symbol包含如下四种:

  • ===:等于
  • !==:不等于
  • empty:为空
  • notEmpty:非空

disabledConditions

按条件禁用。

格式如下,可包含多个禁用条件:

[{},{},{},...]

示例:

[{comp:'key_002',symbol:'!==', value: 'yyy'}]

表示如果当前控件为A,当其他控件中存在唯一标识为key_002控件B,且控件B的值满足不等于yyy这个条件时,则当前控件A禁用。

symbol包含如下四种:

  • ===:等于
  • !==:不等于
  • empty:为空
  • notEmpty:非空

options

固定下拉选项,类型为list。

示例:

[{label: '选项1',value: 1},{label: '选项2',value: 2}]

apiType

下拉选项类型:

  • fixed:使用options内的值作为下拉选项。
  • api:通过接口请求,需配置apiOptions。

不填则为fixed。

apiOptions

JSON体,包含api接口使用的各个参数

示例:

'{"body":{"xxx":111},"header":{"yyy":222},"linkedFields":["key_001"],"method":"POST","params":{"zzz":333},"remote":true,"remoteName":"xxx","remoteQueryField":"body","responseUrl":"data","label":"name","value":"id","url":"https://sss/lll/mmm"}'

JSON解析后:

{
    body: {xxx:111},             // 参数为接口对应传参字段
    header: {yyy: 222},          // 请求头字段
    params: {zzz: 333},          // 参数为接口对应传参字段
    linkedFields: ['key_001],    // 为联动其他控件字段,当其他控件值改变时,接口会重新触发调用,并清空选项
    method: 'POST',              // 请求方式:POST/GET
    remote: true,                // 是否开启远程搜索
    remoteName: 'tt',            // 开启远程搜索时搜索字段
    remoteQureyField: 'body',    // 远程搜索字段传参形式 body/params
    responseUrl: 'data',         // 解析返回值获取选项list的路径
    label: 'name',               // 下拉框控件中显示label对应的参数
    value: 'id',                 // 下拉框控件中实际value对应的参数
    url: 'https://sss/lll/mmm'   // 接口url
}