$(function () {


    let time = "all"
    let l1_type = 1
    let c1_xueduan = "0"





    let l1_xueduan = "0"

    // c1 学校主题活动开展情况监测
    //学段切换
    $('#l1_xueduan').on('change', function () {
        l1_xueduan = $(this).val() + ""
        l1(l1_xueduan, time)
    })
    // 时间切换
    $('body').on('click', '#switch_month', function (e) {
        time = "day";
        $('.switch-time a').removeClass('act')
        $('#switch_month').addClass("act")
        l1(l1_xueduan, time)

    })
    // 人数、次数切换
    $('body').on('click', '#switch_year', function (e) {
        time = "month"
        $('.switch-time a').removeClass('act')
        $('#switch_year').addClass("act")

        l1(l1_xueduan, time)

    })
    $('body').on('click', '#switch_all', function (e) {
        time = "all"
        $('.switch-time a').removeClass('act')
        $('#switch_all').addClass("act")
        l1(l1_xueduan, time)

    })

    l1(l1_xueduan, time);
    function l1(xueduan, time) {
        $("#x-table").html("loading...")

        if (time === "all") {
            query_id1 = "stage_school_social_type_num_all"
            query_id2 = "stage_school_social_num_all"
            xueduan1 = [xueduan, xueduan, xueduan, xueduan]
            xueduan2 = [xueduan, xueduan]
        } else if (time === "month") {
            query_id1 = "stage_school_social_type_num_month"
            query_id2 = "stage_school_social_num_month"
            xueduan1 = [xueduan, xueduan, nowYear, xueduan, xueduan, nowYear]
            xueduan2 = [xueduan, xueduan, nowYear]

        } else if (time === "day") {
            query_id1 = "stage_school_social_type_num_day"
            query_id2 = "stage_school_social_num_day"
            xueduan1 = [xueduan, xueduan, nowYear, nowMonth, xueduan, xueduan, nowYear, nowMonth]
            xueduan2 = [xueduan, xueduan, nowYear, nowMonth]

        }


        axios.all([
            axios({
                ...axiosConf,
                data: {
                    "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
                    "query": {
                        "query_id": query_id1,
                        "query_param": xueduan1
                    },
                    "query_cache": 0,
                    "query_count": [
                        "total"
                    ],
                    "query_format": "json",
                    "query_group": [
                        "org_name", "topic_name"
                    ]
                }
            }),
            axios({
                ...axiosConf,
                data: {
                    "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
                    "query": {
                        "query_id": query_id2,
                        "query_param": xueduan2
                    },
                    "query_cache": 0,
                    "query_count": [
                        "total"
                    ],
                    "query_format": "json",
                    "query_group": [
                        "org_name"
                    ]
                }

            })
        ]).then(axios.spread(function (schoolStageTypeRes, schoolStageRes) {
            let html = ""

            if (schoolStageTypeRes.data.result == "") {
                html = "暂无数据"
                console.log(html);
            } else {
                const schoolStageTypeData = JSON.parse(schoolStageTypeRes.data.result)
                const schoolStageData = JSON.parse(schoolStageRes.data.result)
                console.log(schoolStageTypeData, schoolStageData);
                let orgNameCatch = []
                let orgName = []
                schoolStageTypeData.map((item) => {
                    orgNameCatch.push({ id: item.org_id, name: item.org_name });
                })
                orgName = orgNameCatch.filter((item, index) => {
                    return orgNameCatch.findIndex(_item => _item.id == item.id) == index;
                })

                orgName.map((e, i) => {
                    let arr = []
                    schoolStageTypeData.map((item, index) => {
                        if (item.org_name === e.name) {


                            switch (item.social_topic) {
                                case "44":
                                    orgName[i].deyu = item.total
                                    break;
                                case "45":
                                    orgName[i].zhiyu = item.total
                                    break;
                                case "46":
                                    orgName[i].tiyu = item.total
                                    break;
                                case "47":
                                    orgName[i].meiyu = item.total
                                    break;
                                case "48":
                                    orgName[i].laodong = item.total
                                    break;
                                case "1":
                                    orgName[i].default = item.total
                                    break;
                                    defalut:
                                    break;
                            }
                        }
                    })
                    orgName[i].children = arr

                    schoolStageData.map((item) => {
                        if (item.org_name === e.name) {
                            orgName[i].total = item.total
                        }
                    })

                })


                html = `<div class="x-th">
            <div>序号</div>
            <div>学校名称</div>
            <div>德育</div>
            <div>智育</div>
            <div>体育</div>
            <div>美德</div>
            <div>劳动教育</div>
            <div>默认</div>
            <div>总计</div>
        </div>`
                orgName.map((item, index) => {


                    html += `
                <div class="x-tr">
                    <div>${index + 1}</div>
                    <div>${item.name}</div>
                    <div>${item.deyu ? item.deyu : 0}</div>
                    <div>${item.zhiyu ? item.zhiyu : 0}</div>
                    <div>${item.tiyu ? item.tiyu : 0}</div>
                    <div>${item.meiyu ? item.meiyu : 0}</div>
                    <div>${item.laodong ? item.laodong : 0}</div>
                    <div>${item.default ? item.default : 0}</div>
                    <div>${item.total}</div>
                </div>`
                })


            }
            $("#x-table").html(html)


        })).catch(() => {
            $("#x-table").html("链接失败")

        })

    }





    r1();
    function r1() {


        var myChart = echarts.init(document.getElementById('r1'));  // 各阶段学校数量
        myChart.showLoading(chartsLoadindStyle);

        axios({
            ...axiosConf,
            data: {
                "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
                "query": {
                    "query_id": "stage_social_type_num_all",
                    "query_param": []
                },
                "query_cache": 0,
                "query_count": [
                    "total"
                ],
                "query_format": "echarts",
                "query_group": [
                    "school_typename", "topic_name"
                ]
            }
        })
            .then((response) => {

                const resData = JSON.parse(response.data.result)
                let legendData = []
                let xAxisName = []
                let series = [{
                    type: 'bar',
                    data: [],
                }]
                let dataZoomShow = {
                    show: false
                }
                if (!resData.datas) {
                    myChart.showLoading(chartsLoadindNodataStyle);
                    myChart.clear()
                } else {

                    xAxisName = resData.groups[0]
                    legendData = resData.groups[1]


                    resData.groups[1].map((e, i) => {

                        series.push({
                            name: e,
                            type: 'bar',
                            data: resData.datas[i],
                            barMaxWidth: 20,
                        })

                    })




                    myChart.hideLoading();

                }

                // ===========================================

                option = {
                    // height: "100px",
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            type: 'cross',
                            crossStyle: {
                                color: '#999'
                            }
                        }
                    },

                    textStyle: {
                        color: '#01DFF4'
                    },
                    grid: {
                        top: 50,
                        right: 10,
                        bottom: 40,
                    },
                    color: ["#0BCAEA", "#FE8E3A", "#3FDB94"],
                    legend: {
                        data: legendData,
                        itemWidth: 8,
                        itemHeight: 8,
                        right: 10,
                        top: 10,
                        textStyle: {
                            color: '#01DFF4'
                        },
                    },
                    xAxis: [
                        {
                            type: 'category',
                            data: xAxisName,
                            axisLine: {
                                lineStyle: {
                                    color: '#01DFF4' //更改坐标轴颜色
                                }
                            },
                            axisLabel: {
                                fontSize: 10,
                                color: "white",

                            }

                        },

                    ],
                    yAxis: [

                        {
                            type: 'value',
                            axisLine: {
                                lineStyle: {
                                    color: '#01DFF4' //更改坐标轴颜色
                                }
                            }
                        }
                    ],
                    dataZoom: [
                        {

                            type: "slider",   //slider:滑块  inside:内置，依靠鼠标滚轮或者双击缩放
                            xAxisIndex: 0,   //显示x轴滑块
                            height: "15px",
                            end: 80,
                            top: "90%",
                            ...dataZoomShow
                        }
                    ],
                    series: series
                };


                myChart.setOption(option);

            }).catch(() => {
                myChart.showLoading(chartsLoadindNodataStyle);
                myChart.clear()
            })
        // 使用刚指定的配置项和数据显示图表。

        window.addEventListener("resize", function () {
            myChart.resize();
        });
    }



    r3();

    function r3() {
        var myChart = echarts.init(document.getElementById('r3'));  // 各阶段学校数量
        myChart.showLoading(chartsLoadindStyle);


        axios({
            ...axiosConf,
            data: {
                "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
                "query": {
                    "query_id": "social_type_month_year_all",
                    "query_param": [

                    ]
                },
                "query_cache": 0,
                "query_count": [
                    "total"
                ],
                "query_format": "echarts",
                "query_group": [
                    "year_name", "topic_name"
                ]
            }
        }).then((response) => {

            const resData = JSON.parse(response.data.result)

            let xAxisName = []

            let data = []
            let series = []
            let seriesName = []
            if (!resData.datas) {
                myChart.showLoading(chartsLoadindNodataStyle);
                myChart.clear()


            } else {
                seriesName = resData.groups[1]
                xAxisName = resData.groups[0]
                data = resData.datas
                data.map((e, i) => {

                    series.push({
                        name: seriesName[i],
                        type: 'line',
                        data: e
                    })
                })

                data1 = resData.datas[0]
                data2 = resData.datas[1]
                data3 = resData.datas[2]
                data3 = resData.datas[3]
                data4 = resData.datas[4]
                data5 = resData.datas[5]

                myChart.hideLoading();

            }






            option = {
                // height: "100px",
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        crossStyle: {
                            color: '#999'
                        }
                    }
                },

                textStyle: {
                    color: '#01DFF4'
                },
                grid: {
                    right: 10,
                    top: 50,
                    bottom: 35,
                },
                color: ["#0BCAEA", "#FE8E3A", "#3FDB94"],
                legend: {
                    data: seriesName,
                    itemWidth: 8,
                    itemHeight: 8,
                    right: 10,
                    top: 15,
                    textStyle: {
                        color: '#01DFF4'
                    },

                },
                xAxis: [
                    {
                        type: 'category',
                        data: xAxisName,
                        axisLine: {
                            lineStyle: {
                                color: '#01DFF4' //更改坐标轴颜色
                            }
                        },
                        axisLabel: {
                            fontSize: 10,
                            color: "white",

                        }
                    },
                ],
                yAxis: [

                    {
                        type: 'value',
                        axisLine: {
                            lineStyle: {
                                color: '#01DFF4' //更改坐标轴颜色
                            }
                        }
                    }
                ],
                series: series
            };


            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize", function () {
                myChart.resize();
            });
        }).catch(() => {
            myChart.showLoading(chartsLoadindNodataStyle);
            myChart.clear()

        })




    }


    let r2_time = "2021"
    let optionHtml = ""
    for (i = nowYear; i > nowYear - 10; i--) {
        optionHtml += `<option value="${i}">${i}年</option>`
    }
    $("#r2_time").html(optionHtml)


    $('#r2_time').on('change', function () {
        r2_time = $(this).val() + ""
        r2(r2_time);
    })




    r2(r2_time);
    function r2(time) {
        console.log(time);
        var myChart = echarts.init(document.getElementById('r2'));  // 各阶段学校数量
        myChart.showLoading(chartsLoadindStyle);


        axios({
            ...axiosConf,
            data: {
                "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
                "query": {
                    "query_id": "social_type_month_num_all",
                    "query_param": [
                        time
                    ]
                },
                "query_cache": 0,
                "query_count": [
                    "total"
                ],
                "query_format": "echarts",
                "query_group": [
                    "month_name", "topic_name"
                ]
            }
        })
            .then((response) => {

                const resData = JSON.parse(response.data.result)

                let xAxisName = []
                let legendData = []
                let series = []
                let dataZoom = {}
                if (!resData.datas) {
                    myChart.showLoading(chartsLoadindNodataStyle);
                    myChart.clear()
                    dataZoom = {
                        show: false
                    }
                } else {
                    xAxisName = resData.groups[0]
                    legendData = resData.groups[1]
                    resData.groups[1].map((e, i) => {
                        series.push({
                            name: e,
                            type: 'bar',
                            stack: "all",
                            data: resData.datas[i],
                            barMaxWidth: 40,
                        })

                    })

                    myChart.hideLoading();

                }






                option = {
                    // height: "100px",
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            type: 'cross',
                            crossStyle: {
                                color: '#999'
                            }
                        }
                    },
                    textStyle: {
                        color: '#01DFF4'
                    },
                    grid: {
                        top: 55,
                        bottom: 35,
                        right: 10
                    },
                    color: ["#0BCAEA", "#FE8E3A", "#3FDB94", "#4992FF", "#FF6E76"],
                    legend: {
                        data: legendData,
                        top: 15,
                        right: 10,
                        itemWidth: 8,
                        itemHeight: 8,
                        textStyle: {
                            color: '#01DFF4'
                        },
                    },
                    xAxis: [
                        {
                            type: 'category',
                            data: xAxisName,
                            axisLine: {
                                lineStyle: {
                                    color: '#01DFF4' //更改坐标轴颜色
                                }
                            },
                            axisLabel: {
                                interval: 0,
                                fontSize: 10,
                                color: "white",

                            }

                        },

                    ],
                    yAxis: [
                        {
                            type: 'value',
                            axisLine: {
                                lineStyle: {
                                    color: '#01DFF4' //更改坐标轴颜色
                                }
                            }
                        },
                        {
                            type: 'value',
                            axisLine: {
                                lineStyle: {
                                    color: '#01DFF4' //更改坐标轴颜色
                                }
                            }
                        }
                    ],
                    series: series
                };


                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);




                window.addEventListener("resize", function () {
                    myChart.resize();
                });
            }).catch(() => {
                myChart.showLoading(chartsLoadindNodataStyle);
                myChart.clear()
                dataZoom = {
                    show: false
                }
            })



    }

})