小程序

Mr.Shi

2023-09-04 682182cf67a5aa9fed34335fea22d4673f30f10c

 minipro_standard/pages/updatePhone/updatePhone.vue

@@ -8,7 +8,7 @@
         <view class="password_list_item">
            <text>当前绑定</text>
            <view class="password_list_item_box">
               <input type="number" disabled v-model="form.currentPhone" maxlength="11">
               <input type="number" disabled v-model="userInfo.companyUser.phone" maxlength="11">
            </view>
         </view>
         <view class="password_list_item">
@@ -22,7 +22,7 @@
            <view class="password_list_item_box">
               <input type="text" v-model="form.verificationCode" maxlength="4" placeholder="请输入手机验证码">
               <p @click="getVerificationCode" v-if="!code.isOpen">获取验证码</p>
               <p @click="getVerificationCode" v-else>{{code.num}}</p>
               <p v-else>{{code.num}}</p>
            </view>
         </view>
      </view>
@@ -35,15 +35,50 @@
</template>

<script>
   import { mapState } from 'vuex'
   import { phoneRegular } from '@/common/config.js'
   export default {
      data() {
         return {
            form: {
               currentPhone: '',
               newPhone: '',
               verificationCode: ''
            },
            code: {
               num: 60,
               isOpen: false,
               timer: 0
            }
         };
      },
      computed: mapState([
         'userInfo'
      ]),
      methods: {
         // 获取验证码
         getVerificationCode() {
            this.code.isOpen = true
            this.code.timer = setInterval(() => {
               if (this.code.num === 0) {
                  clearInterval(this.code.timer)
                  this.code.isOpen = false
                  this.code.num = 60
               }
               this.code.num = this.code.num - 1
            }, 1000)
         },
         // 提交修改
         submit() {
            if (!this.form.newPhone) {
               uni.showToast({ title: '新手机号不能为空', icon: 'none', duration: 2000 });
            } else if (!phoneRegular.test(this.form.newPhone)) {
               uni.showToast({ title: '手机号不合法', icon: 'none', duration: 2000 });
            } else if (!this.form.verificationCode) {
               uni.showToast({ title: '验证码不能为空', icon: 'none', duration: 2000 });
            } else {
               console.log('可以提交')
            }
         }
      }
   }
</script>