//------------------------------------------------------------------------------------------------
var breedChart = null;

/**
 * 饼图加载
 * @param obj
 * @param id
 */
function pieChartLoad(data, id) {
    var dom = document.getElementById(id);
    var pieChart = echarts.init(dom);

    var option = {
        tooltip: {
            trigger: 'item',
            position:['20%','110%'],
            formatter: function (params) {
                return params.name + ': ' + params.value;
            }
        },
        color: ['#00d2eb', '#16e2ad', '#ffb517', '#ec3c48', '#8767ff', '#297aff', '#ee3c90'],
        series: [
            {
                name: '',
                type: 'pie',
                radius: ['55%', '84%'],
                center: ['50%', '50%'],
                avoidLabelOverlap: false,
                label: {
                    show: false,
                },
                z: 1,
                data: data,
            }
        ]
    };
    pieChart.setOption(option);
    if (id === 'breedChart') {
        breedChart = {"chart": pieChart, "option": option};
    }
}

/**
 * 堆叠柱状图加载
 * @param obj
 * @param id
 */
// 正常数据
var listData = [{
    value: 8,
    name: '测试1'
},
    {
        value: 2,
        name: '测试2'
    },
    {
        value: 83,
        name: '测试3'
    },
    {
        value: 22,
        name: '测试4'
    },
    {
        value: 22,
        name: '测试5'
    }
];
// 异常数据
var listData1 = [{
    value: 20,
    name: '测试1'
},
    {
        value: 10,
        name: '测试2'
    },
    {
        value: 4,
        name: '测试3'
    },
    {
        value: 20,
        name: '测试4'
    },
    {
        value: 20,
        name: '测试5'
    }
];


function toThousands(num) {
    num = num.toString().split("."); // 分隔小数点
    var arr = num[0].split("").reverse(); // 转换成字符数组并且倒序排列
    var res = [];
    for (var i = 0, len = arr.length; i < len; i++) {
        if (i % 3 === 0 && i !== 0) {
            res.push(","); // 添加分隔符
        }
        res.push(arr[i]);
    }
    res.reverse(); // 再次倒序成为正确的顺序
    if (num[1]) { // 如果有小数的话添加小数部分
        res = res.join("").concat("." + num[1]);
    } else {
        res = res.join("");
    }
    return res;

}


function barChartLoad(data, id) {
    var dom = document.getElementById('ss');
    var barChart = echarts.init(dom);
    var predata = [];
    var ydata = [];
    if (data) {
        for (var i = 0; i < data.typeChartPie.length; i++) {
            if (data.typeChartPie[i].name == "省级储备粮") {
                predata[0] = data.typeChartPie[i].percent;
                ydata[0] = data.typeChartPie[i].value;
            }
            if (data.typeChartPie[i].name == "其他粮食") {
                predata[1] = data.typeChartPie[i].percent;
                ydata[1] = data.typeChartPie[i].value;
            }
            if (data.typeChartPie[i].name == "省级储备油") {
                predata[2] = data.typeChartPie[i].percent;
                ydata[2] = data.typeChartPie[i].value;
            }
            if (data.typeChartPie[i].name == "其他油") {
                predata[3] = data.typeChartPie[i].percent;
                ydata[3] = data.typeChartPie[i].value;
            }
        }
    } else {
        predata = [50, 30, 10, 10];
        ydata = [3733.230, 1825.356, 2523.248, 2005.123];
    }
    console.log(ydata);
    console.log(predata);
    var option = {
        grid: {
            top: '10%',
            left: '2%',
            right: '5%',
            bottom: '8%',
            // containLabel: true
        },
        tooltip: {
            show: true,
            trigger: "axis",

            /*  formatter: params => {
               if (params.componentSubType === 'bar' && params.seriesName !== '背景条') {
                 return `${params.seriesName}<br />${params.name}:${params.value}`
               } else {
                 return ''
               }
             } */
            formatter: function (data) {
                let result = '';
                let content = '';
                for (let i = 0; i < data.length - 1; i++) {
                    if (data[i].componentSubType === 'bar' && data[i].seriesName !== '背景条') {

                        content += `${data[i].marker} ${data[i].seriesName}<span style='font-size:12px; float:right;margin-left:20px;'>${data[i].data}</span><br/>`
                        result = `<span style='font-size: 14px;'>${data[i].name}</span> <br/> ${content}`;
                    } else {
                        // result = ''
                    }
                }
                return result;
            }
        },
        xAxis: {
            splitLine: {
                show: false
            },
            axisLabel: {
                margin: 20,
                show: false
            },
            axisTick: {
                show: false
            },
            axisLine: {
                show: false
            }
        },
        yAxis: [{
            inverse: true,
            type: 'category',
            splitLine: {
                show: false
            },
            axisLine: {
                show: false
            },
            axisLabel: {
                align: 'left',
                verticalAlign: 'bottom',
                padding: [0, 0, 26, 10],
                fontSize: "18",
                color: '#fff',
                formatter: function (param) {
                    //  return '{img|}'+ param
                    return ['{img|}' + '{b|' + param + '}']
                },
                rich: {
                    b: {
                        fontSize: 18,
                        color: '#fff',
                        padding: [0, 0, 0, 10]
                    },
                    img: {
                        backgroundColor: {
                            image: '/static/group/img/c-i1.png',
                        },
                        width: 17,
                        align: 'left',
                    }
                }
            },
            axisTick: {
                show: false
            },
            data: ['省级储备粮', '其他粮食', '省级储备油', '其它油'],
        },
            {
                type: "category",
                inverse: true,
                axisTick: "none",
                axisLine: "none",
                show: true,
                axisLabel: {
                    inside: true,
                    verticalAlign: "bottom",
                    textStyle: {
                        fontFamily: 'DINCond-Bold',
                        color: "#ffd12b",
                        fontSize: "20",
                        padding: [0, 0, 26, 0],
                    },
                    formatter: function (param) {
                        return toThousands(param)
                    }
                },
                data: ydata,
            }
        ],
        series: [{
            // 真实数值条形图
            name: '占比',
            type: 'bar', // pictorialBar
            stack: 'all',
            /* emphasis: {
              focus: 'series'
            }, */
            barWidth: 12,
            itemStyle: {
                color: '#00e4fa'
            },
            data: predata,
            z: 1
        },
            {
                name: '辅助值',
                type: 'pictorialBar',
                barWidth: 12,
                symbol: 'roundRect',
                symbolMargin: 2, //间隙
                symbolSize: [2, 12],
                symbolOffset: [-2, '0%'], //向左偏移9
                symbolClip: true, //裁剪掉左侧多余部分
                symbolRepeat: true,
                itemStyle: {
                    color: '#082640'
                },
                data: [100, 100, 100, 100],
                z: 2
            },
            {
                // 辅助背景图形
                name: '背景条',
                type: 'bar', // pictorialBar
                silent: true,
                barWidth: 12,
                barGap: '-100%',
                itemStyle: {
                    color: '#082640'
                },
                data: [100, 100, 100, 100],
                z: 0
            }
        ]
    };

    barChart.setOption(option);
    /*   if (id === 'breedChart') {
        breedChart = pieChart;
      } */


}

window.onload = function () {
   // barChartLoad(null);
    /*粮食品种*/
    window.onresize = function (e) {
        if (breedChart) {
            breedChart.resize();
        }
    }

  //  ajaxFoodNum();
}

/**
 * 获取饼状图数据
 */
function ajaxFoodNum() {

    var data = {
        "county": county,
        "type": type,
        "companyId": companyId
    };

    $.ajax({
        type: "POST",
        url: "../../visual/amount-food-number",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify(data),
        success: function (result) {
            if (result.code == "0000") {
                var data = result.data;
                renderFoodNum(data);
            }
        },
        error: function (error) {

        }
    });
}

//更新饼状图信息
function renderFoodNum(data) {
    if (data.allSum.length > 8) {
        $("#foodSum").css("font-size", "25px");
    } else {
        $("#foodSum").css("font-size", "32px");
    }
    $("#foodSum").html(data.allSum);

    var foodNumPerHtml = "";
    var color = ["0, 228, 250", "22, 226, 173", "255, 181, 23", "238, 60, 72", "135, 103, 255", "41, 122, 255", "238, 60, 144", "0, 228, 250", "22, 226, 173", "255, 181, 23", "238, 60, 72", "135, 103, 255", "41, 122, 255", "238, 60, 144"];
    for (var i = 0; i < data.varietyChartPie.length; i++) {
        foodNumPerHtml += "" +
            "<li>\n" +
            "\t\t\t\t\t\t\t\t\t<div class=\"con\" style=\"background-color: rgba(" + color[i] + ",.05);\">\n" +
            "\t\t\t\t\t\t\t\t\t\t<div class=\"dot\" style=\"background-color: rgb(" + color[i] + ");\"></div>\n" +
            "\t\t\t\t\t\t\t\t\t\t<div class=\"num\" style=\"color: rgb(" + color[i] + ");\">" + data.varietyChartPie[i].percent + "%</div>\n" +
            "\t\t\t\t\t\t\t\t\t\t<div class=\"type\">" + data.varietyChartPie[i].name + "</div>\n" +
            "\t\t\t\t\t\t\t\t\t</div>\n" +
            "\t\t\t\t\t\t\t\t</li>";
    }
    $("#foodNumPer").html(foodNumPerHtml);
    if (data.varietyChartPie.length > 0) {
        var varietyChart = breedChart;
        varietyChart.option.series[0].data = data.varietyChartPie;
        varietyChart.chart.setOption(varietyChart.option, true);
        breedChart = varietyChart;
    }
    barChartLoad(data);
}