@hanmotec/flex-common-api NPM

动态表单公共api

卡片字段

卡片字段用于描述卡片中每个展示的字段，包括类型，标题，大小等。卡片的属性如下：

属性	名称	类型	默认值	备注
name	字段的名称	string		字段的名称
wrapperKey	嵌套对象的key	string		嵌套对象属性名称，支持多层嵌套属性，用.分割
keyCode	字段的属性	string		字段对应的属性名称，如果不存在，使用字段名称
label	标签	string	-	字段的标签文字
required	是否必填	boolean	false	是否必填，在标签中现在*，同时提交时做校验
type	类型	string	-	类型，各种类型请参照字段类型实现接口
dicName	数据字典名	string	-	对于所有使用数据字典展示key-value组的类型定义管理的数据字典编码
isDummy	是否虚拟字段	boolean	true	是否虚拟字段，虚拟字段不存储，根据数据计算得出
enable	是否可用	boolean	true	是否可用
readonly	是否只读	boolean	false	是否只读字段
visibility	是否只读	enum	1	-1 - 隐藏不占位0 - 隐藏但是占据位置1 - 显示
style	额外的样式	string	-	字段的额外样式
panelAttrs	字段的布局属性	object	-	现在仅仅包含span，用于指定占用的列数，未来准备支持rowSpan
attrs	字段的属性	object	-	字段的其他属性，比如下拉框等，每个类型中有处理
onChange	值发送变化的事件处理	string	-	当数据变化时的处理函数名
onBlur	失去焦点的事件	string	-	当失去焦点时的处理函数名

动态卡片

动态卡片请参考动态卡片文档

动态表单

动态表单请参考动态表单文档

动态脚本编译

用法

import scriptEngine from "@hanmotec/flex-common-api"

const dicLoader = (dicNames) => {
    //根据数据字典的名称读取对应的数据字典
}

onMount(async () => {
    form = await loadForm(); //从动态表单系统读取表单的脚本和布局
    let formClass = scriptEngine.build(utils, form, dicLoader);
    let bizForm = new formClass(data);
})

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago