<%@ page language="java" errorPage="/error.jsp" pageEncoding="UTF-8"
	contentType="text/html; charset=UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
<title>账单信息管理</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- bootstrap 3.0.2 -->
<link href="<c:url value='/styles/lib/bootstrap.min.css'/>"
	rel="stylesheet" type="text/css" />
<link href="<c:url value='/styles/lib/font-awesome.min.css'/>"
	rel="stylesheet" type="text/css" />
<link href='<c:url value='/styles/lib/ionicons.min.css' />'
	rel="stylesheet" type="text/css" />
<link
	href="<c:url value='/styles/lib/datatables/dataTables.bootstrap.css' />"
	rel="stylesheet" type="text/css" />
<link href="<c:url value='/styles/AdminLTE.css?ver=4.0'/>"
	rel="stylesheet" type="text/css" />
<script src="${ctx }/scripts/lib/jquery-1.8.2.min.js"></script>
<script type="text/javascript"
	src="<c:url value='/scripts/bootstrap.min.js'/>"></script>
<script type="text/javascript"
	src="<c:url value='/scripts/My97DatePicker/WdatePicker.js'/>"></script>
<script type="text/javascript" src="<c:url value='/plugin/layer/layer.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/common/mathematical.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/admin/bill/generalBills.js?ver=7.5'/>"></script>
<style type="text/css">
.row {
	padding-top: 25px;
	text-align: center;
}

.col-sm-3 {
	width: 15%
}
</style>
</head>
<body>
	<input type="hidden" id="funcid" value="${funcid}">
	<input type="hidden" value="${ctx}" id="contextPath">
	<input type="hidden" id="totals">
	<c:forEach items="${depositRecordStatusGroup }" var="obj">
		<input type="hidden" value="${obj.itemname}"
			id="status${obj.itemcode }">
	</c:forEach>
	<section class="content">
		<div class="row">
			<div class="col-xs-12">
				<div class="boxlist">
					<!-- /.box-header -->
					<div class="box-body table-responsive">
						<form:form id="conditionform"
							action="${ctx}/admin/bill/generalBillsPage?funcid=${funcid}"
							method="POST">
							<input type="hidden" name="virtualId" value="${virtualId}"
								id="virtualId">
							<div class="form-group"
								style="float: left; background-color: white;">
								<label>月份：</label> <input type="text" name="outMonth"
									id="outMonth" value="${outMonth }" style="width: 120px;"
									class="Wdate"
									onfocus="WdatePicker({firstDayOfWeek:1,dateFmt:'yyyy-MM'})"
									readonly="true" />
							</div>
							<span
								style="float: right; margin-bottom: 2px; margin-right: 0px;">
								<c:if test="${addAct =='1' }">
									<a class="btn btn-success" href="javaScript:void(0);" onclick="showUpdatePayStatus()">支付状态管理</a>
									<a class="btn btn-success" href="javaScript:void(0);" onclick="saveUpdateDepositRecordModel()">预存款管理</a>
								</c:if> 
								<a class="btn btn-default" href="javaScript:void(0);" id='btn-search'>查询</a> 
								<a class="btn btn-default" style="margin-left: 5px;" 
									href="${ctx}/admin/virtualArch/list?funcid=${funcid}" id='bindBtn'>返回</a>
							</span>
						</form:form>
						<table id="example2" class="table table-bordered table-hover">
							<thead>
								<tr>
									<th>序号</th>
									<th>月份</th>
									<th>本期费用总额</th>
									<th>实收金额</th>
									<th>预存抵扣金额</th>
									<th>未缴合计</th>
									<th>支付状态</th>
									<th>修改人/修改时间</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<c:if test="${empty page.items }">
									<tr>
										<td colspan="9" style="font-size: 24px;">暂无账单信息</td>
									</tr>
								</c:if>
								<c:if test="${not empty page.items }">
									<c:forEach items="${page.items }" var="model"
										varStatus="status">
										<tr>
											<td>${ (page.currentPage-1)*page.pageSize+(status.index+1)}</td>
											<td>${model.outMonth }</td>
											<td>${model.totalFee }</td>
											<td>${model.payFee }</td>
											<td>${model.dedFee }</td>
											<td>${model.unpaidAmount }</td>
											<td><c:choose>
													<c:when test="${model.payStatus==1 }">
															已支付
														</c:when>
													<c:otherwise>
															未支付
														</c:otherwise>
												</c:choose></td>
											<td><c:choose>
													<c:when test="${not empty model.modifier }">
															${model.modifier }/${model.modifyTime }
														</c:when>
													<c:otherwise>
															${model.creator }/${model.createTime }
														</c:otherwise>
												</c:choose></td>
											<td><c:if test="${model.payStatus==0 }">
													<!-- <a href="javascript:void(0);" title="支付状态管理"
														class="btn btn-default" onclick=""> <span>支付状态管理</span>
													</a> -->
													<a href="javascript:void(0);" title="编辑管理"
														class="btn btn-back" onclick="saveUpdateGeneralBills('${model.id}')">
														<span>编辑管理</span>
													</a>
												</c:if> <a href="javascript:void(0);" title="打印"
												class="btn btn-success" onclick="generalBillsPutView('${model.id}')"> <span>打印</span>
											</a></td>
										</tr>
									</c:forEach>
								</c:if>

							</tbody>
						</table>

						<div class="btn-page">
							<!-- 页码 -->
							<div align="center" class="pages clearfix">
								<c:forEach items="${page.iterPages }" var="pageNo">
									<c:choose>
										<c:when test="${pageNo == page.currentPage }">
											<span class='current'>${pageNo }</span>
										</c:when>
										<c:when test="${pageNo != null}">
											<a href="javascript:void(0);" onclick='goPage(${pageNo});'>${pageNo}</a>
										</c:when>
										<c:otherwise>
											<em>...</em>
										</c:otherwise>
									</c:choose>
								</c:forEach>
								<strong>共<span
									style="color: black; font-weight: bold; font-size: 16px;">${page.totalCount}</span>条
								</strong> <strong>跳转到第</strong><input type="text" id="gopage"
									style="width: 40px;"
									onkeyup="this.value=this.value.replace(/\D/g,'')"
									onkeypress="this.value=this.value.replace(/\D/g,'')" /><strong>页</strong>
								<a class="btn-sm  btn-primary"
									href="javascript:goPage('gopage');" id='bindBtn'>确定</a>
							</div>
						</div>
					</div>
					<!-- /.box-body -->
				</div>
			</div>
		</div>
	</section>

	<!--预存款管理  -->
	<div class="modal fade" id="saveUpdateDepositRecordModel" tabindex="-1"
		role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="depositRecordTitle">
						预存款管理 <span style='float: right; padding-right: 10px; color: red;'
							id='total'>预存款余额：${virtualArchitecture.reserveBalance }</span>
					</h4>
				</div>
				<div class="modal-body" style="text-align: center;">
					<form class="form-horizontal" role="form" id="form1">
						<div class="form-group"
							style="background-color: white; padding-top: 10px;">
							<label class="col-sm-3 control-label" for="amountFee"
								style="padding-top: 0px; padding-left: 0px;"><span
								style="color: red;">*</span>金额：</label>
							<div class="col-sm-4" style="padding-left: 10px;">
								<input class="form-control" id="amountFee" name="amountFee"
									type="text" placeholder="请输入充值的金额" />
							</div>

							<label class="col-sm-3 control-label" for="status"
								style="padding-top: 0px; padding-left: 0px;"><span
								style="color: red;">*</span>状态：</label>
							<div class="col-sm-4" style="padding-left: 10px;">
								<select name="status" id="status" class="form-control"
									style="width: 182px;">
									<option value="">请选择状态</option>
									<c:forEach items="${depositRecordStatusGroup }" var="obj">
										<option value="${obj.itemcode }">${obj.itemname }</option>
									</c:forEach>
								</select>

							</div>
						</div>
						<div class="form-group"
							style="background-color: white; padding-top: 10px;">
							<label class="col-sm-3 control-label" for="remark"
								style="padding-top: 0px; padding-left: 0px;"><span
								style="color: red;">*</span>备注：</label>
							<div class="col-sm-10" style="padding-left: 10px;">
								<input class="form-control" id="remark" name="remark"
									type="text" placeholder="请输入备注内容" />
							</div>
						</div>

						<div class="form-group"
							style="background-color: white; padding-top: 10px;">
							<span
								style="float: right; margin-bottom: 2px; margin-right: 10px;">
								<a class="btn btn-default" href="javaScript:void(0);"
								onclick="commitDepositRecord()">保存</a> <a class="btn btn-back"
								href="javaScript:void(0);" onclick="clearForm()">清空</a>
							</span>
						</div>
					</form>

					<form class="form-horizontal" role="form" id="form2">
						<span
							style="float: left; font-size: 20px; padding-left: 15px; padding-bottom: 10px;">明细记录</span>
						<section class="content">
							<div class="row" style="padding-top: 0px;">
								<div class="col-xs-12">
									<div class="boxlist">
										<div class="box-body table-responsive" id="fenye">
											<table id="example3" class="table table-bordered table-hover">

											</table>
											<div class='btn-page' id="page3"></div>
										</div>
									</div>
								</div>
							</div>
						</section>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-danger" data-dismiss="modal"
						style="float: right;">关闭</button>
				</div>
			</div>
		</div>
	</div>
	
	<!--支付状态管理  -->
	<div class="modal fade" id="saveUpdatePayStatus" tabindex="-1"
		role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" style="text-align:center">
						<strong>支付状态管理</strong>
					</h4>
				</div>
				<div class="modal-body" style="text-align: center;">
					<form class="form-horizontal" role="form" id="form1">
						<div class="form-group" style="background-color: white; padding-top: 10px;">
							<label class="col-sm-2 control-label" for="remark" style="padding-top: 0px; padding-left: 0px;">
								<span style="color: red;">*</span>账单月份：
							</label>
							<div class="col-sm-9" style="padding-left: 10px;">
								<select class="form-control" id="qianfeeMonth" name="qianfeeMonth" onchange="reloadPayHeji()">
									<option value="">全部</option>
									<option value="">2017-05</option>
									<option value="">2017-04</option>
									<option value="">2017-03</option>
								</select>
								<span style="color: red;float: left;" id="pay_heji">未缴合计：400.00</span>
							</div>
						</div>
						
						<div class="form-group" style="background-color: white; padding-top: 10px;">
							<label class="col-sm-2 control-label" for="remark" style="padding-top: 0px; padding-left: 0px;">
								<span style="color: red;">*</span>实收金额：
							</label>
							<div class="col-sm-9" style="padding-left: 10px;">
								<input class="form-control" id="paidAmount" name="paidAmount" type="text" placeholder="请输入实收金额" />
								<span style="float: left;">请输入数字</span>
							</div>
						</div>
						
						<div class="form-group" style="background-color: white; padding-top: 10px;">
							<label class="col-sm-2 control-label" for="remark" style="padding-top: 0px; padding-left: 0px;">
								<span style="color: red;">*</span>存款抵扣：
							</label>
							<div class="col-sm-9" style="padding-left: 10px;">
								<input class="form-control" id="dedAmount" name="dedAmount" type="text" placeholder="请输入预存款抵扣金额" />
								<span style="float: left;" id="pay_yue">余额：100.00</span>
							</div>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<a class="btn btn-default" href="javaScript:updatePayStatus();">支付成功</a> 
					<button type="button" class="btn btn-danger" data-dismiss="modal" style="float: right;">关闭</button>
				</div>
			</div>
		</div>
	</div>
</body>
</html>