Merge branch 'yoona' into 'master'

登录注册修改密码

See merge request pigbigbig/beyond-clouds-front!24

pages/users/login.vue

@@ -4,7 +4,7 @@
       <div class="login-header">
         <embed src="../../assets/svg/whiteLogo.svg" width="111" height="26"
                type="image/svg+xml"
-               pluginspage="http://www.adobe.com/svg/viewer/install/" />
+               pluginspage="http://www.adobe.com/svg/viewer/install/"/>
         <div class="header-register" @click="handleRegister">注册</div>
       </div>
       <login-card
@@ -13,6 +13,7 @@
         title2="短信登录"
         commitment="1"
         button="登录"
+        :errMessage="errMessage"
         @login="handleLogin"
       ></login-card>
       <div class="login-footer">Copyright © 2019 云里云外开源社区 All Rights Reserved · 京ICP备 1234567891号-11</div>
@@ -25,26 +26,50 @@
 const Cookie = process.client ? require('js-cookie') : null
 import LoginCard from '../../components/pc/loginCard';
 import config from "../../action/config";
+
 export default {
   name: "index",
   layout: 'blank',
   components: {
     LoginCard
   },
-  methods:{
+  data() {
+    return {
+      errMessage: ''
+    }
+  },
+  methods: {
     async handleLogin(way, account, password, phone, verification) {
+      this.errMessage = '';
       console.log(way);
       console.log(account);
       console.log(password);
-      console.log(phone);
-      console.log(verification);
+      console.log(way && account !== '' && password !== '');
+      console.log(!way && account !== '' && verification !== '');
+      let authResponse;
 
-      const authResponse = await this.$axios.$post(config.api.post.Authentication.accountAuth, {
+      // 密码登录 way为 true  验证码 way 为 false
+      if (way && account !== '' && password !== '') {
+        let reg = /^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$).{8,16}$/;
+        if (!reg.test(password) || password.length < 8) {
+          this.errMessage = '密码格式错误';
+          return false
+        }
+        authResponse = await this.$axios.$post(config.api.post.Authentication.accountAuth, {
           mobile: account,
           password: password
         });
+      } else if (!way && account !== '' && verification !== '') {
+        authResponse = await this.$axios.$post(config.api.post.Authentication.smsAuth, {
+          mobile: account,
+          verifyCode: verification
+        });
+      }
+      // console.log(authResponse);
+
       // 认证成功
-      if (authResponse.code === 0) {
+      if (authResponse !== undefined && authResponse.code === 0) {
+        // 获取token
         const token = authResponse.data.accessToken
         const store = this.$store
 
@@ -64,22 +89,23 @@ export default {
           this.$message({
             type: 'success',
             message: '登录成功！'
-          })
+          });
           this.$router.push('/')
         } else {
           store.commit('auth/logout')
           store.commit('userProfile/removeUser')
         }
-      } else {
+      } else if (authResponse !== undefined) {
         // 认证失败
+        this.errMessage = authResponse.msg
         this.$message({
           type: 'error',
           message: authResponse.msg
-        })
+        });
       }
     },
     // 跳转注册页面
-    handleRegister(){
+    handleRegister() {
       this.$router.push('/users/register');
     }
   }
@@ -87,7 +113,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-  .login-container{
+  .login-container {
     position: absolute;
     top: 0;
     bottom: 0;
@@ -96,23 +122,27 @@ export default {
     background-image: url("../../assets/img/background.png");
     background-repeat: no-repeat;
     background-size: cover;
-    .login-center{
+
+    .login-center {
       width: $pageWidth;
       height: 100%;
       margin: 0 auto;
       @extend %flex-column-spb;
-      .login-header{
+
+      .login-header {
         width: 100%;
         margin-top: 20*$length;
         @extend %flex-row-spb;
-        @include fontStyle(14,20,500,#fff,left);
-        .header-register{
+        @include fontStyle(14, 20, 500, #fff, left);
+
+        .header-register {
           @extend %cursorPointer;
         }
       }
-      .login-footer{
+
+      .login-footer {
         margin-bottom: 30*$length;
-        @include fontStyle(12,17,500,#fff,center);
+        @include fontStyle(12, 17, 500, #fff, center);
         cursor: default;
       }
     }

pages/users/register.vue

 <template>
+  <transition>
     <div class="register-wrap">
       <div class="register-container" v-if="!success">
         <login-card
@@ -7,22 +8,23 @@
           title2="邮箱号注册"
           commitment="2"
           button="注册"
+          :errMessage="errMessage"
           @login="handleRegister"
         ></login-card>
       </div>
-    <transition>
       <div class="register-success" v-if="success">
         <yun-icon name="success" size="40px" color="#75D098"></yun-icon>
         <p style="color: #75D098;">注册成功</p>
         <p>请查看邮箱收件箱验证账号</p>
         <button>前往验证</button>
       </div>
-    </transition>
     </div>
+  </transition>
 </template>
 
 <script>
 import LoginCard from '../../components/pc/loginCard';
+import config from "../../action/config";
 
 export default {
   name: "register",
@@ -31,17 +33,50 @@ export default {
   },
   data(){
     return{
-      success: false
+      success: false,
+      errMessage: ''
     }
   },
   methods:{
-    handleRegister(way, account, password, phone, verification) {
+    async handleRegister(way, account, password, phone, verification) {
+      this.errMessage = '';
       console.log(way);
       console.log(account);
       console.log(password);
       console.log(phone);
       console.log(verification);
-      this.success = true
+      let registerResponse;
+
+      if (verification !== '' && password !== '' && account !== '') {
+        let reg = /^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$).{8,16}$/;
+        if (!reg.test(password) || password.length < 8) {
+          this.errMessage = '密码格式错误';
+          return false
+        }
+        registerResponse = await this.$axios.$post(config.api.post.User.register, {
+          mobile: account,
+          password: password,
+          verifyCode: verification
+        })
+      } else if (account !== '' && password !== '') {
+        // 邮箱注册
+      }
+      console.log(registerResponse);
+
+      // 注册成功
+      if (registerResponse !== undefined && registerResponse.code === 0) {
+        this.success = true;
+        setTimeout(() => {
+          this.$router.push('/users/login');
+        }, 2500)
+      } else if(registerResponse !== undefined) {
+        this.errMessage = registerResponse.msg;
+        // 注册失败
+        this.$message({
+          type: 'error',
+          message: registerResponse.msg
+        })
+      }
     }
   }
 }

pages/users/reset.vue

@@ -5,6 +5,7 @@
       class="login-card-container"
       button="重置账号"
       commitment="2"
+      :errMessage="errMessage"
       @login="handleReset"
     ></login-card>
   </div>
@@ -13,37 +14,81 @@
 <script>
 import PageHeader from '../../components/pc/pageHeader';
 import LoginCard from '../../components/pc/loginCard';
+import config from "../../action/config";
+
+
 export default {
   name: "index",
   layout: 'blank',
   components: {
     LoginCard, PageHeader
   },
-  methods:{
-    handleReset(way, account, password, phone, verification) {
+  data() {
+    return {
+      errMessage: ''
+    }
+  },
+  methods: {
+    async handleReset(way, account, password, phone, verification) {
+      this.errMessage = '';
       console.log(way);
       console.log(account);
       console.log(password);
       console.log(phone);
       console.log(verification);
+
+      let resetResponse;
+
+      if (account !== '' && password !== '' && verification !== '') {
+        let reg = /^(?![0-9]+$)(?![a-z]+$)(?![A-Z]+$)(?!([^(0-9a-zA-Z)])+$).{8,16}$/;
+        if (!reg.test(password) || password.length < 8) {
+          this.errMessage = '密码格式错误';
+          return false
+        }
+        resetResponse = await this.$axios.$put(config.api.put.User.revisePassword, {
+          mobile: account,
+          password: password,
+          verifyCode: verification
+        });
+      }
+      console.log(resetResponse);
+
+      // 修改密码成功
+      if (resetResponse !== undefined && resetResponse.code === 0) {
+        this.$message({
+          type: 'success',
+          message: resetResponse.msg
+        });
+        setTimeout(() => {
+          this.$router.push('/users/login');
+        }, 2500)
+      } else if(resetResponse !== undefined) {
+        this.errMessage = resetResponse.msg;
+        // 修改密码失败
+        this.$message({
+          type: 'error',
+          message: resetResponse.msg
+        })
+      }
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-  .login-container{
+  .login-container {
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
     background-image: $bgImage;
-    .login-card-container{
+
+    .login-card-container {
       position: absolute;
       top: 50%;
       left: 50%;
-      transform: translate(-50%,-50%);
+      transform: translate(-50%, -50%);
     }
   }
 </style>