登录

src/api/common.js

@@ -597,6 +597,16 @@ export const HttpReq = {
         return res
       })
     },
+    // 请求短信验证
+    sendSmsCode: function(data) {
+      return request({
+        url: '/api/bsw/bigScreen/personalCenter/sendSmsCode',
+        method: 'post',
+        data: data
+      }).then((res) => {
+        return res
+      })
+    },
     id: null
   }
 }

src/api/login.js

 import request from '@/utils/request'
 
-export function login(username, password, code, uuid) {
+export function login(username, password, code, uuid, smsCode) {
   return request({
     url: 'auth/login',
     method: 'post',
@@ -8,7 +8,8 @@ export function login(username, password, code, uuid) {
       username,
       password,
       code,
-      uuid
+      uuid,
+      smsCode
     }
   })
 }

src/store/modules/user.js

@@ -30,7 +30,7 @@ const user = {
     Login({ commit }, userInfo) {
       const rememberMe = userInfo.rememberMe
       return new Promise((resolve, reject) => {
-        login(userInfo.username, userInfo.password, userInfo.code, userInfo.uuid).then(res => {
+        login(userInfo.username, userInfo.password, userInfo.code, userInfo.uuid, userInfo.smsCode).then(res => {
           setToken(res.token, rememberMe)
           commit('SET_TOKEN', res.token)
           setUserInfo(res.user, commit)

src/views/homepage/login.vue

@@ -37,8 +37,8 @@
               <img :src="codeUrl" @click="getCode">
             </div>
           </el-form-item>
-          <el-form-item v-show="mode!==1" prop="sms">
-            <el-input v-model="loginForm.sms" size="medium" auto-complete="off" placeholder="短信验证码" style="width: 70%" @keyup.enter.native="handleLogin">
+          <el-form-item v-show="mode!==1" prop="smsCode">
+            <el-input v-model="loginForm.smsCode" size="medium" auto-complete="off" placeholder="短信验证码" style="width: 70%" @keyup.enter.native="handleLogin">
               <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
             </el-input>
             <div class="login-code">
@@ -66,14 +66,15 @@
               <span class="underline touch" @click="changeMode(1)">使用已有账号登录</span>
             </div>
             <div style="padding: 10px 0;">
-              <el-checkbox v-model="loginForm.rememberMe" style="margin:0;opacity:0.8" />
-              <div class="login-agreement"><span class="touch">阅读并接受《中国基建传感器网用户协议》及《中国基建传感器网隐私权保护声明》</span></div>
+              <el-checkbox v-model="loginForm.agreement" style="margin:0;opacity:0.8" />
+              <div class="login-agreement"><span style="opacity:0.8">阅读并接受</span><span class="touch" @click="openView(1)">《中国基建传感器网用户协议》</span><span style="opacity:0.8">及</span><span class="touch" @click="openView(3)">《中国基建传感器网隐私权保护声明》</span></div>
             </div>
           </el-form-item>
         </el-form>
       </div>
     </div>
     <home-footer ref="homeFooter" />
+    <user-agreement ref="userAgreement" />
   </div>
 </template>
 
@@ -87,9 +88,11 @@ import titleMenus from './components/titleMenus'
 import userLogin from './components/userLogin'
 import languageSetting from './components/languageSetting'
 import homeFooter from './components/homeFooter'
+import { HttpReq } from '@/api/common'
+import userAgreement from './userAgreement'
 
 export default {
-  components: { titleMenus, userLogin, languageSetting, homeFooter },
+  components: { titleMenus, userLogin, languageSetting, homeFooter, userAgreement },
   data() {
     const validateMobile = (rule, value, callback) => {
       if (value === 'admin') {
@@ -137,15 +140,16 @@ export default {
         username: '',
         password: '',
         rememberMe: false,
+        agreement: true,
         code: '',
-        sms: '',
+        smsCode: '',
         uuid: ''
       },
       loginRules: {
         username: [{ required: true, trigger: 'blur', message: '手机号不能为空' }, { validator: validateMobile, trigger: 'blur' }],
         password: [{ validator: validatePass, trigger: 'blur' }],
         code: [{ validator: validateCode, trigger: 'change' }],
-        sms: [{ validator: validateSms, trigger: 'change' }]
+        smsCode: [{ validator: validateSms, trigger: 'change' }]
       },
       loading: false,
       redirect: undefined
@@ -182,12 +186,21 @@ export default {
     }
   },
   methods: {
+    openView(item) {
+      this.$refs.userAgreement.loadData(item)
+    },
     changeMode(mode) {
       this.mode = mode
       if (mode === 1) {
         this.title = '登录'
+        this.loginForm.password = ''
+        this.loginForm.code = ''
+        this.loginForm.smsCode = ''
       } else if (mode === 2) {
         this.title = '快捷登录'
+        this.loginForm.password = ''
+        this.loginForm.code = ''
+        this.loginForm.smsCode = ''
       } else {
         this.title = '注册'
       }
@@ -196,16 +209,34 @@ export default {
       if (this.timer && this.smsTime) {
         return
       }
-      this.smsBtn = '短信已发送'
-      this.smsTime = 30
-      this.timer = setInterval(() => {
-        this.smsTime--
-        if (this.smsTime === 0) {
-          clearInterval(this.timer)
-          this.timer = null
-          this.smsBtn = '短信获取验证码'
+      if (!this.loginForm.username) {
+        return this.$notify({
+          message: '请输入手机号！',
+          type: 'warning',
+          duration: 5000
+        })
+      }
+      HttpReq.webClientApi.sendSmsCode({
+        tel: this.loginForm.username
+      }).then((res) => {
+        this.$notify({
+          title: res.msg,
+          type: 'success',
+          duration: 2500
+        })
+        if (res.code === 200) {
+          this.smsBtn = '短信已发送'
+          this.smsTime = 30
+          this.timer = setInterval(() => {
+            this.smsTime--
+            if (this.smsTime === 0) {
+              clearInterval(this.timer)
+              this.timer = null
+              this.smsBtn = '短信获取验证码'
+            }
+          }, 1000)
         }
-      }, 1000)
+      })
     },
     getCode() {
       getCodeImg().then(res => {
@@ -224,7 +255,10 @@ export default {
         username: username === undefined ? this.loginForm.username : username,
         password: password,
         rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
-        code: ''
+        code: '',
+        agreement: true,
+        smsCode: '',
+        uuid: ''
       }
     },
     handleRegister() {
@@ -234,7 +268,7 @@ export default {
           password: this.loginForm.password,
           rememberMe: this.loginForm.rememberMe,
           code: this.loginForm.code,
-          sms: this.loginForm.sms,
+          smsCode: this.loginForm.smsCode,
           uuid: this.loginForm.uuid
         }
         if (user.password !== this.cookiePass) {
@@ -271,7 +305,7 @@ export default {
           password: this.loginForm.password,
           rememberMe: this.loginForm.rememberMe,
           code: this.loginForm.code,
-          sms: this.loginForm.sms,
+          smsCode: this.loginForm.smsCode,
           uuid: this.loginForm.uuid
         }
         if (user.password !== this.cookiePass) {