<%@ 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" />
<link rel="stylesheet" href="${contextPath}/static/assets/css/bootstrap-datetimepicker.css" />

<div class="well well-sm">
	<input type="text" class="input-sm" placeholder="开始日期" id="startDate"/>
	<input type="text" class="input-sm" placeholder="结束日期" id="endDate"/>
	<select class="select" id="typeOState">
		<option value="" selected = "selected">操作类型</option>
		<option value="0">收入</option>
		<option value="1">支出</option>
	</select>
	<select class="select" id="lowTypeState">
		<option value="" selected = "selected">业务类型</option>
		<option value="995">诉保积分</option>
		<option value="1000">诉保退保</option>
		<option value="30">诉保红包提现</option>
		<option value="31">诉保红包</option>
		<option value="996">查档积分</option>
		<option value="0">代付</option>
		<option value="8">提现</option>
		<option value="9">代缴诉讼费</option>
		<option value="1">电话咨询</option>
		<option value="2">合同审核</option>
		<option value="3">专项委托</option>
		<option value="4">面谈咨询</option>
		<option value="5">代拟文书</option>
		<option value="6">律师函</option>
		<option value="7">协助谈判</option>
		<!-- <option value="16">案件合作保证金</option> -->
		<option value="17">案件合作平台服务费</option>
		<option value="997">诉讼融资代理收入</option>
		<option value="998">诉讼融资推荐收入</option>
		<option value="999">诉讼融资投资收入</option>
		<option value="50">法律咨询-咨询费</option>
		<option value="51">法律咨询-用户心意</option>
	</select>
	<input type="text" class="input-sm" placeholder="搜索关键字" id="keyword"/>
	<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/date-time/bootstrap-datepicker.js", "${contextPath}/static/assets/js/date-time/locales/bootstrap-datepicker.zh-CN.js",
	                "${contextPath}/static/assets/js/jqGrid/jquery.jqGrid.js", "${contextPath}/static/assets/js/jqGrid/i18n/grid.locale-cn.js",
	                "${contextPath}/static/js/fs/lawALGrid.js?v=4", 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 keyword = encodeURI(encodeURI($("#keyword").val()));
				var startDate = $("#startDate").val();
				var endDate = $("#endDate").val();
				if(startDate.length > 1 && endDate.length > 1){
					if(checkNotDate(startDate)){
						alert('开始时间错误');
						return;
					}
					if(checkNotDate(endDate)){
						alert('结束时间错误');
						return;
					}
					var startTime = new Date(Date.parse(startDate.replace(/-/g, "/")));
					var endTime = new Date(Date.parse(endDate.replace(/-/g, "/")));
					if(endTime.getTime() < startTime.getTime()){
						alert('开始时间不能小于结束时间');
						return;
					}
				}
		    	myGrid.setGridParam({postData:{keyword:keyword, startDate:startDate, endDate:endDate, typeO:$('#typeOState').val(), lowType:$('#lowTypeState').val()},url : '${contextPath}/fs/report/getLawAlReport',page:1}).trigger('reloadGrid');
			});
			
			myGrid = initLawALGrid(grid_selector, pager_selector, '${contextPath}/fs/report/getLawAlReport', 'auto');
    	    
			$(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);
    		}
    		
    		initNavButtons(grid_selector, pager_selector, "${contextPath}");  
    		
    		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);
    		}

    		// var selr = jQuery(grid_selector).jqGrid('getGridParam','selrow');

    		$(document).one('ajaxloadstart.page', function(e) {
    			$(grid_selector).jqGrid('GridUnload');
    			$('.ui-jqdialog').remove();
    		});

    		function checkNotDate(dateStr){
    			var result = false;
    			var re = /^(\d{4})-(\d{2})-(\d{2})$///正则表达式
    		    if(!re.test(dateStr)){
    		       result = true;
    		    }
    		    return result;
    		}
    		
		    $('#startDate').datepicker({
		        language: 'zh-CN',
		        pickTime: false,
		        todayBtn: true,
		        autoclose: true,
		        minView: '2',
		        forceParse: false,
		        format:"yyyy-mm-dd"
		    });
			$('#endDate').datepicker({
		        language: 'zh-CN',
		        pickTime: false,
		        todayBtn: true,
		        autoclose: true,
		        minView: '2',
		        forceParse: false,
		        format:"yyyy-mm-dd"
		    });
    	});
	});
</script>