<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport"
		content="width=device-width,user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<title>加油卡充值</title>
	<link rel="stylesheet" type="text/css" href="${ctx}/styles/common/reset.css" />
	<link rel="stylesheet" type="text/css" href="${ctx}/plugin/swiper/swiper_css/swiper-3.4.1.min.css" />
	<link rel="stylesheet" type="text/css" href="${ctx}/styles/wechat/fuelCard.css" />
	<link rel="stylesheet" type="text/css" href="${ctx }/styles/visitor/layer.css" />
	
	<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
	<script type="text/javascript" src="${ctx}/scripts/common/jquery-1.11.3.min.js"></script>
	<script type="text/javascript" src="${ctx}/scripts/common/common.js"></script>
	<script type="text/javascript" src="${ctx }/scripts/visitor/layer.js"></script>
	<script type="text/javascript" src="${ctx }/scripts/visitor/visitorsecurity.js"></script>
	<script type="text/javascript" src="${ctx }/scripts/common/shareAppMessage.js"></script>
	<script type="text/javascript" src="${ctx }/scripts/wechat/fuelCard.js"></script>
</head>
<body>
	<input type="hidden" id="contextPath" value="${ctx }" />
	<input type="hidden" id="webUrl" value="${webUrl }" />
	<input type="hidden" id="visitPrefix" value="${imageServer }" />
	<input type="hidden" id="openId" value="${openId }" />
	<input type="hidden" id="developId" value="${developId }" />
	<input type="hidden" id="channelCode" value="${channelCode }" />
	<input type="hidden" id="serviceCode" value="${operationType }" />

	<div class="cardwrap clearfix">
		<div class="cardlist clearfix">
			<ul>
				<c:forEach items="${categoriesList }" var="categories" varStatus="s">
					<c:if test="${s.index==0 }">
						<li class="fuelcard" sCode="${categories.serviceCode }">
							<i class="hookicon"></i> 
							<img src="${imageServer}${categories.iconUrl}" alt="" />
						</li>
					</c:if>
					<c:if test="${s.index!=0 }">
						<li class="" sCode="${categories.serviceCode }">
							<i class="hookicon"></i> 
							<img src="${imageServer}${categories.iconUrl}" alt="" />
						</li>
					</c:if>
				</c:forEach>
			</ul>
		</div>
		<div class="entrycard">
			<span></span>
			<div class="entrycardinput">
				<input type="text"  id="cardCode" />
			</div>
		</div>
		
		<div class="fuelprice clearfix" style="display:none">
			<span style="display:block; color:#666666; margin-bottom: 0.86rem; ">请选择充值金额</span>
			<ul id="container">
			</ul>
		</div>
		
		<div class="nogoods" style="display:none">
			<img src="${ctx}/images/gasrecharge/nothinggoods.png" alt="" /><span>暂无此商品</span>
		</div>
	</div>
	<!-- fuelbtn fuelbtn-disable禁用  fuelbtn js_fuelbtn可用-->
	<input type="button" class="fuelbtn fuelbtn-disable" value="立即充值" id="sbBtn" onclick="submitOrder()" />

	<div class="jumowrap">
		<div class="jump clearfix">
			<a href="${ctx}/wechat/recharge/getRechargeRecord?openId=${openId}&developId=${developId}&operationType=${operationType}">充值记录</a> <a href="http://www.avic-s.com/superdesk/WEB-INF/pages/gasrecharge/commonProblem.html">常见问题</a>
		</div>
	</div>
</body>
</html>