WIN-20230912WHV\Administrator 1 rok pred
rodič
commit
6eed50001a
3 zmenil súbory, kde vykonal 121 pridanie a 74 odobranie
  1. 1 1
      api/common.js
  2. 120 73
      pages/login/register.vue
  3. BIN
      static/img/login/Vector.png

+ 1 - 1
api/common.js

@@ -5,7 +5,7 @@ const commonUrl = '/api/common/'
 export const commonSend = (data) => request(commonUrl + 'send', 'post', { ...data })
 export const getRegion = (data) => request(commonUrl + 'region', 'post', { ...data })
 export const getTxySts = (data) => request(commonUrl + 'tx-sts', 'post', { ...data })
-export const getMessage = (data) => request(commonUrl + 'message', 'post', { ...data })
+export const getMessage = (data) => request(commonUrl + 'message', 'post', { ...data },false)
 export const getBaiDuImgRecognition = (data) => request(commonUrl + 'recognition', 'post', { ...data })
 export const getSn = (data) => request(commonUrl + 'sn', 'post', { ...data },true)
 

+ 120 - 73
pages/login/register.vue

@@ -1,40 +1,59 @@
 <template>
   <view class="page-box login-box">
     <view class="login-form sys-radius-50 sys-background-fff">
-      <view class="from-box animate__animated animate__fadeIn">
-        <view class=" input-img">
-          <button class="head-button" open-type="chooseAvatar" @chooseavatar="onChooseAvatar" >
-          <image :src="accountData.head_img"  class="head-img"></image>
-          </button>
-          <view class="head-text text-color-666 sys-size-24">点击上传头像</view>
+      <view class="from-box ">
+        <view class="step-item animate__animated animate__fadeIn" v-if="stepNum===1">
+          <view class=" input-img">
+            <button class="head-button" open-type="chooseAvatar" @chooseavatar="onChooseAvatar" >
+              <image :src="accountData.head_img"  class="head-img"></image>
+            </button>
+            <view class="head-text text-color-666 sys-size-24">点击上传头像</view>
+          </view>
+          <view class="input-item  sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':shakeNum===1}" >
+            <en-input type="nickname" class="login-input" placeholder="请输入昵称"  v-model="accountData.nickname"  ></en-input>
+          </view>
+          <view class="input-item  sys-from-background-color sys-radius-30 animate__animated"  :class="{'animate__shakeX':shakeNum===2}">
+            <en-input type="text" class="login-input" placeholder="请输入姓名"  v-model="accountData.name"  ></en-input>
+          </view>
         </view>
-        <view class="input-item  sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':shakeNum===1}" >
-          <en-input type="nickname" class="login-input" placeholder="请输入昵称"  v-model="accountData.nickname"  ></en-input>
-        </view>
-        <view class="input-item  sys-from-background-color sys-radius-30 animate__animated"  :class="{'animate__shakeX':shakeNum===2}">
-          <en-input type="text" class="login-input" placeholder="请输入姓名"  v-model="accountData.name"  ></en-input>
-        </view>
-        <view class="input-item  sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':shakeNum===3}" >
-          <en-input type="number" class="login-input" placeholder="请输入手机号"  v-model="accountData.phone"  ></en-input>
-        </view>
-        <view class="input-item  input-send sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':shakeNum===4}">
-          <en-input type="number" class="login-input" placeholder="请输入验证码"  v-model="accountData.code" maxlength="6"></en-input>
-          <view class="login-send text-color-dominant sys-size-28 sys-weight-400" @click="getVerifiedCode" v-if="timeNum<=0">发送验证码</view>
-          <view class="login-send text-color-dominant sys-size-28 sys-weight-400" v-else>{{ timeNum }} s</view>
-        </view>
-        <view class="input-item  sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':(shakeNum===5 || shakeNum===7)}" >
-          <en-input type="password" class="login-input" placeholder="请输入密码"  v-model="accountData.password" ></en-input>
-        </view>
-        <view class="input-item  sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':(shakeNum===6 || shakeNum===7)}">
-          <en-input type="password" class="login-input" placeholder="请再次输入密码"  v-model="accountData.passwordTwo" ></en-input>
+        <view class="step-item animate__animated animate__fadeIn" v-else>
+          <view class="back-set" @click="setStepNum(1)">
+            <image class="back-img" src="/static/img/login/Vector.png" mode="widthFix"></image>
+            <view class="back-text text-color-dominant sys-size-30 sys-weight-400">返回上一步</view>
+          </view>
+          <view class="input-item  sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':shakeNum===3}" >
+            <en-input type="number" class="login-input" placeholder="请输入手机号"  v-model="accountData.phone"  ></en-input>
+          </view>
+          <view class="input-item  input-send sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':shakeNum===4}">
+            <en-input type="number" class="login-input" placeholder="请输入验证码"  v-model="accountData.code" maxlength="6"></en-input>
+            <view class="login-send text-color-dominant sys-size-28 sys-weight-400" @click="getVerifiedCode" v-if="timeNum<=0">发送验证码</view>
+            <view class="login-send text-color-dominant sys-size-28 sys-weight-400" v-else>{{ timeNum }} s</view>
+          </view>
+          <view class="input-item  sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':(shakeNum===5 || shakeNum===7)}" >
+            <en-input type="password" class="login-input" placeholder="请输入密码"  v-model="accountData.password" ></en-input>
+          </view>
+          <view class="input-item  sys-from-background-color sys-radius-30 animate__animated" :class="{'animate__shakeX':(shakeNum===6 || shakeNum===7)}">
+            <en-input type="password" class="login-input" placeholder="请再次输入密码"  v-model="accountData.passwordTwo" ></en-input>
+          </view>
         </view>
+
+
       </view>
       <agreement v-model="isConsent" ref="agreement"></agreement>
 
       <view
+          v-if="stepNum===1"
+          class="input-but sys-background-dominant text-color-fff sys-size-30 sys-radius-100 sys-weight-600"
+          :class="{'sys-selected-but':isRegister,'sys-unselected-but':!isRegister}"
+          @click="setStepNum(2)"
+
+      >下一步</view>
+      <view
+          v-else
           class="input-but sys-background-dominant text-color-fff sys-size-30 sys-radius-100 sys-weight-600"
           :class="{'sys-selected-but':isRegister,'sys-unselected-but':!isRegister}"
           @click="register"
+
       >注册</view>
 
 
@@ -80,6 +99,7 @@ export default {
       isConsent: false,
       isRegister: false,
       shakeNum: 0,
+      stepNum:1,
     };
   },
   watch:{
@@ -94,6 +114,16 @@ export default {
     }
   },
   methods:{
+    setStepNum(stepNum){
+      if(stepNum===2){
+        if( !this.verifyData(true)){
+            return false
+        }
+      }
+      if(this.stepNum!==stepNum){
+        this.stepNum=stepNum
+      }
+    },
     onChooseAvatar(e) {
       // console.log(e);
       txUploadFile(e.detail.avatarUrl).then((res) => {
@@ -117,63 +147,68 @@ export default {
     },
     verifyData(type){
       let isRegister=true;
-
-      if(!this.accountData.nickname){
-        isRegister=false
-        if(type){
-          this.shakeNum=1
-          tools.error('请输入昵称');
-        }
-      }else if(!this.accountData.name){
-        isRegister=false
-        if(type){
-          this.shakeNum=2
-          tools.error('请输入姓名');
-        }
-      }else if(!this.accountData.phone){
-        isRegister=false
-        if(type){
-          this.shakeNum=3
-          tools.error('请输入手机号码');
-        }
-      }else if(!this.accountData.password){
-        isRegister=false
-        if(type){
-          this.shakeNum=5
-          tools.error('请输入密码');
-        }
-      }else if(!this.accountData.passwordTwo){
-        isRegister=false
-        if(type){
-          this.shakeNum=6
-          tools.error('请确认密码');
-        }
-      }else if(this.accountData.password!==this.accountData.passwordTwo){
-        isRegister=false
-        if(type){
-          this.shakeNum=7
-          tools.error('密码输入不一致');
-        }
-      }else if(!this.accountData.code){
-        isRegister=false
-        if(type){
-          this.shakeNum=4
-          tools.error('请输入验证码');
+      if(this.stepNum===1){
+        if(!this.accountData.nickname){
+          isRegister=false
+          if(type){
+            this.shakeNum=1
+            tools.error('请输入昵称');
+          }
+        }else if(!this.accountData.name){
+          isRegister=false
+          if(type){
+            this.shakeNum=2
+            tools.error('请输入姓名');
+          }
         }
-      }else if(!this.isConsent){
-        isRegister=false
-        if(type){
-          this.shakeNum=8
-          tools.error('请阅读并同意协议');
-          this.$refs.agreement.setConsentShake()
+      }else {
+       if(!this.accountData.phone){
+          isRegister=false
+          if(type){
+            this.shakeNum=3
+            tools.error('请输入手机号码');
+          }
+        }else if(!this.accountData.password){
+          isRegister=false
+          if(type){
+            this.shakeNum=5
+            tools.error('请输入密码');
+          }
+        }else if(!this.accountData.passwordTwo){
+          isRegister=false
+          if(type){
+            this.shakeNum=6
+            tools.error('请确认密码');
+          }
+        }else if(this.accountData.password!==this.accountData.passwordTwo){
+          isRegister=false
+          if(type){
+            this.shakeNum=7
+            tools.error('密码输入不一致');
+          }
+        }else if(!this.accountData.code){
+          isRegister=false
+          if(type){
+            this.shakeNum=4
+            tools.error('请输入验证码');
+          }
+        }else if(!this.isConsent){
+          isRegister=false
+          if(type){
+            this.shakeNum=8
+            tools.error('请阅读并同意协议');
+            this.$refs.agreement.setConsentShake()
+          }
         }
       }
+
       if(!isRegister){
         setTimeout(()=>{
           if(this.shakeNum>0)this.shakeNum=0
         },500)
       }
       this.isRegister=isRegister
+      return isRegister
 
     },
     register(){
@@ -256,6 +291,18 @@ export default {
     border-radius: 50rpx;
     padding: 40rpx 45rpx;
     animation-delay: 0.8s;
+    transition: 0.5s ease;
+    .back-set{
+      display: flex;
+      justify-content: flex-start;
+      align-items: center;
+      .back-img{
+        width: 38rpx;
+        margin-right: 20rpx;
+      }
+      .back-text{
+      }
+    }
     .input-item{
       height: 96rpx;
       padding: 28rpx 40rpx;

BIN
static/img/login/Vector.png