<?php use \common\libs\MyLib; ?> <?php $this->beginBlock('header_css'); ?> <link href="/assets/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet"> <?php $this->endBlock(); ?> <div class="wrapper wrapper-content animated fadeInRight"> <div class="ibox float-e-margins"> <div class="ibox-title"> <h5>通话记录</h5> <div class="ibox-tools"> <a class="btn btn-primary btn-xs edit-btn" data-id="0" href="javascript:void(0);" onclick="$('#listTable').bootstrapTable('refresh');"> <i class="fa fa-refresh"></i> 刷新 </a> </div> </div> <div class="ibox-content"> <form role="form" class="form-inline" onsubmit="return search();"> <div class="form-group" style="margin-bottom: 8px;"> <label for="username">坐席人员</label> <input type="text" id="caller" name="caller" class="form-control"> </div> <div class="form-group" style="margin-bottom: 8px;"> <label for="datepicker">通话时间</label> <div class="input-group" id="datepicker"> <input type="text" class="form-control" id="begin_date" name="begin_date" value="" autocomplete="off" /> <span class="input-group-addon">到</span> <input type="text" class="form-control" id="end_date" name="end_date" value="" autocomplete="off" /> </div> </div> <button type="submit" class="btn btn-primary">搜索</button> </form> <div class="row"> <div class="col-md-12"> <table id="listTable"> <thead> <tr> <th data-field="id">ID</th> <th data-field="username">工号</th> <th data-field="name">姓名</th> <th data-field="total_call_num">通话数量</th> <th data-field="total_call_time_out">呼出时长</th> <th data-field="total_call_time">通话时长</th> <th data-field="call_in_total_num">呼入次数</th> <th data-field="call_in_suc_num">成功呼入</th> <th data-field="call_in_suc_num_rate">呼入接通率</th> <th data-field="call_out_total_num">呼出次数</th> <th data-field="call_out_suc_num">成功呼出</th> <th data-field="call_out_suc_num_rate">呼出接通率</th> <th data-field="phone_status">通话状态</th> </tr> </thead> </table> </div> </div> </div> </div> </div> <?php $this->beginBlock('footer_js'); ?> <script src="/assets/js/plugins/bootstrap-table/bootstrap-table.min.js"></script> <script src="/assets/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script> <script src="/assets/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script> <script src="/assets/js/plugins/layer/laydate/laydate.js"></script> <script> function opFormatter(value, row, index) { var opStr = []; opStr.push('<a href="javascript:void(0);" onclick="play(' + row.record_file_url + ')">'); opStr.push('<i class="fa fa-play" title="播放"></i>'); opStr.push('</a>'); return opStr.join(' '); } function refreshList() { $('#listTable').bootstrapTable('refresh'); } function search() { $('#listTable').bootstrapTable('destroy'); $('#listTable').bootstrapTable({ url: "/phone-center/usercall-index-json", pagination: true, sidePagination: 'server', queryParams: function(params) { params.username = $('#username').val(); params.begin_time = $('#begin_time').val(); params.end_time = $('#end_time').val(); params.caller = $('#caller').val(); params.called = $('#called').val(); params.call_result = $('#call_result').val(); params.duration_begin = $('#duration_begin').val(); params.duration_end = $('#duration_end').val(); params.is_called = $('#is_called').val(); return params; } }); return false; } $(function() { search(); laydate({ elem:'#begin_date', format: 'YYYY-MM-DD' }); laydate({ elem:'#end_date', format: 'YYYY-MM-DD' }); }); </script> <?php $this->endBlock(); ?>