diff --git a/Application/Mobile/View/User/recharge.html b/Application/Mobile/View/User/recharge.html index 2cc1b98de..6d97b7e9d 100644 --- a/Application/Mobile/View/User/recharge.html +++ b/Application/Mobile/View/User/recharge.html @@ -1,794 +1,124 @@ - - - - - - - - + + + + + + + 充值中心 + + + + + + - -
- -
- - href="{:$_SERVER["HTTP_REFERER"]}" href="{:U('User/index')}" class="hbtn back"> - -

账户充值

- -
- -
- -
- -
- -
- - - -
- -
- -
- -
- -
    - -
  • - - 充值账户 - - - - - - - -
    • - -
  • - - 充值金额 - - - - - - - -
    • - -
  • - - 获得平台币 - - - - - -
    • - -
- -
- -
- -
    - -
  • - - - - - - 请选择支付方式 - - - - - -
    • - -
  • - - - - - - - - 支付宝 - - 支付宝安全支付 - - - - - - - - - - - -
    • - -
  • - - - - - - - - 微信支付 - - 支持微信4.2以上版本支付 - - - - - - - - - - - -
    • - - - -
  • - - - - - - - - 金猪支付 - - 支持多种支付 - - - - - - - - - - - -
    • - -     - -
- -
- -
- - - -
- - - -
- -
- -
- -
- -
- -
    - -
  • - - 充值账户 - - - - - - - -
    • - -
  • - - 选择游戏 - - - -
    - - - -
    - -     - -
    • - -
  • - - 充值金额 - - - - - - - -
    • - -
  • - - 折扣比例 - - - - - - - - - -
    • - -
  • - - 实付金额 - - - - - - - -
    • - -
  • - - 获得绑币 - - - - - - - -
    • - -
- -
- -
- -
    - -
  • - - - - - - 请选择支付方式 - - - - - -
    • - -
  • - - - - - - - - 支付宝 - - 支付宝安全支付 - - - - - - - - - - - -
    • - -
  • - - - - - - - - 微信支付 - - 支持微信4.2以上版本支付 - - - - - - - - - - - -
    • - - - -
  • - - - - - - - - 金猪支付 - - 支持多种支付 - - - - - - - - - - - -
    • - -     - -
- -
- -
- - - -
- - - -
- -
- +
+
+ +
充值中心 +
+
+
  • 平台币充值
    • +
  • 折扣充值
    • +
    +
    +
    +
    +
    +
    +
    充值账户
    + {:session('suser_auth.account')} +
    +
    +
    +
    +
    充值金额
    + +
    +
    +
    +
    +
    充值账户
    + 22 +
    +
    +
    + +
    +
    +
    请选择支付方式
    +
    +
    + +
    +
    支付宝支付
    +
    推荐支付宝用户使用
    +
    +
    + +
    + + +
    -
    - -
    - -
    - - - - - - - - - -     - - - \ No newline at end of file + +
    +
    + +
    +
    微信支付
    +
    推荐微信用户使用
    +
    +
    +
    + + +
    +
    + +
    立即充值
    + + + + \ No newline at end of file diff --git a/Application/Mobile/View/User/recharge1.html b/Application/Mobile/View/User/recharge1.html new file mode 100644 index 000000000..2cc1b98de --- /dev/null +++ b/Application/Mobile/View/User/recharge1.html @@ -0,0 +1,794 @@ + + + + + + + + + + +
    + +
    + + href="{:$_SERVER["HTTP_REFERER"]}" href="{:U('User/index')}" class="hbtn back"> + +

    账户充值

    + +
    + +
    + +
    + +
    + +
    + + + +
    + +
    + +
    + +
    + +
      + +
    • + + 充值账户 + + + + + + + +
      • + +
    • + + 充值金额 + + + + + + + +
      • + +
    • + + 获得平台币 + + + + + +
      • + +
    + +
    + +
    + +
      + +
    • + + + + + + 请选择支付方式 + + + + + +
      • + +
    • + + + + + + + + 支付宝 + + 支付宝安全支付 + + + + + + + + + + + +
      • + +
    • + + + + + + + + 微信支付 + + 支持微信4.2以上版本支付 + + + + + + + + + + + +
      • + + + +
    • + + + + + + + + 金猪支付 + + 支持多种支付 + + + + + + + + + + + +
      • + +       + +
    + +
    + +
    + + + +
    + + + +
    + +
    + +
    + +
    + +
    + +
      + +
    • + + 充值账户 + + + + + + + +
      • + +
    • + + 选择游戏 + + + +
      + + + +
      + +       + +
      • + +
    • + + 充值金额 + + + + + + + +
      • + +
    • + + 折扣比例 + + + + + + + + + +
      • + +
    • + + 实付金额 + + + + + + + +
      • + +
    • + + 获得绑币 + + + + + + + +
      • + +
    + +
    + +
    + +
      + +
    • + + + + + + 请选择支付方式 + + + + + +
      • + +
    • + + + + + + + + 支付宝 + + 支付宝安全支付 + + + + + + + + + + + +
      • + +
    • + + + + + + + + 微信支付 + + 支持微信4.2以上版本支付 + + + + + + + + + + + +
      • + + + +
    • + + + + + + + + 金猪支付 + + 支持多种支付 + + + + + + + + + + + +
      • + +       + +
    + +
    + +
    + + + +
    + + + +
    + +
    + +
    + +
    + +
    + +
    + + + + + + + + + +     + + + \ No newline at end of file diff --git a/Public/Mobile/css/recharge.css b/Public/Mobile/css/recharge.css new file mode 100644 index 000000000..99d216ded --- /dev/null +++ b/Public/Mobile/css/recharge.css @@ -0,0 +1,209 @@ +.recharge{ + width: 100%; + font-family:PingFang SC; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} +.recharge-heard{ + width: 100%; + height: 4.12rem; + background: url("../images/background.png"); + background-size: 100% 100%; +} +.subpage-heard{ + background-color: transparent; +} +.recharge-tabbar{ + margin-top: 0.1rem; + display: flex; + align-items: center; + justify-content: center; +} +.recharge-tabbar li{ + font-size:0.28rem; + font-weight:400; + color:rgba(255,255,255,1); + list-style: none; +} +.recharge-tabbar li:last-child{ + margin-left: 1.10rem; +} +.recharge-tabbar .selected{ + font-size: 0.32rem; + -webkit-transition: all 250ms ease; + transition: all 250ms ease; +} +.content{ + margin-top: -2rem; +} +.recharge-flat{ + padding-top: 0.36rem; + width: 7.1rem; + height: 2.74rem; + background: url("../images/juxing3.png"); + background-size: 100% 100%; +} +.recharge-discount{ + padding-top: 0.36rem; + width: 7.1rem; + height: 5.4rem; + background: url("../images/juxing4.png"); + background-size: 100% 100%; +} +.flat-box{ + padding: 0 0.12rem; +} +.flat-info{ + padding: 0.31rem 0.3rem; + height: 0.26rem; + font-size:0.28rem; + font-weight:500; + color:rgba(41,41,41,1); + display: flex; + align-items: center; + justify-content: space-between; + border-bottom: 1px solid #F5F5F5; +} +.flat-info>span{ + font-size:0.24rem; + font-weight:400; + color:rgba(169,169,169,1); +} +.flat-info>input{ + height: 0.24rem; + font-size: 0.24rem; + outline: 0; + border: 0; + width: 2.77rem; +} +.flat-info>input::placeholder{ + color: #A9A9A9; +} +.recharge-flat .flat-box:last-child .flat-info{ + border: none; +} +.recharge-discount .flat-box:last-child .flat-info{ + border: none; +} +.flat-info select { + background: transparent; + padding: 0.05rem; + font-size: 0.24rem; + border: 1px solid #ccc; + text-align: center; + outline: 0; + border: 0; + color: #A9A9A9; +} +.recharge-payment{ + margin-top: 0.15rem; + width: 6.9rem; + height: 3.76rem; + background:rgba(255,255,255,1); + box-shadow:0px 0px 0.1rem 0px rgba(26,26,26,0.15); + border-radius:0.2rem; +} +.recharge-payment .title{ + padding: 0.32rem 0.29rem; + font-size:0.28rem; + font-weight:500; + color:rgba(41,41,41,1); + border-bottom: 1px solid #F5F5F5; +} +.recharge-payment .alipay{ + padding: 0.29rem 0.3rem; + display: flex; + align-items: center; + justify-content: space-between; + border-bottom:1px solid #F5F5F5; +} +.recharge-payment .alipay:last-child{ + border: none; +} +.recharge-payment .alipay .alipay_img{ + display: flex; + align-items: center; +} +.recharge-payment .alipay .alipay_img>img{ + width: 0.8rem; + height: 0.8rem; +} +.recharge-payment .alipay .alipay_img .img_text{ + margin-left: 0.16rem; + font-size: 0.28rem; + font-weight:500; + color:rgba(41,41,41,1); +} +.recharge-payment .alipay .alipay_img .img_text>div:last-child{ + font-weight:400; + color:rgba(169,169,169,1); + font-size: 0.2rem; +} +.radio_select { + color: #292929; + font-size: 0.28rem; + font-weight: bold; + display: flex; + align-items: center; + margin-left: 0.82rem; + } + + .radio_select input[type="radio"] { + position: absolute; + opacity: 0; + } + .radio_select input[type="radio"] + .radio-label:before { + margin-top: 0.12rem; + content: ''; + background: #f4f4f4; + border-radius: 100%; + border: 1px solid #b4b4b4; + display: inline-block; + width: 0.3rem; + height: 0.3rem; + position: relative; + top: -0.2em; + /* margin-right: 1rem; */ + vertical-align: top; + cursor: pointer; + text-align: center; + -webkit-transition: all 250ms ease; + transition: all 250ms ease; + } + .radio_select input[type="radio"]:checked + .radio-label:before { + background:#21B1EB; + display: block; + content: "\2714"; + text-align: center; + line-height: 0.3rem; + font-size: 0.2rem; + border: 1px solid #21B1EB; + color: white; + /* box-shadow: inset 0 0 0 4px #f4f4f4; */ + } + .radio_select input[type="radio"]:focus + .radio-label:before { + outline: none; + border-color: #21B1EB; + } + .radio_select input[type="radio"]:disabled + .radio-label:before { + box-shadow: inset 0 0 0 4px #f4f4f4; + border-color: #b4b4b4; + background: #b4b4b4; + } + .radio_select input[type="radio"] + .radio-label:empty:before { + margin-right: 0; + } + .payment_btn{ + margin-top: 0.5rem; + width: 5rem; + height: 0.8rem; + border-radius: 0.4rem; + font-size: 0.32rem; + font-weight:500; + color:rgba(255,255,255,1); + text-align: center; + line-height: 0.8rem; + background-color: #21B1EB; + } \ No newline at end of file diff --git a/Public/Mobile/images/background.png b/Public/Mobile/images/background.png new file mode 100644 index 000000000..916d9d069 Binary files /dev/null and b/Public/Mobile/images/background.png differ diff --git a/Public/Mobile/images/juxing2.png b/Public/Mobile/images/juxing2.png new file mode 100644 index 000000000..4e75be5c4 Binary files /dev/null and b/Public/Mobile/images/juxing2.png differ diff --git a/Public/Mobile/images/juxing3.png b/Public/Mobile/images/juxing3.png new file mode 100644 index 000000000..e19b24a60 Binary files /dev/null and b/Public/Mobile/images/juxing3.png differ diff --git a/Public/Mobile/images/juxing4.png b/Public/Mobile/images/juxing4.png new file mode 100644 index 000000000..7011af70a Binary files /dev/null and b/Public/Mobile/images/juxing4.png differ diff --git a/Public/Mobile/images/weixin.png b/Public/Mobile/images/weixin.png new file mode 100644 index 000000000..7b3433f8a Binary files /dev/null and b/Public/Mobile/images/weixin.png differ diff --git a/Public/Mobile/images/zhifubaozhifu.png b/Public/Mobile/images/zhifubaozhifu.png new file mode 100644 index 000000000..29989e647 Binary files /dev/null and b/Public/Mobile/images/zhifubaozhifu.png differ diff --git a/Public/Mobile/js/recharge.js b/Public/Mobile/js/recharge.js new file mode 100644 index 000000000..fa81beb36 --- /dev/null +++ b/Public/Mobile/js/recharge.js @@ -0,0 +1,25 @@ +$(function() { + var isSign = 'currency' + $(".recharge-tabbar li").click( + function(){ + var divShow = $(".content").children("div"); + if($(this).hasClass("")){ + var index = $(this).index(); + $(this).addClass("selected"); + isSign = $(this).attr('name'); + $(this).siblings("li").removeClass("selected"); + $(divShow[index]).show(); + $(divShow[index]).siblings("div").hide(); + } + }) + + // 点击充值按钮 + $(".payment_btn").click(function(){ + //isSign = 'currency'平台币充值 ；isSign = 'iscurrency'折扣充值 + console.log(isSign); + var pattern = $('input:radio[name="radio"]:checked').val(); + // pattern判断支付宝 还是微信支付 + console.log(pattern); + + }) +}) \ No newline at end of file