这个示例使用 前端 easyui-datagrid 后端 php
前端 easyui-datagrid 导出Excel 使用了 datagrid-export.js
datagrid-export.js 文件可自行搜索下载
优点：查询结果显示在datagrid中(不能分页)，前端直接下载不用回后端，效率高速度快。
缺点：查询结果不能分页，必须显示全部内容，显示的内容即是导出后的内容。此方法多用于统计报表中，比如以日期分组统计，结果不可能是几万行（一行为一天分组）。
界面
html
在<body>前 引用 datagrid-export.js
<script type="text/javascript" src="themes/easyui/datagrid-export.js"></script> <body>
<div style='padding:0px 0px 15px 12px ;'> <table> <tr> <td style="width:65px;">呼叫时间:</td> <td style="padding: 0px 0px 0px 2px;"> <input id="start_date_entered" value="<{$start_date}>" placeholder="开始日期" class="my_input laydate-icon" style="height:29px;" onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" readonly ></input></td> <td><span class="input-group-addon" style="height:28px;">至</span></td> <td><input id="stop_date_entered" value="<{$stop_date}>" placeholder="结束日期" class="my_input laydate-icon" style="height:29px;" onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" readonly ></input> </td> <td style="width:10px;"> </td> <td class='width:75px;'>坐席员:</td> <td><select id="select_agent_name" name="select_agent_name" class="easyui-combobox" style="height:28px;width:160px;" editable=false ><{$select_option_agent_name}></select></td> <td style="width:10px;"> </td> <td style="padding: 0px 0px 0px 5px;"> <a href='#' class='easyui-linkbutton' iconCls='icon-select' style="height:29px;width:64px;" onclick='Select()'>查询</a> </td> </tr> </table> </div> <table id='grid'class='easyui-datagrid' style='width:1000px;min-height:450px' title='列表' iconCls='icon-table' rownumbers='true' fitColumns='true' singleSelect='true' toolbar='#toolbar' remoteSort='false'> <thead> <tr> <!-- <th field='select' width='30' align='center'></th> <th field='id' width='10' hidden='true'>编号</th> --> <th field='user_id' width='25'align='center' sortable='true' >坐席工号</th> <th field='user_name' width='25'align='center' sortable='true' >坐席员</th> <th field='login_date' width='30'align='center' sortable='true' >日期</th> <th field='time_len' width='30'align='center' sortable='true' >在线时长</th> <th field='time_len_s' width='30'align='center' sortable='true' >在线时长(秒)</th> </tr> </thead> </table> <div id='toolbar' style='display: flex;align-items:Center; height:35px;' > <a href='javascript:void(0)' class='easyui-linkbutton' iconCls='icon-excel' plain='true' onclick='ToExcel()' <{$ToExcel_disabled}> >导出</a> <div class="btn-separator"></div> <a href='#' class='easyui-linkbutton' iconCls='icon-refresh' plain='true' onclick='Refresh()'>刷新</a> <a href='#' class='easyui-linkbutton' iconCls='icon-cancel' plain='true' onclick='parent.TabClose();'>关闭</a> </div>
js
<script type='text/javascript'>
function Select(){
var agent_name=$('#select_agent_name').combobox('getValue');
var start_time=$('#start_date_entered').val();
var stop_time=$('#stop_date_entered').val();
var url='Api-index.php?module=<{$module_name}>&action=Api_ReportView_Agent_Login_Report_Day_Select';
var query={'agent_name':agent_name,'start_time':start_time,'stop_time':stop_time };
$('#grid').datagrid('options').url=url;
$('#grid').datagrid('options').queryParams=query;
$('#grid').datagrid('reload');
}
function ToExcel(){
$('#grid').datagrid('toExcel','Book.xls');
}
</script>
php
Api_ReportView_Agent_Login_Report_Day_Select.php
<?php //-----------------------------------------------坐席在线时长 日统计------------------------------------ /* foreach($_POST as $k=>$v){ WriteLog("POST " . $k .'--' .$v); } foreach($_GET as $k=>$v){ WriteLog("GET " . $k .'--' .$v); } */ $arr_result = array(); //返回值 $where='';//查询条件 if(!empty($_POST['start_time'])){ $start_time=$_POST['start_time']; $stop_time=$_POST['stop_time']; } else{ //当天 $start_time=date("Y-m-d 0:0:0",strtotime("now")); //$last_month= GetMonthToday("-1");//上个月的今天 //默认查询一个月 //$start_time=$last_month .' 00:00:00'; $stop_time=date("Y-m-d 23:59:59",strtotime("now")); } //$where=" date_time >='{$start_time}' and date_time <='{$stop_time}' "; $where=" login_time >='{$start_time}' and login_time <='{$stop_time}' "; //坐席 if($_REQUEST['agent_name']!='' && $_REQUEST['agent_name']!='0'){ // $where .=" and agent_name = '{$_REQUEST['agent_name']}' "; } //结果集 $items = array(); $sql="SELECT user.user_id , agent_name as user_name,login_date,SEC_TO_TIME(sum(time_len_s)) as time_len,sum(time_len_s) as time_len_s FROM "; $sql.=" cti_agent_login join user on cti_agent_login.agent_name=user.user_id where "; $sql.=" " .$where ." GROUP BY login_date ORDER BY login_date"; //WriteLog($sql); $result_rows=$db->query($sql); $row_count=$db->num_rows($result_rows);//行数 while($row=$db->fetch_array($result_rows)) { array_push($items, $row); //WriteLog($row[2]); $time_len=$row['time_len']; $time_len_s=$row['time_len_s']; $time_len_s_sum=$time_len_s_sum+$time_len_s;//所有坐席的 在线时长(秒) } //合计------------------------------------- $row['user_name']='合计'; $row['date']=$row_count."天";//行数 表示上班天数 if($time_len_s_sum!=''){//为空则不计算 $row['time_len']=Sec2Time($time_len_s_sum);//所有坐席的 在线时长 } else { $row['time_len']=$time_len_s_sum; } $row['time_len_s']=$time_len_s_sum;//所有坐席的 在线时长(秒) array_push($items, $row); //加入数组 $arr_result['rows'] = $items; //WriteLog(json_encode($arr_result['rows'] )); echo json_encode($arr_result); ?>
- datagrid Excel easyui-datagrid datagrid-export 前端datagrid excel easyui-datagrid datagrid-export datagrid-export easyui-datagrid easyui-datagrid datagrid easyui easyui-datagrid datagrid功能easyui easyui-datagrid组件datagrid easyui easyui-datagrid datagrid easyui组件 前端excel excel前端express服务器 前端 文档excel word