111

public/appapi/css/new_Style.css

@@ -84,12 +84,15 @@
 .tixian .sureBtn { width: 10rem; height: 2.2rem; border-radius: 1.1rem; background: #C45EFF; font-size: 0.7rem; color: #fff; line-height: 2.2rem; text-align: center; margin: 0 auto; margin-top: 2.8rem; }
 
 /* 充值 */
-.Recharge .header { width: 100%; padding: 0 0.6rem; background: #fff; overflow: hidden; }
+.Recharge .header { width: 100%; padding: 0 0.6rem; background: #fff; overflow: hidden; position: relative; }
 .Recharge .zhanghu { margin-top: 0.6rem; font-size: 0.7rem; color: #333; }
 .Recharge .inputBox { width: 100%; height: 2.7rem; border-bottom: 1px solid #F5F5F5; display: flex; align-items: center; }
 .Recharge .input_id { font-size: 1.2rem; color: #333; width: 100%; }
 .Recharge .input_id::-webkit-input-placeholder { color: #999; }
 .Recharge .zuanNum { width: 100%; height: 2.15rem; font-size: 0.7rem; color: #333; line-height: 2.15rem; font-weight: 600; }
+.Recharge .userBox { position: absolute; top: 0.55rem; right: 0.6rem; justify-content: center; display: flex; flex-direction: column; align-items: center; }
+.Recharge .userImg { width: 2.2rem; height: 2.2rem; border-radius: 50%; }
+.Recharge .userName { color: #333333; font-size: 0.6rem; margin-top: 0.2rem; }
 .Recharge .body { width: 100%; padding: 0 0.6rem; }
 .Recharge .chooseTips { width: 100%; margin-top: 0.6rem; font-size: 0.7rem; color: #999; }
 .Recharge .chooseBox { width: 100%; display: flex; flex-wrap: wrap; margin-top: 0.2rem; }

themes/simplebootx/Appapi/Rechange/index.html

@@ -11,9 +11,13 @@
         <div class="header">
             <div class="zhanghu">账户ID</div>
             <div class="inputBox">
-              <input type="number" class="input_id" placeholder="请输入ID" />
+              <input v-model="userId" type="number" class="input_id" placeholder="请输入ID" />
+            </div>
+            <div class="zuanNum">剩余钻石：{{zuanNum}}</div>
+            <div class="userBox" v-if="{{userId}}">
+              <img src="__PUBLIC__/appapi/pay/img/bandCard.png" class="userImg" >
+              <div class="userName">手机用户0565</div>
             </div>
-            <div class="zuanNum">剩余钻石：0</div>
         </div>
 
         <div class="body">
@@ -86,7 +90,9 @@
             el: '#app',
             data: {
                 //数据集
+                userId:'', // 用户id
                 sel_num:1 , // 充值类型/数量
+                zuanNum: 0, // 钻石数量
             },
             methods: {
                 //事件