/**
 * @Description 文件描述
 * @Author zhangming
 * @Date 2021-03-02 17:30:04
 * @LastEditTime 2021-04-26 14:52:07
 * @LastEditors zhangming
 */
var E_chart_area = [];


var area_name = GetQueryString('area_name')
console.log("shcoolData:",area_name)

$(function () {


    // 渲染年份列表 在nav.js中获取select_year
    $('#select-year').append(select_year)
    $('.select').on('click', '.placeholder', function (e) {
        var parent = $(this).closest('.select');
        if (!parent.hasClass('is-open')) {
            parent.addClass('is-open');
            $('.select.is-open').not(parent).removeClass('is-open');
        } else {
            parent.removeClass('is-open');
        }
        e.stopPropagation();
    }).on('click', 'ul>li', function () {
        var parent = $(this).closest('.select');
        parent.removeClass('is-open').find('.placeholder').text($(this).text());
        $(window).attr('location', "areaIndex.html?year=" + $(this).text() + "&area_name=" + area_name);
        let on_year = $(this).text();
        echartSizeInfo(on_year);

    });

    var typeOfBe = 'small';
    let areaName = document.querySelector("h1");
    let areaNames = document.querySelector("#myModalLabel");
    var url = decodeURI(window.location.href);
    // var argsIndex = url.split("?area_name=");
    areaName.innerHTML = area_name + '教育发展总体情况';
    areaNames.innerHTML = area_name + '学校列表';
    // 标题增加年份
    $('h1').prepend(config_now_year)
    // 各阶段学校数量
    echarts_1(config_now_year);
    // 学校规模情况
    echarts_2(config_now_year);
    // 学生情况
    echarts_3(config_now_year);
    // 班额情况
    echarts_4(config_now_year);
    // 办学条件情况
    echarts_5(config_now_year);
    // echarts_61();
    // echarts_62();
    // echarts_63();
    getTeacherProportion(config_now_year);
    getStudentProportion(config_now_year);
    getTabList(config_now_year);
    table_data(config_now_year);
    function getTabList(year) {
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": "A075",
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "studentno", "teacherno"
            ],
            "query_format": "json",
            "query_group": [
                "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            var newData = [];
            if(data && data !== ""){
                newData = JSON.parse(data);
            }

            var tab_list = [];
            newData.map((item, index) => {
                // debugger
                if (item.schooltype === "小学" || item.schooltype === "九年一贯制学校" || item.schooltype === "十二年一贯制学校") {
                    var a = tab_list.indexOf("小学");
                    if (a > -1) {
                    } else {
                        tab_list.push("小学")
                    }
                } else if (item.schooltype === "初级中学" || item.schooltype === "九年一贯制学校" || item.schooltype === "十二年一贯制学校" || item.schooltype === "完全中学") {
                    var a = tab_list.indexOf("初中");
                    if (a > -1) {
                    } else {
                        tab_list.push("初中")
                    }
                } else if (item.schooltype === "高级中学" || item.schooltype === "十二年一贯制学校" || item.schooltype === "完全中学") {
                    var a = tab_list.indexOf("高中");
                    if (a > -1) {
                    } else {
                        tab_list.push("高中")
                    }
                }
            })
            _html = '';
            tab_list.map((item, index) => {
                if (index === 0) {
                    _html += `<button class="active tabbtn">${item}</button>`
                } else {
                    _html += `<button class="tabbtn">${item}</button>`
                }
            })
            var tabList = document.querySelector(".tab");
            tabList.innerHTML = _html;
            $("body").delegate(".tabbtn", "click", function (e) {
                $(this).addClass('active');
                $(this).siblings().removeClass('active');
                if (e.target.innerHTML === "小学") {
                    typeOfBe = 'small';
                } else if (e.target.innerHTML === "初中") {
                    typeOfBe = 'middle';
                } else if (e.target.innerHTML === "高中") {
                    typeOfBe = 'height';
                }
                echarts_4(config_now_year);
            })
        })
    }
    // 各阶段学校数量
    function echarts_1(year) {
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": "A042",
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "total"
            ],
            "query_format": "echarts",
            "query_group": [
                "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            var indata = [];
            var newData = [];
            if(data && data !== ""){
                indata = JSON.parse(data);
            }
            newData = dataToChar(indata);

            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('student_number_qx1'));  // 各阶段学校数量
            E_chart_area.push(myChart);
            option = {
                title: {
                    text: '',
                    left: 'center',
                    textStyle: {
                        color: '#fff',
                        fontSize: '16'
                    }
                },
                legend: {
                    type: 'scroll',
                    orient: 'vertical',
                    right: 0,
                    top: '20%',
                    bottom: 20,

                    data: indata.groups[0],
                    textStyle: {
                        color: 'rgba(255,255,255,.5)',
                        fontSize: '12',
                    },
                },
                tooltip: {
                    trigger: 'item'
                },
                series: [
                    {
                        name: '',
                        type: 'pie',
                        radius: '70%',
                        center: ['40%', '50%'],
                        color: ['#168EFE', '#8882F7', '#FFA06C', '#FFDB65', '#2CD1C0', '#FF88A8'],
                        data: newData,
                        label: { show: false },
                        labelLine: { show: false },
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        },
                        animationDelay: function (idx) {
                            return idx * 100;
                        }
                    }
                ]
            };

            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize", function () {
                myChart.resize();
            });
        }, 'json');
    }
    // 学校规模情况
    function echarts_2(year) {
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": "A041",
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "studentno"
            ],
            "query_format": "echarts",
            "query_group": [
                "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            var newData = [];
            if(data && data !== ""){
                newData = JSON.parse(data);
            }

            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('echart_school_size_qx2'));  // 学校规模情况
            E_chart_area.push(myChart);

            option = {
                //  backgroundColor: '#00265f',
                tooltip: {
                    trigger: 'axis',
                    axisPointer: { type: 'shadow' }
                },
                grid: {
                    left: '0%',
                    top: '10px',
                    right: '0%',
                    bottom: '4%',
                    containLabel: true
                },
                xAxis: [{
                    type: 'category',
                    data: newData.groups[0],
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            width: 1,
                            type: "solid"
                        },
                    },

                    axisTick: {
                        show: false,
                    },
                    axisLabel: {
                        interval: 0,
                        // rotate:50,
                        show: true,
                        splitNumber: 15,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                }],
                yAxis: [{
                    // name: '(万人)',
                    // nameLocation: 'start',
                    // nameTextStyle: {
                    //     color: '#fff',
                    // },
                    type: 'value',
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                    axisTick: {
                        show: false,
                    },
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1	)",
                            width: 1,
                            type: "solid"
                        },
                    },
                    splitLine: {
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            type: 'dashed'
                        }
                    }
                }],
                series: [
                    {

                        type: 'bar',
                        data: newData.datas[0],
                        barWidth: '35%', //柱子宽度
                        // barGap: 1, //柱子之间间距
                        itemStyle: {
                            normal: {
                                color: '#FFA06C',
                                opacity: 1,
                                barBorderRadius: 5,
                            }
                        },
                    }
                ],
            };

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

    }
    // 学生情况
    function echarts_3(year) {
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": "A038",
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "total"
            ],
            "query_format": "echarts",
            "query_group": [
                "didgroup", "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            var newData = [];
            if(data && data !== ""){
                newData = JSON.parse(data);
            }
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('student_situation_qx3'));  // 学生情况
            E_chart_area.push(myChart);

            option = {
                //  backgroundColor: '#00265f',
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'shadow'
                    }
                },
                legend: {
                    data: newData.groups[1],
                    textStyle: {
                        color: '#fff'
                    }
                },
                grid: {
                    left: '0%',
                    top: '10px',
                    right: '0%',
                    bottom: '2%',
                    containLabel: true
                },
                xAxis: [{
                    type: 'category',
                    data: newData.groups[0],
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            width: 1,
                            type: "solid"
                        },
                    },

                    axisTick: {
                        show: false,
                    },
                    axisLabel: {
                        interval: 0,
                        // rotate:50,
                        show: true,
                        splitNumber: 15,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                }],
                yAxis: [{
                    type: 'value',
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                    axisTick: {
                        show: false,
                    },
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1	)",
                            width: 1,
                            type: "solid"
                        },
                    },
                    splitLine: {
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            type: 'dashed'
                        }
                    }
                }],
                series: [
                    {
                        name: '小学',
                        type: 'bar',
                        data: newData.datas[0],
                        barWidth: '15%', //柱子宽度
                        // barGap: 1, //柱子之间间距
                        itemStyle: {
                            normal: {
                                color: '#8882F7',
                                opacity: 1,
                                barBorderRadius: 5,
                            }
                        }
                    },
                    {
                        name: '初中',
                        type: 'bar',
                        data: newData.datas[1],
                        barWidth: '15%', //柱子宽度
                        // barGap: 1, //柱子之间间距
                        itemStyle: {
                            normal: {
                                color: '#FFA06C',
                                opacity: 1,
                                barBorderRadius: 5,
                            }
                        }
                    },
                    {
                        name: '高中',
                        type: 'bar',
                        data: newData.datas[2] ? newData.datas[2] : 0,
                        barWidth: '15%', //柱子宽度
                        // barGap: 1, //柱子之间间距
                        itemStyle: {
                            normal: {
                                color: '#2CD1C0',
                                opacity: 1,
                                barBorderRadius: 5,
                            }
                        }
                    }
                ]
            };
            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize", function () {
                myChart.resize();
            });
        }, 'json')
    }
    // 班额情况
    function echarts_4(year) {
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": "A037",
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "total"
            ],
            "query_format": "echarts",
            "query_group": [
                "didgroup", "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            var newData = [];
            if(data && data !== ""){
                newData = JSON.parse(data);
            }
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('class_capacity_qx4'));  // 班额情况
            E_chart_area.push(myChart);

            option = {
                //  backgroundColor: '#00265f',
                tooltip: {
                    trigger: 'axis',
                    axisPointer: { type: 'shadow' }
                },
                grid: {
                    left: '0%',
                    top: '0',
                    right: '5%',
                    bottom: '16%',
                    containLabel: true
                },
                legend: {
                    show: false
                },
                xAxis: [{
                    type: 'value',
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                    axisTick: {
                        show: false,
                    },
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1	)",
                            width: 1,
                            type: "solid"
                        },
                    },
                    splitLine: {
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            type: 'dashed'
                        }
                    }
                }],
                yAxis: [{
                    type: 'category',
                    data: newData.groups[0],
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            width: 1,
                            type: "solid"
                        },
                    },

                    axisTick: {
                        show: false,
                    },
                    axisLabel: {
                        interval: 0,
                        // rotate:50,
                        show: true,
                        splitNumber: 15,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                }],

                series: [
                    {
                        name: typeOfBe === 'small' ? '小学' : typeOfBe === 'middle' ? '初中' : '高中',
                        type: 'bar',
                        data: typeOfBe === 'small' ? newData.datas[0] : typeOfBe === 'middle' ? newData.datas[1] : newData.datas[2],
                        barWidth: '15%', //柱子宽度
                        // barGap: 1, //柱子之间间距
                        label: {
                            show: true,
                            position: 'right'
                        },
                        itemStyle: {
                            normal: {
                                color: '#168EFE',
                                opacity: 1,
                                barBorderRadius: 5,
                            }
                        }
                    },
                ]
            };
            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize", function () {
                myChart.resize();
            });
        }, 'json');
    }
    // 办学条件情况
    function echarts_5(year) {
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": "A040",
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "total", "studentno"
            ],
            "query_format": "json",
            "query_group": [
                "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            var newData = [];
            if(data && data !== ""){
                newData = JSON.parse(data);
            }
            var averageAreaName = [];
            var small_total = 0;
            var small_student_num = 0;
            var middle_total = 0;
            var middle_student_num = 0;
            var height_total = 0;
            var height_student_num = 0;
            newData.map((item, index) => {
                if (item.stage === "小学") {
                    small_total += newData[index].total;
                    small_student_num += newData[index].studentno;
                } else if (item.stage === "初中") {
                    middle_total += newData[index].total;
                    middle_student_num += newData[index].studentno;
                } else if (item.stage === "高中") {
                    height_total += newData[index].total;
                    height_student_num += newData[index].studentno;
                }
            })

            var averageArea = [];
            if (small_total !== 0 && small_student_num !== 0) {
                var small = (small_total / small_student_num).toFixed(2);
                averageArea.push(small);
                averageAreaName.push("小学");
            }
            if (middle_total !== 0 && middle_student_num !== 0) {
                var middle = (middle_total / middle_student_num).toFixed(2);
                averageArea.push(middle);
                averageAreaName.push("初中");
            }
            if (height_total !== 0 && height_student_num !== 0) {
                var height = (height_total / height_student_num).toFixed(2);
                averageArea.push(height);
                averageAreaName.push("高中");
            }

            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('echart_school_condition_qx5'));  // 办学条件情况
            E_chart_area.push(myChart);

            option = {
                //  backgroundColor: '#00265f',
                title: [{
                    text: '生均占地面积情况',
                    // subtext: 'From ExcelHome',
                    left: 'left',
                    textStyle: {
                        color: '#fff',
                        fontSize: '12'
                    }

                }],
                tooltip: {
                    trigger: 'axis',
                    axisPointer: { type: 'shadow' }
                },
                grid: {
                    left: '0%',
                    top: '14%',
                    right: '0%',
                    bottom: '4%',
                    containLabel: true
                },
                xAxis: [{
                    type: 'category',
                    data: averageAreaName,
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            width: 1,
                            type: "solid"
                        },
                    },

                    axisTick: {
                        show: false,
                    },
                    axisLabel: {
                        interval: 0,
                        // rotate:50,
                        show: true,
                        splitNumber: 15,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                }],
                yAxis: [{
                    type: 'value',
                    axisLabel: {
                        //formatter: '{value} %'
                        show: true,
                        textStyle: {
                            color: "rgba(255,255,255,.6)",
                            fontSize: '12',
                        },
                    },
                    axisTick: {
                        show: false,
                    },
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: "rgba(255,255,255,.1	)",
                            width: 1,
                            type: "solid"
                        },
                    },
                    splitLine: {
                        lineStyle: {
                            color: "rgba(255,255,255,.1)",
                            type: 'dashed'
                        }
                    }
                }],
                series: [
                    {
                        name: '',
                        type: 'bar',
                        data: averageArea,
                        barWidth: '30%', //柱子宽度
                        // barGap: 1, //柱子之间间距
                        itemStyle: {
                            normal: {
                                color: '#168EFE',
                                opacity: 1,
                                barBorderRadius: 5,
                            }
                        }
                    },
                ]
            };
            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize", function () {
                myChart.resize();
            });
        }, 'json')
    }

    // 专任教师师生比
    function getTeacherProportion(year) {
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": "A039",
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "studentno", "teacherno"
            ],
            "query_format": "json",
            "query_group": [
                "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            var newData = [];
            if(data && data !== ""){
                newData = JSON.parse(data);
            }
            // if (newData[1] === undefined) {
            //     $("#taacher_and_student_qx61").addClass("sqzn_all");
            //     $("#taacher_and_student_qx61").removeClass("sy");
            //     $("#taacher_and_student_qx62").removeClass("sy");
            //     $("#taacher_and_student_qx63").removeClass("sy");
            // }
            if (newData[2] === undefined) {
                $("#taacher_and_student_qx61").addClass("sqzn");
                $("#taacher_and_student_qx61").removeClass("sy");
                $("#taacher_and_student_qx62").addClass("sqzn");
                $("#taacher_and_student_qx62").removeClass("sy");
                $("#taacher_and_student_qx63").removeClass("sy");
            }
            if (newData[0]) {
                var teacherNum0 = Number(newData[0].teacherno);
                var studentNum0 = Number(newData[0].studentno);
                var studentP1 = (studentNum0 / teacherNum0).toFixed(2);
                echarts_61(studentP1);
            }
            if (newData[1]) {
                var teacherNum1 = Number(newData[1].teacherno);
                var studentNum1 = Number(newData[1].studentno);
                var studentP2 = (studentNum1 / teacherNum1).toFixed(2);
                echarts_62(studentP2);
            }
            if (newData[2]) {
                var teacherNum2 = Number(newData[2].teacherno);
                var studentNum2 = Number(newData[2].studentno);
                var studentP3 = (studentNum2 / teacherNum2).toFixed(2);
                echarts_63(studentP3);
            }

        }, 'json');
    }
    function echarts_61(studentP) {
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('taacher_and_student_qx61'));
        E_chart_area.push(myChart);

        option = {
            title: [{
                text: '小学',
                left: 'center',
                textStyle: {
                    color: '#fff',
                    fontSize: '16'
                }

            }],
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)",
                position: function (p) {   //其中p为当前鼠标的位置
                    return [p[0] + 10, p[1] - 10];
                }
            },
            legend: {
                top: '75%',
                itemWidth: 10,
                itemHeight: 10,
                data: ['教师', '学生'],
                textStyle: {
                    color: 'rgba(255,255,255,.5)',
                    fontSize: '12',
                }
            },
            graphic: {
                type: 'text',
                left: 'center',
                top: '40%',
                style: {
                    text: `1:${studentP}`,
                    textAlign: 'center',
                    fill: '#6EE3DA',
                    fontSize: '16'
                }
            },
            series: [
                {
                    name: '小学',
                    type: 'pie',
                    center: ['50%', '42%'],
                    radius: ['40%', '60%'],
                    color: ['#168EFE', '#FFDB65'],
                    label: { show: false },
                    labelLine: { show: false },
                    data: [
                        { value: 1, name: '教师' },
                        { value: studentP, name: '学生' },
                    ],
                    emphasis: {
                        itemStyle: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
        window.addEventListener("resize", function () {
            myChart.resize();
        });
    }
    function echarts_62(studentP) {
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('taacher_and_student_qx62'));
        E_chart_area.push(myChart);

        option = {

            title: [{
                text: '初中',
                left: 'center',
                textStyle: {
                    color: '#fff',
                    fontSize: '16'
                }

            }],
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)",
                position: function (p) {   //其中p为当前鼠标的位置
                    return [p[0] + 10, p[1] - 10];
                }
            },
            legend: {
                top: '75%',
                itemWidth: 10,
                itemHeight: 10,
                data: ['教师', '学生'],
                textStyle: {
                    color: 'rgba(255,255,255,.5)',
                    fontSize: '12',
                }
            },
            graphic: {
                type: 'text',
                left: 'center',
                top: '40%',
                style: {
                    text: `1:${studentP}`,
                    textAlign: 'center',
                    fill: '#6EE3DA',
                    fontSize: '16'
                }
            },
            series: [
                {
                    name: '初中',
                    type: 'pie',
                    center: ['50%', '42%'],
                    radius: ['40%', '60%'],
                    color: ['#168EFE', '#FFDB65'],
                    label: { show: false },
                    labelLine: { show: false },
                    data: [
                        { value: 1, name: '教师' },
                        { value: studentP, name: '学生' },
                    ],
                }
            ]
        };

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

        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('taacher_and_student_qx63'));
        E_chart_area.push(myChart);

        option = {
            title: [{
                text: '高中',
                left: 'center',
                textStyle: {
                    color: '#fff',
                    fontSize: '16'
                }

            }],
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)",
                position: function (p) {   //其中p为当前鼠标的位置
                    return [p[0] + 10, p[1] - 10];
                }
            },
            legend: {
                top: '70%',
                itemWidth: 10,
                itemHeight: 10,
                data: ['教师', '学生'],
                textStyle: {
                    color: 'rgba(255,255,255,.5)',
                    fontSize: '12',
                }
            },
            graphic: {
                type: 'text',
                left: 'center',
                top: '40%',
                style: {
                    text: `1:${studentP}`,
                    textAlign: 'center',
                    fill: '#6EE3DA',
                    fontSize: '16'
                }
            },
            series: [
                {
                    name: '高中',
                    type: 'pie',
                    center: ['50%', '42%'],
                    radius: ['40%', '60%'],
                    color: ['#168EFE', '#FFDB65'],
                    label: { show: false },
                    labelLine: { show: false },
                    data: [
                        { value: 1, name: '教师' },
                        { value: studentP, name: '学生' },
                    ],
                }
            ]
        };
        if (newData[2]) {
            // 使用刚指定的配置项和数据显示图表。
            myChart.setOption(option);
            window.addEventListener("resize", function () {
                myChart.resize();
            });
        }
    }
    // 学生男女比例
    function getStudentProportion(year) {
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": "A036",
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "teacherno", "studentno"
            ],
            "query_format": "json",
            "query_group": [
                "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            var newData = [];
            if(data && data !== ""){
                newData = JSON.parse(data);
            }
            if (newData[2] === undefined) {
                $("#student_boys_and_girls11").addClass("sqzn");
                $("#student_boys_and_girls11").removeClass("sy");
                $("#student_boys_and_girls12").addClass("sqzn");
                $("#student_boys_and_girls12").removeClass("sy");
                $("#student_boys_and_girls13").removeClass("sy");
            }
            if (newData[0]) {
                var womon = newData[0].nvno;
                var mon = newData[0].total - newData[0].nvno;
                echarts_11(womon, mon);
            }
            if (newData[1]) {
                var womon = newData[1].nvno;
                var mon = newData[1].total - newData[1].nvno;
                echarts_12(womon, mon);
            }
            if (newData[2]) {
                var womon = newData[2].nvno;
                var mon = newData[2].total - newData[2].nvno;
                echarts_13(womon, mon);
            }
        }, 'json');
    }
    function echarts_11(womon, mon) {

        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('student_boys_and_girls11'));
        E_chart_area.push(myChart);

        option = {

            title: [{
                text: '小学',
                left: 'center',
                textStyle: {
                    color: '#fff',
                    fontSize: '16'
                }

            }],
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)",
                position: function (p) {   //其中p为当前鼠标的位置
                    return [p[0] + 10, p[1] - 10];
                }
            },
            legend: {
                top: '75%',
                itemWidth: 10,
                itemHeight: 10,
                data: ['男', '女'],
                textStyle: {
                    color: 'rgba(255,255,255,.5)',
                    fontSize: '12',
                }
            },
            series: [
                {
                    name: '小学',
                    type: 'pie',
                    center: ['50%', '42%'],
                    radius: ['40%', '60%'],
                    color: ['#168EFE', '#FFDB65'],
                    label: { show: false },
                    labelLine: { show: false },
                    data: [
                        { value: mon, name: '男' },
                        { value: womon, name: '女' },
                    ],
                    emphasis: {
                        itemStyle: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
        window.addEventListener("resize", function () {
            myChart.resize();
        });
    }
    function echarts_12(womon, mon) {
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('student_boys_and_girls12'));
        E_chart_area.push(myChart);

        option = {

            title: [{
                text: '初中',
                left: 'center',
                textStyle: {
                    color: '#fff',
                    fontSize: '16'
                }

            }],
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)",
                position: function (p) {   //其中p为当前鼠标的位置
                    return [p[0] + 10, p[1] - 10];
                }
            },
            legend: {
                top: '75%',
                itemWidth: 10,
                itemHeight: 10,
                data: ['男', '女'],
                textStyle: {
                    color: 'rgba(255,255,255,.5)',
                    fontSize: '12',
                }
            },
            series: [
                {
                    name: '初中',
                    type: 'pie',
                    center: ['50%', '42%'],
                    radius: ['40%', '60%'],
                    color: ['#168EFE', '#FFDB65'],
                    label: { show: false },
                    labelLine: { show: false },
                    data: [
                        { value: mon, name: '男' },
                        { value: womon, name: '女' },
                    ],
                }
            ]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
        window.addEventListener("resize", function () {
            myChart.resize();
        });
    }
    function echarts_13(womon, mon) {
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('student_boys_and_girls13'));
        E_chart_area.push(myChart);

        option = {
            title: [{
                text: '高中',
                left: 'center',
                textStyle: {
                    color: '#fff',
                    fontSize: '16'
                }

            }],
            tooltip: {
                trigger: 'item',
                formatter: "{a} <br/>{b}: {c} ({d}%)",
                position: function (p) {   //其中p为当前鼠标的位置
                    return [p[0] + 10, p[1] - 10];
                }
            },
            legend: {
                top: '75%',
                itemWidth: 10,
                itemHeight: 10,
                data: ['男', '女'],
                textStyle: {
                    color: 'rgba(255,255,255,.5)',
                    fontSize: '12',
                }
            },
            series: [
                {
                    name: '高中',
                    type: 'pie',
                    center: ['50%', '42%'],
                    radius: ['40%', '60%'],
                    color: ['#168EFE', '#FFDB65'],
                    label: { show: false },
                    labelLine: { show: false },
                    data: [
                        { value: mon, name: '男' },
                        { value: womon, name: '女' },
                    ],
                }
            ]
        };

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

    function table_data(year) {
        var query_id = "A043";
        if(parseInt(year) >= 2021){
            query_id = "A079"
        }
        $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
            "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
            "query": {
                "query_id": query_id,
                "query_param": [
                    year, area_name
                ]
            },
            "query_cache": 0,
            "query_count": [
                "teacherno", "studentno"
            ],
            "query_format": "json",
            "query_group": [
                "stage"
            ]
        }), function (resport) {
            var data = resport.result;
            console.log("shcoolData:",data)
            var newData = [];
            if(data && data !== ""){
                newData = JSON.parse(data);
            }
            _tab = "";

            var primary_school = [];
            var junior_middle_school = [];
            var nine_year_school = [];
            var Senior_high_school = [];
            var Complete_high_school = [];
            var twelve_year_school = [];

            var tabListBtn = []
            newData.map((item, index) => {
                var a = tabListBtn.indexOf(item.schooltype);
                if (a > -1) {
                    // console.log(1111111111, 'a')
                } else {
                    tabListBtn.push(item.schooltype)
                }

                if (item.schooltype === "小学") {
                    primary_school.push(item);
                } else if (item.schooltype === "初级中学") {
                    junior_middle_school.push(item);
                } else if (item.schooltype === "九年一贯制学校") {
                    nine_year_school.push(item);
                } else if (item.schooltype === "高级中学") {
                    Senior_high_school.push(item);
                } else if (item.schooltype === "完全中学") {
                    Complete_high_school.push(item);
                } else if (item.schooltype === "十二年一贯制学校") {
                    twelve_year_school.push(item);
                }
            })

            tabListBtn.map((item, index) => {
                if (index === 0) {
                    _tab += '<li role="presentation" class="active tab_box_css">'
                    _tab += "<a href='javascript:void(0)'>" + item + "</a>"
                    _tab += '</li>'
                    // _tab += `<li role="presentation" class="active tab_box_css"><a  onclick="${tabfunction(item)}">${item}</a></li>`
                } else {
                    // _tab += `<li role="presentation" class=" tab_box_css"><a onclick="tabfunction(${item})">${item}</a></li>`
                    _tab += '<li role="presentation" class="tab_box_css">'
                    _tab += '<a href="javascript:void(0)">' + item + '</a>'
                    _tab += '</li>'
                }
            })
            // $(".nav-pills").html(_tab)  
            var tabList = document.querySelector(".nav-pills");
            tabList.innerHTML = _tab;

            $("body").delegate(".tab_box_css", "click", function (e) {
                $(this).addClass("active").siblings().removeClass("active");
                _html = "";
                if (e.target.innerHTML === "小学") {
                    primary_school.map((item, index) => {
                        _html += `<li class="school_name_style"><div></div>
                        <a href="schoolIndex.html?area_name=${area_name}&school_id=${item.organizationno}&school_name=${item.organizationname}${GetQueryString("year") ? "&year=" + GetQueryString("year") : ''}">${item.organizationname}</a>
                        </li>`
                    })
                    var schoolList = document.querySelector("#school_list .school_list_ul");
                    schoolList.innerHTML = _html;
                } else if (e.target.innerHTML === "初级中学") {
                    junior_middle_school.map((item, index) => {
                        _html += `<li class="school_name_style"><div></div>
                        <a href="schoolIndex.html?area_name=${area_name}&school_id=${item.organizationno}&school_name=${item.organizationname}${GetQueryString("year") ? "&year=" + GetQueryString("year") : ''}">${item.organizationname}</a>
                        </li>`
                    })
                    var schoolList = document.querySelector("#school_list .school_list_ul");
                    schoolList.innerHTML = _html;
                } else if (e.target.innerHTML === "九年一贯制学校") {
                    nine_year_school.map((item, index) => {
                        _html += `<li class="school_name_style"><div></div>
                        <a href="schoolIndex.html?area_name=${area_name}&school_id=${item.organizationno}&school_name=${item.organizationname}${GetQueryString("year") ? "&year=" + GetQueryString("year") : ''}">${item.organizationname}</a>
                        </li>`
                    })
                    var schoolList = document.querySelector("#school_list .school_list_ul");
                    schoolList.innerHTML = _html;
                } else if (e.target.innerHTML === "高级中学") {
                    Senior_high_school.map((item, index) => {
                        _html += `<li class="school_name_style"><div></div>
                        <a href="schoolIndex.html?area_name=${area_name}&school_id=${item.organizationno}&school_name=${item.organizationname}${GetQueryString("year") ? "&year=" + GetQueryString("year") : ''}">${item.organizationname}</a>
                        </li>`
                    })
                    var schoolList = document.querySelector("#school_list .school_list_ul");
                    schoolList.innerHTML = _html;
                } else if (e.target.innerHTML === "完全中学") {
                    Complete_high_school.map((item, index) => {
                        _html += `<li class="school_name_style"><div></div>
                        <a href="schoolIndex.html?area_name=${area_name}&school_id=${item.organizationno}&school_name=${item.organizationname}${GetQueryString("year") ? "&year=" + GetQueryString("year") : ''}">${item.organizationname}</a>
                        </li>`
                    })
                    var schoolList = document.querySelector("#school_list .school_list_ul");
                    schoolList.innerHTML = _html;
                } else if (e.target.innerHTML === "十二年一贯制学校") {
                    twelve_year_school.map((item, index) => {
                        _html += `<li class="school_name_style"><div></div>
                        <a href="schoolIndex.html?area_name=${area_name}&school_id=${item.organizationno}&school_name=${item.organizationname}${GetQueryString("year") ? "&year=" + GetQueryString("year") : ''}">${item.organizationname}</a>
                        </li>`
                    })
                    var schoolList = document.querySelector("#school_list .school_list_ul");
                    schoolList.innerHTML = _html;
                }
            });
            _html = "";
            primary_school.map((item, index) => {
                _html += `<li class="school_name_style"><div></div>
                <a href="schoolIndex.html?area_name=${area_name}&school_id=${item.organizationno}&school_name=${item.organizationname}${GetQueryString("year") ? "&year=" + GetQueryString("year") : ''}">${item.organizationname}</a>
                </li>`
            })
            var schoolList = document.querySelector("#school_list .school_list_ul");
            schoolList.innerHTML = _html;
        }, 'json');

    }
})