DataBox 数据展示

TIP

1.0.0+

DataBox 数据模版 - 图1

  1. <avue-data-box :option="option"></avue-data-box>
  2. <script>
  3. export default {
  4.   data(){
  5.     return {
  6.       option: {
  7.         span:6,
  8.         data: [
  9.           {
  10.             title: '错误日志',
  11.             count: 12332,
  12.             icon: 'el-icon-warning',
  13.             color: 'rgb(49, 180, 141)',
  14.             href:'https://avue.top',
  15.             target:'_blank'
  16.           },
  17.           {
  18.             title: '数据展示',
  19.             count: 33,
  20.             icon: 'el-icon-view',
  21.             color: 'rgb(56, 161, 242)',
  22.             href:'https://avue.top',
  23.             target:'_blank'
  24.           },
  25.           {
  26.             title: '权限管理',
  27.             count: 2223,
  28.             icon: 'el-icon-setting',
  29.             color: 'rgb(117, 56, 199)',
  30.             href:'https://avue.top',
  31.             target:'_blank'
  32.           },
  33.           {
  34.             title: '权限管理',
  35.             count: 2223,
  36.             icon: 'el-icon-setting',
  37.             color: 'rgb(117, 56, 199)',
  38.             href:'https://avue.top',
  39.             target:'_blank'
  40.           },
  41.         ]
  42.       },
  43.     }
  44.   }
  45. }
  46. </script>