Commit e212dc99 by 乔延琦

Merge branch 'develop-zhouyi' into 'develop'

feat(@rbc/rbc-login): add verificationCode

See merge request GFP/RBC/rbc-frontend!136
parents 33e4909d 2f18fa6e
...@@ -22,10 +22,15 @@ ...@@ -22,10 +22,15 @@
:model="userData" :model="userData"
:rules="ruleInline" :rules="ruleInline"
> >
<div class="input-field"> <div
class="input-field"
:class="{ 'with-verificationCode-code': withVerificationCode }"
>
<div <div
class="input-label" class="input-label"
:class="{ inputLabelFocus: signUserName === true || userData.username.length !== 0}" :class="{
inputLabelFocus: signUserName === true || userData.username.length !== 0
}"
>用户名</div> >用户名</div>
<FormItem prop="username"> <FormItem prop="username">
<Input <Input
...@@ -49,8 +54,11 @@ ...@@ -49,8 +54,11 @@
/> />
</FormItem> </FormItem>
</div> </div>
<div class="height2"></div> <div class="height2">
<div class="input-field"> <div
class="input-field"
:class="{ 'with-verificationCode-code': withVerificationCode }"
>
<div class="input-label" :class="{ inputLabelFocus: signPassword === true || userData.password.length !== 0}">密码</div> <div class="input-label" :class="{ inputLabelFocus: signPassword === true || userData.password.length !== 0}">密码</div>
<FormItem prop="password"> <FormItem prop="password">
...@@ -80,7 +88,29 @@ ...@@ -80,7 +88,29 @@
/> />
</FormItem> </FormItem>
</div> </div>
<div class="height2"></div> </div>
<div class="height2" v-if="withVerificationCode">
<div class="input-field verificationCode-code-field">
<div
class="input-label"
>验证码</div>
<FormItem prop="verificationCode">
<Input
style="width: calc(100% - 90px)"
v-model="userData.verificationCode"
size="default"
/>
<img
:src="verifyCodeImg"
style="width: 80px;height: 32px;"
@click="getVerificationCode"
/>
</FormItem>
</div>
</div>
</Form> </Form>
</div> </div>
<div class="login-btn"> <div class="login-btn">
...@@ -91,8 +121,9 @@ ...@@ -91,8 +121,9 @@
style="height: 40px" style="height: 40px"
@click="submit" @click="submit"
:loading="loginLoading" :loading="loginLoading"
>登录</Button
> >
登录
</Button>
</div> </div>
</div> </div>
</div> </div>
...@@ -120,23 +151,23 @@ export default { ...@@ -120,23 +151,23 @@ export default {
userData: { userData: {
username: "", username: "",
password: "", password: "",
verification: "", verificationCode: "",
}, },
ruleInline: { ruleInline: {
username: [ username: [
{ {
required: true, required: true,
message: "用户名不能为空", message: '用户名不能为空',
trigger: "blur", trigger: 'blur',
}, },
], ],
password: [ password: [
{ {
required: true, required: true,
message: "密码不能为空", message: '密码不能为空',
trigger: "blur", trigger: 'blur',
}, },
] ],
}, },
loginLoading: false, loginLoading: false,
bgimg: null, bgimg: null,
...@@ -145,6 +176,9 @@ export default { ...@@ -145,6 +176,9 @@ export default {
signPassword: false, signPassword: false,
verificationImg: null, verificationImg: null,
verifyuuid: "", verifyuuid: "",
withVerificationCode: false,
sessionId: null,
verifyCodeImg: null,
}; };
}, },
computed: { computed: {
...@@ -172,7 +206,6 @@ export default { ...@@ -172,7 +206,6 @@ export default {
} }
document.addEventListener('keyup', this.onKeyUp) document.addEventListener('keyup', this.onKeyUp)
this.getVerificationCode();
}, },
methods: { methods: {
onKeyUp(event) { onKeyUp(event) {
...@@ -192,7 +225,26 @@ export default { ...@@ -192,7 +225,26 @@ export default {
}) })
}, },
getLoginAssetsInfo() { getLoginAssetsInfo() {
this.imgLoading = 3 this.imgLoading = 4
this.getVerificationCode().then((res) => {
this.withVerificationCode = res.verifyOptionState === '1'
if (this.withVerificationCode) {
this.ruleInline['verificationCode'] = [
{
required: true,
message: '验证码不能为空',
trigger: 'blur',
},
]
}
this.$nextTick(() => {
this.$refs["userData"].resetFields()
this.imgLoading -= 1
})
}).catch(() => {
this.imgLoading -= 1
})
window.GMS.$http.post('/homepage/query', { pageType: '1' }).then((res) => { window.GMS.$http.post('/homepage/query', { pageType: '1' }).then((res) => {
const obj = res.data && res.data.data || [{}, {}] const obj = res.data && res.data.data || [{}, {}]
const bgImgCode = obj[0] && obj[0].ext3 const bgImgCode = obj[0] && obj[0].ext3
...@@ -201,13 +253,13 @@ export default { ...@@ -201,13 +253,13 @@ export default {
bgImgCode bgImgCode
? this.getImgUrl(bgImgCode).then((url) => { ? this.getImgUrl(bgImgCode).then((url) => {
this.loginImageBg = url this.loginImageBg = url
;--this.imgLoading this.imgLoading -= 1
}) })
: this.imgLoading -= 1 : this.imgLoading -= 1
iconCode iconCode
? this.getImgUrl(iconCode).then((url) => { ? this.getImgUrl(iconCode).then((url) => {
this.loginIcon = url this.loginIcon = url
;--this.imgLoading this.imgLoading -= 1
}) })
: this.imgLoading -= 1 : this.imgLoading -= 1
const boxImgCode = obj[1] && obj[1].icon const boxImgCode = obj[1] && obj[1].icon
...@@ -215,7 +267,7 @@ export default { ...@@ -215,7 +267,7 @@ export default {
boxImgCode boxImgCode
? this.getImgUrl(boxImgCode).then((url) => { ? this.getImgUrl(boxImgCode).then((url) => {
this.boxImgUrl = url this.boxImgUrl = url
;--this.imgLoading this.imgLoading -= 1
}) })
: this.imgLoading -= 1 : this.imgLoading -= 1
}).catch(() => { }).catch(() => {
...@@ -223,16 +275,6 @@ export default { ...@@ -223,16 +275,6 @@ export default {
}) })
}, },
// setBackground(imgUrl) {
// document.querySelector("#bgMB").animate(
// {
// zIndex: 2,
// opacity: 0,
// },
// 1000
// );
// },
enterkeydown($event) { enterkeydown($event) {
if ($event.keyCode === 13) { if ($event.keyCode === 13) {
this.submit(); this.submit();
...@@ -245,18 +287,25 @@ export default { ...@@ -245,18 +287,25 @@ export default {
this.loginLoading = true; this.loginLoading = true;
const name = this.userData.username; const name = this.userData.username;
const pwd = this.userData.password; const pwd = this.userData.password;
this.loginVerification(name, pwd); const verifyCode = this.userData.verificationCode
this.loginVerification(name, pwd, verifyCode);
} }
}); });
}, },
loginVerification(name, pwd) { loginVerification(name, pwd, verifyCode) {
//@king 20200801 vpn连不上,暂时去掉 let param = {
username: name,
password: pwd,
}
if (this.withVerificationCode) {
param['extInfo'] = {
verifyId: this.sessionId,
verifyCode: verifyCode,
}
}
GMS.util.nvwa GMS.util.nvwa
.login({ .login(param)
username: name,
password: pwd,
})
.then(res => { .then(res => {
this.loginLoading = false; this.loginLoading = false;
GMS.routerManager.afterLogin().then(() => { GMS.routerManager.afterLogin().then(() => {
...@@ -270,6 +319,7 @@ export default { ...@@ -270,6 +319,7 @@ export default {
}); });
if(res.data.code!=0 && res.data && res.data.msg){ if(res.data.code!=0 && res.data && res.data.msg){
this.$Message.error(res.data.msg); this.$Message.error(res.data.msg);
this.getVerificationCode();
} }
}) })
.catch((error) => { .catch((error) => {
...@@ -279,27 +329,27 @@ export default { ...@@ -279,27 +329,27 @@ export default {
this.$Message.error(res.data.msg); this.$Message.error(res.data.msg);
this.userData.username = ""; this.userData.username = "";
this.userData.password = ""; this.userData.password = "";
this.userData.verification = ""; this.userData.verificationCode = "";
}); });
}, },
getVerificationCode() { getVerificationCode() {
try { return GMS.$http.get(
this.verifyuuid = GMS.util.generateUUID(); `/rbc/verify-code/get?verifyId=${this.sessionId ? this.sessionId:''}`
GMS.$http.get( ).then((resp) => {
`/captcha/getCaptcha?clientId=${this.verifyuuid}`, if(!("data" in resp && 'success' in resp && 'error' in resp)){
{ resp = {
responseType: "blob", "data":resp.data.data ? resp.data.data : resp.data,
"success":true,
'error':null
} }
).then((res) => { }
if (res.data) { if (resp.success) {
this.verificationImg = window.URL.createObjectURL(res.data); this.verifyCodeImg = resp.data.verifyText
} this.sessionId = resp.data.verifyId
}) return resp.data
}
} catch (err) { })
console.log(err);
}
}, },
}, },
}; };
...@@ -440,6 +490,19 @@ export default { ...@@ -440,6 +490,19 @@ export default {
} }
} }
.with-verificationCode-code {
margin-bottom: 0;
}
.verificationCode-code-field {
margin-bottom: 5px;
/deep/ .ivu-form-item-content {
display: flex;
align-items: center;
justify-content: space-between;
}
}
.login-btn { .login-btn {
padding-left: 50px; padding-left: 50px;
width: 370px; width: 370px;
......
...@@ -170,7 +170,7 @@ export default { ...@@ -170,7 +170,7 @@ export default {
conditions.push(condition); conditions.push(condition);
} }
} }
this.seniorQuery = conditions this.seniorQuery = conditions.filter((o) => !!o.values)
this.$refs this.$refs
&& this.$refs.customQuery && this.$refs.customQuery
&& this.$refs.customQuery.initTemplate && this.$refs.customQuery.initTemplate
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment