/**
 * 为图表option二次设置样式属性
 */

/**
 * @param option: Object 图表配置档
 * @param silent: Boolean 无交互
 * @param thumbnail: Boolean 缩略图模式
 */
export default (option, silent, thumbnail) => {
    let _option = { ...option };
    let viewType = _option.series ? (_option.series[0].type) : null;

    // 动画
    _option.animation = !thumbnail;
    // 悬浮提示
    _option.tooltip = _option.tooltip ? {
        ..._option.tooltip,
        show: !silent && !thumbnail
    } : {
        show: !silent && !thumbnail,
        trigger: "axis",
        axisPointer: {
            type: "cross",
            label: {
                backgroundColor: "#6a7985"
            }
        }
    };
    // 图例
    _option.legend = _option.legend ? {
        ..._option.legend,
        show: !thumbnail,
        selectedMode: !silent
    } : {
        show: !thumbnail,
        selectedMode: !silent
    }
    // 容器
    _option.grid = _option.grid ? {
        left: thumbnail ? 10 : (_option.grid.left ? _option.grid.left : '10%'),
        right: thumbnail ? 10 : (_option.grid.right ? _option.grid.right : '10%'),
        top: thumbnail ? 10 : (_option.grid.top ? _option.grid.top : 60),
        bottom: thumbnail ? 10 : (_option.grid.bottom ? _option.grid.bottom : 60),
        containLabel: !thumbnail
    } : {
        left: thumbnail ? 10 : '10%',
        right: thumbnail ? 10 : '10%',
        top: thumbnail ? 10 : 60,
        bottom: thumbnail ? 10 : 60,
        containLabel: !thumbnail
    }
    // x轴
    _option.xAxis ? _option.xAxis[0] = {
        ..._option.xAxis[0],
        show: !thumbnail
    } : void 0;
    // y轴
    _option.yAxis ? _option.yAxis[0] = {
        ..._option.yAxis[0],
        show: !thumbnail
    } : void 0;
    // 图形
    if(viewType ==='bar' ) { // 柱状图
        _option.series = _option.series.map(s => ({
            ...s, showSymbol: !thumbnail, silent
        }));
    }else if(viewType === 'pie') { // 饼图
        _option.series = _option.series.map(s => ({
            ...s, label: { show: !silent }, labelLine: { show: !silent }, silent
        }));
    }else if(viewType === 'line') { // 折线图
        _option.series = _option.series.map(s => ({
            ...s, showSymbol: !thumbnail, silent
        }));
    }else if(viewType === 'scatter') { // 散点图
        _option.series = _option.series.map(s => ({
            ...s, silent
        }));
    }
    
    
    return _option;
}

// function barConfig(chartConfig, option, styleConfig, silent, thumbnail) {
//     const { xAxis, serieses, xTitle, yTitle } = option;
//     const { bar } = styleConfig;
//     const { stack, visibleToolTip } = (bar || { stack: false, visibleToolTip: true });
//     let o = {
//         animation: !thumbnail,
//         tooltip : {
//             show: visibleToolTip && !silent && !thumbnail,
//             trigger: "axis",
//             axisPointer: {
//                 type: "cross",
//                 label: {
//                     backgroundColor: "#6a7985"
//                 }
//             }
//         },
//         legend: {
//             show: !thumbnail,
//             selectedMode: !silent
//         },
//         grid: {
//             left: thumbnail ? 10 : '10%',
//             right: thumbnail ? 10 : '10%',
//             top: thumbnail ? 10 : 60,
//             bottom: thumbnail ? 10 : 60,
//             containLabel: !thumbnail
//         },
//         xAxis: [{
//             show: !thumbnail,
//             type: 'category',
//             data: barXAxis(chartConfig, xAxis),
//             name: xTitle || '横轴',
//         }],
//         yAxis: [{
//             show: !thumbnail,
//             name: yTitle || '纵轴',
//             type: 'value'
//         }],
//         series: serieses.map(s => {
//             return {
//                 name: s.name,
//                 type: 'bar',
//                 data: s.value,
//                 stack: stack ? '1' : null,
//                 showSymbol: !thumbnail,
//                 silent,
//             }
//         }) 
//     }
//     return o;
// }

// function pieConfig(option, styleConfig, silent, thumbnail) {

//     const { xAxis, columnName, serieses } = option;

//     let o = {
//         animation: !thumbnail,
//         grid: {
//             left: thumbnail ? 10 : '10%',
//             right: thumbnail ? 10 : '10%',
//             top: thumbnail ? 10 : 60,
//             bottom: thumbnail ? 10 : 60,
//             containLabel: !thumbnail
//         },
//         tooltip : {
//             show: !silent && !thumbnail,
//             trigger: 'item',
//             formatter: "{a} <br/>{b} : {c} ({d}%)"
//         },
//         legend: {
//             show: !thumbnail,
//             data: xAxis,
//             selectedMode: !silent
//         },
//         series : [
//             {
//                 name: columnName,
//                 type: 'pie',
//                 // radius : '55%',
//                 // center: ['50%', '60%'],
//                 data: serieses[0].value,
//                 label: { show: !silent },
//                 labelLine: { show: !silent },
//                 itemStyle: {
//                     emphasis: {
//                         shadowBlur: 10,
//                         shadowOffsetX: 0,
//                         shadowColor: 'rgba(0, 0, 0, 0.5)'
//                     }
//                 },
//                 silent
//             }
//         ]
//     };
//     return o;
// }

// function lineConfig(option, styleConfig, silent, thumbnail) {
//     const { serieses, xTitle, yTitle } = option;

//     let o = {
//         animation: !thumbnail,
//         grid: {
//             left: thumbnail ? 10 : '10%',
//             right: thumbnail ? 10 : '10%',
//             top: thumbnail ? 10 : 60,
//             bottom: thumbnail ? 10 : 60,
//             containLabel: !thumbnail
//         },
//         tooltip: {
//             show: !silent && !thumbnail,
//             trigger: 'axis',
//             axisPointer: {
//                 type: 'cross'
//             }
//         },
//         legend: {
//             show: !thumbnail,
//             selectedMode: !silent
//         },
//         xAxis:  {
//             show: !thumbnail,
//             name: xTitle,
//             type: 'time'
//         },
//         yAxis: {
//             show: !thumbnail,
//             name: yTitle,
//             type: 'value'
//         },
        
//         series: serieses.map(s => {
//             return {
//                 name: s.name,
//                 type: 'line',
//                 data: s.mdata.map(m => {
//                     return [m.date, m.value]
//                 }),
//                 showSymbol: !thumbnail,
//                 silent
//             }
//         })
//     };

//     return o;
// }

// function scatterConfig(option, styleConfig, silent, thumbnail) {
//     const { serieses, xTitle, yTitle } = option;
//     let o = {
//         animation: !thumbnail,
//         grid: {
//             left: thumbnail ? 10 : '10%',
//             right: thumbnail ? 10 : '10%',
//             top: thumbnail ? 10 : 60,
//             bottom: thumbnail ? 10 : 60,
//             containLabel: !thumbnail
//         },
//         tooltip : {
//             show: !silent && !thumbnail,
//             showDelay : 0,
//             axisPointer:{
//                 show: true,
//                 type : 'cross',
//                 lineStyle: {
//                     type : 'dashed',
//                     width : 1
//                 }
//             }
//         },
//         legend: {
//             show: !thumbnail,
//             selectedMode: !silent
//         },
//         xAxis : [
//             {
//                 show: !thumbnail,
//                 type : 'value',
//                 name: xTitle,
//                 scale:true,
//                 splitLine: {
//                     show: false
//                 }
//             }
//         ],
//         yAxis : [
//             {
//                 show: !thumbnail,
//                 type : 'value',
//                 name: yTitle,
//                 scale:true,
//                 splitLine: {
//                     show: false
//                 }
//             }
//         ],
//         series : serieses.map(s => {
//             return {
//                 name: s.name,
//                 type: 'scatter',
//                 data: s.mdata.map(m => {
//                     return [m.date, m.value]
//                 }),
//                 silent
//             }
//         })
//     };
//     return o;
// }

// function aggregateTableConfig(option, styleConfig, silent, thumbnail) {
//     const { columns, data } = option;
//     let c = columns.map(_c => {
//         if(_c.dataIndex === 'percent') {
//             return { ..._c, render: (value, record, index) => ((+value*100).toFixed(2)) + '%'};
//         }else {
//             return {..._c, width: 100};
//         }
//     });
//     let o = {
//         columns: c,
//         data: data.map((d, i) => {
//             return { ...d, key: i}
//         })
//     };
//     return o;
// }

// function tableViewConfig(option, styleConfig, silent, thumbnail) {
//     const { columns, data } = option;
//     const { table } = styleConfig || {};
//     const {
//         visibleIndex,
//         aligns,
//         widths,
//         thousandsSeparatorColumns,
//     } = table || {
//         visibleIndex: false,
//         aligns: {},
//         widths: {},
//         thousandsSeparatorColumns: [],
//     };
//     console.log(styleConfig);
//     let c = columns.map(c => {
//         let o = {
//             key: c.name,
//             title: c.label,
//             dataIndex: c.name,
//             width: widths? (widths[c.name] ? ( +widths[c.name] ) : 100 ) : 100,
//             align: aligns ? (aligns[c.name] || 'left') : 'left',
//         };
//         if(c.type === 'time') {
//             o.render = v => moment(v).format('YYYY-MM-DD');
//         }
//         return o;
//     });
//     if(visibleIndex) {
//         c.unshift({
//             key: '_index',
//             title: '序号',
//             render: (v, r, i) => i+1,
//             width: 50,
//             align: 'center'
//         });
//     }
//     let o = {
//         columns: c,
//         data: data.map((d, i) => {
//             return { ...d, key: i}
//         })
//     };
//     return o;
// }

// function barXAxis(chartConfig, xAxis) {
//     let data = xAxis;
    
//     if(chartConfig) {
//         const { xAxis: cx } = chartConfig;
//         const { column, granularity } = cx;
//         const { label: cLabel, type: cType, value: cValue } = column;
//         const { label: gLabel, value: gValue } = granularity;

//         if(cType === 'time') {
//             let s = GRANULARITY['time'];
//             let g = s.find(d => d.value === gValue);
//             data = xAxis.map(x => (g.replaceFunction && typeof g.replaceFunction === 'function') ? g.replaceFunction(x) : x);
//         }
//     }
    
//     return data;
// }