qt-public-ui/lib/IndexCard/index.zh-CN.md

新设计规范下业务组件库

## IndexCard.Group

| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| type | 卡片组的类型 | `default` \| `flex` | default |
| value | 卡片组的值 | number \| string \| (number | string)[] | - |
| defaultValue | 卡片组的默认值 | number \| string \| (number | string)[] | - |
| onChange | onChange事件 | function(value) | - |
| multiSelect | 是否开启多选模式 | boolean | false | 
| loading | 是否加载中 | boolean | false |
| max | 多选模式下最多选择的数量 | number | Infinity | 
| min | 多选模式下最少选择的数量 | number | 0 | 
| style | 样式 | React.CSSProperties | - |
| className | className | string | - | 


## IndexCard

单个indexcard，外层需包裹IndexCard.Group使用

| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| id | 类似select的value，作每个card的唯一标识 | string \| number | - |
| data | 卡片的数据 | Array<[CardInfo](/#/ui/IndexCard/#cardinfo) \| [CardSingle](/#/ui/IndexCard/#cardsingle)> | - |
| disabled | 是否disabled | boolean | - |
| render | 直接渲染card的内容 ｜ React.ReactNode | - | 
| type | 卡片类型 | `default` \| `simple` \| `pairs` | - |
| className | className | string | - | 



## IndexCard.Add

单个 添加卡片，外层需包裹IndexCard.Group使用

| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| icon | icon图标 | string | umicon-plus |
| text | 文本 | string | - | 
| visible | 是否可见 | boolean | true |
| onClick | 点击触发的事件 | onClick | - |
| type | 卡片类型 | `default` \| `simple` \| `pairs` | - |



#### CardSingle

卡片数据类型

| 参数 | 说明 | 类型 | 是否必填 |
| --- | --- | --- | --- |
| tips | tips的内容 | [TipsProps](/#/ui/Tips) | 否 | 
| value | 卡片的数值 | number | 否 | 
| valueType | value 的数据类型 | string | 否 | 
| title | 标题 | string | 是 | 
| ratios | 环比占比区域的内容 | [RatioItem]((/#/ui/IndexCard/#ratioitem))[] | 否 |
| links | 跳转链接 | { label: string, url: string } | 否 |

#### CardInfo

卡片数据类型

| 参数 | 说明 | 类型 | 是否必填 |
| --- | --- | --- | --- |
| button | 按钮的配置项 | [ButtonProps](https://ant-design.gitee.io/components/button-cn/#API) | 否 | 
| desc | 描述 | string | 是 | 

#### RatioItem

环比占比区域的内容配置项


| 参数 | 说明 | 类型 | 是否必填 |
| --- | --- | --- | --- |
| label | 标题 | string | 是 |
| value | 对应的比率 | string | 是 |
| valueType | value 的数据类型 | string | 否 | 
| hint | hover 的提示 | string | - |
| render | 自定义渲染(不包括label) | React.ReactNode | 否 |