<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="contextPath" value="${pageContext.request.contextPath}"></c:set>
<link rel="stylesheet" href="${contextPath}/static/assets/css/jquery-ui.css" />
<link rel="stylesheet" href="${contextPath}/static/assets/css/ui.jqgrid.css" />
<div class="well well-sm">
<input type="text" class="input-sm" placeholder="案件编号" id="kwOrderId"/>
<input type="text" class="input-sm" placeholder="案件名称" id="kwName"/>
<input type="text" class="input-sm" placeholder="律师" id="kwLawyer"/>
<select class="select" id="orderState">
<option value="" selected = "selected">状态</option>
<option value="20">融资中</option>
<option value="93">融资失败</option>
<option value="94">金额已退</option>
<option value="21">融资完成</option>
<option value="30">诉讼中</option>
<option value="40">回款中</option>
<option value="50">已回款</option>
</select>
<button type="button" class="btn btn-purple btn-sm" id="searchd">
<span class="ace-icon fa fa-search icon-on-right bigger-110"></span>
查询
</button>
</div>
<div class="row">
<div class="col-xs-12">
<table id="grid-table"></table>
<div id="grid-pager"></div>
<script type="text/javascript">
var $path_base = "${contextPath}/static";//in Ace demo this will be used for editurl parameter
</script>
<!-- PAGE CONTENT ENDS -->
</div><!-- /.col -->
</div><!-- /.row -->
<!-- page specific plugin scripts -->
<script type="text/javascript">
var myGrid = null;
var scripts = [ null, "${contextPath}/static/assets/js/jqGrid/jquery.jqGrid.js", "${contextPath}/static/assets/js/jqGrid/i18n/grid.locale-cn.js", null ];
$('.page-content-area').ace_ajax('loadScripts', scripts, function() {
// inline scripts related to this page
jQuery(function($) {
var grid_selector = "#grid-table";
var pager_selector = "#grid-pager";
// resize to fit page size
$(window).on('resize.jqGrid', function() {
$(grid_selector).jqGrid('setGridWidth', $(".page-content").width());
})
// resize on sidebar collapse/expand
var parent_column = $(grid_selector).closest('[class*="col-"]');
$(document).on('settings.ace.jqGrid', function(ev, event_name, collapsed) {
if (event_name === 'sidebar_collapsed' || event_name === 'main_container_fixed') {
// setTimeout is for webkit only to give time for DOM changes and then redraw!!!
setTimeout(function() {
$(grid_selector).jqGrid('setGridWidth', parent_column.width());
}, 0);
}
});
$(document).keydown(function(event) {
var key = window.event ? event.keyCode : event.which;
if (key == 13) {
$("#searchd").click();
}
});
/*搜索框 主要对Jquery grid进行刷新 带参数刷新 */
$("#searchd").click(function(){
var kwOrderId =$("#kwOrderId").val();
var kwName =$("#kwName").val();
var kwLawyer =$("#kwLawyer").val();
var orderState =$("#orderState").val();
myGrid.setGridParam({data:'json',url : '${contextPath}/fs/report/getSsrzTzReport?kwOrderId='+kwOrderId+'&kwName='+kwName+'&kwLawyer='+kwLawyer+'&orderState='+orderState}).trigger('reloadGrid');
});
myGrid= jQuery(grid_selector).jqGrid({
subGrid : false,
url : "${contextPath}/fs/report/getSsrzTzReport",
datatype : "json",
height : '100%',
width : 'auto',
colNames : ['投资时间', '姓名','手机号码','案件编号','案件名称','融资金额','投资金额','支付方式','支付单号','总投资金额','案件状态','投资收入','投资收益率','投资期限'],
colModel : [{ name : 'p_createDate',
index : 'p_createDate',
width : 120,
editable : false
},{ name : 'l_real_name',
index : 'l_real_name',
width : 100,
search : false,
editable : false,
readonly : true
},{ name : 'l_phone',
index : 'l_phone',
width : 120,
search : false,
editable : false,
},{ name : 'o_orderId',
index : 'o_orderId',
width : 100,
editable : false
},{ name : 'o_title',
index : 'o_title',
width : 200,
editable : false
},{
name : 'o_moneyPc',
index : 'o_moneyPc',
width : 120,
editable : false
},{
name : 'p_money',
index : 'p_money',
width : 120,
editable : false
},{
name : 'p_platform',
index : 'p_platform',
width : 100,
editable : true
}, {
name : 'p_tradeNo',
index : 'p_tradeNo',
width : 150,
editable : false
}, {
name : 'o_moneyTzl',
index : 'o_moneyTzl',
width : 120,
editable : false
}, {
name : 'o_orderState',
index : 'o_orderState',
width : 100,
editable : false
}, {
name : 'moneyTz',
index : 'moneyTz',
width : 120,
sortable : false,
editable : false
}, {
name : 'profit',
index : 'profit',
width : 100,
sortable : false,
editable : false
}, {
name : 'returnCycle',
index : 'returnCycle',
width : 100,
sortable : false,
editable : false
}],
//scroll : 1, // set the scroll property to 1 to enable paging with scrollbar - virtual loading of records
sortname : "createDate",
sortorder : "desc",
viewrecords : true,
rowNum : 100,
rowList : [ 100, 500, 1000 ],
pager : pager_selector,
altRows : true,
loadComplete : function() {
var table = this;
setTimeout(function(){
styleCheckbox(table);
updateActionIcons(table);
updatePagerIcons(table);
enableTooltips(table);
}, 0);
}
//caption : "用户管理列表",
//autowidth : true,
/**
grouping : true,
groupingView : {
groupField : ['name'],
groupDataSorted : true,
plusicon : 'fa fa-chevron-down bigger-110',
minusicon : 'fa fa-chevron-up bigger-110'
},
*/
});
$(window).triggerHandler('resize.jqGrid');// trigger window resize to make the grid get the correct size
// enable search/filter toolbar
// jQuery(grid_selector).jqGrid('filterToolbar',{defaultSearch:true,stringResult:true})
// jQuery(grid_selector).filterToolbar({});
// switch element when editing inline
function aceSwitch(cellvalue, options, cell) {
setTimeout(function() {
$(cell).find('input[type=checkbox]').addClass('ace ace-switch ace-switch-5').after('<span class="lbl"></span>');
}, 0);
}
// navButtons
jQuery(grid_selector).jqGrid('navGrid', pager_selector, { // navbar options
edit : false,
editicon : 'ace-icon fa fa-pencil blue',
add : false,
addicon : 'ace-icon fa fa-plus-circle purple',
del : false,
delicon : 'ace-icon fa fa-trash-o red',
search : false,
searchicon : 'ace-icon fa fa-search orange',
refresh : true,
refreshicon : 'ace-icon fa fa-refresh blue',
view : false,
viewicon : 'ace-icon fa fa-search-plus grey'
}, {
// edit record form
// closeAfterEdit: true,
// width: 700,
recreateForm : true,
beforeShowForm : function(e) {
var form = $(e[0]);
form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
style_edit_form(form);
},
errorTextFormat: function (response) {
var result = eval('('+response.responseText+')');
return result.message;
}
})
jQuery(grid_selector).jqGrid('navButtonAdd', pager_selector,{
caption : "",
title : "导出Excel",
buttonicon : "ace-icon fa fa-file-excel-o green",
onClickButton : function () {
var keys = [], ii = 0, rows = "";
var ids = $(grid_selector).getDataIDs(); // Get All IDs
var row = $(grid_selector).getRowData(ids[0]); // Get First row to get the labels
var label = $(grid_selector).jqGrid('getGridParam','colNames');
for(var k in label){
rows = rows + label[k] + "\t"; // output each Column as tab delimited
}
for (var k in row) {
keys[ii++] = k; // capture col names
}
rows = rows + "\n"; // Output header with end of line
var tIds = {"p_createDate":true,"l_real_name":false,"l_phone":true,"o_orderId":true,"o_title":false,"o_moneyPc":false,"p_money":false,
"p_platform":false,"p_tradeNo":true,"o_moneyTzl":false,"o_orderState":false,"moneyTz":false,"profit":false,"returnCycle":false};
for (i = 0; i < ids.length; i++) {
row = $(grid_selector).getRowData(ids[i]); // get each row
for (j = 0; j < keys.length; j++){
if(tIds[keys[j]]){
rows = rows + '="' + row[keys[j]] + '"\t'; // output each Row as tab delimited
}else{
rows = rows + row[keys[j]] + '\t'; // output each Row as tab delimited
}
}
rows = rows + "\n"; // output each row with end of line
}
rows = rows + "\n"; // end of line at the end
var form = "<form name='csvexportform' action='${contextPath}/fs/report/getExcel?fileName=ssrztz' method='post'>";
form = form + "<input type='hidden' name='csvBuffer' value='" + encodeURIComponent(rows) + "'>";
form = form + "</form><script>document.csvexportform.submit();</sc" + "ript>";
OpenWindow = window.open('', '');
OpenWindow.document.write(form);
OpenWindow.document.close();
}
});
function style_edit_form(form) {
// form.find('input[name=statusCn]').addClass('ace ace-switch ace-switch-5').after('<span class="lbl"></span>');
// don't wrap inside a label element, the checkbox value won't be submitted (POST'ed)
// .addClass('ace ace-switch ace-switch-5').wrap('<label class="inline" />').after('<span class="lbl"></span>');
// update buttons classes
var buttons = form.next().find('.EditButton .fm-button');
buttons.addClass('btn btn-sm').find('[class*="-icon"]').hide();// ui-icon, s-icon
buttons.eq(0).addClass('btn-primary').prepend('<i class="ace-icon fa fa-check"></i>');
buttons.eq(1).prepend('<i class="ace-icon fa fa-times"></i>')
buttons = form.next().find('.navButton a');
buttons.find('.ui-icon').hide();
buttons.eq(0).append('<i class="ace-icon fa fa-chevron-left"></i>');
buttons.eq(1).append('<i class="ace-icon fa fa-chevron-right"></i>');
}
function beforeEditCallback(e) {
var form = $(e[0]);
form.closest('.ui-jqdialog').find('.ui-jqdialog-titlebar').wrapInner('<div class="widget-header" />')
style_edit_form(form);
}
// it causes some flicker when reloading or navigating grid
// it may be possible to have some custom formatter to do this as the grid is being created to prevent this
// or go back to default browser checkbox styles for the grid
function styleCheckbox(table) {
/**
* $(table).find('input:checkbox').addClass('ace') .wrap('<label />') .after('<span class="lbl align-top" />') $('.ui-jqgrid-labels th[id*="_cb"]:first-child')
* .find('input.cbox[type=checkbox]').addClass('ace') .wrap('<label />').after('<span class="lbl align-top" />');
*/
}
// unlike navButtons icons, action icons in rows seem to be hard-coded
// you can change them like this in here if you want
function updateActionIcons(table) {
/**
* var replacement = { 'ui-ace-icon fa fa-pencil' : 'ace-icon fa fa-pencil blue', 'ui-ace-icon fa fa-trash-o' : 'ace-icon fa fa-trash-o red', 'ui-icon-disk' : 'ace-icon fa fa-check green', 'ui-icon-cancel' :
* 'ace-icon fa fa-times red' }; $(table).find('.ui-pg-div span.ui-icon').each(function(){ var icon = $(this); var $class = $.trim(icon.attr('class').replace('ui-icon', '')); if($class in replacement)
* icon.attr('class', 'ui-icon '+replacement[$class]); })
*/
}
// replace icons with FontAwesome icons like above
function updatePagerIcons(table) {
var replacement = {
'ui-icon-seek-first' : 'ace-icon fa fa-angle-double-left bigger-140',
'ui-icon-seek-prev' : 'ace-icon fa fa-angle-left bigger-140',
'ui-icon-seek-next' : 'ace-icon fa fa-angle-right bigger-140',
'ui-icon-seek-end' : 'ace-icon fa fa-angle-double-right bigger-140'
};
$('.ui-pg-table:not(.navtable) > tbody > tr > .ui-pg-button > .ui-icon').each(function() {
var icon = $(this);
var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
if ($class in replacement)
icon.attr('class', 'ui-icon ' + replacement[$class]);
})
}
function enableTooltips(table) {
$('.navtable .ui-pg-button').tooltip({
container : 'body'
});
$(table).find('.ui-pg-div').tooltip({
container : 'body'
});
}
// var selr = jQuery(grid_selector).jqGrid('getGridParam','selrow');
$(document).one('ajaxloadstart.page', function(e) {
$(grid_selector).jqGrid('GridUnload');
$('.ui-jqdialog').remove();
});
});
});
</script>