支付暂时完成

README.md

@@ -139,11 +139,40 @@ appid
 
 > xjqy 快速登录逻辑
 
--   [ ] 登录成功, 携带用户信息, 在 url 里面, 携带 x-token 在 url 里面 携带密码信息在 url 里面
-
+-   [x] 登录成功, 携带用户信息, 在 url 里面, 携带 x-token 在 url 里面 携带密码信息在 url 里面
 
 > 读取路由中的信息修改
 > 路由中必有参数:
 > platform: xjqy
 > appid:777
 > data: 我存的数据
+
+## 2021.7.20
+
+-   [ ] xjqy 游戏内充值
+
+> xjqy
+
+1. 游戏内支付路由参数 /gamepay
+
+    > 支付参数: server_id=50001&server_name=圣者 1 服&cp_order_id=0123466789&role_name=刀剑无眼&role_id=5001_12&goods_id=4002&goods_name=100 元宝&amount=10000
+    > 固定参数 platform=xjqy&appid=777&data=xxx(我存的数据)
+
+2. 回调地址需要的参数(我这边处理)
+
+    > 支付参数: 根据游戏内支付的参数处理好, 支付参数与游戏内支付参数一致
+    > 支付平台等:
+
+    pay: hb/game => 重新拉起支付需要的参数 决定拉起的是鸿币充值还是游戏内充值
+    pay_type
+    pay_platform
+    固定参数 platform=xjqy&appid=777&data=xxx(我存的数据)
+
+## 2021.7.21
+
+-   [x] counter 页面查询 查询订单
+-   [x] counter 页面逻辑需要重新捋, 没写完
+
+## 2021.7.27 查漏补缺 (初始代码是从 JHPassport -> master -> 1.3.0 之前的 更新代码从 1.3.0 之后更新)
+
+-   [x] 更新公众号引导图图片

config/test.env.js

@@ -4,6 +4,6 @@ const prodEnv = require('./prod.env')
 
 module.exports = merge(prodEnv, {
     NODE_ENV: '"development"',
-    API_ROOT: '"https://api.jhfly.cn"', // 测试环境地址
+    API_ROOT: '"//42.193.163.133:30000"', // 线上测试环境地址
     xjqyLogin: '"jhfly://localhost/login"', // 仙界情缘登录地址
 })

src/App.vue

@@ -38,7 +38,7 @@ export default {
     };
   },
   computed: {
-    ...mapState(["query", "appid", "CONFIG"]),
+    ...mapState(["query", "appid", "CONFIG", "userInfo"]),
   },
   watch: {
     // 监听路由变化 初始化路由
@@ -79,6 +79,11 @@ export default {
       // 获取当前android是哪个(针对特殊处理的包, 比如仙界情缘)
       const platform = this.$utils.getQueryString("platform");
       this.platformAction(platform);
+
+      // 获取userInfo
+      let userInfo = this.$utils.readStorage("", "userInfo");
+      userInfo = userInfo && JSON.parse(userInfo);
+      this.userInfoAction(userInfo);
     },
 
     // 获取用户信息
@@ -132,7 +137,15 @@ export default {
       const { appid } = this;
       const returnUrlLeft =
         window.location.origin + window.location.pathname + "#/counter?";
-      const returnUrlQuery = `pay=game&appid=${appid}&server_id=${server_id}&server_name=${server_name}&cp_order_id=${cp_order_id}&role_name=${role_name}&role_id=${role_id}&goods_id=${goods_id}&goods_name=${goods_name}&amount=${amount}&pay_type=${pay_type}&pay_platform=${pay_platform}`;
+      // 1. 拿到所有的当前路由的参数
+      const allQuery = this.$utils.getAllQueryString();
+      // 2. 将需要的参数拼接
+      const queryString = this.$utils.queryStringUtil({
+        ...allQuery,
+        pay_type,
+        pay_platform,
+        pay: "game",
+      });
       return this.$api
         .order({
           server_id,
@@ -146,7 +159,7 @@ export default {
           amount,
           pay_type,
           pay_platform,
-          return_url: returnUrlLeft + returnUrlQuery,
+          return_url: returnUrlLeft + queryString,
           extra,
         })
         .then((res) => {
@@ -161,6 +174,31 @@ export default {
           if (pay_platform === "HB") {
             return;
           }
+
+          const time = new Date().getTime();
+          const orderItem = {
+            order_id: data.order_id,
+            time,
+            server_id,
+            server_name,
+            cp_order_id,
+            app_id: appid,
+            role_name,
+            role_id,
+            goods_id,
+            goods_name,
+            amount,
+            pay_type,
+            uid: this.userInfo.uid,
+          };
+          //   let orderList = JSON.parse(localStorage.getItem("orderList")) || [];
+          let orderList = this.$utils.readStorage("", "orderList");
+          orderList = (orderList && JSON.parse(orderList)) || [];
+          orderList.push(orderItem);
+
+          //   localStorage.setItem("orderList", JSON.stringify(orderList));
+          this.$utils.writeStorage("", "orderList", JSON.stringify(orderList));
+
           window.location.href = data.url;
         });
     },
@@ -173,7 +211,15 @@ export default {
       const { appid } = this;
       const returnUrlLeft =
         window.location.origin + window.location.pathname + "#/counter?";
-      const returnUrlQuery = `pay=hb&appid=${appid}&amount=${amount}&goods_name=${goods_name}&pay_type=${pay_type}&pay_platform=${pay_platform}`;
+      // 1. 拿到所有的当前路由的参数
+      const allQuery = this.$utils.getAllQueryString();
+      // 2. 将需要的参数拼接
+      const queryString = this.$utils.queryStringUtil({
+        ...allQuery,
+        pay_type,
+        pay_platform,
+        pay: "hb",
+      });
       return this.$api
         .recharge({
           amount,
@@ -181,7 +227,7 @@ export default {
           app_id: appid,
           pay_type,
           pay_platform,
-          return_url: returnUrlLeft + returnUrlQuery,
+          return_url: returnUrlLeft + queryString,
           extra,
         })
         .then((res) => {
@@ -207,10 +253,11 @@ export default {
             goods_name,
             amount,
             pay_type,
+            uid: this.userInfo.uid,
           };
           //   let orderList = JSON.parse(localStorage.getItem("orderList")) || [];
           let orderList = this.$utils.readStorage("", "orderList");
-          orderList = JSON.parse(orderList) || [];
+          orderList = (orderList && JSON.parse(orderList)) || [];
           orderList.push(orderItem);
 
           //   localStorage.setItem("orderList", JSON.stringify(orderList));

src/components/Menu/MenuPay/MenuHbPay.vue

@@ -12,17 +12,17 @@
     <!-- 支付鸿币 -->
     <div class="pay_money">
       <span class="left">应付鸿币</span>
-      <span class="right">{{ payArg.amount / 100 }}</span>
+      <span class="right">{{ query.amount / 100 }}</span>
     </div>
     <!-- 确认 -->
     <div
       class="confirm"
-      v-if="finance >= payArg.amount / 100 && canPay"
+      v-if="finance >= query.amount / 100 && canPay"
       @click="toPay"
     >
       立即支付
     </div>
-    <div class="confirm gray" v-else-if="finance >= payArg.amount / 100">
+    <div class="confirm gray" v-else-if="finance >= query.amount / 100">
       支付中
     </div>
 
@@ -47,15 +47,15 @@ export default {
     };
   },
   computed: {
-    ...mapState(["finance", "query"]),
-    payArg() {
-      return this.$store.state.payArg;
+    ...mapState(["finance"]),
+    query() {
+      return this.$store.state.query;
     },
   },
   watch: {
-    payArg: {
+    query: {
       handler(newValue) {
-        // console.log(newValue, "payArg");
+        // console.log(newValue, "query");
       },
       deep: true,
       immediate: true,
@@ -95,7 +95,7 @@ export default {
         goods_id,
         goods_name,
         amount,
-      } = this.payArg;
+      } = this.query;
       const payType = this.$utils.payType(payPlatform).h5;
       this.payHandler({
         server_id,

src/components/Menu/MenuPay/MenuPayH5.vue

@@ -214,7 +214,8 @@ export default {
   inject: ["checkCode", "getFinance", "checkCodeHandler", "onRecharge"],
   data() {
     return {
-      payCountList: ["100", "200", "500", "1000"], // 可选充值金额列表
+      payCountList: ["0.01", "200", "500", "1000"], // 可选充值金额列表
+    //   payCountList: ["100", "200", "500", "1000"], // 可选充值金额列表
       currentCount: 0, // 默认选中的充值金额
       payPlatform: "ALIPAY", // 默认支付方式
       payCount: 0, // 应付金额

src/config.js

@@ -31,6 +31,7 @@ const CONFIG = {
     serviceUrl: "//kf.jhfly.cn/chatIndex?kefu_id=kefu2&refer=", // 惊鸿客服url
     storeUrl: "//h5.jhfly.cn/rxzr/activities/dazhuanpan", // 积分商城链接
     xjqyLoginUrl: "jhfly://localhost/login", // 仙界情缘登录路由
+    xjqyPayUrl: "jhfly://localhost/pay", // 仙界情缘支付路由
 }
 
 

src/views/Counter/Counter.vue

@@ -34,12 +34,14 @@
       <div class="bottom">{{ query.amount / 100 }}元</div>
     </div>
     <!-- 继续付款 -->
-    <div class="continue" v-if="query.pay === 'game'" @click="gamePay">
+    <!-- <div class="continue" v-if="query.pay === 'game'" @click="gamePay">
       继续付款
     </div>
     <div class="continue" v-if="query.pay === 'hb'" @click="hbPay">
       继续付款
-    </div>
+    </div> -->
+
+    <div class="continue" @click="back">返回游戏</div>
 
     <!-- 支付遇到问题 -->
     <div class="question" @click="onService">支付遇到问题？联系客服</div>
@@ -66,8 +68,6 @@ export default {
   created() {},
   mounted() {},
   methods: {
-    back() {},
-
     // 游戏充值
     gamePay() {
       const {
@@ -163,7 +163,7 @@ export default {
   }
 
   .rmb {
-    margin-top: 50 / @rem;
+    margin-top: 100 / @rem;
 
     .count {
       font-size: 50 / @rem;
@@ -176,7 +176,7 @@ export default {
   }
 
   .bottom {
-    margin-bottom: 80 / @rem;
+    margin-bottom: 100 / @rem;
     font-size: 32 / @rem;
   }
 
@@ -210,20 +210,74 @@ export default {
 @media all and (orientation: landscape),
   /** 伪竖屏*/all and (orientation: portrait) and (min-width: 600px) and (min-height: 800px) {
   .counter {
-    .icon-back {
-      margin-top: 2 / @rem;
-      margin-right: 5 / @rem;
-      font-size: 25 / @rem;
+    .top {
+      i {
+        font-size: 30 / @rem;
+      }
+
+      .icon-back {
+        margin-right: 5 / @rem;
+        font-size: 25 / @rem;
+      }
+
+      .title {
+        width: 125 / @rem;
+        height: 30 / @rem;
+        line-height: 30 / @rem;
+        margin: 5 / @rem auto 0;
+        padding-left: 10 / @rem;
+        font-size: 18 / @rem;
+
+        img {
+          width: 30 / @rem;
+        }
+
+        .wx,
+        .ali {
+          width: 25 / @rem;
+          margin-top: 2.5 / @rem;
+        }
+
+        span {
+          margin-left: 5 / @rem;
+        }
+      }
     }
 
-    .title {
-      height: 30 / @rem;
-      line-height: 30 / @rem;
-      margin-top: 8 / @rem;
-      margin-left: 5 / @rem;
-      padding-left: 10 / @rem;
+    .rmb {
+      margin-top: 50 / @rem;
+
+      .count {
+        font-size: 25 / @rem;
+
+        .yuan {
+          font-size: 40 / @rem;
+        }
+      }
+    }
+
+    .bottom {
+      margin-bottom: 50 / @rem;
+      font-size: 16 / @rem;
+    }
+
+    .continue {
+      height: 50 / @rem;
+      line-height: 50 / @rem;
+      margin: 0 auto 20 / @rem;
       font-size: 18 / @rem;
     }
+
+    .question {
+      font-size: 16 / @rem;
+    }
+
+    .finish {
+      width: 150 / @rem;
+      margin-left: -75 / @rem;
+      bottom: 40 / @rem;
+      font-size: 16 / @rem;
+    }
   }
 }
 

src/views/GamePay/GamePay.vue

@@ -58,6 +58,9 @@ export default {
 
     // 关闭
     close() {
+      // 1. 展示游戏内充值
+      this.showInnerControl("");
+      // 2. 关闭当前
       console.log("gamepay close");
     },
   },

src/views/GamePay/GamePayH5.vue

@@ -5,11 +5,11 @@
       <!-- 确认信息 -->
       <div class="pay_money">
         <span class="left">充值金额</span>
-        <span class="right">￥ {{ payArg.amount / 100 }}</span>
+        <span class="right">￥ {{ query.amount / 100 }}</span>
       </div>
       <div class="pay_info">
         <span class="left">购买商品</span>
-        <span class="right">{{ payArg.goods_name }}</span>
+        <span class="right">{{ query.goods_name }}</span>
       </div>
 
       <!-- 支付方式 -->
@@ -82,18 +82,8 @@ export default {
   },
   computed: {
     ...mapState(["finance", "query"]),
-    payArg() {
-      return this.$store.state.payArg;
-    },
   },
   watch: {
-    payArg: {
-      handler(newValue) {
-        // console.log(newValue, "payArg");
-      },
-      deep: true,
-      immediate: true,
-    },
     finance(newValue) {
       newValue
         ? this.onSelectPayPlatform("ALIPAY")
@@ -144,7 +134,7 @@ export default {
         goods_id,
         goods_name,
         amount,
-      } = this.payArg;
+      } = this.query;
       const payType = this.$utils.payType(currentPayPlatform).h5;
       this.payHandler({
         server_id,