<%@ 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/moviesvip.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}/plugin/swiper/swiper_js/swiper-3.4.1.min.js"></script>
	<script type="text/javascript" src="${ctx }/scripts/common/shareAppMessage.js"></script>
	<script type="text/javascript">
		$(function(){
			 var mySwiper = new Swiper ('.swiper-container', {
			        loop: true,
			        autoplay : 2000,
			        // 如果需要分页器
			        pagination: '.swiper-pagination',
			      });     

	         $(".explainshow").click(function(){
	             $(".explainmask").show();
	         });
	         $(".explainbtn").click(function(){
	             $(".explainmask").hide();
	         })
	         
	       	//分享处理
	       	var channelCode=$("#channelCode").val();
	        var serviceCode=$("#serviceCode").val();
	     	var url=$("#webUrl").val()+"/wechat/appUser/execWechatAuth?developId="+$("#developId").val()+"&pageType=filmIndexPage&channelCode="+channelCode+"&serviceCode="+serviceCode;
	     	var imageUrl=$("#webUrl").val()+"/images/visitor/log.png?v=1.0";
	     	var title="全屏影视会员仲夏大放血，低至8折";
	     	shareAppMessage(title, "超级前台联合全屏影视提供，为您提供专享服务", url, imageUrl);
		});
		
		function bannerUrl(linkUrl){
			if(linkUrl!=""){
				window.location.href=linkUrl;
			}
		}
     </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="${serviceCode }" />
	
	<c:choose>
		<c:when test="${not empty bannerStr && fn:length(bannerStr)>1}">
			<div class="swiper-container">
				<div class="swiper-wrapper">
					<c:forEach items="${bannerStr }" var="model">
	                	<div class="swiper-slide">
	                		<img src="${imageServer }${model.path }" alt=""  />
	                	</div>
	            	</c:forEach>
				</div>
				<div class="swiper-pagination"></div>
			</div>
		</c:when>
		<c:otherwise>
			<c:forEach items="${bannerStr }" var="model">
               	<div class="swiper-slide">
               		<img src="${imageServer }${model.path }" alt=""  />
               	</div>
           	</c:forEach>
		</c:otherwise>
	</c:choose>
	
	<!-- 影视会员列表 -->
	<div class="movieslist clearfix">
		<c:forEach items="${categoriesList}" var="categories">
			 <a href="${ctx}/wechat/recharge/moviesvipreCharge?developId=${developId}&openId=${openId}&operationType=${categories.serviceCode}&channelCode=${channelCode}" class="moviesvip">
                <img src="${imageServer}${categories.iconUrl }" alt="" />
                <div class="moviesname">
                    <span class="ellipsis">${categories.name }</span>
                    <em>${categories.description }</em>
                </div>
            </a>
		</c:forEach>
	</div>
	<div class="jumowrap">
		<div class="jump clearfix">
			<a href="${ctx}/wechat/recharge/getRechargeRecord?openId=${openId}&developId=${developId}&operationType=YSHY">订单查询</a> <a
				href="javascript:void(0);" class="explainshow">充值说明</a>
		</div>
	</div>
	<!-- 充值说明 -->
	<div class="explainmask">
		<div class="explain">
			<h3>充值说明</h3>
			<p>
				1、芒果TV会员：本商品为自动充值，付款后会自动充值至您填写的账号中，请确保账号填写正确，充值成功后不予退换。<br />
				2、其他会员（除芒果TV会员外）：售出商品为官方卡密，均不退不换。付款后，卡密将以短信形式发至您填写是手机号码中，请确保手机号码填写正确。<br />
				3、如因会员账号填写错误导致误充，或因输入错误的手机号码导致卡密信息泄露，系统不予退款，请您尝试联系充错的号码协商补偿。<br />
				4、如有疑问，请咨询客服：<a href="tel:4008386065">4008386065</a>
			</p>
			<a href="javascript: void(0)" class="explainbtn">知道了</a>
		</div>
	</div>
</body>
</html>