card.html 8.6 KB
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>月卡年卡</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-title" content="">
    <meta name="google" value="notranslate"><!-- 禁止Chrome 浏览器中自动提示翻译 -->
    <link rel="apple-touch-icon-precomposed" href="favicon.ico">
    <link rel="shortcut icon" href="favicon.ico">
    <link rel="Bookmark" href="favicon.ico">
    <link rel="stylesheet" href="//cdn.bootcss.com/weui/1.1.1/style/weui.min.css">
    <link rel="stylesheet" href="//cdn.bootcss.com/jquery-weui/1.0.1/css/jquery-weui.min.css">
    <link rel="stylesheet" href="${staticHost}/css/reset.css">
    <link rel="stylesheet" href="${staticHost}/css/card.css?v=1.0">
</head>
<body ontouchstart>
    <input type="hidden" id="pklNo" value="${pklNo!''}"/>
    <div class="weui-panel__bd card-top">
        <div class="weui-media-box weui-media-box_text weui-media-box-border card-park">
            <h4 class="weui-media-box__title park-tit" id="parkLotName"></h4>
            <p class="weui-media-box__desc park-desc" id="parkLotAddress"></p>
        </div>
        <div class="park-bg"></div>
    </div>

    <div class="weui-panel weui-panel_access month-mar" id="addCardMonth" style="display: none;">
        <!--  <div class="weui-panel__hd month-chtit">包月优惠</div>
        <div class="weui-panel__bd">
            <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg mon-vip">
                <div class="weui-media-box__hd monthcard-bg">
                    <img class="weui-media-box__thumb" src="${staticHost}/img/monthcard.png">
                </div>
                <div class="weui-media-box__bd car-font">
                    <h4 class="weui-media-box__title">蓝牌小车包月卡</h4>
                    <p class="weui-media-box__desc">单价:<span class="fontcol">¥90</span></p>
                </div>
                <div class="weui-cell__ft">
                </div>
            </a>
            <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg mon-vip">
                <div class="weui-media-box__hd monthcard-bg">
                    <img class="weui-media-box__thumb" src="${staticHost}/img/monthcard.png">
                </div>
                <div class="weui-media-box__bd car-font">
                    <h4 class="weui-media-box__title">黄牌大车包月卡</h4>
                    <p class="weui-media-box__desc">单价:<span class="fontcol">¥180</span></p>
                </div>
                <div class="weui-cell__ft">
                </div>
            </a>
        </div>-->
    </div>

    <div class="weui-panel weui-panel_access" id="addCardYear" style="display: none;">
        <!-- <div class="weui-panel__hd year-chtit">包年优惠</div>
        <div class="weui-panel__bd">
            <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg year-vip">
                <div class="weui-media-box__hd yearcard-bg">
                    <img class="weui-media-box__thumb" src="${staticHost}/img/yearcard.png">
                </div>
                <div class="weui-media-box__bd car-font">
                    <h4 class="weui-media-box__title">蓝牌小车包年卡</h4>
                    <p class="weui-media-box__desc">单价:<span class="fontcol">¥90</span></p>
                </div>
                <div class="weui-cell__ft">
                </div>
            </a>
            <a href="javascript:void(0);" class="weui-media-box weui-media-box_appmsg year-vip">
                <div class="weui-media-box__hd yearcard-bg">
                    <img class="weui-media-box__thumb" src="${staticHost}/img/yearcard.png">
                </div>
                <div class="weui-media-box__bd car-font">
                    <h4 class="weui-media-box__title">黄牌大车包年卡</h4>
                    <p class="weui-media-box__desc">单价:<span class="fontcol">¥180</span></p>
                </div>
                <div class="weui-cell__ft">
                </div>
            </a> -->
        </div>
    </div>
<script src="//cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
<script src="//cdn.bootcss.com/jquery-weui/1.0.1/js/jquery-weui.min.js"></script>
<script src="${staticHost}/js/jsutil.js"></script>
<script src="${staticHost}/js/url.js"></script>
<script type="text/javascript">

 var func ={
    //1.查询停车场月卡年卡信息
    queryParkLotCard:function(){
      	var pklNo =  $('#pklNo').val();
      	var jsonInfo ={};
      	jsonInfo.pklNo = pklNo;
      	 jsutil.defaultReq(
      			  mUrl.queryParkLotCard,
			      jsonInfo,
			      function(data){
					if("8888" ==data.code){
						var parkLot = data.data;
						$('#parkLotName').text(parkLot.parkName);
						$('#parkLotAddress').text(parkLot.address);
						//2.添加包年包月信息
						 var str ="";
						 var strYear ="";
						 str +=' <div class="weui-panel__hd month-chtit">包月优惠</div>';
				         str +='<div class="weui-panel__bd">';

				         strYear +='<div class="weui-panel__hd year-chtit">包年优惠</div>';
							str +='<div class="weui-panel__bd">';
						$.each(parkLot.parkCardCouponsList,function(i,n){
							if("22"==n.goods_type || "23"==n.goods_type ){//月卡
								$('#addCardMonth').show();
							            if("23"==n.goods_type){//小型月卡
							            	str +='<a href="javascript:void(0);" id="monthCardMin" class="weui-media-box weui-media-box_appmsg mon-vip" data-value="'+n.id+'">';
							            }else{
							            	str +='<a href="javascript:void(0);" id="monthCardMax" class="weui-media-box weui-media-box_appmsg mon-vip" data-value="'+n.id+'">';
							            }

									     str +='<div class="weui-media-box__hd monthcard-bg">';
									        str +='<img class="weui-media-box__thumb" src="${staticHost}/img/monthcard.png">';
						                 str +='</div>';
						                 str +='<div class="weui-media-box__bd car-font">';
						                      str +='<h4 class="weui-media-box__title">'+n.goods_type_remark+'</h4>';
						                      str +=' <p class="weui-media-box__desc">单价:<span class="fontcol">¥'+n.goods_amount+'</span></p>';
						                 str +='</div>';
						                 str +=' <div class="weui-cell__ft"></div>';
						                 str +='</a>';
							}else{
								$('#addCardYear').show();
								    if("20"==n.goods_type){
								    	strYear +='<a href="javascript:void(0);" id="yearCardMin" class="weui-media-box weui-media-box_appmsg year-vip" data-value="'+n.id+'">';
								    }else{
								    	strYear +='<a href="javascript:void(0);" id="yearCardMax" class="weui-media-box weui-media-box_appmsg year-vip" data-value="'+n.id+'">';
								    }

									          strYear +='<div class="weui-media-box__hd yearcard-bg">';
									              strYear +=' <img class="weui-media-box__thumb" src="${staticHost}/img/yearcard.png">';
									           strYear +='</div>';
									           strYear +='<div class="weui-media-box__bd car-font">';
									                strYear +='<h4 class="weui-media-box__title">'+n.goods_type_remark+'</h4>';
									                strYear +='<p class="weui-media-box__desc">单价:<span class="fontcol">¥'+n.goods_amount+'</span></p>';
									           strYear +='</div>';
									           strYear +='<div class="weui-cell__ft"></div>';
									strYear +='</a>';

							}
						});
						 str +='</div>';
						 strYear +='</div>';
						$('#addCardMonth').empty();
						$('#addCardMonth').html(str);
						$('#addCardYear').empty();
						$('#addCardYear').html(strYear);
					}else{
						 $.alert("亲!系统繁忙,请重新操作!");
						 return false;
					}
				 }
			  );
    },
    //办理月卡
    monthCardBuy:function(){
    	$(document).on('click','#monthCardMin,#monthCardMax',function(){
    		var id=$(this).attr('data-value');
    		 window.location.href=mUrl.monthOrderView+"&id="+id+"&data="+Math.random();

    	});
    },
    //办理年卡
    yearCardBuy:function(){
    	$(document).on('click','#yearCardMin,#yearCardMax',function(){
    		var id=$(this).attr('data-value');
    		 window.location.href=mUrl.yearOrderView+"&id="+id+"&data="+Math.random();

    	});
    }
 };
 $(function(){
	 func.queryParkLotCard();
	 func.monthCardBuy();
	 func.yearCardBuy();

 });
</script>
</body>
</html>