<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>统计</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
    <link href="../static/css/main/animate.min.css" th:href="@{/css/main/animate.min.css}" rel="stylesheet"/>
    <link href="../static/css/main/style.min862f.css" th:href="@{/css/main/style.min862f.css}" rel="stylesheet"/>
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content">

    <div class="row">
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <span class="label label-success pull-right">本年</span>
                    <h5>本年度申请累计</h5>
                </div>
                <div class="ibox-content">
                    <small>企业申请</small>
                    <h1 class="no-margins" id="qysq" th:text="${qy.qc1}"></h1>
                    <div class="stat-percent font-bold text-success">
                    </div>
                </div>
                <div class="ibox-content">
                    <small>个体申请</small>
                    <h1 class="no-margins" th:text="${gt.gc1}"></h1>
                    <div class="stat-percent font-bold text-success">
                    </div>
                </div>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <span class="label label-info pull-right">本月</span>
                    <h5>本月申请累计</h5>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" th:text="${byqy.qc1}"></h1>
                    <div class="stat-percent font-bold text-info">
                    </div>
                    <small>企业申请</small>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" th:text="${bygt.gc1}">275,800</h1>
                    <div class="stat-percent font-bold text-info">
                    </div>
                    <small>个体申请</small>
                </div>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <span class="label label-primary pull-right">今天</span>
                    <h5>今天申请累计</h5>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" th:text="${jtqy.qc1}"></h1>
                    <div class="stat-percent font-bold text-navy">
                    </div>
                    <small>企业申请</small>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" th:text="${jtgt.gc1}"></h1>
                    <div class="stat-percent font-bold text-navy">
                    </div>
                    <small>个体申请</small>
                </div>
            </div>
        </div>
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <span class="label label-danger pull-right">待审核</span>
                    <h5>待审核用户</h5>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" id="qydsh" >0</h1>
                    <div class="stat-percent font-bold text-danger">
                    </div>
                    <small>企业</small>
                </div>
                <div class="ibox-content">
                    <h1 class="no-margins" id="gtdsh" >0</h1>
                    <div class="stat-percent font-bold text-danger">
                    </div>
                    <small>个体</small>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>折线图</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="graph_flot.html#">
                            <i class="fa fa-wrench"></i>
                        </a>
                       <!-- <ul class="dropdown-menu dropdown-user">
                            <li><a href="graph_flot.html#">选项1</a>
                            </li>
                            <li><a href="graph_flot.html#">选项2</a>
                            </li>
                        </ul>-->
                        <a class="close-link">
                            <i class="fa fa-times"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="echarts" id="echarts-line-chart"></div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>饼状图</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="graph_flot.html#">
                            <i class="fa fa-wrench"></i>
                        </a>
                        <!--<ul class="dropdown-menu dropdown-user">
                            <li><a href="graph_flot.html#">选项1</a>
                            </li>
                            <li><a href="graph_flot.html#">选项2</a>
                            </li>
                        </ul>-->
                        <a class="close-link">
                            <i class="fa fa-times"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="echarts" id="echarts-pie-chart"></div>
                </div>
            </div>
        </div>
        <div class="col-sm-6">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>饼状图</h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="graph_flot.html#">
                            <i class="fa fa-wrench"></i>
                        </a>
                      <!--  <ul class="dropdown-menu dropdown-user">
                            <li><a href="graph_flot.html#">选项1</a>
                            </li>
                            <li><a href="graph_flot.html#">选项2</a>
                            </li>
                        </ul>-->
                        <a class="close-link">
                            <i class="fa fa-times"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">
                    <div class="echarts" id="echarts-pie-chart1"></div>
                </div>
            </div>
        </div>

    </div>
</div>
</div>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>
<script th:src="@{/ajax/libs/flot/jquery.flot.js}"></script>
<th:block th:include="include :: sparkline-js"/>
<th:block th:include="include :: footer" />
<th:block th:include="include :: echarts-js" />
<script type="text/javascript">
    $(document).ready(function () {

        // $.ajax({
        //     "url": "/Ytj/info/sleAll",
        //     "type": "get",
        //     "dataType": "json",
        //     "success": function (json) {
        //         if(json.code==0){
        //             var data= json.data;
        //             $("#qysq").val(data[0].qy.qc1)
        //         }
        //     }
        // })
        function zongshu() {
            var gt = parseInt([[${gt.gc1}]]);
            var qy = parseInt([[${qy.qc1}]]);
            var qys = parseInt([[${qy.qs1}]]);
            var gts = parseInt([[${gt.gs1}]]);

            $("#zongji").text(gt + qy);
            $("#bi").text(parseInt((qys + gts) / (gt + qy) * 100) + "%");
            $("#qybi").text(parseInt(qys / qy * 100) + "%");
            $("#gtbi").text(parseInt(gts / gt * 100) + "%");
            $("#bis").css("width", (qys + gts) / (gt + qy) * 100 + "%");
            $("#qis").css("width", qys / qy * 100 + "%");
            $("#gis").css("width", gts / gt * 100 + "%");
        }

        zongshu();
        var da1 = [];
        var da2 = [];

        function selAll() {
            $.ajax({
                "url": "/Ytj/info/selAll",
                "type": "GET",
                "dataType": "json",
                "success": function (json) {
                    if (json.code == 0) {
                        var da = json.data.gtgsyws;
                        var daq = json.data.qyInfos;
                        var gtlflg = json.data.gtlflg[0];
                        var qylflg = json.data.qyflg[0];
                        if(qylflg==null){
                            qylflg= new FormData();
                            qylflg.append("dsh", 0);
                        }
                        $("#qydsh").text(qylflg.dsh);
                        $("#gtdsh").text(gtlflg.dsh);

                        for (var i = 0; i < 31; i++) {
                            da1[i] = 0;
                        }
                        for (var i = 0; i < da.length; i++) {
                            da1[parseInt(da[i].days.substring(6))-1] = da[i].counts;
                        }

                        for (var i = 0; i < 31; i++) {
                            da2[i] = 0;
                        }
                        for (var i = 0; i < daq.length; i++) {
                            da2[parseInt(daq[i].days.substring(6))-1] = daq[i].counts;
                        }

                        var pieChart = echarts.init(document.getElementById("echarts-pie-chart"));
                        var pieoption = {
                            title : {
                                text: '企业汇总',
                                subtext: '',
                                x:'center'
                            },
                            tooltip : {
                                trigger: 'item',
                                formatter: "{a} <br/>{b} : {c} ({d}%)"
                            },
                            legend: {
                                orient : 'vertical',
                                x : 'left',
                                data:['待审核 :'+qylflg.dsh+"个",'审核中 :'+qylflg.shz+"个",'审核通过 :'+qylflg.tg+"个",'申请退回 :'+qylflg.th+"个"]
                            },
                            calculable : true,
                            series : [
                                {
                                    name:'企业审核状态',
                                    type:'pie',
                                    radius : '55%',
                                    center: ['50%', '60%'],
                                    data:[
                                        {value:qylflg.dsh, name:'待审核 :'+qylflg.dsh+"个"},
                                        {value:qylflg.shz, name:'审核中 :'+qylflg.shz+"个"},
                                        {value:qylflg.tg, name:'审核通过 :'+qylflg.tg+"个"},
                                        {value:qylflg.th, name:'申请退回 :'+qylflg.th+"个"}
                                    ]
                                }
                            ]
                        };
                        pieChart.setOption(pieoption);
                        $(window).resize(pieChart.resize);
                        var pieChart = echarts.init(document.getElementById("echarts-pie-chart1"));
                        var pieoption = {
                            title : {
                                text: '个体汇总',
                                subtext: '',
                                x:'center'
                            },
                            tooltip : {
                                trigger: 'item',
                                formatter: "{a} <br/>{b} : {c} ({d}%)"
                            },
                            legend: {
                                orient : 'vertical',
                                x : 'left',
                                data:['待审核 :'+gtlflg.dsh+"个",'审核中 :'+gtlflg.shz+"个",'审核通过 :'+gtlflg.tg+"个",'申请退回 :'+gtlflg.th+"个"]
                            },
                            calculable : true,
                            series : [
                                {
                                    name:'个体审核状态',
                                    type:'pie',
                                    radius : '55%',
                                    center: ['50%', '60%'],
                                    data:[
                                        {value:gtlflg.dsh, name:'待审核 :'+gtlflg.dsh+"个"},
                                        {value:gtlflg.shz, name:'审核中 :'+gtlflg.shz+"个"},
                                        {value:gtlflg.tg, name:'审核通过 :'+gtlflg.tg+"个"},
                                        {value:gtlflg.th, name:'申请退回 :'+gtlflg.th+"个"}
                                    ]
                                }
                            ]
                        };
                        pieChart.setOption(pieoption);
                        $(window).resize(pieChart.resize);


                        var lineChart = echarts.init(document.getElementById("echarts-line-chart"));
                        var lineoption = {
                            title : {
                                text: '本月的申请情况'
                            },
                            tooltip : {
                                trigger: 'axis'
                            },
                            legend: {
                                data:['最高点','最低点']
                            },
                            grid:{
                                x:40,
                                x2:40,
                                y2:24
                            },
                            calculable : true,
                            xAxis : [
                                {
                                    type : 'category',
                                    boundaryGap : false,
                                    data : ['1号','2号','3号','4号','5号','6号','7号','8号','9号','10号','11号','12号','13号','14号'
                                        ,'15号','16号','17号','18号','19号','20号','21号','22号','23号','24号','25号','26号','27号','28号',
                                        '29号','30号','31号']
                                }
                            ],
                            yAxis : [
                                {
                                    type : 'value',
                                    axisLabel : {
                                        formatter: '{value}'
                                    }
                                }
                            ],
                            series : [
                                {
                                    name:'个体申请',
                                    type:'line',
                                    data:[da1[0], da1[1], da1[2], da1[3], da1[4], da1[5], da1[6], da1[7], da1[8], da1[9], da1[10], da1[11], da1[12]
                                        , da1[13], da1[14], da1[15], da1[16], da1[17], da1[18], da1[19], da1[20], da1[21], da1[22], da1[23], da1[24]
                                        , da1[25], da1[26], da1[27], da1[28], da1[29], da1[30]],
                                    markPoint : {
                                        data : [
                                            {type : 'max', name: '最大值'},
                                            {type : 'min', name: '最小值'}
                                        ]
                                    },
                                    markLine : {
                                        data : [
                                            {type : 'average', name: '平均值'}
                                        ]
                                    }
                                },
                                {
                                    name:'企业申请',
                                    type:'line',
                                    data:[da2[0], da2[1], da2[2], da2[3], da2[4], da2[5], da2[6], da2[7], da2[8], da2[9], da2[10], da2[11], da2[12]
                                        , da2[13], da2[14], da2[15], da2[16], da2[17], da2[18], da2[19], da2[20], da2[21], da2[22], da2[23], da2[24]
                                        , da2[25], da2[26], da2[27], da2[28], da2[29], da2[30]],
                                    markPoint : {
                                        data : [
                                            {type : 'max', name: '最大值'},
                                            {type : 'min', name: '最小值'}
                                        ]
                                    },
                                    markLine : {
                                        data : [
                                            {type : 'average', name : '平均值'}
                                        ]
                                    }
                                }
                            ]
                        };
                        lineChart.setOption(lineoption);
                        $(window).resize(lineChart.resize);


                    }
                }
            });

        }

        selAll();


    });
</script>
</body>
</html>
