You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

297 lines
12 KiB
HTML

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>超级签购买界面</title>
<link href="__CSS__/ssg/common.css" rel="stylesheet" type="text/css">
<script src="__JS__/ssg/flexible.min.js" type="text/javascript"></script>
<script src="__JS__/ssg/juicer.min.js" type="text/javascript"></script>
</head>
<style>
body {
background-color: #F5F5F5;
}
.flexitem {
display: flex;
justify-content: flex-start;
align-items: center;
}
.title {
display: flex;
height: .9rem;
width: 100%;
justify-content: space-between;
align-items: center;
background-color: #21B1EB;
color: white;
font-size: .28rem;
}
.title img {
width: .3rem;
height: .3rem;
}
.borderitem::after {
/* margin-left: .24rem; */
height: 1px;
position: absolute;
z-index: 0;
bottom: 0;
left: 0;
content: "";
width: 100%;
background-image: -webkit-linear-gradient(bottom, #ececec 50%, transparent 0);
background-image: linear-gradient(0deg, #ececec 50%, transparent 0);
}
.shaddowbox {
background-color: #fff;
border-radius: .24rem;
box-shadow: 0px 0px 6px 0px rgba(89, 40, 8, 0.15);
}
input {
background-color: #F5F5F5;
}
.pay-button div{
margin:auto;width:5.6rem;height:1.34rem;background:url('__IMG__/ssg/index/paybt.png') no-repeat top center/cover;color: #fff;text-align: center;line-height: 1.1rem;font-size: .32rem;
}
.gamechoose{
width: .3rem;height: .3rem;
}
.gamenocheck{
background:url('__IMG__/ssg/index/nocheck.png') no-repeat top center/cover;
}
.gamecheck{
background:url('__IMG__/ssg/index/check.png') no-repeat top center/cover;
}
</style>
<body>
<div class="title">
<div class="flexitem" id="logout">
<img class="logout" src="__IMG__/ssg/index/logout.png" style="margin-left:.29rem;">
<div style="margin-left: 5px;">退出登入</div>
</div>
<div style="font-size: .32rem;font-weight: 600;">至尊版购买</div>
<div class="flexitem" style="margin-right:.29rem;" onclick="window.location.href='{:U(\'order\')}'">
<img class="order" src="__IMG__/ssg/index/order.png">
<div style="margin-left: 5px;">订单查询</div>
</div>
</div>
<div style="padding: .3rem;">
<div class="shaddowbox">
<div style="font-size: .28rem;color:#292929;position: relative;">
<div class="borderitem"
style="display: flex; justify-content: space-between;align-items:center;padding: 0 .3rem;line-height: .9rem;">
<div style="font-size: .32rem;">苹果超级签</div>
<div class="flexitem" style="color: #A9A9A9;" onclick="window.location.href='{:U(\'rule\')}'">
<div style="margin-right: 5px;">至尊版说明</div>
<img src="__IMG__/ssg/index/back.png" style="width:.3rem;height:.3rem;">
</div>
</div>
</div>
<div class="flexitem" style="height: 2.6rem;justify-content:center;">
<img class="order" src="__IMG__/ssg/index/ad.png" style="width: 6.3rem;height: 2rem;">
</div>
</div>
<div class="shaddowbox" style="margin-top: .3rem;">
<div style="font-size: .24rem;color:#292929;position: relative;">
<p style="padding: .3rem;">
1.选择游戏产品时,即选择购买超级签游戏下载链接和对应
的游戏礼包,无法退换哦~
</p>
<p style="padding:0 .3rem .3rem;">
2.同个账号多个设备需要去找客服那边购买。
</p>
</div>
</div>
<div class="shaddowbox" style="margin-top: .3rem;">
<div style="font-size: .28rem;color:#292929;position: relative;">
<div class="borderitem"
style="display: flex; justify-content: space-between;align-items:center;padding: 0 .3rem;line-height: .9rem;">
<div style="font-size: .32rem;">选择产品</div>
<div class="flexitem"
style="color: #A9A9A9;width:calc(100% - 2rem);width:-webkit-calc(100% - 2rem);width:-moz-calc(100% - 2rem);height: .6rem;background-color: #F5F5F5;border-radius: .3rem;">
<img src="__IMG__/ssg/index/select.png" style="width:.4rem;height: .4rem;margin-left: .17rem;">
<input id="selectVal" type="text" value=""
style="border: 0px;height: .6rem;font-size: .24rem;margin-left: .2rem;width:calc(100% - 1rem);width:-webkit-calc(100% - 1rem);width:-moz-calc(100% - 1rem);">
</div>
</div>
</div>
<!--游戏列表-->
<div style=" padding:0 .3rem .3rem;" id="gamebox">
<div style="text-align: center;font-size: .24rem;color: #a9a9a9;line-height: 5;">游戏数据获取中....</div>
</div>
</div>
<!---button--->
<div class="shaddowbox" style="margin-top: .3rem;">
<div style="font-size: .28rem;color:#292929;position: relative;" onclick="window.location.href='{:U(\'help\')}'">
<div class="borderitem"
style="display: flex; justify-content: space-between;align-items:center;padding: 0 .3rem;line-height: .9rem;">
<div style="font-size: .32rem;">支付未到账?</div>
<div class="flexitem" style="color: #A9A9A9;">
<div style="margin-right: 5px;">充值帮助</div>
<img src="__IMG__/ssg/index/back.png" style="width:.3rem;height:.3rem;">
</div>
</div>
</div>
<div style="font-size: .28rem;color:#292929;position: relative;" onclick="chatQQ()">
<div style="display: flex; justify-content: space-between;align-items:center;padding: 0 .3rem;line-height: .9rem;">
<div style="font-size: .32rem;">联系客服</div>
<div class="flexitem" style="color: #A9A9A9;">
<!-- <div style="margin-right: 5px;">至尊版说明</div> -->
<img src="__IMG__/ssg/index/back.png" style="width:.3rem;height:.3rem;">
</div>
</div>
</div>
</div>
</div>
<div style="margin:auto;width:100%;height:1.34rem;"></div>
<div class="pay-button">
<div>确认支付¥10</div>
</div>
</body>
<script type="text/template" id="gametpl">
{@each list as item,index}
<div class="gameitem flexitem" style="padding-top:.3rem ;justify-content: space-between;" data-game_id = "${item.game_id}">
<img src="${item.game_icon}" style="width: .7rem;height: .7rem;">
<div style="margin-left: .2rem;flex-grow: 1;">
<div class="flexitem">
<div style="font-size: .28rem;">${item.game_name}-超级签</div>
<img src="__IMG__/ssg/index/gif.png" style="width: .27rem;height: .27rem;margin-left: .2rem;">
</div>
<div style="color:#A9A9A9;font-size: .2rem;">
至尊特权礼包(限量)
</div>
</div>
{@if index==0}
<div class="gamechoose gamenocheck gamecheck"></div>
{@else}
<div class="gamechoose gamenocheck "></div>
{@/if}
</div>
{@/each}
</script>
<script src="__JS__/jquery-1.11.1.min.js" type="text/javascript"></script>
<script>
checkSafari();
var index = {
self :this,
select:{type:1},
choose:{},
pay_game_id:{},
getgamelist(){
$.ajax({
type: 'POST',
url: 'mobile.php?s=/Ssg/getGamaList.html',
dataType: 'JSON',
data:index.select,
success: function (result) {
console.log(result)
try {
if(result.pay_game_id){
index.pay_game_id = result.pay_game_id;
}
} catch (error) {}
index.jucierFun(result)
}
})
},
jucierFun(data){
var tpl = document.getElementById('gametpl').innerHTML;
var html = juicer(tpl, data);
$("#gamebox").html(html);
if(data["list"].length != 0){
index.choose.game_id = data['list'][0]['game_id']
}
index.event();
},
event(){
$(".gameitem").off("click");
$("#selectVal").off("keyup");
$(".gameitem").on("click",function(){
$(".gamechoose").removeClass("gamecheck");
$(this).find(".gamechoose").addClass("gamecheck");
var data = $(this).data();
index.choose.game_id = data.game_id;
})
$("#selectVal").on("keyup",function(){
index.select.game_name =$(this).val().replace(/\s*/g,"");
index.select.type = 0;
index.getgamelist()
})
}
}
index.getgamelist();
$(".pay-button").on("click",function(){
var inres = index.pay_game_id.indexOf(index.choose.game_id);
if(inres > -1){
alert("亲~您已购买过了~请到【订单查询】查看订单信息哟~");
}else{
location.href = "/sdk.php/Ipa365/pay/game_id/"+index.choose.game_id;
}
})
$("#logout").on("click",function(){
location.href = "mobile.php?s=/Ssg/logout.html";
})
function handlePay() {
var hdGameID = $("#hdGameID").val();
var orderStatus = $("#orderStatus").val();
if (!hdGameID || hdGameID == 0) {
alert("请选择游戏");
} else if(orderStatus==1){
alert("亲~您已购买过了~请到【订单查询】查看订单信息哟~");
}else {
location.href = "/sdk.php/Ipa365/pay/game_id/"+hdGameID;
}
}
function throttle(fun, delay) {
var timer = null;
var startTime = Date.now();
return function () {
var curTime = Date.now();
var remaining = delay - (curTime - startTime); //计算出两次触发的时间间隔有没有大余delay
var context = this;
var args = arguments;
clearTimeout(timer);
if (remaining <= 0) {
fun.apply(context, args);
startTime = Date.now(); //如果两次触发时间大余delay则立马触发一次任务函数并且更新起始时间戳
} else {
timer = setTimeout(fun, remaining); //如果两次触发时间小于delay 则改变定时器时间保证delay时间一定触发任务函数
}
}
}
function chatQQ() {
window.location.href = 'mqqwpa://im/chat?chat_type=wpa&uin={$app_qq}&version=1&src_type=web&web_src=oicqzone.com';
}
function checkSafari() {
var ua = navigator.userAgent.toLowerCase();
//判断是不是在iPhone的Safair浏览器打开的本页面
if (ua.indexOf('applewebkit') > -1 && ua.indexOf('mobile') > -1 && ua.indexOf('safari') > -1 &&
ua.indexOf('linux') === -1 && ua.indexOf('android') === -1 && ua.indexOf('chrome') === -1 &&
ua.indexOf('ios') === -1 && ua.indexOf('browser') === -1) {
return true;
}
else {
alert("请使用iPhone中的Safari浏览器打开本页面");
window.location.href = 'mobile.php?s=/Ssg/home.html';
}
}
</script>
</html>