跳到主要内容

简洁卡片

1. 效果展示

2. 添加卡片

点击首页常用选择简洁卡片,即可添加简洁卡片

3. 数据

3.1 静态数据

[
{
"title": "访问数",
"icon": "icon-jeecg-qianbao",
"value": 2000,
"color": "green",
"suffix": "月"
},
{
"title": "成交额",
"icon": "icon-jeecg-youhuiquan",
"value": 20000,
"color": "blue",
"suffix": "月"
},
{
"title": "下载数",
"icon": "icon-jeecg-tupian",
"value": 8000,
"color": "orange",
"suffix": "周"
},
{
"title": "成交数",
"icon": "icon-jeecg-jifen",
"value": 5000,
"color": "purple",
"suffix": "年"
}
]

3.2 动态数据

4. 属性

  • 水平间距:设置水平间距
  • 垂直间距:设置垂直间距
  • 宽度占比:设置宽度占比 注:修改卡片个数时,如将默认4个修改为少于或多余4个时,需重新设置宽度占比,一行展示不全时,会换行展示;如下图:

  • 标题颜色:设置卡片标题颜色
  • 标题字体大小:设置卡片标题字体大小
  • 数值颜色:设置卡片数值颜色
  • 数值字体大小:设置卡片数值字体大小
  • 图标大小:设置图标大小
  • 图标颜色:设置图标颜色
  • 设置图标库

5. 交互(暂无)