liut
150 lines
6.1 KiB
HTML
150 lines
6.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Document</title>
|
|
<link href="__STATIC__/pan/shouyi/theme.css" rel="stylesheet">
|
|
<script src="__STATIC__/js/jquery.js"></script>
|
|
<script src="__STATIC__/js/lay/modules/layer.js"></script>
|
|
<script src="__STATIC__/pan/shouyi/bootstrap.js"></script>
|
|
</head>
|
|
<body>
|
|
<style>
|
|
@media (max-width : 500px) {
|
|
.modal-dialog {
|
|
margin: 0rem;
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
|
|
.modal-content {
|
|
border: 0;
|
|
border-radius: 0.375rem 0.375rem 0 0;
|
|
outline: 0;
|
|
}
|
|
|
|
.modal.fade .modal-dialog {
|
|
transform: translate3d(0, 100vh, 0);
|
|
}
|
|
|
|
.modal.show .modal-dialog {
|
|
transform: translate3d(0, 0, 0);
|
|
}
|
|
|
|
|
|
}
|
|
|
|
.mb_vip_item.active {
|
|
background-color: rgba(115, 255, 236, 0.18)
|
|
}
|
|
</style>
|
|
|
|
<div class="modal-dialog" role="document" style="max-width: 550px;">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">开通VIP会员</h5>
|
|
{eq name="$is_layer" value="0"}
|
|
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
|
|
<span class="font-weight-light" aria-hidden="true">×</span>
|
|
</button>
|
|
{/eq}
|
|
</div>
|
|
<div class="modal-body p-3">
|
|
<div id="mb_vip_selection">
|
|
|
|
{volist name="$rule" id="vo"}
|
|
<div class="mb_vip_item d-flex justify-content-between py-3 px-2"
|
|
onclick="mb_switch_vip({$vo.id});" data-vip="{$vo.id}">
|
|
<div class=" ">
|
|
<span class="font-weight-normal my-0">{$vo.name}</span>
|
|
<span class="badge badge-soft-success badge-pill ml-1">限时{$vo.discount}折</span>
|
|
<p class="fs--1 mb-0">{$vo.desc}</p>
|
|
</div>
|
|
<div class=" ">
|
|
<h3 class="font-weight-medium my-1"> {$vo.money}<small class="fs--1 text-700">元
|
|
/ {$vo.day_name}</small> </h3>
|
|
</div>
|
|
</div>
|
|
{/volist}
|
|
</div>
|
|
<h5 class="text-center mb-3">选择购买方式</h5>
|
|
<div class="text-center">
|
|
<button onclick="zhifu('alipay');" class="btn btn-lg btn-falcon-primary mr-4">
|
|
<svg class="svg-inline--fa fa-alipay fa-w-14 mr-2" aria-hidden="true" focusable="false"
|
|
data-prefix="fab" data-icon="alipay" role="img" xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 448 512" data-fa-i2svg="">
|
|
<path fill="currentColor"
|
|
d="M377.74 32H70.26C31.41 32 0 63.41 0 102.26v307.48C0 448.59 31.41 480 70.26 480h307.48c38.52 0 69.76-31.08 70.26-69.6-45.96-25.62-110.59-60.34-171.6-88.44-32.07 43.97-84.14 81-148.62 81-70.59 0-93.73-45.3-97.04-76.37-3.97-39.01 14.88-81.5 99.52-81.5 35.38 0 79.35 10.25 127.13 24.96 16.53-30.09 26.45-60.34 26.45-60.34h-178.2v-16.7h92.08v-31.24H88.28v-19.01h109.44V92.34h50.92v50.42h109.44v19.01H248.63v31.24h88.77s-15.21 46.62-38.35 90.92c48.93 16.7 100.01 36.04 148.62 52.74V102.26C447.83 63.57 416.43 32 377.74 32zM47.28 322.95c.99 20.17 10.25 53.73 69.93 53.73 52.07 0 92.58-39.68 117.87-72.9-44.63-18.68-84.48-31.41-109.44-31.41-67.45 0-79.35 33.06-78.36 50.58z">
|
|
</path>
|
|
</svg>支付宝</button>
|
|
|
|
<button onclick="zhifu('wxpay');" class="btn btn-lg btn-falcon-success"><!--span class="fab fa-weixin mr-2"></span>-->
|
|
<svg class="svg-inline--fa fa-weixin fa-w-18 mr-2"
|
|
aria-hidden="true" focusable="false" data-prefix="fab" data-icon="weixin" role="img"
|
|
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" data-fa-i2svg="">
|
|
<path fill="currentColor"
|
|
d="M385.2 167.6c6.4 0 12.6.3 18.8 1.1C387.4 90.3 303.3 32 207.7 32 100.5 32 13 104.8 13 197.4c0 53.4 29.3 97.5 77.9 131.6l-19.3 58.6 68-34.1c24.4 4.8 43.8 9.7 68.2 9.7 6.2 0 12.1-.3 18.3-.8-4-12.9-6.2-26.6-6.2-40.8-.1-84.9 72.9-154 165.3-154zm-104.5-52.9c14.5 0 24.2 9.7 24.2 24.4 0 14.5-9.7 24.2-24.2 24.2-14.8 0-29.3-9.7-29.3-24.2.1-14.7 14.6-24.4 29.3-24.4zm-136.4 48.6c-14.5 0-29.3-9.7-29.3-24.2 0-14.8 14.8-24.4 29.3-24.4 14.8 0 24.4 9.7 24.4 24.4 0 14.6-9.6 24.2-24.4 24.2zM563 319.4c0-77.9-77.9-141.3-165.4-141.3-92.7 0-165.4 63.4-165.4 141.3S305 460.7 397.6 460.7c19.3 0 38.9-5.1 58.6-9.9l53.4 29.3-14.8-48.6C534 402.1 563 363.2 563 319.4zm-219.1-24.5c-9.7 0-19.3-9.7-19.3-19.6 0-9.7 9.7-19.3 19.3-19.3 14.8 0 24.4 9.7 24.4 19.3 0 10-9.7 19.6-24.4 19.6zm107.1 0c-9.7 0-19.3-9.7-19.3-19.6 0-9.7 9.7-19.3 19.3-19.3 14.5 0 24.4 9.7 24.4 19.3.1 10-9.9 19.6-24.4 19.6z">
|
|
</path>
|
|
</svg>微信支付</button>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
{eq name="$is_layer" value="0"}
|
|
<button class="btn btn-secondary" type="button" data-dismiss="modal">关闭</button>
|
|
{/eq}
|
|
<a href="javascript:;" onclick="vip_kefu()" class="btn btn-primary">联系客服</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script>
|
|
var vip_id = "";
|
|
|
|
function vip_kefu() {
|
|
layer.alert("{$Think.config.basic.site_kefu|raw}", { title: '联系客服' });
|
|
}
|
|
|
|
function zhifu(pay_type){
|
|
|
|
layer.open({
|
|
type: 2,
|
|
title: '支付页面',
|
|
closeBtn: 1,
|
|
area: ['100%', '100%'], // 宽高
|
|
content: "/user/payment?pay_type="+pay_type+"&vip="+vip_id + "&share_id={$share_id}",
|
|
end: function () {
|
|
//设置订单为已关闭
|
|
$.get("/user/vip_close");
|
|
},
|
|
cancel:function(index){
|
|
//eg1
|
|
layer.confirm('确定要取消支付吗？ 求求你了(〒︿〒)', {icon: 3}, function(index2){
|
|
layer.close(index2);
|
|
layer.confirm('真的要关闭吗？ ..(｡•ˇ‸ˇ•｡)…', {icon: 3}, function(index2){
|
|
layer.close(index2);
|
|
layer.close(index);
|
|
layer.msg("好吧... (╯︵╰)");
|
|
});
|
|
});
|
|
return false;
|
|
},
|
|
});
|
|
|
|
}
|
|
|
|
function mb_switch_vip(id) {
|
|
$("#mb_vip_selection > div.active").removeClass("active");
|
|
var xx = $("#mb_vip_selection > div:eq("+id+")");
|
|
xx.addClass("active");
|
|
vip_id = xx.attr("data-vip");
|
|
}
|
|
mb_switch_vip(2);
|
|
</script>
|
|
</body>
|
|
</html> |