feat: 初始化3.2.1版本

src/pages/activity/index.vue

@@ -1,7 +1,9 @@
 <template>
-  <view v-if="pic" class='app-container'>
+  <view v-if="pic" class="app-container">
     <img :src="pic" />
-    <button class="submit" type="submit" circle @click="getSubmit">立即兑换</button>
+    <button class="submit" type="submit" circle @click="getSubmit">
+      立即兑换
+    </button>
 
     <!-- 弹窗 -->
     <uni-popup ref="popup" type="center" :is-mask-click="false">
@@ -18,68 +20,69 @@
 </template>
 
 <script>
-import { detail, submit } from '@/api/activity.js'
+import { detail, submit } from "@/api/activity.js";
 export default {
   data() {
     return {
-      pic: '',
+      pic: "",
       form: {
-        activityId: '',
+        activityId: "",
         clientType: getApp().globalData.userInfo.deviceClientType,
         deviceMac: getApp().globalData.userInfo.deviceMac,
-        type: getApp().globalData.deviceInfo.deviceMode
+        type: getApp().globalData.deviceInfo.deviceMode,
       },
       // 弹窗内容
-      content: '',
+      content: "",
       // 兑换成功
-      isShow: false
-    }
+      isShow: false,
+    };
   },
   onLoad(e) {
-    this.form.activityId = e.activityId
-    this.getDetail()
+    this.form.activityId = e.activityId;
+    this.getDetail();
   },
   methods: {
     getDetail() {
       detail({
-        activityId: this.form.activityId
-      }).then(res => {
+        activityId: this.form.activityId,
+      }).then((res) => {
+        console.log("gadfadsfqewrqerq====" + JSON.stringify(res));
         if (res.code === 0) {
-          this.pic = res.data.pic
+          this.pic = res.data.pic;
         } else {
           uni.showToast({
             title: res.data.message,
-            icon: 'error',
-            duration: 2000
-          })
+            icon: "error",
+            duration: 2000,
+          });
         }
-      })
+      });
     },
 
     // 立即领取
     getSubmit() {
-      submit(this.form).then(res => {
+      submit(this.form).then((res) => {
         if (res.code === 0) {
-          this.$refs.popup.open()
-          this.content = res.data
-          this.isShow = true
+          this.$refs.popup.open();
+          this.content = res.data;
+          this.isShow = true;
         } else {
           uni.showToast({
             title: res.data.message,
-            icon: 'none',
+            icon: "none",
             mask: true,
-            duration: 2000
-          })
+            duration: 2000,
+          });
         }
-      })
+      });
     },
 
     // 关闭弹窗
     getClose() {
-      this.$refs.popup.close()
-    }
-  }
-}
+      this.$refs.popup.close();
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>

src/pages/pay/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <view class='app-container' flex column>
+  <view class="app-container" flex column>
     <view :class="['header', orderList.length > 0 ? 'header-bg' : '']">
       <view class="info" flex>
         <view class="dev-img" flex center>
@@ -7,26 +7,50 @@
         </view>
         <view class="dev" flex column>
           <view class="dev-name owt">{{ info.deviceName }}</view>
-          <view class="dev-history" @click="getRouter">开通记录<uni-icons type="right" color="#9fa5ad" size="11" /></view>
+          <view class="dev-history" @click="getRouter"
+            >开通记录<uni-icons type="right" color="#9fa5ad" size="11"
+          /></view>
         </view>
       </view>
       <view class="progress" flex column center>
-        <progress :percent="percent" activeColor="#FFD5A0" backgroundColor="#746C64" border-radius="20" />
+        <progress
+          :percent="percent"
+          activeColor="#FFD5A0"
+          backgroundColor="#746C64"
+          border-radius="20"
+        />
         <view class="progress-info" flex between>
           <view>
-            <text>剩余：{{ (this.rateplan.left / 1024).toFixed(2) }}GB / 总量：{{ (this.rateplan.total / 1024).toFixed(2) }}GB</text>
+            <text
+              >剩余：{{ (this.rateplan.left / 1024).toFixed(2) }}GB / 总量：{{
+                (this.rateplan.total / 1024).toFixed(2)
+              }}GB</text
+            >
             <text style="margin-left: 10px">{{ this.rateplan.dayStr }}</text>
           </view>
           <text>已用：{{ (this.rateplan.used / 1024).toFixed(2) }}GB</text>
         </view>
       </view>
       <view v-if="orderList.length > 0">
-        <view class="progress" flex column center v-for="item in orderList" :key="item.orderId">
-          <progress activeColor="#FFD5A0" backgroundColor="#746C64" border-radius="20" />
+        <view
+          class="progress"
+          flex
+          column
+          center
+          v-for="item in orderList"
+          :key="item.orderId"
+        >
+          <progress
+            activeColor="#FFD5A0"
+            backgroundColor="#746C64"
+            border-radius="20"
+          />
           <view class="progress-info" flex>
             <view>
               <text>待生效流量套餐</text>
-              <text style="margin-left: 10px;">总量：{{ (item.total / 1024 / 1024).toFixed(2) }}GB</text>
+              <text style="margin-left: 10px"
+                >总量：{{ (item.total / 1024 / 1024).toFixed(2) }}GB</text
+              >
             </view>
             <text style="margin-left: 10px">{{ item.dayStr }}</text>
           </view>
@@ -36,11 +60,24 @@
     <view class="main">
       <view class="title" flex>
         <text>流量选择</text>
-        <uni-icons type="help" color="#828282" style="margin-left: 4px;" @click="getOpen" />
+        <uni-icons
+          type="help"
+          color="#828282"
+          style="margin-left: 4px"
+          @click="getOpen"
+        />
       </view>
       <view flex wrap>
-        <view :class="['list', active === index ? 'active' : '']" v-for="(item, index) in options" :key="index" flex
-          column between @click="getActive(item, index)" :data-content-before="item.operators">
+        <view
+          :class="['list', active === index ? 'active' : '']"
+          v-for="(item, index) in options"
+          :key="index"
+          flex
+          column
+          between
+          @click="getActive(item, index)"
+          :data-content-before="item.operators"
+        >
           <view class="flow owt">{{ item.name }}</view>
           <view class="discount icon">{{ item.goodDiscountedPrice }}</view>
           <view class="price icon">{{ item.goodPrice }}</view>
@@ -49,8 +86,11 @@
       </view>
       <view class="explain" flex column>
         <text>说明：</text>
-        <text>1、当前流量包购买后，将充值至猫王音响赠送的SIM卡内</text>
-        <text>2、预充值流量因运营商结算时效，上一个流量包使用完后1小时 内生效，如有疑问，请咨询客服。 </text>
+        <text>1、当前流量包购买后，将充值至猫王音响赠送的SIM卡内dasd发</text>
+        <text
+          >2、预充值流量因运营商结算时效，上一个流量包使用完后1小时
+          内生效，如有疑问，请咨询客服。
+        </text>
         <text>3、如在有效期内流量未使用完毕，流量将被清零</text>
       </view>
     </view>
@@ -62,14 +102,25 @@
     </view>
 
     <!-- 弹窗 -->
-    <uni-popup ref="popup" type="bottom" border-radius="10px 10px 10px 10px" background-color="#2a2a2a">
+    <uni-popup
+      ref="popup"
+      type="bottom"
+      border-radius="10px 10px 10px 10px"
+      background-color="#2a2a2a"
+    >
       <view class="popup">
         <view class="title">购买须知</view>
         <view class="content">
-          <h4>1. 支付完成后，若当前没有生效中的套餐，套餐立即生效，若当前有生效中未使用完套餐，购买套餐进入流量套餐队列，待上一个套餐失效后激活生效。</h4>
+          <h4>
+            1.
+            支付完成后，若当前没有生效中的套餐，套餐立即生效，若当前有生效中未使用完套餐，购买套餐进入流量套餐队列，待上一个套餐失效后激活生效。
+          </h4>
           <h4>2. 此卡充值流量套餐后，仅限当前设备使用。</h4>
           <h4>3. 此套餐为虚拟产品，购买后不支持退款。</h4>
-          <h4>4. 客服微信：miao friend ，有任何问题请添加客服微信，我们将耐心为您解决问题。</h4>
+          <h4>
+            4. 客服微信：miao friend
+            ，有任何问题请添加客服微信，我们将耐心为您解决问题。
+          </h4>
         </view>
         <button @click="getClose">我知道了</button>
       </view>
@@ -95,117 +146,127 @@ export default {
       active: 0,
       // 流量套餐id
       goddsId: 0,
-      state: '',
+      state: "",
       // 待生效流量
-      orderList: []
-    }
+      orderList: [],
+    };
   },
   onLoad(e) {
-    this.state = e.state
-    this.getOpenId(e)
-    this.getDetail()
-    this.getOptions()
-    this.getOrder()
+    console.log("gadfadfqewrqr===" + JSON.stringify(e));
+    this.state = e.state;
+    this.getOpenId(e);
+    this.getDetail();
+    this.getOptions();
+    this.getOrder();
   },
   methods: {
     // 获取openId
     getOpenId(e) {
-      openId(e.code).then(res => {
+      openId(e.code).then((res) => {
         if (res.code === 0) {
-          uni.setStorageSync('openId', res.data.openid)
+          uni.setStorageSync("openId", res.data.openid);
         }
-      })
+      });
     },
 
     // 流量信息
     getDetail() {
-      detail({ state: this.state }).then(res => {
+      detail({ state: this.state }).then((res) => {
         if (res.code === 0) {
-          this.info = res.data
-          this.rateplan = res.data.rateplan
-          this.percent = this.rateplan.used / this.rateplan.total * 100
+          this.info = res.data;
+          this.rateplan = res.data.rateplan;
+          this.percent = (this.rateplan.used / this.rateplan.total) * 100;
         }
-      })
+      });
     },
 
     // 流量列表
     getOrder() {
-      order({ state: this.state }).then(res => {
+      order({ state: this.state }).then((res) => {
         if (res.code === 0) {
-          this.orderList = res.data.filter(i => i.status === 1).splice(0, 2)
+          this.orderList = res.data.filter((i) => i.status === 1).splice(0, 2);
         }
-      })
+      });
     },
 
     // 流量套餐
     getOptions() {
-      options({ state: this.state }).then(res => {
-        this.options = res.data
-        this.goodsId = res.data[0].id
-        res.data.map(i => document.documentElement.style.setProperty('——operators', i.operators))
-      })
+      options({ state: this.state }).then((res) => {
+        this.options = res.data;
+        this.goodsId = res.data[0].id;
+        res.data.map((i) =>
+          document.documentElement.style.setProperty("——operators", i.operators)
+        );
+      });
     },
 
     // 选择套餐
     getActive(item, index) {
-      this.active = index
-      this.goodsId = item.id
+      this.active = index;
+      this.goodsId = item.id;
     },
 
     // 下单
     getWechatPay() {
       wechatPay({
-        openId: uni.getStorageSync('openId'),
+        openId: uni.getStorageSync("openId"),
         goodType: 18,
         goodsId: this.goodsId,
         ptype: 1,
         state: this.state,
-        tradeType: 2
-      }).then(res => {
+        tradeType: 2,
+      }).then((res) => {
         if (res.code === 0) {
-          this.form = JSON.parse(res.data.wxOrder.formUrl)
-          if (typeof WeixinJSBridge == 'undefined') {
+          this.form = JSON.parse(res.data.wxOrder.formUrl);
+          if (typeof WeixinJSBridge == "undefined") {
             if (document.addEventListener) {
-              document.addEventListener('WeixinJSBridge', this.onBridgeReady(), false)
+              document.addEventListener(
+                "WeixinJSBridge",
+                this.onBridgeReady(),
+                false
+              );
             } else if (document.attachEvent) {
-              document.attachEvent('WeixinJSBridge', this.onBridgeReady())
-              document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady())
+              document.attachEvent("WeixinJSBridge", this.onBridgeReady());
+              document.attachEvent(
+                "onWeixinJSBridgeReady",
+                this.onBridgeReady()
+              );
             }
           } else {
-            this.onBridgeReady()
+            this.onBridgeReady();
           }
         }
-      })
+      });
     },
 
     // 弹窗
     getOpen() {
-      this.$refs.popup.open()
+      this.$refs.popup.open();
     },
 
     // 关闭
     getClose() {
-      this.$refs.popup.close()
+      this.$refs.popup.close();
     },
 
     // 调起支付
     onBridgeReady() {
-      WeixinJSBridge.invoke('getBrandWCPayRequest', this.form, function (res) {
+      WeixinJSBridge.invoke("getBrandWCPayRequest", this.form, function (res) {
         if (res.err_msg == "get_brand_wcpay_request:ok") {
           // 支付成功刷新页面
           location.reload();
         }
-      })
+      });
     },
 
     // 开通记录
     getRouter() {
       uni.navigateTo({
         url: `/pages/pay/detail?state=${this.state}`,
-      })
-    }
-  }
-}
+      });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
@@ -216,7 +277,7 @@ export default {
 .header {
   width: 100%;
   height: 368rpx;
-  background: url('../../static/pay/bg.png') no-repeat 100% / 100%;
+  background: url("../../static/pay/bg.png") no-repeat 100% / 100%;
 
   .info {
     margin-bottom: 38rpx;
@@ -275,7 +336,7 @@ export default {
 
 .header-bg {
   height: 510rpx;
-  background: url('../../static/pay/bigbg.png') no-repeat 100% / 100%;
+  background: url("../../static/pay/bigbg.png") no-repeat 100% / 100%;
 }
 
 .main {
@@ -289,7 +350,7 @@ export default {
 
   .active {
     background-color: rgba(199, 170, 134, 0.12);
-    border: 2px solid #A4D099 !important;
+    border: 2px solid #a4d099 !important;
     // background-color: #A4D099;
   }
 
@@ -299,7 +360,7 @@ export default {
     border: 1px solid #ffffff26;
     border-radius: 16rpx;
     padding: 48rpx 10px;
-    color: #FFD5A0;
+    color: #ffd5a0;
     position: relative;
     margin: 24rpx 5px 0;
 
@@ -320,7 +381,7 @@ export default {
     }
 
     .icon::before {
-      content: '￥';
+      content: "￥";
       font-size: 24rpx;
     }
   }
@@ -330,18 +391,18 @@ export default {
     position: absolute;
     left: -1px;
     top: -1px;
-    background-color: #FFD5A0;
+    background-color: #ffd5a0;
     color: #765626;
     font-size: 22rpx;
     border-radius: 16rpx 0 16rpx 0;
     padding: 0 16rpx;
   }
 
-  .tag-name{
+  .tag-name {
     position: absolute;
     left: 0px;
     bottom: -1px;
-    background-color: #FFD5A0;
+    background-color: #ffd5a0;
     color: #765626;
     font-size: 22rpx;
     width: 100%;
@@ -364,7 +425,7 @@ export default {
 
   .warning {
     font-size: 22rpx;
-    background-color: #2A2A2A;
+    background-color: #2a2a2a;
     padding: 16rpx 32rpx;
   }
 }
@@ -390,16 +451,15 @@ export default {
   }
 }
 
-
 button {
   width: calc(100% - 64rpx);
   height: 92rpx;
   display: flex;
   justify-content: center;
   align-items: center;
-  background: linear-gradient(90deg, #F3CF97 0%, #F6E5C4 100%);
+  background: linear-gradient(90deg, #f3cf97 0%, #f6e5c4 100%);
   border-radius: 23px;
-  color: #7C541A;
+  color: #7c541a;
   font-size: 32rpx;
   font-weight: bold;
   margin: 32rpx auto;