子表单明细
介绍
用于子表明细数据录入,即“子表单的子表单”。其内可配置添加输入组件,支持输入框、单选框、日期选择、文件上传等类型
API
Props
参数名 | 描述 | 类型 | 默认值 |
---|---|---|---|
status | 默认状态 | 'default' | 'readonly' | 'hide' | 'default' |
title | 标题 | string | - |
showLabel | 显示标题 | boolean | true |
value | 编辑默认值 | Array<Record<string, any>> | - |
labelWidth | 标签宽度 | number | - |
name | 数据字段 | string | ${组件编码}_${长度为8的随机字符串} |
showIndexCol | 显示序号 | boolean | false |
rowDraggable | 拖动排序 | boolean | false |
fixedLeft | 冻结左侧列 | 0|1|2 | 0 |
maxCount | 最大条数 | nunmber | - |
showAddBtn | 新增按钮 | boolean | true |
showActionCol | 显示操作列 | boolean | true |
actionColWidth | 操作列宽度 | number | 80 |
showCopyBtn | 复制 | boolean | true |
copyType | 复制位置 | "next"|"bottom" | "bottom" |
showRemoveBtn | 删除 | boolean | true |
validate | 校验 | Validate | - |
baseStyle | 自定义样式 , 表格整体自定义样式 | string | - |
customClass | 类名绑定 | string | - |
boxStyle | 盒模型, margin,border,padding设置 | BoxStyle | - |
uniqueKey | 唯一标识, 组件的唯一标识 | string | - |
tip | 气泡提醒 | string | - |
loop | 循环数据, 循环渲染设置 | Loop | - |
Props 字段列
参数名 | 描述 | 类型 | 默认值 |
---|---|---|---|
type | 数据编辑格式-数据类型,'input'|'select'|'treeSelect'|'inputNumber' |'date'|'time'|'switch'|'uploadFile' | string | 'input' |
colType | 数据展示类型,'text'|'custom' | string | 'input' |
renderFunc | 自定义展示配置 | function | - |
show | 是否回显 | boolean | true |
title | 标题 | string | - |
name | 数据字段 | string | - |
placeholder | 占位提示 | string | '请输入'|'请选择' |
width | 列宽 | number | - |
searchDelay | 搜索时间延迟时间,单位ms | number | 500 |
disabled | 禁用 | boolean | false |
required | 必填 | boolean | false |
requiredMsg | 必填错误提示 | string | - |
customValidate | 自定义校验 | boolean | false |
customValidateFunc | 自定义校验函数 | function | - |
append | 后置按钮 | boolean | false |
appendType | 后置类型,'text'|'icon' | string | 'text' |
appendText | 后置标签文字 | string | - |
appendIcon | 后置图标 | string | - |
options | 选项数据 | Array<Record<string, string|number>> | - |
fieldNames | 指定字段名 | { key: string, title: string, children?: string } | {key: 'key', title: 'value', children: 'children'} |
multiple | 多选 | boolean | false |
maxTagCount | 最大显示数量 | number | - |
allowSearch | 可搜索 | boolean | false |
filterOption | 是否过滤选项 | boolean | false |
filterTreeNode | 过滤函数 | function | - |
loading | 是否为加载中状态 | boolean | false |
isLoadMore | 开启异步加载 | boolean | false |
loadMore | 异步加载函数 | function | - |
precision | 数字精度 | number | - |
min | 最小值 | number | - |
max | 最大值 | number | - |
dateType | 选择器类型,'date'|'week'|'month'|'quarter'|'year' | string | 'date' |
format | 格式,'YYYY-MM-DD'|'YYYY-MM-DD HH'|'YYYY-MM-DD HH:mm'|'YYYY-MM-DD HH:mm:ss' | string | 'YYYY-MM-DD' |
isRangeSelect | 范围选择 | boolean | false |
disabledDate | 不可选取的时间 | function | - |
hideDisabledOptions | 隐藏禁止选择的选项 | boolean | false |
disabledHours | 禁用的小时选项 | Array<number> | - |
disabledMinutes | 禁用的分钟选项 | Array<number> | - |
disabledSeconds | 禁用的秒数选项 | Array<number> | - |
switchType | 类型,'circle'|'round'|'line' | string | 'circle' |
fileName | 上传文件名,'file'|'files' | string | 'files' |
valueFormat | 默认值数据格式,'default'|'object' | string | 'default' |
extraData | 额外数据 | function | - |
setUrl | 文件预览地址 | function | - |
btnTitle | 按钮内容 | string | - |
btnType | 按钮类型,'primary'|'default'|'outline' | string | 'default' |
directory | 文件夹上传 | boolean | false |
maxFileNum | 最大上传文件个数 | number | 6 |
maxFileSize | 单文件最大上传大小(MB) | number | 20 |
withCredentials | 是否允许请求cookie | boolean | false |
autoUpload | 自动上传 | boolean | true |
accept | 上传文件类型 | string | - |
enablePreview | 开启预览 | boolean | false |
previewEvent | 预览事件 | function | - |
enableDownload | 开启下载 | boolean | true |
downloadEvent | 下载事件 | function | - |
Events
事件名 | 描述 | 参数 |
---|---|---|
onChange | 值变化时调用 | ctx:PangeaContext params:{ value: any } loop:LoopParams |
Type
javascript
// 校验配置信息
type Validate = {
"required": boolean,
"min": boolean,
"requiredMsg": string,
"minLength": number,
"minMsg": string
}
// 盒模型
type BoxStyle = {
"marigin": [string|string|string|string],
"border": [string|string|string|string],
"padding": [string|string|string|string],
"borderColor": 'color-border-1'|'color-border-2'|'color-border-3'|'color-border-4',
"borderStyle": 'solid'|'dotted'|'dashed'
}
// 循环
type Loop = {
"data": any[],
"paramName": string,
"indexName": string,
"key": string
}
// 循环变量数据参数
type LoopParams = {
"indexName":string,
"paramName":string,
"ref":ComputedRefImpl, // 全部的循环变量数据
"row":any,
"rowIndex":number
}[]