html:

 js:

var vue = new Vue({    el: '#app',    data: {        // 指定图表的配置项和数据        option : {            // 图标标题            title : {                text: '投诉方式统计',                x:'center'            },            // 提示框组件            tooltip : {                trigger: 'item',                // 字符串模板,饼图、仪表盘、漏斗图: {a}（系列名称），{b}（数据项名称），{c}（数值）, {d}（百分比）                formatter: "{a}
{b} : {c} ({d}%)"            },            // 图例组件            legend : {                orient: 'horizontal',                bottom: 'bottom',                data: []            },            series : {                    name: '投诉方式',                    type: 'pie',                    radius : '50%',                    center: ['50%', '50%'],                    label : {                        normal : {                            show : true,                            formatter : "{b} : {c} ({d}%)"                        }                    },                    data:[],                    itemStyle: {                        emphasis: {                            shadowBlur: 10,                            shadowOffsetX: 0,                            shadowColor: 'rgba(0, 0, 0, 0.5)'                        }                    }                }                    },// 接口返回的结果集合        backResultData:[],        // 表格数据        tableData:[],        // 行展开后的子表格数据        subTableData:[]    },

successCallBack : function(result){                    if(result.success){                        // 接口返回的结果集合                        backResultData = result.data;                        // 设置饼图数据，普通for循环遍历，饼图去除总计列                        for(var i=0; i

效果：

 其中，只有element2.8及其以上版本才支持列表折叠子列表的，前面版本支持列表展开行是本行的详情信息；