category: Components type: UI Views component: Basic chinese: 展示面板 english: Dashboard
一般在系统的首页展示一些指标数据,也可以快速导航的入口
API
Dashboard
成员 | 说明 | 类型 | 默认值 |
---|---|---|---|
width | 设定弹层宽度 | number |
100% |
height | 设定弹层高度 | number |
100% |
className | 设置定义的样式 | string |
null |
contentPadding | 指定相对于父元素大小的内间距,可以指定上下左右四个方向 | array |
[48] |
showGapLine | 是否展示行与列之间的border | boolean |
true |
showGapMark | 展示展示行与列交叉的交叉点样式 | boolean |
true |
column | 每一行多少列 | number |
4 |
itemMinWidth | 单个条目的最小宽度 | number |
auto |
shadowSize | 鼠标浮上去的阴影大小 | number |
30 |
shadowSkewingSize | 阴影动画的最大调整范围 | number |
20 |
type | 主题风格,三种 primary ,secondary ,normal
|
string |
normal |
Dashboard.Group
Dashboard 的直接子元素,用于设置分组的 title 信息,其子元素可以是任何节点,子元素如果是 Dashboard.Item ,就可以按照 组件的 API 配置相应的字段信息,如果 Dashboard.Item 满足不了您的需求,请自行设置内部展示的结构
成员 | 说明 | 类型 | 默认值 |
---|---|---|---|
title | 设置分组信息的 title |
string /Element
|
'' |
className | 设置Group 的 className | string |
null |
itemHeight | 设置内容区每一个内容区块的高度 | Number |
null |
columnFlex | 设置列的宽度比重,多少列数组中就有几个数字 | Array |
null |
Dashboard.Item
设置单个条目的信息,子节点用于填充图表,当然你也可以选择放其他的元素
成员 | 说明 | 类型 | 默认值 |
---|---|---|---|
count | 数量字段(支持 0-9¥$%.,?₽€*+-<> ,超出将以文本展示) |
Number/String |
null |
title | 标题 |
String /Element
|
null |
subtitle | 副标题 |
String /Element
|
null |
thousandGap | 对于 count 字段,通过 , 隔开千位 | Boolean |
true |
chartWidth | 图标元素的宽度 | number |
180 |
chartHeight | 图标元素的高度 | number |
120 |
href | 单个元素的链接地址,配置该属性,点击可以跳转 | string |
null |
target | 页面跳转时的打开方式 | string |
'_self' |
className | 设置单个 Item 的 className | string |
null |