#@layout()
#define main()
<style>
    .areaSum .tszcs li {
        width: 160px;
    }
</style>
<div class="areaSum clearfix">

    <div class="line"></div>
    <div class="hztj">
        基本统计
    </div>
    <div id="basic">
    <ul class="xxs clearfix">

        <li>
            <a class="nolink" href="javascript:;">
            <div class="clearfix"><span class="pull-left">学生数</span><i class="pull-right">●</i></div>
                <div id="xss">0</div>
            </a>
        </li>
        <li>
            <a href="/reader">
            <div class="clearfix"><span class="pull-left">读者数</span><i class="pull-right">●</i></div>
                <div id="dzs">0</div>
            </a>
        </li>
        <li>
            <a class="nolink" href="/book/librarybook">
            <div class="clearfix"><span class="pull-left">图书总册数</span><i class="pull-right">●</i></div>
                <div id="tszcs">0</div>
            </a>
        </li>
        <li>
            <a class="nolink" href="/list-manage/bookClassificationStatistics">
            <div class="clearfix"><span class="pull-left">图书种数</span><i class="pull-right">●</i></div>
                <div id="tszs">0</div>
            </a>
        </li>
    </ul>
    <ul class="tszcs clearfix">
        <li>
            <a href="/list-manage/bookClassificationStatistics">
                <div>缺书册数：</div>
                <div id="qscs">0</div>
            </a>
        </li>
        <li>
            <a class="nolink" href="javascript:;">
                <div>图书生均册数：</div>
                <div id="tssjcs">0</div>
            </a>
        </li>
        <li>
            <a class="nolink" href="/periodical/libraryperiodical">
                <div>期刊种数：</div>
                <div id="qkzs">0</div>
            </a>
        </li>
        <li>
            <a class="nolink" href="javascript:;">
                <div>平均复本：</div>
                <div id="pjfb">0</div>
            </a>
        </li>
        <li>
            <a class="nolink" href="javascript:;">
                <div>图书保障率：</div>
                <div id="tsbzl">0</div>
            </a>
        </li>
        <li>
            <a class="nolink" href="javascript:;">
                <div>年度生均递增：</div>
                <div id="sjdz">0</div>
            </a>
        </li>
    </ul>
    </div>

    <div class="line"></div>
    <div class="hztj">
        今日简报
    </div>
    <div id="today">
        <ul class="tszcs clearfix">
            <li>
                <a href="libNumberStats">
                    <div>借出数量：</div>
                    {{result.jssl.jssl}}
                </a>
            </li>
            <li>
                <a href="libNumberStats">
                    <div>还书数量：</div>
                    {{result.hssl.hssl}}
                </a>
            </li>

            <li>
                <a class="nolink" href="javascript:;">
                    <div>新增图书：</div>
                    {{result.xzsl.xzsl}}
                </a>
            </li>
            <li>
                <a class="nolink" href="javascript:;">
                    <div>注销图书：</div>
                    {{result.zxsl.zxsl}}
                </a>
            </li>

        </ul>
    </div>

    <div class="line"></div>
    <div class="hztj">
        流通统计
    </div>

    <div>

        <div class="layui-tab-item layui-show">
            <a id="dqjcsl">{{result.dqjcsl}}</a>
            &nbsp;&nbsp;<a id="tsjcsl">{{result.tsjcsl}}</a>
            &nbsp;&nbsp;<a id="qkjcsl">{{result.qkjcsl}}</a>
        </div>
        <div>
            <label for="startDate">时间选择：</label>
            <input type="text" name="kssj" id="startDate" style="width: 100px;height: 30px;" placeholder="">
            <label for="endDate">到：</label>
            <input type="text" name="jssj" id="endDate" style="width: 100px;height: 30px;" placeholder="">
            <button type="button" class="layui-btn layui-btn-sm" onclick="query()">查询</button>
        </div>
        <div>
        <ul class="tszcs clearfix">
            <li>
                <a id="dzdgrc">
                    {{result.dzdgrc}}
                </a>
            </li>
            <li>
                <a id="dzdgl">
                    {{result.dzdgl}}
                </a>
            </li>
            <li>
                <a id="cslyl">
                    {{result.cslyl}}
                </a>
            </li>
            <li>
                <a id="wxlyl">
                    {{result.wxlyl}}
                </a>
            </li>
            <li>
                <a id="rjjycs">
                    {{result.rjjycs}}
                </a>
            </li>
            <li>
                <a id="dzydl">{{result.dzydl}}</a>
            </li>
        </ul>
        </div>
</div>

</div>
#end
#define methods()

<script type="text/javascript">

        $(function(){
            var startdate=new Date();
            var enddate = new Date();
            startdate.setMonth(startdate.getMonth()-1);
            //enddate = enddate.toLocaleString();

            laydate.render({
                elem: '#endDate', //指定元素
                value:enddate
            });
            laydate.render({
                elem: '#startDate',//指定元素
                value:startdate
            });
            $.ajax({
                url: "/comprehensiveStatistics/basicStatistics",
                type: "POST",
                data:{orgid:JSON.parse(sessionStorage.loginData).orgid,token:JSON.parse(sessionStorage.loginData).token},
                success: function(result) {
                    if(result.code==200){
                        if(result.data){
                            if(result.data.dzs){$("#dzs").text(result.data.dzs);}
                            if(result.data.xss){$("#xss").text(result.data.xss);}
                            if(result.data.pjfb){$("#pjfb").text(result.data.pjfb);}
                            if(result.data.qkzs){$("#qkzs").text(result.data.qkzs);}
                            if(result.data.sjdz){$("#sjdz").text(result.data.sjdz);}
                            if(result.data.tsbzl){$("#tsbzl").text(result.data.tsbzl);}
                            if(result.data.tsglys){$("#tsglys").text(result.data.tsglys);}
                            if(result.data.tssjcs){$("#tssjcs").text(result.data.tssjcs);}
                            if(result.data.tszcs){$("#tszcs").text(result.data.tszcs);}
                            if(result.data.tszcs_bz){$("#tszcs_bz").text(result.data.tszcs_bz);}
                            if(result.data.tszs){$("#tszs").text(result.data.tszs);}
                        }

                    }
                }
            });

            $.ajax({
                url: "/comprehensiveStatistics/briefingToday",
                type: "POST",
                data:{orgid:JSON.parse(sessionStorage.loginData).orgid,token:JSON.parse(sessionStorage.loginData).token},
                success: function(result) {
                    new Vue({
                        el: '#today',
                        data: {
                            result: result.data
                        }
                    })
                }
            });
            query();
        });



    function query(){
        var kssj = $("#startDate").val();
        var jssj = $("#endDate").val();
        $.ajax({
            url: "/comprehensiveStatistics/circulationStatistics",
            type: "POST",
            data:{orgid:JSON.parse(sessionStorage.loginData).orgid,token:JSON.parse(sessionStorage.loginData).token,kssj:kssj,jssj:jssj},
            success: function(result) {
                $("#dzydl").text("读者阅读率："+result.data.dzydl);
                $("#rjjycs").text("人均借阅册数："+result.data.rjjycs.toFixed(2));
                $("#wxlyl").text("文献利用率："+result.data.wxlyl);
                $("#cslyl").text("藏书利用率："+result.data.cslyl);
                $("#dzdgl").text("读者到馆率："+result.data.dzdgl);
                $("#dzdgrc").text("读者到馆人次："+result.data.dzdgrc);
                $("#dqjcsl").text("当前借出数量："+result.data.dqjcsl);
                $("#tsjcsl").text("图书占："+result.data.tsjcsl);
                $("#qkjcsl").text("期刊占："+result.data.qkjcsl);
            }
        });
    }

</script>
#end
