安装

npm install ecc-custom-report

使用

在main.js引入

import CustomReport from 'ecc-custom-report';
import 'ecc-custom-report/lib/ecc-custom-report.css'
Vue.use(CustomReport)

在vue文件中使用

// 饼图
<ViewData
  :drawingItem="drawingItem"
  :data="data"
></ViewData>

// 柱状图
<ViewData
  :drawingItem="drawingItem"
  :data="{xArr, yArr}"
></ViewData>

// 列表
<ViewData
  :drawingItem="drawingItem"
  :data="{tableData, columns}"
></ViewData>

传入的属性 drawingItem：拖入的控件对象

| 属性 | 描述 | | --- | --- | | label | 控件名 | | reportType | 控件类型，1、2、3分别为列表、柱状图、饼图 |

data: 展示的数据

| 属性 | 数据类型 | 描述 | | --- | --- | --- | | data | Array | 控件类型为饼图时使用，饼图展示的数据 | | data.tableData | Array | 控件类型为列表时使用，列表展示的数据 | | data.columns | Array | 控件类型为列表时使用，列表表头 | | data.xArr | Array | 控件类型为柱状图时使用，柱状图X轴数据 | | data.yArr | Array | 控件类型为柱状图时使用，柱状图Y轴数据 |