<?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" id="searchFrm" class="form-inline" onsubmit="return search();"> <input type="hidden" name="company_type" id="company_type" value="<?=$company_type?>"> <?php if($company_type == 3) { ?> <div class="form-group" style="margin-bottom: 8px;"> <label for="username">工号</label> <input type="text" id="username" name="username" class="form-control"> </div> <?php } ?> <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_time" name="begin_time" value="" autocomplete="off" /> <span class="input-group-addon">到</span> <input type="text" class="form-control" id="end_time" name="end_time" value="" autocomplete="off" /> </div> </div> <div class="form-group" style="margin-bottom: 8px;margin-left:20px;"> <label for="caller">主叫电话</label> <input type="text" id="caller" name="caller" class="form-control"> </div> <div class="form-group" style="margin-bottom: 8px;margin-left:20px;"> <label for="called">被叫电话</label> <input type="text" id="called" name="called" class="form-control"> </div> <div class="form-group" style="margin-bottom: 8px;"> <label for="call_result">通话状态</label> <select name="call_result" id="call_result" class="form-control"> <option value="">请选择</option> <option value="ANSWERED">通话成功</option> <option value="BUSY">被叫忙</option> <option value="NO_ANSWER">被叫无应答</option> <option value="REJECT">被叫拒接</option> <option value="HANGUP">主叫提前挂机</option> <option value="INVALID_NUMBER">空号</option> <option value="POWER_OFF">关机</option> <option value="UNAVAILABLE">暂时无法接听</option> <option value="SUSPEND">停机</option> <option value="TP_NO_BINDING">无绑定关系</option> <option value="TP_TIMEOUT">号码查询接口超时</option> <option value="BLACK">黑名单号码</option> <option value="TP_ERROR">号码查询接口解析错误</option> <option value="CALLED_BLACK">被叫不支持</option> <option value="CALL_FORWARD">呼叫转移</option> <option value="OTHER">其他失败情形</option> </select> </div> <div class="form-group" style="margin-bottom: 8px;margin-left:20px;"> <label for="duration">通话时长</label> <div class="input-group" id="duration"> <input type="text" id="duration_begin" name="duration_begin" class="form-control" size="3"> <span class="input-group-addon">到</span> <input type="text" id="duration_end" name="duration_end" class="form-control" size="3"> <span class="input-group-addon">截止(秒为单位)</span> </div> </div> <div class="form-group" style="margin-bottom: 8px;margin-left:20px;"> <label class="control-label">客户来电</label> <select name="is_called" name="is_called" class="form-control"> <option value="0">全部</option> <option value="1" >是</option> <option value="2" >否</option> </select> </div> <button type="submit" class="btn btn-primary">搜索</button> </form> <div class="row" style="margin-top:20px;"> <div class="col-md-12"> <table id="listTable"> <thead class="bg-warning"> <tr> <th data-field="id">ID</th> <th data-field="username">坐席人员</th> <th data-field="begin_time">通话时间</th> <th data-field="caller">主叫真实号码</th> <th data-field="called">被叫真实号码</th> <th data-field="caller_show">主叫分配号码</th> <th data-field="called_show">被叫分配号码</th> <th data-field="call_duration">通话时长</th> <th data-field="call_result">通话状态</th> <th data-formatter="opFormatter">语音</th> </tr> </thead> </table> </div> </div> </div> </div> </div> <div id="player" class="hidden"> <audio controls> <!-- Audio files --> <source src="http://music.baidu.com/cms/app/muplayer/test_mp3/1.mp3" type="audio/mp3"> <!-- Fallback for browsers that don't support the <audio> element --> 您的浏览器不支持在线播放,请<a href="http://music.baidu.com/cms/app/muplayer/test_mp3/1.mp3">下载</a> </audio> </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> var o = {}; function opFormatter(value, row, index) { var opStr = []; if(row.record_file_url !== null) { opStr.push('<a href="javascript:void(0);" onclick="play(\'' + row.record_file_url + '\')">'); } else { opStr.push('<a href="javascript:void(0);" onclick="play(\'' + row.record_file_url_real + '\')">'); } opStr.push('<i class="fa fa-play" title="播放"></i>'); opStr.push('</a>'); return opStr.join(' '); } function play(url) { var body = '<audio controls>'; body += '<source src="' + url + '" type="audio/mp3">'; body += '您的浏览器不支持在线播放,请<a href="' + url + '">下载</a>'; body += '</audio>'; parent.layer.open({ type: 1, skin: 'layui-layer-rim', //加上边框 area: ['320px', '130px'], //宽高 title: '播放语音', content: body }); } function refreshList() { $('#listTable').bootstrapTable('refresh'); } function search() { o = {}; var params = $("#searchFrm").serializeArray(); $.each(params, function(index) { o[this['name']] = this['value']; }); $('#listTable').bootstrapTable('destroy'); $('#listTable').bootstrapTable({ url: "/phone-center/call-records-json", pagination: true, sidePagination: 'server', queryParams: function(params) { o['offset'] = params['offset']; o['limit'] = params['limit']; return o; } }); return false; } $(function() { search(); laydate({ elem:'#begin_time', format: 'YYYY-MM-DD hh:mm:ss', istime: true }); laydate({ elem:'#end_time', format: 'YYYY-MM-DD hh:mm:ss', istime: true }); }); </script> <?php $this->endBlock(); ?>