|
|
|
@ -12,17 +12,17 @@
|
|
|
|
|
<script src="__JS__/ssg/juicer.min.js" type="text/javascript"></script>
|
|
|
|
|
</head>
|
|
|
|
|
<style>
|
|
|
|
|
body {
|
|
|
|
|
.index-box {
|
|
|
|
|
background-color: #F5F5F5;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.flexitem {
|
|
|
|
|
.index-box .flexitem {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: flex-start;
|
|
|
|
|
align-items: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
|
.index-box .title {
|
|
|
|
|
display: flex;
|
|
|
|
|
height: .9rem;
|
|
|
|
|
width: 100%;
|
|
|
|
@ -32,13 +32,26 @@
|
|
|
|
|
color: white;
|
|
|
|
|
font-size: .28rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.title img {
|
|
|
|
|
.index-box .title .logout{
|
|
|
|
|
margin-left:.29rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .title .back div{
|
|
|
|
|
margin-left: 5px;
|
|
|
|
|
}
|
|
|
|
|
.index-box .title img {
|
|
|
|
|
width: .3rem;
|
|
|
|
|
height: .3rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.borderitem::after {
|
|
|
|
|
.index-box .title .content{
|
|
|
|
|
font-size: .32rem;font-weight: 600;
|
|
|
|
|
}
|
|
|
|
|
.index-box .title .orderbox{
|
|
|
|
|
margin-right:.29rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .title .orderbox div{
|
|
|
|
|
margin-left: 5px;
|
|
|
|
|
}
|
|
|
|
|
.index-box .borderitem::after {
|
|
|
|
|
/* margin-left: .24rem; */
|
|
|
|
|
height: 1px;
|
|
|
|
|
position: absolute;
|
|
|
|
@ -51,61 +64,104 @@
|
|
|
|
|
background-image: linear-gradient(0deg, #ececec 50%, transparent 0);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.shaddowbox {
|
|
|
|
|
.index-box .shaddowbox {
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
border-radius: .24rem;
|
|
|
|
|
box-shadow: 0px 0px 6px 0px rgba(89, 40, 8, 0.15);
|
|
|
|
|
}
|
|
|
|
|
.index-box .allitembox{
|
|
|
|
|
padding: .3rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .allitembox .title-cell{
|
|
|
|
|
font-size: .28rem;color:#292929;position: relative;
|
|
|
|
|
}
|
|
|
|
|
/* .index-box .allitembox .title-cell >div{
|
|
|
|
|
|
|
|
|
|
input {
|
|
|
|
|
} */
|
|
|
|
|
.index-box .allitembox .title-cell .borderitem{
|
|
|
|
|
display: flex; justify-content: space-between;align-items:center;padding: 0 .3rem;line-height: .9rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .allitembox .aditem .adimg{
|
|
|
|
|
height: 2.6rem;justify-content:center;
|
|
|
|
|
}
|
|
|
|
|
.index-box .allitembox .aditem .adimg img{
|
|
|
|
|
width: 6.3rem;height: 2rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box input {
|
|
|
|
|
background-color: #F5F5F5;
|
|
|
|
|
}
|
|
|
|
|
.pay-button div{
|
|
|
|
|
.index-box .maringtop3rem{
|
|
|
|
|
margin-top: .3rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .title-name{
|
|
|
|
|
font-size: .32rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .a9color{
|
|
|
|
|
color: #A9A9A9;
|
|
|
|
|
}
|
|
|
|
|
.index-box .wh3rem{
|
|
|
|
|
width: .3rem;height: .3rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .inputbox{
|
|
|
|
|
color: #A9A9A9;width:calc(100% - 2rem);width:-webkit-calc(100% - 2rem);width:-moz-calc(100% - 2rem);height: .6rem;background-color: #F5F5F5;border-radius: .3rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .inputbox img{
|
|
|
|
|
width:.4rem;height: .4rem;margin-left: .17rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .inputbox input{
|
|
|
|
|
border: 0px;height: .6rem;font-size: .24rem;margin-left: .2rem;width:calc(100% - 1rem);width:-webkit-calc(100% - 1rem);width:-moz-calc(100% - 1rem);
|
|
|
|
|
}
|
|
|
|
|
.index-box .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{
|
|
|
|
|
.index-box .gameitem{
|
|
|
|
|
padding-top:.3rem ;justify-content: space-between;
|
|
|
|
|
}
|
|
|
|
|
.index-box .gameitem .gameimg{
|
|
|
|
|
width: .7rem;height: .7rem;
|
|
|
|
|
}
|
|
|
|
|
.index-box .gamechoose{
|
|
|
|
|
width: .3rem;height: .3rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.gamenocheck{
|
|
|
|
|
background:url('__IMG__/ssg/index/nocheck.png') no-repeat top center/cover;
|
|
|
|
|
.index-box .gamenocheck{
|
|
|
|
|
background:url('__IMG__/ssg/index/nocheck.png') no-repeat top center/100% 100%;
|
|
|
|
|
}
|
|
|
|
|
.gamecheck{
|
|
|
|
|
background:url('__IMG__/ssg/index/check.png') no-repeat top center/cover;
|
|
|
|
|
.index-box .gamecheck{
|
|
|
|
|
background:url('__IMG__/ssg/index/check.png') no-repeat top center/100% 100%;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<body class="index-box">
|
|
|
|
|
|
|
|
|
|
<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 class="flexitem back" id="logout">
|
|
|
|
|
<img class="logout" src="__IMG__/ssg/index/logout.png">
|
|
|
|
|
<div>退出登入</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="font-size: .32rem;font-weight: 600;">至尊版购买</div>
|
|
|
|
|
<div class="flexitem" style="margin-right:.29rem;" onclick="window.location.href='{:U(\'order\')}'">
|
|
|
|
|
<div class="content">至尊版购买</div>
|
|
|
|
|
<div class="flexitem orderbox" onclick="window.location.href='{:U(\'order\')}'">
|
|
|
|
|
<img class="order" src="__IMG__/ssg/index/order.png">
|
|
|
|
|
<div style="margin-left: 5px;">订单查询</div>
|
|
|
|
|
<div>订单查询</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 class="allitembox">
|
|
|
|
|
<div class="shaddowbox aditem">
|
|
|
|
|
<div class="title-cell">
|
|
|
|
|
<div class="borderitem">
|
|
|
|
|
<div class="title-name">苹果超级签</div>
|
|
|
|
|
<div class="flexitem a9color" onclick="window.location.href='{:U(\'rule\')}'">
|
|
|
|
|
<div style="margin-right: 5px;">至尊版说明</div>
|
|
|
|
|
<img src="__IMG__/ssg/index/back.png" style="width:.3rem;height:.3rem;">
|
|
|
|
|
<img class="wh3rem" src="__IMG__/ssg/index/back.png">
|
|
|
|
|
</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 class="flexitem adimg">
|
|
|
|
|
<img class="order" src="__IMG__/ssg/index/ad.png">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="shaddowbox" style="margin-top: .3rem;">
|
|
|
|
|
<div style="font-size: .24rem;color:#292929;position: relative;">
|
|
|
|
|
<div class="shaddowbox maringtop3rem">
|
|
|
|
|
<div class="title-cell" style="font-size: .24rem;">
|
|
|
|
|
<p style="padding: .3rem;">
|
|
|
|
|
1.选择游戏产品时,即选择购买超级签游戏下载链接和对应
|
|
|
|
|
的游戏礼包,无法退换哦~
|
|
|
|
@ -115,16 +171,13 @@
|
|
|
|
|
</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 class="shaddowbox maringtop3rem">
|
|
|
|
|
<div class="title-cell">
|
|
|
|
|
<div class="borderitem">
|
|
|
|
|
<div class="title-name">选择产品</div>
|
|
|
|
|
<div class="flexitem inputbox">
|
|
|
|
|
<img src="__IMG__/ssg/index/select.png">
|
|
|
|
|
<input id="selectVal" type="text" value="">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
@ -135,23 +188,21 @@
|
|
|
|
|
</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 class="shaddowbox maringtop3rem">
|
|
|
|
|
<div class="title-cell" onclick="window.location.href='{:U(\'help\')}'">
|
|
|
|
|
<div class="borderitem">
|
|
|
|
|
<div class="title-name">支付未到账?</div>
|
|
|
|
|
<div class="flexitem a9color">
|
|
|
|
|
<div style="margin-right: 5px;">充值帮助</div>
|
|
|
|
|
<img src="__IMG__/ssg/index/back.png" style="width:.3rem;height:.3rem;">
|
|
|
|
|
<img class="wh3rem" src="__IMG__/ssg/index/back.png">
|
|
|
|
|
</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 class="title-cell" onclick="chatQQ()">
|
|
|
|
|
<div class="borderitem">
|
|
|
|
|
<div class="title-name">联系客服</div>
|
|
|
|
|
<div class="flexitem a9color">
|
|
|
|
|
<img class="wh3rem" src="__IMG__/ssg/index/back.png">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -164,9 +215,9 @@
|
|
|
|
|
</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="gameitem flexitem" data-game_id = "${item.game_id}">
|
|
|
|
|
<img class="gameimg" src="${item.game_icon}">
|
|
|
|
|
<div class="" 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;">
|
|
|
|
|