platform-bi-web/src/models/parseChartOption.js

/**
 * 将请求返回的图表展示数据解析为前台展示用的config
 */
import moment from 'moment'
import EllipsisTooltip from '../components/common/ellipsisTooltip/index'
import { deepAssign, numberFormat } from '../utils/baseUtils'
import STATISTICS_OPTION from '../components/chartDesigner/sections/statisticsOption.json'
import themes from '../components/chartDesigner/sections/style/theme/index'
import adapteGridPosition from './adapteGridPosition'

export default function(viewType, data, chartConfig, themeName, styleConfig) {
    if(!data) {
        return {};
    }
    try {
        let theme = themes[themeName] || themes['default']
        let o, themeConfig;
        switch(viewType) {
            case 'bar': {
                themeConfig = Object.assign({}, theme.base, theme.bar);
                o = barOption(data, chartConfig, themeConfig, styleConfig);
                break;
            }
            case 'pie': {
                themeConfig = Object.assign({}, theme.base, theme.pie);
                o = pieOption(data, chartConfig, themeConfig, styleConfig);
                break;
            }
            case 'line': {
                themeConfig = Object.assign({}, theme.base, theme.line);
                o = lineOption(data, chartConfig, themeConfig, styleConfig);
                break;
            }
            case 'scatter': {
                themeConfig = Object.assign({}, theme.base, theme.scatter);
                o = scatterOption(data, chartConfig, themeConfig, styleConfig);
                break;
            }
            case 'aggregateTable': {
                themeConfig = theme.aggregateTable;
                o = aggregateTableOption(data, chartConfig, themeConfig, styleConfig);
                break;
            }case 'dataView' : {
                themeConfig = theme.dataView;
                o = dataViewOption(data, chartConfig, themeConfig, styleConfig);
                break;
            }
            default:{
                o = {};
                break;
            }
        }
        return o;
    }catch(e) {
        console.error(e);
    }
}

function barOption(data, barConfig, themeConfig, styleConfig) {
    const { xAxis, yAxis, groupBy } = barConfig;
    const { gridPosition, barMaxWidth, barMinHeight, barGap, stack, labelVisible, labelPosition, labelDistance,
        labelRotate, labelFormatter, xNameLocation, xNameGap, xNameRotate, xLabelHiddenCover, xLabelRotate,
        xLabelMargin, yNameLocation, yNameGap, yNameRotate, legendHidden: styleLegendHidden, legendInPagination,
        legendOrient : styleLegendOrient, legendPosition, legendFormatter, labelZeroVisible, } = styleConfig;
    let xTitle = xAxis?`${xAxis.column.label}${xAxis.granularity.value?'('+xAxis.granularity.label+')':''}`:null
    let yTitle = yAxis?`${yAxis.column.label}${yAxis.gauge.value?'('+yAxis.gauge.label+')':''}`:null
    data.serieses = data.serieses || [];

    let legendHidden = !!groupBy && !!groupBy.key ? styleLegendHidden : true,
        legendOrient = styleLegendOrient || 'vertical',
        legendTop = legendPosition ? ((legendPosition.top === '' || legendPosition.top === null || legendPosition.top === undefined) ? 50 : legendPosition.top) : 50,
        legendLeft = legendPosition ? ((legendPosition.left === '' || legendPosition.left === null || legendPosition.left === undefined) ? 'auto' : legendPosition.left) : 'auto',
        legendRight = legendPosition ? ((legendPosition.right === '' || legendPosition.right === null || legendPosition.right === undefined) ? '5%' : legendPosition.right) : '5%',
        legendBottom = legendPosition ? ((legendPosition.bottom === '' || legendPosition.bottom === null || legendPosition.bottom === undefined) ? 50 : legendPosition.bottom) : 50;
    
    let adapte_grid_position = adapteGridPosition({
        legendHidden,
        legendOrient,
        legendLeft,
        legendRight,
        legendTop,
        legendBottom,
    });
    let option = deepAssign({
        tooltip : {
            trigger: "axis",
            axisPointer: {
                type: "cross",
                label: {
                    backgroundColor: "#6a7985"
                }
            }
        },
        legend: {
            show: !!groupBy && !!groupBy.key && (legendHidden === undefined ? true : !legendHidden),
            type: legendInPagination === undefined ? 'plain' : (!!legendInPagination ? 'scroll' : 'plain'),
            orient: legendOrient,
            top: legendTop,
            left: legendLeft,
            right: legendRight,
            bottom: legendBottom,
            formatter: legendFormatter || '{name}',
        },
        grid: {
            top: (gridPosition && gridPosition.top && gridPosition.top !== 'auto') ? ( // 已设置图域上边距
                gridPosition.top
            ) : adapte_grid_position.top,
            left: (gridPosition && gridPosition.left && gridPosition.left !== 'auto') ? ( // 已设置图域左边距
                gridPosition.left
            ) : adapte_grid_position.left,
            right: (gridPosition && gridPosition.right && gridPosition.right !== 'auto') ? ( // 已设置图域右边距
                gridPosition.right
            ) : adapte_grid_position.right,
            bottom: (gridPosition && gridPosition.bottom && gridPosition.bottom !== 'auto') ? ( // 已设置图域下边距
                gridPosition.bottom
            ) : adapte_grid_position.bottom,
            containLabel: true
        },
        xAxis: [{
            type: 'category',
            nameLocation: (xNameLocation === '' || xNameLocation === null || xNameLocation === undefined) ? 'end' : xNameLocation,
            nameGap: (xNameGap === '' || xNameGap === null || xNameGap === undefined) ? 15 : Number(xNameGap),
            nameRotate: (xNameRotate === '' || xNameRotate === null || xNameRotate === undefined) ? 0 : Number(xNameRotate),
            axisLabel: {
                interval: xLabelHiddenCover === undefined ? 'auto' : (!!xLabelHiddenCover ? 'auto' : 0),
                rotate: (xLabelRotate === '' || xLabelRotate === null || xLabelRotate === undefined) ? 0 : Number(xLabelRotate),
                margin: (xLabelMargin === '' || xLabelMargin === null || xLabelMargin === undefined) ? 8 : Number(xLabelMargin),
            },
            data: data.xAxis.map(d => {
                let gv= xAxis.granularity.value;
                let xv = d || '空';
                if(gv === 'halfYear') {
                    let arr = d.split('-H');
                    xv = arr[0] + ['上半年', '下半年'][arr[1] - 1]
                }else if(gv === 'month') {
                    xv = d.replace('-M', '-');
                }else if(gv === 'quarter') {
                    let arr = d.split('-Q');
                    xv = arr[0] + '-' + ['一', '二', '三', '四'][arr[1] - 1] + '季度'
                }else if(gv === 'week') {
                    let arr = d.split('-W');
                    xv = arr[0] + '-' + arr[1] + '周'
                }
                return xv;
            }),
            name: xTitle || '横轴',
        }],
        yAxis: [{
            name: yTitle || '纵轴',
            type: 'value',
            nameLocation: (yNameLocation === '' || yNameLocation === null || yNameLocation === undefined) ? 'end' : yNameLocation,
            nameGap: (yNameGap === '' || yNameGap === null || yNameGap === undefined) ? 15 : Number(yNameGap),
            nameRotate: (yNameRotate === '' || yNameRotate === null || yNameRotate === undefined) ? 0 : Number(yNameRotate),
        }],
        series: data.serieses.map(s => {
            return {
                name: groupBy ? s.name : (yAxis.column.label || s.name),
                type: 'bar',
                data: s.value,
                barMaxWidth: barMaxWidth || 80,
                barMinHeight: barMinHeight || 0,
                barGap: barGap || '30%',
                stack: !!groupBy && !!groupBy.key && !!stack,
                label: {
                    normal: {
                        show: !!labelVisible,
                        position: labelPosition || 'inside',
                        distance: (labelDistance === '' || labelDistance === null || labelDistance === undefined) ? 5 : Number(labelDistance),
                        rotate: (labelRotate === '' || labelRotate === null || labelRotate === undefined) ? 0 : Number(labelRotate),
                        // formatter: (labelFormatter === '' || labelFormatter === null || labelFormatter === undefined) ? '{c}' : labelFormatter,
                        formatter: !labelZeroVisible ? (params) => {
                            const { name : a, seriesName: b, value: c} = params;
                            // {a: 系列名 name} {b: 数据名 seriesName} {c: 数据值 value}
                            const obj = { a, b, c };
                            let str = labelFormatter || '{c}';
                            if(c === 0) {
                                return '';
                            }else {
                                return `${str.replace(/{([^{ ^}])+}/g, function(x, y) {
                                    let s;
                                    if(!Object.prototype.hasOwnProperty.call(obj, y)) {
                                        return x;
                                    }else {
                                        try {
                                            s = obj[y];
                                        }catch(e) {
                                            s = x;
                                        }
                                    }
                                    return s;
                                })}`
                            }
                        } : ((labelFormatter === '' || labelFormatter === null || labelFormatter === undefined) ? '{c}' : labelFormatter),
                    }
                }
            }
        }),
        dataZoom: {
            show: false
        }
    }, themeConfig);
    
    return option;
}

function lineOption(data, lineConfig, themeConfig, styleConfig) {
    const { gridPosition, legendHidden : styleLegendHidden, legendInPagination, legendOrient : styleLegendOrient, legendPosition, labelSymbol,
        legendFormatter, xNameLocation, xNameGap, xNameRotate, xLabelRotate, xLabelMargin,
        yNameLocation, yNameGap, yNameRotate, stack, labelVisible, labelPosition, labelDistance, labelRotate,
        labelFormatter, lineSmooth, labelSymbolSize } = styleConfig;
    const { xAxis, yAxis, groupBy } = lineConfig;
    let xTitle = xAxis?`${xAxis.column.label}${xAxis.granularity.value?'('+xAxis.granularity.label+')':''}`:null
    let yTitle = yAxis?`${yAxis.column.label}${yAxis.gauge.value?'('+yAxis.gauge.label+')':''}`:null
    data.serieses = data.serieses || [];

    let legendHidden = !!groupBy && !!groupBy.key ? styleLegendHidden : true,
        legendOrient = styleLegendOrient || 'vertical',
        legendTop = legendPosition ? ((legendPosition.top === '' || legendPosition.top === null || legendPosition.top === undefined) ? 50 : legendPosition.top) : 50,
        legendLeft = legendPosition ? ((legendPosition.left === '' || legendPosition.left === null || legendPosition.left === undefined) ? 'auto' : legendPosition.left) : 'auto',
        legendRight = legendPosition ? ((legendPosition.right === '' || legendPosition.right === null || legendPosition.right === undefined) ? '5%' : legendPosition.right) : '5%',
        legendBottom = legendPosition ? ((legendPosition.bottom === '' || legendPosition.bottom === null || legendPosition.bottom === undefined) ? 50 : legendPosition.bottom) : 50;

    let adapte_grid_position = adapteGridPosition({
        legendHidden,
        legendOrient,
        legendLeft,
        legendRight,
        legendTop,
        legendBottom,
    });
    let option = deepAssign({
        grid: {
            top: (gridPosition && gridPosition.top && gridPosition.top !== 'auto') ? ( // 已设置图域上边距
                gridPosition.top
            ) : adapte_grid_position.top,
            left: (gridPosition && gridPosition.left && gridPosition.left !== 'auto') ? ( // 已设置图域左边距
                gridPosition.left
            ) : adapte_grid_position.left,
            right: (gridPosition && gridPosition.right && gridPosition.right !== 'auto') ? ( // 已设置图域右边距
                gridPosition.right
            ) : adapte_grid_position.right,
            bottom: (gridPosition && gridPosition.bottom && gridPosition.bottom !== 'auto') ? ( // 已设置图域下边距
                gridPosition.bottom
            ) : adapte_grid_position.bottom,
            containLabel: true
        },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross'
            }
        },
        legend: {
            show: !!groupBy && !!groupBy.key && (legendHidden === undefined ? true : !legendHidden),
            type: legendInPagination === undefined ? 'plain' : (!!legendInPagination ? 'scroll' : 'plain'),
            orient: legendOrient,
            top: legendTop,
            left: legendLeft,
            right: legendRight,
            bottom: legendBottom,
            formatter: legendFormatter || '{name}',
        },
        xAxis:  [{
            name: xTitle || '横轴',
            type: 'time',
            nameLocation: (xNameLocation === '' || xNameLocation === null || xNameLocation === undefined) ? 'end' : xNameLocation,
            nameGap: (xNameGap === '' || xNameGap === null || xNameGap === undefined) ? 15 : Number(xNameGap),
            nameRotate: (xNameRotate === '' || xNameRotate === null || xNameRotate === undefined) ? 0 : Number(xNameRotate),
            axisLabel: {
                rotate: (xLabelRotate === '' || xLabelRotate === null || xLabelRotate === undefined) ? 0 : Number(xLabelRotate),
                margin: (xLabelMargin === '' || xLabelMargin === null || xLabelMargin === undefined) ? 8 : Number(xLabelMargin),
            },
        }],
        yAxis: [{
            name: yTitle || '纵轴',
            type: 'value',
            nameLocation: (yNameLocation === '' || yNameLocation === null || yNameLocation === undefined) ? 'end' : yNameLocation,
            nameGap: (yNameGap === '' || yNameGap === null || yNameGap === undefined) ? 15 : Number(yNameGap),
            nameRotate: (yNameRotate === '' || yNameRotate === null || yNameRotate === undefined) ? 0 : Number(yNameRotate),
        }],
        
        series: (data.serieses || []).map(s => {
            return {
                name: s.name,
                type: 'line',
                stack: !!groupBy && !!groupBy.key && !!stack,
                label: {
                    normal: {
                        show: !!labelVisible,
                        position: labelPosition || 'inside',
                        distance: (labelDistance === '' || labelDistance === null || labelDistance === undefined) ? 5 : Number(labelDistance),
                        rotate: (labelRotate === '' || labelRotate === null || labelRotate === undefined) ? 0 : Number(labelRotate),
                        formatter: (labelFormatter === '' || labelFormatter === null || labelFormatter === undefined) ? '{c}' : labelFormatter,
                    },
                },
                symbol: !labelSymbol ? 'emptyCircle' : labelSymbol,
                symbolSize: (labelSymbolSize === '' || labelSymbolSize === null || labelSymbolSize === undefined) ? 4 : Number(labelSymbolSize),
                smooth: !!lineSmooth,
                data: s.mdata.map(m => {
                    return [m.date, m.value]
                }).sort((a, b) => {return new Date(a[0]).getTime() - new Date(b[0]).getTime()} )
            }
        }),
        dataZoom: {
            show: false
        }
    }, themeConfig, styleConfig);

    return option;
}

function pieOption(data, pieConfig, themeConfig, styleConfig) {
    let columnName = pieConfig.xAxis.column.label + (pieConfig.xAxis.granularity.value ? '('+pieConfig.xAxis.granularity.label+')' : '');
    const { pieCenter, pieRadius, legendHidden, legendInPagination, legendOrient, legendPosition, legendFormatter,
        labelHidden } = styleConfig;

    let option = deepAssign({
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            show: legendHidden === undefined ? true : !legendHidden,
            type: legendInPagination === undefined ? 'plain' : (!!legendInPagination ? 'scroll' : 'plain'),
            orient: legendOrient || 'vertical',
            top: legendPosition ? legendPosition.top || 50 : 50,
            left: legendPosition ? legendPosition.left || 'auto' : 'auto',
            right: legendPosition ? legendPosition.right || '5%' : '5%',
            bottom: legendPosition ? legendPosition.bottom || 50 : 50,
            formatter: legendFormatter || '{name}',
            data: data.xAxis.map(d => {
                let gv= pieConfig.xAxis.granularity.value;
                let xv = d;
                if(!d) {
                    xv = '空';
                }else {
                    if(gv === 'halfYear') {
                        let arr = d.split('-H');
                        xv = arr[0] + ['上半年', '下半年'][arr[1] - 1]
                    }else if(gv === 'month') {
                        xv = d.replace('-M', '-');
                    }else if(gv === 'quarter') {
                        let arr = d.split('-Q');
                        xv = arr[0] + '-' + ['一', '二', '三', '四'][arr[1] - 1] + '季度'
                    }else if(gv === 'week') {
                        let arr = d.split('-W');
                        xv = arr[0] + '-' + arr[1] + '周'
                    }
                }
                
                return xv;
            }),
        },
        grid: {
            left: '10%',
            right: '10%',
            top: 100,
            bottom: 60,
            containLabel: true
        },
        series : [
            {
                name: columnName,
                type: 'pie',
                center: pieCenter ? [pieCenter[0] || '40%', pieCenter[1] || '50%'] : ['40%', '50%'],
                radius: pieRadius ? [pieRadius[0] || 0, pieRadius[1] || '75%'] : [0, '75%'],
                label: {
                    normal: {
                        show: labelHidden === undefined ? true : !labelHidden,
                    },
                    emphasis: {
                        show: true,
                    }
                },
                labelLine: {
                    normal: {
                        show: labelHidden === undefined ? true : !labelHidden,
                    },
                    emphasis: {
                        show: true,
                    }
                },
                avoidLabelOverlap: labelHidden === undefined ? true : !labelHidden,
                data: (data.serieses || [{ value: [] }])[0].value.map(v => {
                    let obj = { ...v };
                    if(!v.name) {
                        obj.name = '空'
                    }else {
                        let gv= pieConfig.xAxis.granularity.value;
                        if(gv === 'halfYear') {
                            let arr = v.name.split('-H');
                            obj.name = arr[0] + ['上半年', '下半年'][arr[1] - 1]
                        }else if(gv === 'month') {
                            obj.name = v.name.replace('-M', '-');
                        }else if(gv === 'quarter') {
                            let arr = v.name.split('-');
                            obj.name = arr[0] + '-' + ['一', '二', '三', '四'][arr[1] - 1] + '季度'
                        }else if(gv === 'week') {
                            let arr = v.name.split('-');
                            obj.name = arr[0] + '-' + arr[1] + '周'
                        }
                    }
                    return obj;
                }),
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    }, themeConfig);

    return option;
}

function scatterOption(data, scatterConfig, themeConfig, styleConfig) {
    const { gridPosition, legendHidden: styleLegendHidden, legendInPagination, legendOrient : styleLegendOrient, legendPosition,
        labelSymbol, legendFormatter, xNameLocation, xNameGap, xNameRotate, xLabelRotate, xLabelMargin,
        yNameLocation, yNameGap, yNameRotate, labelSymbolSize, xLabelHiddenCover } = styleConfig;
    const { xAxis, yAxis, groupBy } = scatterConfig;
    let xTitle = xAxis?`${xAxis.column.label}${xAxis.granularity.value?'('+xAxis.granularity.label+')':''}`:null
    let yTitle = yAxis?`${yAxis.column.label}${yAxis.gauge.value?'('+yAxis.gauge.label+')':''}`:null
    
    let legendHidden = !!groupBy && !!groupBy.key ? styleLegendHidden : true,
        legendOrient = styleLegendOrient || 'vertical',
        legendTop = legendPosition ? ((legendPosition.top === '' || legendPosition.top === null || legendPosition.top === undefined) ? 50 : legendPosition.top) : 50,
        legendLeft = legendPosition ? ((legendPosition.left === '' || legendPosition.left === null || legendPosition.left === undefined) ? 'auto' : legendPosition.left) : 'auto',
        legendRight = legendPosition ? ((legendPosition.right === '' || legendPosition.right === null || legendPosition.right === undefined) ? '5%' : legendPosition.right) : '5%',
        legendBottom = legendPosition ? ((legendPosition.bottom === '' || legendPosition.bottom === null || legendPosition.bottom === undefined) ? 50 : legendPosition.bottom) : 50;
    
    let adapte_grid_position = adapteGridPosition({
        legendHidden,
        legendOrient,
        legendLeft,
        legendRight,
        legendTop,
        legendBottom,
    });
    let option = deepAssign({
        grid: {
            top: (gridPosition && gridPosition.top && gridPosition.top !== 'auto') ? ( // 已设置图域上边距
                gridPosition.top
            ) : adapte_grid_position.top,
            left: (gridPosition && gridPosition.left && gridPosition.left !== 'auto') ? ( // 已设置图域左边距
                gridPosition.left
            ) : adapte_grid_position.left,
            right: (gridPosition && gridPosition.right && gridPosition.right !== 'auto') ? ( // 已设置图域右边距
                gridPosition.right
            ) : adapte_grid_position.right,
            bottom: (gridPosition && gridPosition.bottom && gridPosition.bottom !== 'auto') ? ( // 已设置图域下边距
                gridPosition.bottom
            ) : adapte_grid_position.bottom,
            containLabel: true
        },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross'
            }
        },
        legend: {
            show: !!groupBy && !!groupBy.key && (legendHidden === undefined ? true : !legendHidden),
            type: legendInPagination === undefined ? 'plain' : (!!legendInPagination ? 'scroll' : 'plain'),
            orient: legendOrient,
            top: legendTop,
            left: legendLeft,
            right: legendRight,
            bottom: legendBottom,
            formatter: legendFormatter || '{name}',
        },
        xAxis : [{
            type : 'value',
            name: xTitle || '横轴',
            nameLocation: (xNameLocation === '' || xNameLocation === null || xNameLocation === undefined) ? 'end' : xNameLocation,
            nameGap: (xNameGap === '' || xNameGap === null || xNameGap === undefined) ? 15 : Number(xNameGap),
            nameRotate: (xNameRotate === '' || xNameRotate === null || xNameRotate === undefined) ? 0 : Number(xNameRotate),
            axisLabel: {
                interval: xLabelHiddenCover === undefined ? 'auto' : (!!xLabelHiddenCover ? 'auto' : 0),
                rotate: (xLabelRotate === '' || xLabelRotate === null || xLabelRotate === undefined) ? 0 : Number(xLabelRotate),
                margin: (xLabelMargin === '' || xLabelMargin === null || xLabelMargin === undefined) ? 8 : Number(xLabelMargin),
            },
            scale:true,
            splitLine: {
                show: true
            }
        }],
        yAxis : [{
            type : 'value',
            name: yTitle || '纵轴',
            nameLocation: (yNameLocation === '' || yNameLocation === null || yNameLocation === undefined) ? 'end' : yNameLocation,
            nameGap: (yNameGap === '' || yNameGap === null || yNameGap === undefined) ? 15 : Number(yNameGap),
            nameRotate: (yNameRotate === '' || yNameRotate === null || yNameRotate === undefined) ? 0 : Number(yNameRotate),
            scale:true,
            splitLine: {
                show: true
            },
        }],
        series : (data.serieses || []).map(s => {
            return {
                name: s.name,
                type: 'scatter',
                symbol: !labelSymbol ? 'circle' : labelSymbol,
                symbolSize: (labelSymbolSize === '' || labelSymbolSize === null || labelSymbolSize === undefined) ? 10 : Number(labelSymbolSize),
                data: s.mdata.map(m => {
                    return [m.date, m.value]
                })
            }
        }),
        dataZoom: {
            show: false
        }
    }, themeConfig);

    return option;
}

function aggregateTableOption( data, aggregateTableConfig, themeConfig, styleConfig) {
    const { targetColumn, groupBy, statistics: statisticsNames } = aggregateTableConfig;
    const { direction } = styleConfig;

    let statistics = STATISTICS_OPTION.filter(o => statisticsNames.indexOf(o.value) !== -1).map(s => ({
            name: s.value,
            label: s.label
        })),
        group1Name = groupBy.length > 0 ? groupBy[0].key : null,
        group2Name = groupBy.length > 1 ? groupBy[1].key : null,
        group1s = [],
        group2s = [],
        tableData;
    const resData = data.valueList;



    if(!group1Name) { // 无分组
        let o = {};
        statistics.forEach(s => {
            o[s.name] = numberFormat(resData[s.name])
        });
        tableData = o;
    }else {
        if(!group2Name) { // 只有一个分组
            resData.forEach(d => {
                let v = d[group1Name];
                if(group1s.indexOf(v) === -1) {
                    group1s.push(v);
                }
            });
            tableData = resData.map(d => {
                let o = {};
                statistics.forEach(s => {
                    o[s.name] = numberFormat(d[s.name])
                });
                return o;
            });
        }else { // 有两个分组
            resData.forEach(d => {
                let v1 = d[group1Name];
                let v2 = d[group2Name];
                if(group1s.indexOf(v1) === -1) {
                    group1s.push(v1);
                }
                if(group2s.indexOf(v2) === -1) {
                    group2s.push(v2);
                }
            });
            tableData = group1s.map(g => {
                let obj = {},
                    list = resData.filter(d => d[group1Name] === g)
                    // .slice(0, 5);
                
                obj[group1Name] = g;
                obj['data'] = group2s.map(g => {
                    let o = {};
                    o[group2Name] = g;
                    statistics.forEach(s => {
                        let v = list.find(l => l[group2Name] === g);
                        o[s.name] = v ? (typeof v[s.name] === 'number' ? numberFormat(v[s.name]) : '') : '';
                    });
                    return o;
                });
                return obj;
            });

        }
    }

    let option = {
        themeConfig,
        targetColumn,
        direction,
        group1Name: groupBy.length > 0 ? groupBy[0].key : null,
        group2Name: groupBy.length > 1 ? groupBy[1].key : null,
        group1s,
        group2s,
        statistics,
        data: tableData
    };

    console.log(option);
    return option;
}

function dataViewOption(data, dataViewConfig, themeConfig, styleConfig) {
    const { list, pageNum, pageSize, pages, total } = data.valueList;

    let columns = dataViewConfig.viewColumns || [];
    let dataSource = list || [];

    let option = {
        columns: columns.map(c => {
            let obj = {
                title: c.label,
                dataIndex: c.name,
            }
            if(c.type === 'time') {
                obj.render = (v, r, i) => {
                    let text = v === null ? '空' : moment(v).isValid() ? moment(v).format('YYYY-MM-DD') : v
                    return <EllipsisTooltip title={text}>{text}</EllipsisTooltip>
                }
            }else {
                obj.render = v => {
                    let text = v === null ? '空' : v
                    return <EllipsisTooltip title={text}>{text}</EllipsisTooltip>
                }
            }
            return obj;
        }),
        dataSource: dataSource.map((d, i) => {
            return { ...d, key: i}
        }),
        page: pageNum,
        pageSize,
        pages,
        total,
    };

    return option;
}