1.1.6 • Published 3 years ago
进度折叠卡片
@teamix/progress-collapse-card
带有进度条、可折叠的内容展示卡片。适用于显示资源负载、项目进程等。
API
| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
|---|
| title | 标题 | false | ReactNode | - | |
| dataTitle | 列头显示文字 | false | dataTitle {} | - | |
| dataSource | 数据数组 | true | dataSource [] | [] | |
| grid | 栅格配置 | false | grid {} | grid | |
| progressGrid | 进度条栅格配置 | false | progressGrid {} | progressGrid | |
| numericalFontFamily | 数值字体 | false | 'TXDDINMediumNumber' | 'default' | 'TXDDINMediumNumber' | |
| loading | 加载状态 | false | boolean | object | false | |
| noData | 无数据占位 | false | ReactNode | 暂无数据 | |
| expanded | 展开状态 | false | boolean | true | |
| onExpand | 展开操作 | false | (visibility) => void | - | |
| onlyContent | 仅展示内容 | false | boolean | false | |
dataTitle
| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
|---|
| used | 已使用 | false | ReactNode | - | |
| usable | 未使用 | false | ReactNode | - | |
| total | 总数 | false | ReactNode | - | |
dataSource
| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
|---|
| name | 名称 | true | ReactNode | - | |
| icon | 图标 | false | ReactNode | - | iconType |
| percent | 百分比 | true | number | - | |
| progressProps | 进度条配置 | false | Progress {} | - | |
| used | 已使用数量 | true | number | - | |
| usable | 未使用数量 | true | number | - | |
| total | 总数数量 | true | number | - | |
grid
| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
|---|
| gutter | 栅格间隔 | false | number | 8 | |
| span | 栅格占位格数 | false | number [] | 6, 9, 3, 3, 3 | |
progressGrid
| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
|---|
| gutter | 进度条栅格间隔 | false | number | 16 | |
| span | 进度条栅格占位格数 | false | number [] | 14， 7 | |
| textAlign | 进度条文字对齐方式 | false | 'left' | 'center' | 'right' | 'right' | |