手机号格式校验

package-lock.json

@@ -1133,9 +1133,9 @@
       "integrity": "sha512-VZMYa7+fXHdwIq1TDhSXoVmSPEGM/aa+6Aiq3nVVJ9bXr24zScr+NlKFKC3iPljA7ho/GAZr+d2jOf5GIRC30Q=="
     },
     "@qg/cherry-ui": {
-      "version": "2.21.6",
-      "resolved": "http://npmprivate.quantgroups.com/@qg%2fcherry-ui/-/cherry-ui-2.21.6.tgz",
-      "integrity": "sha512-0FozrHsJneBnknKwlLvGdBn1uJq2eyWYP2Nm9WbzDdJzi/BdSMbSC5f/XmV2gwT++VWQvxOYzGHRaCMUD3ImGg==",
+      "version": "2.21.7",
+      "resolved": "http://npmprivate.quantgroups.com/@qg%2fcherry-ui/-/cherry-ui-2.21.7.tgz",
+      "integrity": "sha512-kFt8N5aQpTeAKNRldxIJyDIVJ8PSKawv+vLHTJhlZRJfW1d7UepkXdnA0sZwXJsSE/ID6DyUhUessIoKS0a6xA==",
       "requires": {
         "@popperjs/core": "^2.5.4",
         "vue-lazyload": "^1.3.3",

package.json

@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "@better-scroll/core": "^2.0.0-beta.6",
-    "@qg/cherry-ui": "^2.21.6",
+    "@qg/cherry-ui": "^2.21.7",
     "@qg/js-bridge": "^1.1.9",
     "@qg/qg-scroll": "^1.4.2",
     "@qg/ui-request": "0.0.20",

src/views/home/components/RechargeInput.vue

@@ -75,12 +75,6 @@ export default {
       setTimeout(() => {
         this.inputBlur = false;
       }, 500);
-
-      if (this.phoneNo && !checkPhoneFormat(this.phoneNo)) {
-        this.$toast.fail('请您输入正确的手机号');
-        this.input();
-        return;
-      }
       !this.phoneHome && this.queryhome();
       this.input();
     },

src/views/home/components/RechargeTop.vue

@@ -8,7 +8,9 @@
       >
         充值订单
       </a>
-      <a href="" class="top-link-title" @click="goOrderListTrack('联系客服', 'cs')">联系客服</a>
+      <a href="javascript:;" class="top-link-title" @click="goOrderListTrack('联系客服', 'cs')"
+        >联系客服</a
+      >
     </div>
     <div class="top-tabs">
       <p class="top-tabs-title">娱乐生活</p>

src/views/home/index.vue

@@ -33,7 +33,7 @@ import RechargeTop from './components/RechargeTop.vue';
 import RechargeList from './components/RechargeList.vue';
 import RechargeInput from './components/RechargeInput.vue';
 import localStorage from '@/service/localStorage.service';
-import { throttle } from '@/service/utils.service';
+import { throttle, checkPhoneFormat } from '@/service/utils.service';
 const { getSpuList } = api;
 export default {
   components: {
@@ -54,7 +54,11 @@ export default {
   },
   computed: {
     disabled: function() {
-      return this.rechargePhoneInfo.phoneNo && this.selectedRechargeInfo.salePrice;
+      return (
+        this.rechargePhoneInfo.phoneNo &&
+        checkPhoneFormat(this.rechargePhoneInfo.phoneNo) &&
+        this.selectedRechargeInfo.salePrice
+      );
     }
   },
   created() {

src/views/pay/index.less

 @import url('../../style/mixins');
 .pay {
-  // width: 100%;
   padding: @padding-xs;
-  .cr-coupon-list__item{
-    .cr-coupon-list__icon{
-      position:absolute !important;
-    }
-  }
 }
 .price-box {
   background-color: @white;

src/views/vipLife/components/AccountInput.vue

@@ -6,6 +6,7 @@
       clearable
       class="Vl__account__field"
       :type="info.type === 101 ? 'text' : 'number'"
+      @input="checkPhone"
     >
       <template #button>
         <cr-image
@@ -17,23 +18,11 @@
         />
       </template>
     </cr-field>
-    <!-- <div class="Vl__list" :class="{ show: !inputBlur }">
-      <div
-        v-for="(item, index) in list"
-        :key="index"
-        class="Vl__list-item"
-        @click="handleSelectPhone(item)"
-      >
-        <span class="phone">{{ phoneFormat(item.phone) }}</span>
-        <span class="phone-home">{{ item.home }}</span>
-        <span v-if="index === 0" class="current">上次充值</span>
-      </div>
-    </div> -->
   </div>
 </template>
 <script>
 import rechargeApi from '@/api/recharge.api';
-import { phoneFormat } from '@/service/utils.service';
+import { phoneFormat, phoneTrim } from '@/service/utils.service';
 export default {
   name: 'AccountInput',
   props: {
@@ -45,28 +34,20 @@ export default {
   },
   data: function() {
     return {
-      // inputBlur: true
-      // showList: false
-      // list: [
-      //   {
-      //     phone: '17165445433',
-      //     home: '北京 移动'
-      //   }
-      // ]
+      accountMask: ''
     };
   },
   computed: {
     maxLength() {
       return this.info.type !== 101 ? 13 : 30;
     },
-    accountMask: {
-      get() {
-        return this.info.type !== 101 ? this.phoneFormat(this.value) : this.value;
-      },
-      set(val) {
-        this.$emit('input', val.replace(/\s/g, ''));
-        // this.getPhoneHome();
+    phoneNo() {
+      return phoneTrim(this.accountMask);
     }
+  },
+  watch: {
+    info: function() {
+      this.checkPhone();
     }
   },
   methods: {
@@ -77,6 +58,14 @@ export default {
     async getPhoneHome() {
       const [res] = await rechargeApi({ phoneNo: this.value });
       this.phoneHome = res.phoneHome;
+    },
+    checkPhone() {
+      if (this.info.type !== 101) {
+        this.accountMask = this.phoneFormat(this.accountMask);
+      } else {
+        this.accountMask = this.phoneNo;
+      }
+      this.$emit('input', this.phoneNo);
     }
   }
 };

src/views/vipLife/index.vue

@@ -68,6 +68,7 @@ export default {
     disabled() {
       return (
         (this.spuInfo.rechargeAccountType !== 2 && !this.account) ||
+        (this.spuInfo.type !== 101 && !isPhone(this.account)) ||
         !this.skuList.length ||
         !this.skuInfo.hasStock
       );
@@ -162,11 +163,11 @@ export default {
       this.showLoading = false;
     },
     goOrder: throttle(async function() {
-      if (!this.account && this.spuInfo.rechargeAccountType !== 2)
-        return this.$toast.fail('请填写账号！');
-      if (this.spuInfo.type !== 101 && !isPhone(this.account)) {
-        return this.$toast.fail('请填写正确的手机号！');
-      }
+      // if (!this.account && this.spuInfo.rechargeAccountType !== 2)
+      //   return this.$toast.fail('请填写账号！');
+      // if (this.spuInfo.type !== 101 && !isPhone(this.account)) {
+      //   return this.$toast.fail('请填写正确的手机号！');
+      // }
       if (!this.skuInfo.skuNo) return this.$toast.fail('请选择类型！');
       this.$track.registeredEvents('h5_OtherRechargePageRechargeNowClick', {
         classify_name: this.spuData[this.currentTab - 1].name,