feat

- 增加 套餐列表从接口获取

README.md

@@ -249,4 +249,10 @@ feature
 ## v1.0.28
 `2023.3.2`
 update
-- 修改 最后一步按钮文案
+- 修改 最后一步按钮文案
+
+
+## v1.0.29
+`2023.3.13`
+feat
+- 增加 套餐列表从接口获取

src/api/core.js

@@ -28,6 +28,7 @@ export const APICore = {
     payLiveBaseDevice, //微信统一下单
     GpsDeviceFence, //围栏 redis
     cardPackageList, //零川基础套餐列表
+    devicePayPackage,
 }
 /* const headerAuth = this.$store.getters.gatewayToken; */
 // 获取告警详情
@@ -85,4 +86,11 @@ function cardPackageList(data) {
         data,
     });
 }
+function devicePayPackage(imei) {
+    return service({
+        url: `${baseUrl}/core/api/v1/open/card/GetDevicePayPackage`,
+        method: 'get',
+        params: {imei},
+    })
+}
 export default APICore;

src/config/models.js

@@ -1,11 +1,11 @@
 /*
  * @Date: 2021-11-20 10:26:39
  * @LastEditors: JinxChen
- * @LastEditTime: 2023-02-27 09:59:02
+ * @LastEditTime: 2023-03-13 09:35:07
  * @FilePath: \TelpoH5FrontendWeb\src\config\models.js
  * @description:
  */
-export const VERSION_MODEL = '1.0.28F'; //版本号
+export const VERSION_MODEL = '1.0.29F'; //版本号
 export const IMAGE_URL = {
     production: 'http://zfb.ssjlai.com/web/',
     test: 'http://zfb.ssjlai.com/web/',

src/http/webapi.js

@@ -1,7 +1,7 @@
 /*
  * @Author: linwl
  * @Date: 2020-04-13 14:47:59
- * @LastEditTime: 2023-02-24 10:47:44
+ * @LastEditTime: 2023-03-13 16:35:17
  * @LastEditors: JinxChen
  * @Description: axios请求配置
  * @FilePath: \TelpoH5FrontendWeb\src\http\webapi.js
@@ -41,7 +41,7 @@ service.interceptors.request.use(
         /* if (localStorage.getItem('webapiToken')) {
 
         } */
-        request.headers.AuthToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJVc2VySW5mbyI6eyJVc2VySWQiOiJjZTQzOWU1Yy03NWVjLTRhMTEtYWJmMC02YTdhM2IzY2UwMGQiLCJMb2dpbk5hbWUiOiIxODI3NzQyNjcxMiIsIkxvZ2luVHlwZSI6MX0sIkV4cCI6MTY4NDg5NTk5ODg4NS4wfQ.VK_fNU0QrCJwsc_Dxa_lPP1dvnxo73TfKzV_bJquqxU';
+        request.headers.AuthToken = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJVc2VySW5mbyI6eyJVc2VySWQiOiJjZTQzOWU1Yy03NWVjLTRhMTEtYWJmMC02YTdhM2IzY2UwMGQiLCJMb2dpbk5hbWUiOiIxODI3NzQyNjcxMiIsIkxvZ2luVHlwZSI6MX0sIkV4cCI6MTY4NjY0NTI1MTQ4NC4wfQ.cm3AblDTivfbuJ-OgDAglWVsJFWiJZyrpt_BmNq499g';
         return request;
     },
     errorHandler

src/views/package-list/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Date: 2022-03-29 16:57:58
  * @LastEditors: JinxChen
- * @LastEditTime: 2023-03-05 11:59:59
+ * @LastEditTime: 2023-03-13 16:41:09
  * @FilePath: \TelpoH5FrontendWeb\src\views\package-list\index.vue
  * @description: TODO 小台风充值h5
 -->
@@ -18,7 +18,7 @@
         <div class="topup-container">
             <div class="main">
                 <!-- 无套餐时显示 -->
-                <div class="noData_container" v-show="packageOrderList.length === 0 && isShowNoData">
+                <div class="noData_container" v-show="packageOrderList.length === 0 && !isShowNoData">
                     <p>暂无相关套餐数据,请您联系管理员~</p>
                 </div>
                 <!-- 套餐订购 -->
@@ -38,7 +38,7 @@
                     <!-- 套餐内容 -->
                     <div class="order-content">
                         <div class="title">
-                            <p>{{item.packageName}}<!-- ：{{(item.packagePrice/item.packageIssue).toFixed(0)}}元/月 --></p>
+                            <p>{{item.packageName}}<!-- ：{{(item.packagesPrice/item.packageIssue).toFixed(0)}}元/月 --></p>
                         </div>
                         <div class="remark">
                             <p>每月200分钟通话时长，1G流量</p>
@@ -46,10 +46,10 @@
                         <div class="details">
                             <p>
 
-                                <span class="orange large">￥{{(item.packagePrice/(item.packageIssue === 0 ? 1: item.packageIssue)).toFixed(0)}}</span>元/月，
+                                <span class="orange large">￥{{(item.packagesPrice/(item.packageIssue === 0 ? 1: item.packageIssue)).toFixed(0)}}</span>元/月，
                             </p>
                             <p class="total">
-                                <span>合计</span><span class="orange price">{{item.packagePrice}}元</span>
+                                <span>合计</span><span class="orange price">{{item.packagesPrice}}元</span>
                             </p>
                         </div>
                         <!-- <div class="package-buy">
@@ -114,15 +114,15 @@ export default {
             topupTitle: "请选择套餐充值电话卡", //充值页面标题
             // 套餐列表， todo 需要从接口获取
             packageOrderList: [
-                {
+                /* {
                     packageName: '语音卡套餐(1年)',
                     packagePayType: 1,
-                    packagePrice: 240,
+                    packagesPrice: 240,
                     packageIssue: 12,
-                    payWxPayProductId: process.env.NODE_ENV === "production" ? '1629407413618294784' : '1629405716684029952', //微信支付
+                    payWxPayProductId: process.env.NODE_ENV === "production" ? '1635123463911587840' : '1635122887959592960', //微信支付
                     payAliPayProductId: process.env.NODE_ENV === "production" ? '1629407413618294784' : '1629405716684029952', //支付宝全额支付
                     payAntPayProductId: process.env.NODE_ENV === "production" ? '1629407705558630400': '1629405558344859648', //支付宝花呗支付
-                }
+                } */
             ],
             outTradeNo: "", //订单号
             price: "", //价格,
@@ -145,8 +145,8 @@ export default {
         this.getAuth();
         this.getParams();
         this.getWxAutograph();
-        // todo 接口列表
-        /* this.getLiveBasePackage(); */
+        //  套餐列表
+        this.getDevicePayPackage();
     },
     /* mounted() {
         this.getParams();
@@ -193,49 +193,45 @@ export default {
             }
         },
         // 获取基本套餐信息
-        getLiveBasePackage() {
+        getDevicePayPackage() {
             this.$toast.loading({
-                message: "获取套餐中",
+                message: "加载中",
                 duration: 1500
             });
-            let reqBody = {
-                manufactorId:"",
-                productModelId:0,
-                iccid:"",
-                pageNumber:1,
-                begNumber:20
-            }
-            APICore.cardPackageList(reqBody)
+            APICore.devicePayPackage(this.params.imei)
                 .then(res => {
                     console.log("data", res.data);
                     if (res.data.code === 106 || res.data.code === 104) {
                         // token过期
                         this.getAuth();
                         setTimeout(() => {
-                            this.getLiveBasePackage();
+                            this.getDevicePayPackage();
                         }, 1500);
                     } else if (res.data.code === 0 && res.data.data === null) {
                         this.isShowNoData = true;
-                    }else {
-                        let data = res.data.data.list;
-                        if(data === null) {
-                            this.isShowNoData = true;
+                    } else {
+                        if(res.data.data === null) {
+                            this.isShowNoData = false;
                         } else {
-                            this.packageOrderList = data.filter(item => {
-                                return item.pechargeUrl === '1629405716684029952' || item.pechargeUrl === '1629405558344859648';
+                            let data = res.data.data.packagesList;
+                            // 处理获取套餐的逻辑
+                            // 筛选 基础套餐，producModelId 1 是基础套餐；2 是加油包
+                            let packageList = data.filter(item => {
+                                return item.producModelId === 1
                             });
-                            console.log("套餐数据::", data);
+                            this.packageOrderList = packageList;
+                            console.log("套餐数据::", packageList);
                         }
+                        this.$toast.success({
+                            message: "加载完成",
+                            duration: 1500
+                        });
                     }
-                    this.$toast.success({
-                        message: "成功获取套餐",
-                        duration: 1500
-                    });
                 })
                 .catch(error => {
                     this.$dialog.confirm({
                         title: "获取套餐数据失败",
-                        message: error,
+                        message: error.message,
                         showCancelButton: false,
                     });
                 })
@@ -280,20 +276,33 @@ export default {
         },
         // 话费充值
         onBuy(data) {
-            this.price = data.packagePrice;
+            this.price = data.packagesPrice;
+            // 遍历数据找到属于三种支付方式对应的套餐id， 1 微信 2 支付宝全额 3 支付宝分期
+            let payTypeToPackAgeId = data.payTypeList;
+            console.log("购买的套餐数据data", data);
             // 需要区分是要用微信支付还是支付宝花呗支付
             if (this.payType === '2') {
-                this.payProductId =  process.env.NODE_ENV === "production" ? '1629407413618294784' : '1629405716684029952', //支付宝全额支付
+                // 全额
+                this.payProductId = payTypeToPackAgeId.filter(item => {
+                    return item.payType === '2';
+                })[0].productId;
                 this.packageIssue = 0;
                 this.aliPay(data);
             } else if (this.payType === '3') {
-                this.payProductId =  process.env.NODE_ENV === "production" ? '1629407705558630400': '1629405558344859648', //支付宝花呗支付
+                // 分期
+                this.payProductId = payTypeToPackAgeId.filter(item => {
+                    return item.payType === '3';
+                })[0].productId;
                 this.packageIssue = 12;
                 this.payType = '2'
                 this.aliPay(data);
             } else {
+                // 微信
                 let openId = this.$store.getters.openId;
-                this.payProductId =  process.env.NODE_ENV === "production" ? '1629407413618294784': '1629405716684029952'; //支付宝花呗支付
+                this.payProductId = payTypeToPackAgeId.filter(item => {
+                    return item.payType === '1';
+                })[0].productId;
+                this.packageIssue = 0;
                 if(openId === null || openId === 'null') {
                     this.$dialog.confirm({
                         message: '获取OpenId失败，请您重新进入',
@@ -317,8 +326,8 @@ export default {
                 productId: this.payProductId, //套餐id
                 packageName: /* data.productModel */ data.packageName, //套餐名字
                 packagePayType: Number(this.payType), //支付类型
-                packageIssue: 12, //分期
-                packagePrice: process.env.NODE_ENV === "production" ? data.packagePrice * 100 : 1  //总金额单位为分，测试环境写死
+                packageIssue: 0, //分期
+                packagePrice: process.env.NODE_ENV === "production" ? data.packagesPrice * 100 : 1  //总金额单位为分，测试环境写死
             };
             this.$toast.clear();
             APICore.payLiveBaseDevice(reqBody)
@@ -413,7 +422,7 @@ export default {
                 packageName: /* data.productModel + ',' +  */data.packageName, //套餐名字
                 packagePayType: Number(this.payType), //支付类型
                 packageIssue: this.packageIssue, //分期
-                packagePrice: process.env.NODE_ENV === "production" ? data.packagePrice * 100 : 1 //总金额单位为分，测试环境写死
+                packagePrice: process.env.NODE_ENV === "production" ? data.packagesPrice * 100 : 1 //总金额单位为分，测试环境写死
             };
             this.$toast.clear();
             APICore.payLiveBaseDevice(reqBody)