代码调整

src/common/variables.scss

@@ -2,4 +2,21 @@ $labelColor: #666C70;
 $valueColor: #B6B5BA;
 $valueColor2: #353535;
 
+$whiteColor: #FFFFFF;
+
 $tabHeight: 50px;
+
+.btn-group {
+    position: fixed;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    display: flex;
+    flex-direction: row;
+    height: 50px;
+    padding: 0 17px;
+    background: $whiteColor;
+    .left, .right {
+        flex: auto;
+    }
+}
\ No newline at end of file

src/views/proof/components/AddBanner.vue

@@ -111,14 +111,6 @@ export default class AddBanner extends Vue {
       padding: 17px;
     }
     .btn-group{
-      position: fixed;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      display: flex;
-      flex-direction: row;
-      height: 50px;
-      padding: 0 17px;
       .left,.right{
         flex: auto;
       }

src/views/userCenter/SetPasswd.vue

@@ -5,7 +5,7 @@
         <van-field :value="userInfo.phone || userInfo.email" label="" readonly placeholder="请输入你的手机号" class="margin-top30"></van-field>
         <van-button block style="margin-top: 60px;" type="info" @click="step = '2'">获取验证码</van-button>
     </section>
-    <code-input v-if="step == '2'" :code.sync="code" :codeTo="userInfo.phone || userInfo.email" :sendCode="sendCode" :validateCode="validateCode" :next="showPassWordInputHandler"></code-input>
+    <code-input v-if="step == '2'" :code.sync="code" :codeTo="userInfo.phone || userInfo.email" @send-code="sendCode" @next="showPassWordInputHandler"></code-input>
       <section v-if="step == '3'">
         <div class="title">输入密码</div>
         <van-field v-model="pwd" label="" placeholder="请输入6~16位密码" class="margin-top30"></van-field>
@@ -70,7 +70,8 @@ export default class SetPasswd extends Vue {
       email,
     });
   }
-  private showPassWordInputHandler() {
+  private async showPassWordInputHandler() {
+    await this.validateCode();
     this.step = '3';
   }
   private async setPwd() {

src/views/userCenter/SetPhone.vue

@@ -11,22 +11,19 @@
         v-if="step === '2'"
         :code.sync="code"
         :codeTo="userInfo.phone || userInfo.email"
-        :sendCode="sendCode()"
-        :validateCode="validateOldAccount"
-        :next="showNewAccountInput"></code-input>
+        @send-code="sendCode()"
+        @next="showNewAccountInput"></code-input>
       <section v-if="step === '3'">
         <div class="title">输入新手机号</div>
         <van-field v-model="newPhone" label="" placeholder="请输入新手机号" class="margin-top30"></van-field>
         <van-button block type="info" class="margin-top30" @click="step='4'">确定</van-button>
       </section>
-      <!--         :validateCode="() => {}"
- -->
       <code-input
         v-if="step === '4'"
         :code.sync="code"
         :codeTo="newPhone"
-        :sendCode="sendCode(newPhone)"
-        :next="setPhone"></code-input>
+        @send-code="sendCode(newPhone)"
+        @next="setPhone"></code-input>
       <set-success
         v-if="step === '5'"
         :tip="'手机号设置成功'"></set-success>
@@ -84,7 +81,8 @@ export default class SetPhone extends Vue {
     });
     this.randomToken = random_token;
   }
-  private showNewAccountInput() {
+  private async showNewAccountInput() {
+    await this.validateOldAccount();
     this.step = '3';
     this.code = '';
   }

src/views/userCenter/components/CodeInput.vue

@@ -36,19 +36,21 @@ export default class CodeInput extends Vue {
     required: true,
   })private codeTo!: string;
   @Prop()private code!: string;
-  @Prop({
-    default: () => {
-      return () => {}
-    },
-  })private sendCode!: () => Promise<any>;
-  @Prop({
-    default: () => {
-      return () => {}
-    },
-  })private validateCode!: () => Promise<any>;
-  @Prop({
-    default: () => 0,
-  })private next!: () => Promise<any>;
+  // @Prop({
+  //   default: () => {
+  //     return () => {};
+  //   },
+  // })private sendCode!: () => Promise<any>;
+  // @Prop({
+  //   default: () => {
+  //     return () => {};
+  //   },
+  // })private validateCode!: () => Promise<any>;
+  // @Prop({
+  //   default: () => {
+  //     return () => {};
+  //   },
+  // })private next!: () => Promise<any>;
 
   private count: number = 0;
   private showKeyboard: boolean = true;
@@ -58,7 +60,8 @@ export default class CodeInput extends Vue {
   private timerDown() {
     if (this.count > 0 ) { return; }
     this.count = 60;
-    this.sendCode();
+    // this.sendCode();
+    this.$emit('send-code');
     const timer = setInterval(() => {
       if ( this.count <= 0) {
         clearInterval(timer);
@@ -75,13 +78,14 @@ export default class CodeInput extends Vue {
     const code = (this.code + key).slice(0, 6);
     this.$emit('update:code', code );
     if (code.length < 6) { return; }
-    try {
-      await this.validateCode();
-      this.showKeyboard = false;
-      await this.next();
-    } catch (err) {
-      console.error(err);
-    }
+    // try {
+    //   await this.validateCode();
+    //   this.showKeyboard = false;
+    //   await this.next();
+    // } catch (err) {
+    //   console.error(err);
+    // }
+    this.$emit('next');
   }
   private onDelete() {
     const { code, code: { length }} = this;