@teamix/data-summary
Version:
47 lines (40 loc) • 2.85 kB
Markdown
# 数据概览_spacex
@teamix/data-summary
数据概览，数据展示
## API
| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
| ------ | ---- | ---- | ---- | ------ | ---- |
| dataSource | 数据项 | 是 | [IDataItem](#idataitem) 或者 [IDataItem](#idataitem)[]，参考 IDataItem 定义 | | |
| title | 标题 | 否 | React.ReactNode | | |
| subTitle | 副标题 | 否 | React.ReactNode | | |
| loading | 加载中状态 | 否 | Boolean | false | |
| noBorder | 没有边框 | 否 | Boolean | false | 默认带边框 |
| noPadding | 没有内边距 | 否 | Boolean | false | 默认带内边距，无边距的情况下也没有边框 |
| backgroundState | 背景色状态 | 否 | 'normal', 'success', 'error', 'warning', 'help', 'grey' | |想定制背景色可通过style属性指定|
| increase | 增减百分比，正数表示增加，负数表示减少 | 否 | number | | |
| increaseUnit | 增减单位 | 否 | string | % | |
| progress | 进度 | 否 | number | | |
| progressState | 进度条状态，可快捷设置进度条颜色，当 progress 不为空时有效 | 否 | 'normal', 'success', 'error' | | 对应 Progress 的 state 属性 |
| progressColor | 进度条颜色，当 progress 不为空时有效 | 否 | string | | 对应 Progress 的 color 属性 |
| style | 自定义样式 | 否 | React.CSSProperties | | |
| action | 自定义操作区 | 否 | React.ReactNode | | |
| extra | 自定义扩展区 | 否 | React.ReactNode | | |
| footer | 自定义底部内容 | 否 | React.ReactNode | | |
| prefixType | 卡片前缀状态，当设置 prefix 或 prefixIcon 后生效 | 否 | 'inner', 'outer' | 'inner' | |
| prefix | 卡片前缀文案 | 否 | React.ReactNode | | |
| prefixIcon | 卡片前缀图标 | 否 | string | | 对应 Icon 的 type 属性 |
| prefixState | 卡片前缀状态 | 否 | 'normal', 'success', 'warning', 'error' | | |
| onDataItemClick | 点击回调函数 | 否 | Function | | |
### IDataItem
数据项
| 参数名 | 说明 | 必填 | 类型 | 默认值 | 备注 |
| ------ | ---- | ---- | ---- | ------ | ---- |
| data | 数据 | 是 | number | | |
| description | 描述文案 | 是 | React.ReactNode | | |
| icon | 图标 | 否 | string | | 对应 Icon 的 type 属性 |
| unit | 数据单位 | 否 | string | | 如 '%', '个', '℃' |
| align | 数据项水平对齐 | 否 | 'center', 'left', 'right' | 'left' | |
| status | 数据状态 | 否 | 'success', 'error' | | |
| dataAlign | 数值水平对齐 | 否 | 'center', 'left', 'right' | 'left' | |
| url | 跳转地址 | 否 | string | | |
| onClick | 点击回调函数 | 否 | Function | | |