duhongyu
/
AnYang_UI


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341
							<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>坐席考勤</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="../Script/Common/huayi.load.js"></script>
    <script src="../Script/Common/huayi.config.js"></script>
    <link href="../css/WorkOrder/Search.css" rel="stylesheet">
    <link href="../css/init.css" rel="stylesheet" />
    <!--<script src="../css/laydate/laydate.js"></script>-->
    <script src="../js/laydate/laydate.js"></script>
    <style type="text/css">
        .time-box {
            display: inline-block;
            position: relative;
        }

        .toolRight input {
            padding-right: 30px;
        }

        .toolBar {
            margin-bottom: 0;
            border: 0;
        }

        .tub {
            position: absolute;
            right: 8px;
            top: 5px;
            font-size: 18px;
            color: #00a0ca;
        }

        #thead1 thead th,
        #thead2 thead th {
            background: #00a0cd;
            color: #fff;
        }

        table thead,
        tbody tr {
            display: table;
            width: 100%;
            table-layout: fixed;
        }

        .table {
            margin-bottom: 0;
        }
    </style>
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="daoHang clearfix">
            <div class="dhLeft">
                <sapn>
                    <i class="syIcon"></i>位置：
                    <a href="javaScript:;" id="ReIndex">首页</a>&gt;
                    <a href="javaScript:;">报表管理</a>&gt;
                    <a href="javaScript:;" class="nowPosition">坐席考勤</a>
                </sapn>
            </div>
            <div class="dhRight">
                <a href="" title="刷新"><i class="fa fa-refresh"></i></a>
            </div>
        </div>
        <div class="Content_box">
            <div class="complain Shows">
                <ul class="nav nav-tabs ul_tab" role="tablist">
                    <li class="active">
                        <a>汇总</a>
                    </li>
                    <li>
                        <a>详情</a>
                    </li>
                </ul>
                <div class="tab-content">
                    <div class="one_content">
                        <div class="toolBar clearfix">
                            <div class="toolLeft">

                                开始时间:
                                <span class="time-box">
                                    <i class="tub fa fa-calendar"></i>
                                    <input type="text" id="startTime" style="width: 190px;" />
                                </span>
                                结束时间:
                                <span class="time-box">
                                    <i class="tub fa fa-calendar"></i>
                                    <input type="text" id="endTime" style="width: 190px;" />
                                </span>
                                <a class="search btns">搜索</a>
                                <a class="btns export">导出</a>

                            </div>
                        </div>
                        <!--<div style="width: 100%;padding: 10px;">-->
                        <!--<div class="table-head">-->
                        <table id="table1" data-row-style="rowStyle" data-query-params="queryParams"
                            data-pagination="true">
                            <thead>
                                <tr>
                                    <th data-field="UserCode" data-align="center">工号</th>
                                    <th data-field="UserName" data-align="center">姓名</th>
                                    <th data-field="ExtNumber" data-align="center">分机号</th>
                                    <th data-field="Date" data-align="center">日期</th>
                                    <th data-field="logintime" data-align="center" data-sortable="true">首次签入时间</th>
                                    <th data-field="logouttime" data-align="center" data-sortable="true"> 最后签出时间</th>
                                    <th data-field="logintimes" data-align="center"> 签入总时长</th>
                                    <th data-field="free" data-align="center" data-sortable="true"> 空闲时长</th>
                                    <th data-field="talking" data-align="center" data-sortable="true"> 通话时长</th>
                                    <th data-field="postprocess" data-align="center" data-sortable="true"> 话后处理时长</th>
                                    <th data-field="repose" data-align="center" data-sortable="true"> 置忙时长</th>
                                    <th data-field="reposeconut" data-align="center" data-sortable="true"> 置忙次数</th>
                                    <th data-field="logcount" data-align="center" data-sortable="true"> 登录次数</th>
                                    <th data-field="callincount" data-align="center" data-sortable="true"> 呼入量</th>
                                    <th data-field="calloutcount" data-align="center" data-sortable="true"> 呼出量</th>
                                </tr>
                            </thead>
                        </table>
                        <!--</div>-->
                    </div>
                    <div class="two_content" style="display: none;">
                        <div class="toolBar clearfix">
                            <div class="toolLeft">
                                开始时间:
                                <span class="time-box">
                                    <i class="tub fa fa-calendar"></i>
                                    <input type="text" id="startTime1" />
                                </span>
                                结束时间:
                                <span class="time-box">
                                    <i class="tub fa fa-calendar"></i>
                                    <input type="text" id="endTime1" />
                                </span>
                                <a class="search2 btns">搜索</a>
                                <a class="btns export2">导出</a>

                            </div>
                        </div>
                        <table id="workorderlist" data-row-style="rowStyle" data-query-params="queryParams"
                            data-pagination="true">
                            <thead>
                                <tr>
                                    <th data-field="UserCode" data-align="center">工号</th>
                                    <th data-field="UserName" data-align="center">姓名</th>
                                    <th data-field="ExtNumber" data-align="center">分机号</th>
                                    <th data-field="LoginTime" data-align="center" data-sortable="true">签入时间</th>
                                    <th data-field="LogoutTime" data-align="center" data-sortable="true"> 签出时间</th>
                                    <th data-field="logtimes" data-align="center" data-sortable="true"> 签入总时长</th>
                                    <th data-field="free" data-align="center" data-sortable="true"> 空闲时长</th>
                                    <th data-field="talking" data-align="center" data-sortable="true"> 通话时长</th>
                                    <th data-field="postprocess" data-align="center" data-sortable="true"> 话后处理时长</th>
                                    <th data-field="repose" data-align="center" data-sortable="true"> 置忙时长</th>
                                    <th data-field="reposeconut" data-align="center" data-sortable="true"> 置忙次数</th>
                                    <th data-field="callincount" data-align="center" data-sortable="true"> 呼入量</th>
                                    <th data-field="calloutcount" data-align="center" data-sortable="true"> 呼出量</th>
                                </tr>
                            </thead>
                        </table>

                    </div>

                </div>
            </div>
        </div>
    </div>
    <script>
        var table1 = $('#table1');
        var dates = new Date();
        //helper.DateFormat.getNowDate();
        //alert()
        var timeS = dates.getFullYear() + "-" +
            (dates.getMonth() + 1) +
            "-" + (dates.getDate())
            var timeE = dates.getFullYear() + "-" +
                (dates.getMonth() + 1) +
                "-" + (dates.getDate())
                // " " + (dates.getHours()) +
                // ":" + (dates.getMinutes()) +
                // ":" + (dates.getSeconds());
        $(document).ready(function () {
            //获取当前小时数(0-23)    
            //获取当前分钟数(0-59)    
            $('.ul_tab li').click(function () {
                //					$(this).parent().find("li").removeClass("active");
                $(this).addClass("active").siblings().removeClass("active");
                var index = $(this).index();
                $('.tab-content').children("div").eq(index).show().siblings().hide();
            })

            $('#startTime').val(timeS)
            laydate.render({
                elem: '#startTime',
                // type: 'datetime',
                theme: '#00a1cb'
            });
            $('#endTime').val(timeE)
            laydate.render({
                elem: '#endTime',
                // type: 'datetime',
                theme: '#00a1cb'
            });
            $('#startTime1').val(timeS)
            laydate.render({
                elem: '#startTime1',
                // type: 'datetime',
                theme: '#00a1cb'
            });
            $('#endTime1').val(timeE)
            laydate.render({
                elem: '#endTime1',
                // type: 'datetime',
                theme: '#00a1cb'
            });
            initTable1();

            //搜索
            $('.search').click(function () {
                initTable1();
            })
            initTable2();
            //搜索
            $('.search2').click(function () {
                initTable2();
            })

        })

        function initTable1() {
            $.ajax({
                type: "get",
                url: huayi.config.callcenter_url + "SeatMonitoring/GetReportList",
                async: true,
                dataType: 'json',
                data: {
                    token: $.cookie("token"),
                    stime: $('#startTime').val(),
                    etime: $('#endTime').val()
                },
                success: function (data) {
                    if (data.state.toLowerCase() == 'success') {
                        $('#table1').bootstrapTable('load', data.data);
                    }

                }

            });
            $('#table1').bootstrapTable('destroy').bootstrapTable({
                striped: true
            });

        }
        var table = $("#workorderlist");

        function initTable2() {
            //先销毁表格
            table.bootstrapTable('destroy');
            //初始化表格,动态从服务器加载数据
            table.bootstrapTable({
                method: "get", //使用get请求到服务器获取数据
                url: huayi.config.callcenter_url + "SeatMonitoring/GetReportDetailList", //获取数据的Servlet地址
                contentType: "application/x-www-form-urlencoded",
                striped: true, //表格显示条纹
                pagination: true, //启动分页
                pageSize: 10, //每页显示的记录数
                pageNumber: 1, //当前第几页
                pageList: [5, 10, 50, 100], //记录数可选列表
                search: false, //是否启用查询
                showColumns: false, //显示下拉框勾选要显示的列
                showRefresh: false, //显示刷新按钮
                sidePagination: "server", //表示服务端请求
                //设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
                //设置为limit可以获取limit, offset, search, sort, order
                queryParamsType: "undefined",
                queryParams: function queryParams(params) { //设置查询参数
                    var param = {
                        page: params.pageNumber,
                        pagesize: params.pageSize,
                        token: $.cookie("token"),
                        stime: $('#startTime1').val(),
                        etime: $('#endTime1').val()
                    };
                    return param;
                },
                onLoadSuccess: function () { //加载成功时执行
                    //layer.msg("加载成功");
                },
                onLoadError: function () { //加载失败时执行
                    //layer.msg("加载数据失败", { time: 1500, icon: 2 });
                }
            });
            //				
            //				
            //				 $.ajax({
            //	         	type:"get",
            //	         	url: huayi.config.callcenter_url+"SeatMonitoring/GetReportDetailList",
            //	         	async:true,
            //	         	dataType:'json',
            //	         	data:{
            //	         			token: $.cookie("token"),
            //						stime: $('#startTime1').val(),
            //						etime: $('#endTime1').val()
            //	         	},
            //	         	success:function(data){
            //	         		table.bootstrapTable('load',data.rows); 
            //	         	}
            //	         });
            //				table.bootstrapTable('destroy').bootstrapTable({striped: true});
        }
        //导出
        $('.export').click(function () {
            dcexcel(this);
        })

        function dcexcel(obj) {
            var dpt = "";
            var url = huayi.config.callcenter_url + "SeatMonitoring/ExptList?token=" + $.cookie("token");
            url += "&stime=" + $('#startTime').val() + "&etime=" + $('#endTime').val();
            console.log(obj)
            obj.href = url;
        }
        //导出
        $('.export2').click(function () {
            dcexcel2(this);
        })

        function dcexcel2(obj) {
            var dpt = "";
            var url = huayi.config.callcenter_url + "SeatMonitoring/GetReportDetailList?token=" + $.cookie("token");
            url += "&stime=" + $('#startTime1').val() + "&etime=" + $('#endTime1').val() + "&isdc=1";
            obj.href = url;
        }
    </script>
</body>

</html>