let form, layer, laydate;
let user = getUser();
let myChart12 = echarts.init(document.getElementById('echarts-one'));
layui.use(['form', 'layer', 'laydate'], function () {
    layer = layui.layer;
    form = layui.form;
    laydate = layui.laydate;
    laydate.render({
        elem: '#ID-laydate-rangeLinked',
        range: ['#startDay', '#endDay'],
        rangeLinked: true,
        btns: ['confirm']
    });
    $('#startDay').val(getNowTime());
    $('#endDay').val(getNowTime());
    form.render();
    getVioStatistics();
});

// 查询
function query() {
    myChart12.dispose();
    myChart12 = echarts.init(document.getElementById('echarts-one'));
    getVioStatistics();
}

function getVioStatistics() {
    let param = {
        startTime: $('#startDay').val(),
        endTime: $('#endDay').val(),
        currentUserId: user.userId + '',
        isSup: user.isSup,
        currentUserOrgId: user.orgId
    };
    $.ajax({
        headers: {
            "encrypt": sm3(JSON.stringify(param))
        },
        url: dataUrl + 'proteam/pot/superStatistics/getVioStatistics?token=' + token,
        data: param,
        type: 'POST',
        async: true,
        success: function (result) {
            if (result.code === 200) {
                initEchartsOne(result.data);
            } else if (result.code === 401) {
                logout(1)
            }
        }, error: function () {
        }
    });
}

// 导出
function exportExcel() {
    let startTime = $("#startDay").val(),
        endTime = $("#endDay").val(),
        currentUserId = user.userId + '',
        isSup = user.isSup,
        currentUserOrgId = user.orgId;
    let loadingMsg = layer.msg("数据导出中,请稍候...", { icon: 16, scrollbar: false, time: 0, });
    let url = dataUrl + "proteam/pot/superStatistics/exportExcel?startTime=" + startTime + "&endTime=" + endTime + "&currentUserId=" + currentUserId + "&isSup=" + isSup + "&currentUserOrgId=" + currentUserOrgId + "&token=" + token;
    let xhr = new XMLHttpRequest();
    xhr.open("get", url, true);
    xhr.responseType = "blob"; // 转换流
    xhr.setRequestHeader("encrypt",
        sm3(JSON.stringify({
            startTime: startTime,
            endTime: endTime,
            currentUserId: currentUserId,
            isSup: isSup,
            currentUserOrgId: currentUserOrgId
        })));
        xhr.setRequestHeader('encryption','encryption');
    xhr.setRequestHeader('token',token);
    xhr.onload = function () {
        layer.close(loadingMsg);
        if (this.status === 200) {
            let blob = this.response;
            var a = document.createElement("a");
            var url = window.URL.createObjectURL(blob);
            a.href = url;
            a.download = startTime + '至' + endTime + "违章统计" + ".xlsx"; // 文件名
        } else {
            layer.msg("服务异常,请稍后重试", { icon: 16, scrollbar: false, time: 2000 });
        }
        a.click();
        window.URL.revokeObjectURL(url);
    };
    xhr.send();
}

/*按违章等级统计-echarts*/
function initEchartsOne(list) {
    let myData5 = []; // 地市
    let fwrs = [];  // 站班会数量
    let xdrs = [];  // 违章数量
    let zhl = [];  // 违章率
    $.each(list, function (index, item) {
        myData5.push(item.orgName);
        fwrs.push(item.classNum);
        xdrs.push(item.vioNum);
        zhl.push(item.vioRate);
    })
    let option = {
        backgroundColor: "transparent",
        tooltip: {
            trigger: "axis",
            axisPointer: {
                type: "shadow",
            },
            textStyle: {
                color: "#fff",
            },
            backgroundColor: "rgba(0, 58, 99, 0.8)", //设置背景颜色
            borderColor: "rgba(0, 58, 99, 0.8)",
            confine: true,
            formatter: `{b}<br>{a}：{c}个<br>{a1}：{c1}个<br>{a2}：{c2}%`,
        },
        legend: {
            itemWidth: 12,
            itemHeight: 8,
            itemGap: 20,
            right: "2%",
            top: "3%",
            x: "center",
            textStyle: {
                fontSize: 14,
                color: "#000",
            },
            data: ["站班会数量", "违章数量", "违章占比"],
            selectedMode: false,
        },
        grid: {
            top: "8%",
            left: "2%",
            right: "2%",
            bottom: "2%",
            containLabel: true,
        },
        xAxis: {
            type: "category",
            data: myData5,
            axisLabel: {
                color: "#000",
                interval: 0,
                fontSize: 12,
            },
            axisLine: {
                show: true,
                lineStyle: {
                    color: "rgba(127, 214, 255, .4)",
                },
            },
            splitLine: {
                show: false,
            },
            axisTick: {
                show: false,
            },
        },
        yAxis: [
            {
                type: "value",
                name: "数量 / 个",
                splitNumber: 5,
                nameTextStyle: {
                    color: "#000",
                    fontSize: 12,
                    align: "center",
                    // padding: [0, 20, 5, 0],
                },
                axisLabel: {
                    formatter: "{value}",
                    color: "rgba(95, 187, 235, 1)",
                    textStyle: {
                        fontSize: 14,
                        color: "#000",
                        lineHeight: 16,
                    },
                },
                axisTick: {
                    show: false,
                },
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: "rgba(28, 130, 197, .3)",
                        type: "dashed",
                    },
                },
            },
            {
                name: "违章占比 / %",
                splitNumber: 5,
                max: 100,
                type: "value",
                nameTextStyle: {
                    color: "#000",
                    fontSize: 12,
                    align: "center",
                    // padding: [0, 0, 5, 0],
                },
                axisLabel: {
                    show: true,
                    fontSize: 12,
                    color: "#000",
                },
                axisLine: {
                    show: false,
                },
                axisTick: {
                    show: false,
                },
                splitLine: {
                    show: false,
                },
            },
        ],
        series: [
            {
                name: "站班会数量",
                type: "bar",
                data: fwrs,
                barWidth: "15px",
                barGap: "50%",
                itemStyle: {
                    normal: {
                        borderColor: "#3681FF",
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            {
                                offset: 0,
                                color: "rgba(15, 51, 82, 1)",
                            },

                            {
                                offset: 1,
                                color: "rgba(0, 168, 255, 1)",
                            },
                        ]),
                    },
                },
                label: {
                    show: true,
                    position: "top",
                    fontSize: 12,
                    color: "#000",
                    offset: [0, -5],
                    formatter: "{c}",
                },
            },
            {
                name: "违章数量",
                type: "bar",
                data: xdrs,
                barWidth: "15px",
                barGap: "50%",
                itemStyle: {
                    normal: {
                        borderColor: "rgba(54, 234, 255, 1)",
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            {
                                offset: 0,
                                color: "rgba(15, 51, 82, 1)",
                            },

                            {
                                offset: 1,
                                color: "rgba(21, 219, 203, 1)",
                            },
                        ]),
                    },
                },
                label: {
                    show: true,
                    position: "top",
                    fontSize: 12,
                    color: "#000",
                    offset: [0, -5],
                    formatter: "{c}",
                },
            },
            {
                name: "违章占比",
                type: "line",
                yAxisIndex: 1,
                showSymbol: true,
                symbolSize: 8,
                smooth: true,
                symbol: "circle",
                lineStyle: {
                    normal: {
                        color: "#02D6B0",
                    },
                },
                itemStyle: {
                    color: "#02D6B0",
                    borderColor: "#fff",
                    borderWidth: 1,
                },
                areaStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(
                            0,
                            0,
                            0,
                            1,
                            [
                                {
                                    offset: 0,
                                    color: "rgba(0, 255, 246, 0.5)",
                                },
                                {
                                    offset: 1,
                                    color: "rgba(0, 255, 246, 0)",
                                },
                            ],
                            false
                        ),
                    },
                },
                data: zhl, // 折线图的数据
            },
        ],
    };
    myChart12.setOption(option, true);
    window.addEventListener("resize", function () {
        myChart12.resize();
    });
}