<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title><?php echo $data['gname'].$data['title'].$this->config['sitename'];?></title>
<meta name="description" content="<?php echo $this->config['description']?>">
<meta name="keywords" content="<?php echo $this->config['keyword']?>">
<style type="text/css">
.pay_box{
    width: 100%;
    background: #fff;
    border-radius:4px;
}
.pay_menu{
    position: relative;
    height:44px;
    line-height:44px;
    background:#f5f6f9;
    overflow:hidden;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border: 1px solid #eee;
    border-bottom: none;
    color: #33334f;
    font-size: 14px;
}
.pay{
    float:left;
    height:44px;
    padding:0 50px;
    text-align:center;
    cursor:pointer;
}
.checked1{
    background:#648ff7;
    color:#fff;
}
.pay_list1,.pay_list2{
    padding:18px 0 8px 18px;
    border: 1px solid #eee;
    border-top:none;
}
.check_pay{
    display:block;
    width:180px;
    line-height:48px;
    height:48px;
    text-align:center;
    border: none;
    color:#fff;
    background: #f97c73;
    margin:40px auto 20px auto;
    cursor:pointer;
    font-size:16px;
    border-radius: 2px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.14);
    transition: .2s;
}
.check_pay:hover{
    background: #fa655a;
}
.lab3{
    display:inline-block;
    width:160px;
    padding:10px 0px;
    text-align:center;
    background: #fff;
    border-radius: 2px;
    cursor:pointer;
    font-size:14px;
    margin:0 12px 10px 2px;
    transition:ease 0.2s;
    border: 1px solid transparent;
}
.lab3 input[type=radio]{
    display:none;
}
.lab3:hover{
    border: 1px solid #648ff7;
}
.checked2{
    position: relative;
    border: 1px solid #648ff7;
}
.checked2:after{
    content: '';
    position: absolute;
    left: 0;
    top:0;
    display: block;
    width: 0;
    height: 0;
    border-top: 12px solid #648ff7;
    border-right: 12px solid transparent;
}
.spsm {
    position: absolute;
    right: 0;
    top: -22px;
    font-size: 12px;
    color: #648ff7;
    font-weight: bold;
}
.all_pay{
    position: absolute;
    right: 15px;
    text-align: center;
    font-size: 18px;
    color: #f97c73;
}
.all_pay i{
    font-size: 28px;
    vertical-align: middle;
}
#paysubmit{
    width: 50%;
    background-color: #2e8ded;
    
}
</style>
<link id="layuicss-skinlayercss" rel="stylesheet" href="https://lib.baomitu.com/layer/2.3/skin/layer.css" media="all">
	<link rel="stylesheet" href="https://lib.baomitu.com/amazeui/2.7.2/css/amazeui.min.css">
	<script src="https://lib.baomitu.com/jquery/2.0.3/jquery.min.js"></script>
	<script src="https://lib.baomitu.com/layer/2.3/layer.js"></script>
</head> 
<body>
<div align="center"><!--商品 -->
    <p style="width: 750px;text-align: center;font-size: 18px;color:green;font-size:20px;" id="pay_p">确认商品信息</p>
    <p class="detail" style="color:#2e8ded;">商品名称：<font color="red"><?php echo $data['gname'];?></font></p>
    <p class="detail" style="color:#2e8ded;">商品单价：<span class="price" id="price"><?php echo $data['price'];?></span> </p>
    <p class="detail" name="zongjia" style="color:#2e8ded;">付款金额：<span class="price" id="total"></span></p>
  <form name="myform" id="myform" action="" method="post" target="_blank">
    <p class="detail" style="color:#2e8ded;">购买数量  <input type="number" id="number" name="number" min="1" max="10000" value="1" class="othbox"  pattern="^-?(?:\d+|\d{1,3}(?:,\d{3})+)?(?:\.\d+)?$" required="required" onchange="func()"></p>
     <?php
     //判断是否是自动发卡
        if ($data['type'] != 1) {
            $html = "<p class=\"detail\" style=\"color:#2e8ded;\">联系方式：<input type=\"text\" name=\"account\" id=\"account\"  lay-verify=\"required\" placeholder=\"QQ号码或者电话\" autocomplete=\"off\" class=\"layui-input\"></p>";

        }else{
        	//手工订单
            $html = "<p class=\"detail\" style=\"color:#2e8ded;\">".$data['onetle'].":<input type=\"text\" id=\"account\" name=\"account\"  lay-verify=\"required\"  autocomplete=\"off\" class=\"layui-input\"></p>";
            $ripu = explode(',',$data['gdipt']);
            if($ripu[0]){
                $ipu = 1;
                foreach ($ripu as $v){
                    $html.="<p class=\"detail\" style=\"color:#2e8ded;\">".$v.":<input type=\"text\" id=\"ipu".$ipu."\" name=\"ipu".$ipu."\" lay-verify=\"required\"  class=\"layui-input\"></p>";
                    $ipu = $ipu+1;
                }
            }
        }
        echo $html;
        ?>
    	<div style="width: 750px;text-align: center;height: 50px;">    		
    		<input type="hidden" name="shuliang" value="1">
            <input type="hidden" id="paytype" name="paytype" value="alipay">
    		<input type="hidden" value="<?php echo $data['id'];?>"  id="glist" name="gid">
    		<?php if($this->config['pay_alipay']!="0"){ ?>
            <label class="lab3 checked2" for="pay_item_13">
                <input name="pid" id="pay_item_13" value="13" data-bank="alipay" type="radio">
                <img src="/static/pay/images/icon_zfb.jpg">
            </label>
            	<?php }  if($this->config['pay_wxpay']!="0"){ ?>
            <label class="lab3" for="pay_item_14">
                <input name="pid" id="pay_item_14" value="14" data-bank="wxpay" type="radio">
                <img src="/static/pay/images/icon_wx.jpg">
            </label>
            	<?php } ?>
                
        <button type="button" class="am-btn am-btn-primary am-btn-ml am-square am-center" onclick="buyOrder()" id="paysubmit" ><span class="am-icon-shopping-cart"></span>立即购买</button>
        <hr>
        <div class="detail">
           <?php echo $data['cont'];?>  
       </div>
       
    </div>
</div>
<script>

<?php
 if(mb_strlen($data['noti'],"utf-8")>5){	
				echo "layer.open({
					  type: 1, 
					  title: '购买提醒',
					  skin: 'layui-layer-demo',
					  closeBtn: 0,
					  anim: 2,
					  shadeClose: true,
					  content: '".$this->jsformat($data['noti'])."',
					  btn: '我知道了'
					});"; 
	}  
?>

 
$(function(){
			 $("input[name=shuliang]").val(1)
			 var vs =$("input[name=shuliang]").val();
			 var price = $('#price').text()
			  $('#total').text(vs*price)
	  
        $(".lab3").click(function () {
            $(this).children('input').attr('checked', true);
            $(this).siblings("label").children('input').attr('checked', false);
            $(this).siblings("label").removeClass("checked2");
            $(this).addClass("checked2");
            var bankid = $(this).children('input').data('bank');
            $('input[name="paytype"]').val(bankid);
        });
})

function func(){
	 //获取被选中的option标签
	 var vs =  $('#number').val();
	 var price = $('#price').text()
	 var sum = vs*price;
	 $('#total').text(sum+'元')
	 $("input[name=shuliang]").val(vs)
}


/**
 * 提交订单
 */
function buyOrder() {
    var gid = $("#glist").val();
    var number = $("#number").val();
    var account = $("#account").val();
    var paytype = $("#paytype").val();
    var ipu1 = $("#ipu1").val();
    var ipu2 = $("#ipu2").val();
    var ipu3 = $("#ipu3").val();
    var ipu4 = $("#ipu4").val();
    $.ajax({
        url: '/buy/postOrder',
        type: 'POST',
        dataType: 'json',
        data: {
            gid: gid,
            number: number,
            account: account,
            paytype: paytype,
            ipu1: ipu1,
            ipu2: ipu2,
            ipu3: ipu3,
            ipu4: ipu4
        },
        beforeSend: function () {
            layer.load(1);
        },
        success: function (result) {
            layer.closeAll();
            if (result.status == 0) {
                layer.alert(result.msg, {icon: 2})
            } else if (result.status == 2) {
                layer.alert(result.msg, {icon: 6})
            } else if (result.status == 999) {
            	window.location.href=result.data;
            } else {
               layer.open({
                type: 1,
				title: result.msg,
                content: result.data,
                anim: 4,
  				shade: 0.1, //遮罩透明度
                area: ['50%', '50%'],
                maxmin: true
              });
              
              
            }

        }
    });
}

</script>
</body></html>