| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>日通话时长统计</title>
- <!--[if lt IE 9]>
- <meta http-equiv="refresh" content="0;ie.html" />
- <![endif]-->
- <link rel="stylesheet" href="js/select2/css/select2.min.css" />
- <script src="Script/Common/huayi.load.js"></script>
- <script src="Script/Common/huayi.config.js"></script>
- <link rel="stylesheet" href="./js/layui-v2.5.5/layui/css/layui.css" />
- <link rel="stylesheet" href="css/init.css" />
- <style>
- .zxt-top {
- background: #f3f3f4;
- height: 60px;
- padding: 10px 20px;
- }
-
- .topCon {
- float: right;
- margin-right: 45px;
- }
-
- .zxt-content {
- width: 95%;
- margin: 0 auto;
- }
- </style>
- </head>
- <body class="gray-bg" style="background: #fefefe;">
- <div class="zxtable">
- <div class="daoHang clearfix">
- <div class="dhLeft">
- <sapn><i class="syIcon"></i>位置:
- <a id="ReIndex" href="javaScript:;">首页</a>>
- <a href="javaScript:;">报表分析</a>>
- <a href="javaScript:;">话务运营分析</a>>
- <a href="" class="nowPosition">日通话时长统计</a>
- </sapn>
- </div>
- <div class="dhRight">
- <a href="#" title="刷新"><i class="fa fa-refresh"></i></a>
- </div>
- </div>
- <div class="zxt-top clearfix">
- <div class="topCon">
- <div class="form-inline th-bar clearfix">
- <div class="time-box form-group">
- <i class="tub fa fa-calendar"></i>
- <input class="form-control" type="text" id="startTime" placeholder="请选择起止时间" style="width: 228px;">
- </div>
- <!--<div class="time-box form-group">
- 部门:
- <select id="bumen">
- <option value="">请选择</option>
- </select>
- </div>-->
- <div class="time-box form-group">
- <select name="" id="zuoxi" class="form-control"></select>
- </div>
- <div class="form-group tool_bars pull-right">
- <button class="btns sear">搜索</button>
- <a class="btns export">导出</a>
- </div>
- </div>
- </div>
- </div>
- <div class="zxt-content">
- <table class="layui-hide" id="t_callTotal" lay-filter="layuitableTotal"></table>
- </div>
- </div>
- <script src="js/layui-v2.5.5/layui/layui.js"></script>
- <script src="./js/select2/js/select2.min.js"></script>
- <script>
- var token = $.cookie("token");
- $(function() {
- bindseat(); //获取坐席
- layui.use('laydate', function() {
- var laydate = layui.laydate;
- //日期
- laydate.render({
- elem: '#startTime',
- range: '~',
- theme: '#1ab394',
- calendar: 'true'
- });
- });
-
- var myDate = new Date();
- $('#startTime').val(myDate.getFullYear() + "-" + turn(myDate.getMonth() + 1) + "-" + "01" + " ~ " + myDate.getFullYear() + "-" + turn(myDate.getMonth() + 1) + "-" + turn(myDate.getDate()));
- function turn(aa) {
- if(aa < 10) {
- aa = "0" + aa;
- }
- return aa;
- }
-
- //helper.getDropList.getDept($('#bumen'));//获取部门
- getTableDataList(); //获取表格数据
- //搜索事件
- $(".sear").click(function() {
- getTableDataList();
- });
- document.onkeydown = function (e) { // 回车提交表单
- var theEvent = window.event || e;
- var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
- if (code == 13) {
- getTableDataList();
- }
- }
- //导出
- $('.export').click(function() {
- dcexcel(this);
- })
- })
- //加载表格
- function getTableDataList() {
- var loadindex = layer.load();
- layui.use('table', function() {
- var table = layui.table;
- //方法级渲染
- table.render({
- elem: '#t_callTotal',
- url: huayi.config.callcenter_url + "DaysTalkTime/GetDataList",
- method: 'get', //如果无需自定义HTTP类型,可不加该参数
- skin: 'row', //line (行边框风格) row (列边框风格) nob (无边框风格)
- even: true, //开启隔行背景
- size: 'lg', //sm,lg尺寸的表格
- where: {
- stime: $('#startTime').val() && $('#startTime').val().split(' ~ ')[0],
- etime: $('#startTime').val() && $('#startTime').val().split(' ~ ')[1],
- //dpt: $('#bumen').val(),
- usercode: $("#zuoxi option:selected").val(),
- token: token
- }, //如果无需传递额外参数,可不加该参数
- //request: {}, //如果无需自定义请求参数,可不加该参数
- response: {
- statusName: 'state', //数据状态的字段名称,默认:code
- statusCode: 'success', //成功的状态码,默认:0
- msgName: 'message', //状态信息的字段名称,默认:msg
- //countName: 'total', //数据总数的字段名称,默认:count
- //dataName: 'rows', //数据列表的字段名称,默认:data
- }, //如果无需自定义数据响应名称,可不加该参数
- cols: [
- [{
- field: '日期',
- title: '日期',
- align: 'center',
- fixed: true,
- sort: true,
- width: 150,
- }, {
- field: '呼入次数',
- title: '呼入次数',
- align: 'center',
- width: '',
- },
- {
- field: '呼入时长',
- title: '呼入时长',
- align: 'center',
- width: '',
- },
- {
- field: '呼出次数',
- title: '呼出次数',
- align: 'center',
- width: '',
- },
- {
- field: '呼出时长',
- title: '呼出时长',
- align: 'center',
- width: '',
- },
- {
- field: '呼出未接通次数',
- title: '呼出未接通次数',
- align: 'center',
- width: '',
- },
- {
- field: '振铃时长',
- title: '振铃时长',
- align: 'center',
- width: '',
- },
- {
- field: '通话总时长',
- title: '通话总时长',
- align: 'center',
- templet: '<div><span class="color_73926">{{d.通话总时长}}</span></div>',
- width: '',
- },
- {
- field: '平均通话总时长',
- title: '平均通话总时长',
- align: 'center',
- templet: '<div><span class="color_73926">{{d.平均通话总时长}}</span></div>',
- width: '',
- },
- ]
- ],
- height: 'full-150',
- done:function(){
- layer.close(loadindex);
- }
- });
- //监听行单击事件
- table.on('row(layuitableTotal)', function(obj){
- console.log(obj.tr) //得到当前行元素对象
- console.log(obj.data) //得到当前行数据
- var time = obj.data.日期;
- //修改工单
- layer.open({
- type: 2,
- title: '明细信息',
- maxmin: true, //开启最大化最小化按钮
- area: ['80%', '90%'],
- content: './ReportForm/dailyCallDurationDetail.html?time=' + time,
- });
- });
- });
- }
- //获取坐席
- function bindseat() {
- $.getJSON(huayi.config.callcenter_url + "UserAccount/GetSeatList", {
- token: token
- }, function(result) {
- if(result.state.toLowerCase() == "success") {
- seatlist = result.data;
- $("#zuoxi").empty();
- $("#zuoxi").append('<option value="">请选择坐席</option>');
- $(seatlist).each(function(i, n) {
- $("#zuoxi").append('<option value="' + n.F_UserCode + '">' + n.F_UserName + '</option>');
- })
- }
- });
- }
- function dcexcel(obj) {
- var stime = $('#startTime').val() && $('#startTime').val().split(' ~ ')[0];
- var etime = $('#startTime').val() && $('#startTime').val().split(' ~ ')[1];
- var url = huayi.config.callcenter_url + "DaysTalkTime/ExptList?token=" + token;
- url += "&stime=" + stime + "&etime=" + etime + "&usercode=" + $("#zuoxi option:selected").val();
- obj.href = url;
- }
- </script>
- </body>
- </html>
|