maintenance/public/assets/js/backend/screen.js

define(['jquery', 'bootstrap', 'backend', 'addtabs', 'table', 'echarts', 'echarts-theme', 'template','form'], function ($, undefined, Backend, Datatable, Table, Echarts, undefined, Template,Form) {
    var Controller = {
        index: function () {
            // $("input[name='collection_name']").addClass("selectpage").data("source", "district/selectpage").data('params',{'custom[pid]':0,'custom[departid]':1}).data("primaryKey", "name").data("field", "name").data("orderBy", "number asc");
            //最高分
            zg();
            //最低分
            zd();
            //平均分
            pjf();
            //平均时长
            pjsc();

            //各区队平均分分析
            echarts_41();
            //本年度考试成绩平均分统计
            echarts_51();

            //FZD04B型侦毒器维修难点统计
            echarts_11();
            //FZB006型毒剂报警器维修难点统计
            echarts_21();
            // 防化兵用毒剂报警器维修难点统计
            echarts_61();

            //最高分
            function zg() {
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('zb1'));
                var v1=100;
                var v2=0;
                var v3=v1+v2;
                option = {
                    series: [{
                        type: 'pie',
                        radius: ['60%', '70%'],
                        color:'#49bcf7',
                        label: {
                            normal: {
                                position: 'center'
                            }
                        },
                        data: [{
                            value: v1,
                            name: Config.max,
                            label: {
                                normal: {
                                    formatter:70,//Math.round( v1/v3*100)+ '%%',
                                    textStyle: {
                                        fontSize: 30,
                                        color:'#fff',
                                    }
                                }
                            }
                        },
                            {
                                value: v2,
                                label: {
                                    normal: {
                                        formatter : function (params){
                                            return '最高分';
                                        },
                                        textStyle: {
                                            color: '#aaa',
                                            fontSize: 16
                                        }
                                    }
                                },
                                itemStyle: {
                                    normal: {
                                        color: 'rgba(255,255,255,.2)'
                                    },
                                    emphasis: {
                                        color: '#fff'
                                    }
                                },
                            }]
                    }]
                };
                myChart.setOption(option);
                window.addEventListener("resize",function(){
                    myChart.resize();
                });
            }
            //最低分
            function zd() {
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('zb2'));
                var v1=Config.min;
                var v2=100;
                var v3=v1+v2;
                option = {
                    //animation: false,
                    series: [{
                        type: 'pie',
                        radius: ['60%', '70%'],
                        color:'#49bcf7',
                        label: {
                            normal: {
                                position: 'center'
                            }
                        },
                        data: [{
                            value: Config.min,
                            name: Config.min,
                            label: {
                                normal: {
                                    // formatter:Math.round( v1/v3*100)+ '%',
                                    textStyle: {
                                        fontSize: 24,
                                        color:'#fff',
                                    }
                                }
                            }
                        }, {
                            value: v2,
                            label: {
                                normal: {
                                    formatter : function (params){
                                        return '最低分';
                                    },
                                    textStyle: {
                                        color: '#aaa',
                                        fontSize: 16
                                    }
                                }
                            },
                            itemStyle: {
                                normal: {
                                    color: 'rgba(255,255,255,.2)'
                                },
                                emphasis: {
                                    color: '#fff'
                                }
                            },
                        }]
                    }]
                };
                myChart.setOption(option);
                window.addEventListener("resize",function(){
                    myChart.resize();
                });
            }
            //平均分
            function pjf() {
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('zb3'));
                var v1=Config.exam_pjf;
                var v2=25;
                option = {
                    series: [{

                        type: 'pie',
                        radius: ['60%', '70%'],
                        color:'#62c98d',
                        label: {
                            normal: {
                                position: 'center'
                            }
                        },
                        data: [{
                            value: Config.exam_pjf,
                            name: Config.exam_pjf,
                            label: {
                                normal: {
                                    // formatter:Math.round( v1/v3*100)+ '%',
                                    textStyle: {
                                        fontSize: 24,
                                        color:'#fff',
                                    }
                                }
                            }
                        }, {
                            value: v2,
                            label: {
                                normal: {
                                    formatter : function (params){
                                        return '平均分';
                                    },
                                    textStyle: {
                                        color: '#aaa',
                                        fontSize: 16
                                    }
                                }
                            },
                            itemStyle: {
                                normal: {
                                    color: 'rgba(255,255,255,.2)'
                                },
                                emphasis: {
                                    color: '#fff'
                                }
                            },
                        }]
                    }]
                };
                myChart.setOption(option);
                window.addEventListener("resize",function(){
                    myChart.resize();
                });
            }
            //平均时长
            function pjsc() {
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('zb4'));
                var v1=Config.exam_pjsc;
                var v2=10;
                option = {
                    series: [{

                        type: 'pie',
                        radius: ['60%', '70%'],
                        color:'#29d08a',
                        label: {
                            normal: {
                                position: 'center'
                            }
                        },
                        data: [{
                            value: v1,
                            name: Config.exam_pjsc+'分钟',
                            label: {
                                normal: {
                                    // formatter:Math.round( v1/v3*100)+ '%',
                                    textStyle: {
                                        fontSize: 24,
                                        color:'#fff',
                                    }
                                }
                            }
                        }, {
                            value: v2,
                            label: {
                                normal: {
                                    formatter : function (params){
                                        return '平均时长';
                                    },
                                    textStyle: {
                                        color: '#aaa',
                                        fontSize: 16
                                    }
                                }
                            },
                            itemStyle: {
                                normal: {
                                    color: 'rgba(255,255,255,.2)'
                                },
                                emphasis: {
                                    color: '#fff'
                                }
                            },
                        }]
                    }]
                };
                myChart.setOption(option);
                window.addEventListener("resize",function(){
                    myChart.resize();
                });
            }

            //各区队平均分分析
            function echarts_41() {
                var xaa = [];
                for (var i in Config.qudui_list){
                    xaa.push(Config.qudui_list[i]['user_depart_name']);
                }
                var vaa = [];
                for (var i in Config.qudui_list){
                    vaa.push(Config.qudui_list[i]['user_depart_pjf']);
                }
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('echart4'));
                option = {
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            type: 'shadow'
                        }
                    },
                    legend: {
                        data: ['2025年'],
                        align: 'right',
                        right: '40%',
                        top:'0%',
                        textStyle: {
                            color: "#fff",
                            fontSize: '16',

                        },
                        itemWidth: 16,
                        itemHeight: 16,
                        itemGap: 35
                    },
                    grid: {
                        left: '0%',
                        top:'40px',
                        right: '0%',
                        bottom: '2%',
                        containLabel: true
                    },
                    xAxis: [{
                        type: 'category',
                        data: xaa,
                        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: '16',
                            },
                        },
                    }],
                    yAxis: [{
                        type: 'value',
                        axisLabel: {
                            //formatter: '{value} %'
                            show:true,
                            textStyle: {
                                color: "rgba(255,255,255,.6)",
                                fontSize: '16',
                            },
                        },
                        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)",
                            }
                        }
                    }],
                    series: [{
                        name: Config.qudui_list_year+'年',
                        type: 'bar',
                        data: vaa,
                        barWidth:'15', //柱子宽度
                        // barGap: 1, //柱子之间间距
                        itemStyle: {
                            normal: {
                                color:'#2f89cf',
                                opacity: 1,
                                barBorderRadius: 5,
                            }
                        }
                    },
                        //     {
                        //     name: '2018年',
                        //     type: 'bar',
                        // 	data: [1, 4, 5, 11, 12, 9, 5, 6, 5, 6, 3, 9],
                        // 	barWidth:'15',
                        //    // barGap: 1,
                        //     itemStyle: {
                        //         normal: {
                        //             color:'#62c98d',
                        //             opacity: 1,
                        // 			barBorderRadius: 5,
                        //         }
                        //     }
                        // },
                    ]
                };

                /* 青岛研锦网络科技有限公司   版权所有*/
                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);
                window.addEventListener("resize",function(){
                    myChart.resize();
                });
            }

            //本年度考试成绩平均分统计
            function echarts_51() {
                var xa1 = [];
                for (var i in Config.collection_list){
                    xa1.push(Config.collection_list[i]['exam_collection_name']);
                }
                var va1 = [];
                for (var i in Config.collection_list){
                    va1.push(Config.collection_list[i]['collection_pjf']);
                }
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('echart5'));
                option = {
                    //  backgroundColor: '#00265f',
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            // type: 'shadow'
                        }
                    },
                    // legend: {
                    //     // data: ['2017年', '2018年'],
                    //     align: 'right',
                    //     right: '40%',
                    // 	top:'0%',
                    //     // textStyle: {
                    //     //     color: "#fff",
                    // 	//     fontSize: '16',
                    //     //
                    //     // },
                    //
                    //     // itemGap: 35
                    // },
                    grid: {
                        left: '0%',
                        top:'40px',
                        right: '0%',
                        bottom: '2%',
                        containLabel: true
                    },
                    xAxis: [{
                        type: 'category',
                        data: xa1,
                        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: '16',
                            },
                        },
                    }],
                    yAxis: [{
                        type: 'value',
                        axisLabel: {
                            //formatter: '{value} %'
                            show:true,
                            textStyle: {
                                color: "rgba(255,255,255,.6)",
                                fontSize: '16',
                            },
                        },
                        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)",
                            }
                        }
                    }],
                    series: [
                        //     {
                        //     name: '2017年',
                        //     type: 'line',
                        //
                        //     data: [2, 6, 3, 8, 5, 8, 10, 13, 8, 5, 6, 9],
                        //
                        //     itemStyle: {
                        //         normal: {
                        //             color:'#2f89cf',
                        //             opacity: 1,
                        //
                        // 			barBorderRadius: 5,
                        //         }
                        //     }
                        // },
                        {
                            // name: '2018年',
                            type: 'line',
                            data: va1,
                            barWidth:'15',
                            // barGap: 1,
                            itemStyle: {
                                normal: {
                                    color:'#62c98d',
                                    opacity: 1,
                                    barBorderRadius: 5,
                                }
                            }
                        },
                    ]
                };
                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);
                window.addEventListener("resize",function(){
                    myChart.resize();
                });
            }

            //FZD04B型侦毒器维修难点统计
            function echarts_11() {
                var xa12 = [];
                for (var i in Config.one_static){
                    xa12.push(Config.one_static[i]['name']);
                }
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('echart1'));
                option = {
                    tooltip : {
                        trigger: 'item',
                        formatter: "{b} : {c} ({d}%)"
                    },
                    legend: {
                        right:3,
                        top:30,
                        height:140,
                        itemWidth:8,
                        itemHeight:10,
                        itemGap:10,
                        textStyle:{
                            color: 'rgba(255,255,255,.6)',
                            fontSize:12
                        },
                        orient:'vertical',
                        data:xa12
                    },
                    calculable : true,
                    series : [
                        {
                            name:' ',
                            color: ['#62c98d', '#2f89cf', '#c9c862', '#c98b62', '#c962b9', '#7562c9','#c96262'],
                            type:'pie',
                            radius : [30, 70],
                            center : ['35%', '50%'],
                            roseType : 'radius',
                            label: {
                                normal: {
                                    show: true
                                },
                                emphasis: {
                                    show: true
                                }
                            },
                            label:{
                                // ✅ 标签换行配置
                                formatter: function(params) {
                                    console.log(params.data.name)
                                    return `${params.data.name.replace(/(.{4})/g, '$1\n')}\n`;
                                },
                            },
                            lableLine: {
                                normal: {
                                    show: false
                                },
                                emphasis: {
                                    show: true
                                }
                            },
                            data:[
                                {value:Config.one_static[0]['error_total'], name:Config.one_static[0]['name']},
                                {value:Config.one_static[1]['error_total'], name:Config.one_static[1]['name']},
                                {value:Config.one_static[2]['error_total'], name:Config.one_static[2]['name']},
                                {value:Config.one_static[3]['error_total'], name:Config.one_static[3]['name']},
                                {value:Config.one_static[4]['error_total'], name:Config.one_static[4]['name']},
                            ]
                        },
                    ]
                };

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

            // FZB006型毒剂报警器维修难点统计
            function echarts_21() {
                var xa13 = [];
                for (var i in Config.two_static){
                    xa13.push(Config.two_static[i]['name']);
                }
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('echart2'));
                option = {
                    tooltip : {
                        trigger: 'item',
                        formatter: "{b} : {c} ({d}%)"
                    },
                    legend: {
                        right:-10,
                        top:50,
                        height:140,
                        itemWidth:8,
                        itemHeight:10,
                        itemGap:10,
                        textStyle:{
                            color: 'rgba(255,255,255,.6)',
                            fontSize:12
                        },
                        orient:'vertical',
                        data:xa13,
                    },
                    calculable : true,
                    series : [
                        {
                            name:' ',
                            color: ['#62c98d', '#205acf', '#c9c862', '#c98b62', '#c962b9', '#7562c9','#c96262'],
                            type:'pie',
                            radius : [30, 70],
                            center : ['35%', '50%'],
                            roseType : 'radius',
                            label: {
                                normal: {
                                    show: true
                                },
                                emphasis: {
                                    show: true
                                },
                            },
                            label:{
                                // ✅ 标签换行配置
                                formatter: function(params) {
                                    console.log(params.data.name)
                                    return `${params.data.name.replace(/(.{4})/g, '$1\n')}\n`;
                                },
                            },
                            lableLine: {
                                normal: {
                                    show: true
                                },
                                emphasis: {
                                    show: true
                                }
                            },
                            data:[
                                {value:Config.two_static[0]['error_total'], name:Config.two_static[0]['name']},
                                {value:Config.two_static[1]['error_total'], name:Config.two_static[1]['name']},
                                {value:Config.two_static[2]['error_total'], name:Config.two_static[2]['name']},
                                {value:Config.two_static[3]['error_total'], name:Config.two_static[3]['name']},
                                {value:Config.two_static[4]['error_total'], name:Config.two_static[4]['name']}
                            ]
                        },
                    ]
                };

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

            //防化兵用毒剂报警器维修难点统计
            function echarts_61() {
                var xa16 = [];
                for (var i in Config.three_static){
                    xa16.push(Config.three_static[i]['name']);
                }
                // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('echart6'));

                option = {
                    tooltip : {
                        trigger: 'item',
                        formatter: "{b} : {c} ({d}%)"
                    },
                    legend: {
                        right:-5,
                        top:1,
                        height:100,
                        itemWidth:8,
                        itemHeight:8,
                        itemGap:10,
                        textStyle:{
                            color: 'rgba(255,255,255,.6)',
                            fontSize:12
                        },
                        orient:'vertical',
                        data:xa16,
                        // formatter: function(name) {
                        //     const dataItem = option.series[0].data.find(item => item.name === name);
                        //     // ✅ 名称每4字符换行 + 显示数值
                        //     return `${name.replace(/(.{8})/g, '$1\n')}\n`;
                        // },
                    },
                    calculable : true,
                    series : [
                        {
                            name:' ',
                            color: ['#62c98d', '#205acf', '#c9c862', '#c98b62', '#c962b9', '#7562c9','#c96262'],
                            type:'pie',
                            radius : [30, 70],
                            center : ['35%', '50%'],
                            roseType : 'radius',
                            label: {
                                normal: {
                                    show: true
                                },
                                emphasis: {
                                    show: true
                                }
                            },
                            label:{
                                // ✅ 标签换行配置
                                formatter: function(params) {
                                    console.log(params.data.name)
                                    return `${params.data.name.replace(/(.{4})/g, '$1\n')}\n`;
                                },
                            },
                            lableLine: {
                                normal: {
                                    show: true
                                },
                                emphasis: {
                                    show: true
                                }
                            },

                            data:[
                                {value:Config.three_static[0]['error_total'], name:Config.three_static[0]['name']},
                                {value:Config.three_static[1]['error_total'], name:Config.three_static[1]['name']},
                                {value:Config.three_static[2]['error_total'], name:Config.three_static[2]['name']},
                                {value:Config.three_static[3]['error_total'], name:Config.three_static[3]['name']},
                                {value:Config.three_static[4]['error_total'], name:Config.three_static[4]['name']}
                            ]
                        },
                    ]
                };
                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);
                window.addEventListener("resize",function(){
                    myChart.resize();
                });
            }
            $(document).on("change", ".collections", function(){
                console.log($(this).val()+'###')
                if($(this).val()){
                    window.location.href = '/admin/screen/index?ids='+$(this).val();
                }
            });
            Controller.api.bindevent();
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            },
        },
    };

    return Controller;
});