//全局图表默认配置
import echarts from 'echarts';
//引入贵州
import './gz';

export default {
    //对对象进行深度合并
    assign(v = {}, n = {}) {
        for (var key in n) {
            v[key] = v[key] && v[key].toString() === "[object Object]"
                ? this.assign(v[key], n[key])
                : v[key] = n[key];
        }
        return v;
    },
    //配置合并
    /**
     * chartData,图表数据 [{data:[]},{data:[]}] - 后台返回数据
     * tableData,表格数据 - 无用
     * legendData,图例数据 - 无用
     * seriesConfig,每一项的配置必须是数组 对应没项数据 [{}]
     *
     * optionConfig 用户配置
     *
     * config 当前类型图表默认配置
     *
     * return 返回图表标准配置
     */
    mergeConfig({
        chartData = [],
        seriesConfig = [],
        optionConfig = {}
    }, config = {}) {
        //取得默认配置
        let {
            option = {},
            series = []
        } = config;
        /**
         * 对 用户项 配置进行合并
         * 用用户数据作为显示项的数量
         */
        chartData = Array.isArray(chartData)
            ? chartData
            : [];
        //得到图表标准series数组
        let tempArr = [];
        chartData.map((x, i) => {
            //数据与用户配置合并 , 合并后数据与默认配置合并
            const si = {
                    ...(seriesConfig[i] || {})
                }, //用户配置
                sM = series[i] || {}, //默认配置
                obj = this.assign({
                    ...sM
                }, {
                    ...si,
                    ...x
                });
            obj.data.length && tempArr.push(si.follow
                ? (Array.isArray(si.data)
                    ? si
                    : (() => {
                        si.data = x.data;
                        tempArr.push(obj);
                        return si;
                    })())
                : obj);
        });
        //判断是否还有配置项 多出项不参与默认配置合并
        const clength = chartData.length;
        if (clength && seriesConfig.length > clength) {
            for (let i = clength, si = 0; si = seriesConfig[i++];) {
                tempArr.push(si.follow
                    ? (Array.isArray(si.data)
                        ? si
                        : (() => {
                            si.data = chartData[clength - 1].data;
                            return si;
                        })())
                    : si);
            }
        }
        //合并默认全局配置
        option = this.assign({
            ...option
        }, {
            ...optionConfig
        });
        return {
            ...option,
            series: tempArr
        };
    },
    /**
     * 饼图默认配置 option 与 项配置
     */
    get pieConfig() {
        //默认饼颜色
        const colorList = [
            "rgba(33, 17, 121, 1)",
            "rgba(66, 62, 181, 1)",
            "rgba(97, 94, 198, 1)",
            "rgba(28, 96, 247, 1)",
            "rgba(76, 132, 255, 1)",
            "rgba(28, 84, 207, 1)",
            "rgba(12, 163, 137, 1)",
            "rgba(9, 189, 215, 1)",
            "rgba(109, 208, 222, 1)",
            "rgba(94, 139, 171, 1)",
            "rgba(53, 118, 165, 1)",
            "rgba(21, 109, 81, 1)",
            "rgba(6, 123, 152, 1)",
            "rgba(31, 93, 108, 1)"
        ];
        return {
            option: {
                title: {
                    text: '',
                    subtext: '',
                    x: 'center',
                    y: '42%',
                    textStyle: {
                        fontWeight: 200,
                        fontSize: 12,
                        color: 'rgba(174, 220, 244, 1)'
                    },
                    subtextStyle: {
                        color: 'rgba(174, 220, 244, 1)',
                        fontSize: 20
                    }
                },
                legend: {
                    show: false
                }
            },
            series: [
                {
                    radius: [
                        '35%', "60%"
                    ],
                    center: [
                        '50%', '50%'
                    ],
                    type: 'pie',
                    geoIndex: 10,
                    itemStyle: {
                        normal: {
                            color: (params) => params.data.color || colorList[params.dataIndex]
                        }
                    },
                    labelLine: {
                        normal: {
                            show: false,
                            length: 5,
                            length2: 5,
                            lineStyle: {
                                color: '#fff'
                            }
                        },
                        emphasis: {
                            show: true
                        }
                    },
                    label: {
                        normal: {
                            show: false,
                            formatter: "{c}",
                            textStyle: {
                                fontSize: 12
                            }
                        },
                        emphasis: {
                            show: true
                        }
                    }
                }
            ]
        }
    },
    //data.chartData,图表数据 [[1,2,3,4,5],[2,3,4,5]]
    getOptionPie(data = {}) {
        //原形外环配置
        const pieRing = {
            radius: [
                '60%', '65%'
            ],
            center: [
                '50%', '50%'
            ],
            type: 'pie',
            geoIndex: 0,
            label: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: false
                }
            },
            labelLine: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: false
                }
            },
            animation: false,
            tooltip: {
                show: false
            },
            itemStyle: {
                normal: {
                    color: 'rgba(68, 102, 244, 0.2)'
                }
            },
            data: [
                {
                    value: 1
                }
            ]
        }
        //包装数组
        data.chartData = data
            .chartData
            .map(x => {
                return {
                    data: Array.isArray(x)
                        ? x
                        : []
                }
            });
        data
            .chartData
            .push(pieRing);
        return this.mergeConfig(data, this.pieConfig);
    },
    //线图默认配置
    get LineConfig() {
        const config = {
            type: 'line',
            smooth: true,
            symbol: 'circle',
            symbolSize: 2,
            showSymbol: false,
            lineStyle: {
                normal: {
                    width: 1
                }
            }
        };
        return {
            option: {
                grid: {
                    left: '6%',
                    right: '8%',
                    bottom: '17%',
                    top: "15%",
                    containLabel: true
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'line',
                        lineStyle: {
                            color: {
                                type: 'linear',
                                x: 0,
                                y: 0,
                                x2: 0,
                                y2: 1,
                                colorStops: [
                                    {
                                        offset: 0,
                                        color: 'rgba(26, 118, 230, 1)' // 0% 处的颜色
                                    }, {
                                        offset: 1,
                                        color: 'rgba(29, 236, 198, 0)' // 100% 处的颜色
                                    }
                                ],
                                global: false // 缺省为 false
                            }
                        }
                    },
                    showContent: false
                },
                legend: {
                    show: false
                },
                xAxis: {
                    type: 'category',
                    boundaryGap: false,
                    axisLine: {
                        lineStyle: {
                            color: 'rgba(50, 86, 111, 1)'
                        }
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        // rotate:45,
                        interval: 0,
                        color: 'rgba(50, 86, 111, 1)',
                        fontSize: 12
                    }
                },
                yAxis: {
                    type: 'value',
                    name: "",
                    nameTextStyle: {
                        color: 'rgba(50, 86, 111, 1)',
                        fontSize: 12
                    },
                    axisLine: {
                        show: false
                    },
                    axisLabel: {
                        color: 'rgba(50, 86, 111, 1)',
                        fontSize: 12
                    },
                    splitLine: {
                        show: true,
                        lineStyle: {
                            color: 'rgba(255, 255, 255, 0.1)'
                        }
                    },
                    axisTick: {
                        show: false
                    }
                }
            },
            series: [
                {
                    ...config,
                    label: {
                        show: true,
                        fontSize: 16,
                        color: 'rgba(255, 255, 255, 1)',
                        position: 'right',
                        // backgroundColor: 'rgba(8, 106, 189, 0.4)', borderWidth: 0, borderRadius: 50,
                        padding: [
                            8, 18, 6, 18
                        ],
                        borderColor: 'rgba(8,106,189,1)',
                        rich: {}
                    },
                    areaStyle: {
                        normal: {
                            color: new echarts
                                .graphic
                                .LinearGradient(0, 0, 0, 1, [
                                    {
                                        offset: 0,
                                        color: 'rgba(31, 78, 180, 0.8)'
                                    }, {
                                        offset: 1,
                                        color: 'rgba(0,0,0,0)'
                                    }
                                ], false)
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: 'rgba(31, 78, 180, 1)'
                        }
                    }
                }, {
                    ...config,
                    label: {
                        show: true,
                        fontSize: 16,
                        color: 'rgba(255, 255, 255, 1)',
                        position: 'right',
                        // backgroundColor: 'rgba(74, 255, 0, 0.4)', borderWidth: 2, borderRadius: 50,
                        padding: [
                            8, 18, 6, 18
                        ],
                        borderColor: 'rgba(74, 255, 0, 1)',
                        rich: {}
                    },
                    areaStyle: {
                        normal: {
                            color: new echarts
                                .graphic
                                .LinearGradient(0, 0, 0, 1, [
                                    {
                                        offset: 0,
                                        color: 'rgba(75, 252, 0, 0.75)'
                                    }, {
                                        offset: 1,
                                        color: 'rgba(122, 253, 101, 0)'
                                    }
                                ], false)
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: "rgba(74, 255, 0, 0.6)"
                        }
                    }
                }, {
                    ...config,
                    label: {
                        show: true,
                        fontSize: 16,
                        color: 'rgba(255, 255, 255, 1)',
                        position: 'right',
                        // backgroundColor: 'rgba(252, 253, 101, 0.4)', borderWidth: 2, borderRadius:
                        // 50,
                        padding: [
                            8, 18, 6, 18
                        ],
                        borderColor: 'rgba(252, 253, 101, 1)',
                        rich: {}
                    },
                    areaStyle: {
                        normal: {
                            color: new echarts
                                .graphic
                                .LinearGradient(0, 0, 0, 1, [
                                    {
                                        offset: 0,
                                        color: 'rgba(252, 253, 101, 0.8)'
                                    }, {
                                        offset: 1,
                                        color: 'rgba(252, 253, 101, 0.1)'
                                    }
                                ], false)
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: "rgba(252, 253, 101, 1)"
                        }
                    }
                }
            ]
        }
    },
    //线图  data.chartData,图表数据 [[1,2,3,4,5],[2,3,4,5]]
    getOptionLine(data = {}) {
        //包装数组
        data.chartData = data
            .chartData
            .map(x => {
                return {
                    data: Array.isArray(x)
                        ? x
                        : []
                }
            });
        return this.mergeConfig(data, this.LineConfig);
    },
    //全国地图
    getOptionMap() {
        return {
            visualMap: {
                min: 0,
                max: 2,
                show: false,
                inRange: {
                    color: ['rgba(74, 255, 0, 0.8)', 'rgba(252, 253, 101, 0.86)', 'rgba(88, 196, 254, 0.9)']
                }
            },
            geo: {
                zoom: 1.2,
                show: true,
                map: 'china',
                label: {
                    normal: {
                        show: true
                    },
                    emphasis: {
                        show: false
                    }
                },
                roam: true,
                itemStyle: {
                    normal: {
                        areaColor: 'transparent',
                        borderColor: '#090822',
                        borderWidth: 0.3
                    },
                    emphasis: {
                        show: false
                    }
                }
            },
            series: [
                {
                    type: 'map',
                    mapType: 'china',
                    geoIndex: 0,
                    data: []
                }
            ]
        };
    },
    getMapOpt() {
        return this.getOptionMap();
    },
    //柱状图
    getOptionPillar(x, y = []) {
        let data = [];
        if (y[0]) {
            data = y[0].data;
        }
        return {
            // title: {     text: '特性示例：渐变色 阴影 点击缩放',     subtext: 'Feature Sample: Gradient
            // Color, Shadow, Click Zoom' },
            xAxis: {
                data: x,
                axisLabel: {
                    inside: true,
                    textStyle: {
                        color: '#fff'
                    }
                },
                axisTick: {
                    show: false
                },
                axisLine: {
                    show: false
                },
                z: 10
            },
            yAxis: {
                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                axisLabel: {
                    textStyle: {
                        color: '#999'
                    }
                }
            },
            dataZoom: [
                {
                    type: 'inside'
                }
            ],
            series: [// { // For shadow     type: 'bar',     itemStyle: {         normal: {color:
                // 'rgba(0,0,0,0.05)'}     },     barGap:'-100%',     barCategoryGap:'40%',
                // data: y,     animation: false },
                {
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            color: new echarts
                                .graphic
                                .LinearGradient(0, 0, 0, 1, [
                                    {
                                        offset: 0,
                                        color: '#83bff6'
                                    }, {
                                        offset: 0.5,
                                        color: '#188df0'
                                    }, {
                                        offset: 1,
                                        color: '#188df0'
                                    }
                                ])
                        },
                        emphasis: {
                            color: new echarts
                                .graphic
                                .LinearGradient(0, 0, 0, 1, [
                                    {
                                        offset: 0,
                                        color: '#2378f7'
                                    }, {
                                        offset: 0.7,
                                        color: '#2378f7'
                                    }, {
                                        offset: 1,
                                        color: '#83bff6'
                                    }
                                ])
                        }
                    },
                    data: data
                }
            ]
        };
    },
    //预警图
    getEarlyWarningMap(data) {
        let option = {
            dataRange: {
                orient: "horizontal",
                show: false,
                min: 0,
                max: 4
            },
            geo: {
                map: "qn",
                roam: false,
                zoom: 1.6,
                label: {
                    emphasis: {
                        "show": false
                    }
                },
                itemStyle: {
                    normal: {
                        areaColor: {
                            type: 'radial',
                            x: 0.5,
                            y: 0.5,
                            r: 1,
                            colorStops: [
                                {
                                    offset: 0,
                                    color: 'rgba(6,150,255,0)' // 0% 处的颜色
                                }, {
                                    offset: 1,
                                    color: 'rgba(6,150,255,.3)' // 100% 处的颜色
                                }
                            ],
                            globalCoord: false // 缺省为 false
                        },
                        borderColor: "rgba(25,180,249,1)",
                        borderWidth: 1,
                        shadowColor: 'rgba(25,180,249,1)',
                        shadowBlur: 12
                    },
                    emphasis: {
                        areaColor: "rgba(25,180,249,1)"
                    }
                }
            },
            series: [
                {
                    name: "预警级别",
                    type: "effectScatter",
                    coordinateSystem: "geo",
                    showEffectOn: "render",
                    rippleEffect: {
                        scale: 4
                    },
                    label: {
                        normal: {
                            formatter(p) {
                                return p.data.signaltype + "预警";
                            },
                            position: "top",
                            show: true,
                            fontSize: 12
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: "#fff"
                        }
                    },
                    data
                }
            ]
        }
        return option;
    }
}