|
|
|
@ -7,11 +7,13 @@ |
|
|
|
</div> |
|
|
|
<div class="login-body"> |
|
|
|
<h3 class="login-title">{{ $t('login.title') }}</h3> |
|
|
|
<el-form :model="dataForm" |
|
|
|
:rules="dataRule" |
|
|
|
ref="dataForm" |
|
|
|
@keyup.enter.native="dataFormSubmitHandle()" |
|
|
|
status-icon> |
|
|
|
<el-form |
|
|
|
:model="dataForm" |
|
|
|
:rules="dataRule" |
|
|
|
ref="dataForm" |
|
|
|
@keyup.enter.native="dataFormSubmitHandle()" |
|
|
|
status-icon |
|
|
|
> |
|
|
|
<!-- <el-form-item> |
|
|
|
<el-select v-model="$i18n.locale" |
|
|
|
class="w-percent-100"> |
|
|
|
@ -22,25 +24,22 @@ |
|
|
|
</el-select> |
|
|
|
</el-form-item> --> |
|
|
|
<el-form-item prop="phone"> |
|
|
|
<el-input v-model="dataForm.phone" |
|
|
|
placeholder="手机号"> |
|
|
|
<span slot="prefix" |
|
|
|
class="el-input__icon"> |
|
|
|
<svg class="icon-svg" |
|
|
|
aria-hidden="true"> |
|
|
|
<el-input v-model="dataForm.phone" placeholder="手机号"> |
|
|
|
<span slot="prefix" class="el-input__icon"> |
|
|
|
<svg class="icon-svg" aria-hidden="true"> |
|
|
|
<use xlink:href="#icon-user"></use> |
|
|
|
</svg> |
|
|
|
</span> |
|
|
|
</el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="password"> |
|
|
|
<el-input v-model="dataForm.password" |
|
|
|
type="password" |
|
|
|
:placeholder="$t('login.password')"> |
|
|
|
<span slot="prefix" |
|
|
|
class="el-input__icon"> |
|
|
|
<svg class="icon-svg" |
|
|
|
aria-hidden="true"> |
|
|
|
<el-input |
|
|
|
v-model="dataForm.password" |
|
|
|
type="password" |
|
|
|
:placeholder="$t('login.password')" |
|
|
|
> |
|
|
|
<span slot="prefix" class="el-input__icon"> |
|
|
|
<svg class="icon-svg" aria-hidden="true"> |
|
|
|
<use xlink:href="#icon-lock"></use> |
|
|
|
</svg> |
|
|
|
</span> |
|
|
|
@ -49,39 +48,46 @@ |
|
|
|
<el-form-item prop="captcha"> |
|
|
|
<el-row :gutter="20"> |
|
|
|
<el-col :span="14"> |
|
|
|
<el-input v-model="dataForm.captcha" |
|
|
|
:placeholder="$t('login.captcha')"> |
|
|
|
<span slot="prefix" |
|
|
|
class="el-input__icon"> |
|
|
|
<svg class="icon-svg" |
|
|
|
aria-hidden="true"> |
|
|
|
<el-input |
|
|
|
v-model="dataForm.captcha" |
|
|
|
:placeholder="$t('login.captcha')" |
|
|
|
> |
|
|
|
<span slot="prefix" class="el-input__icon"> |
|
|
|
<svg class="icon-svg" aria-hidden="true"> |
|
|
|
<use xlink:href="#icon-safetycertificate"></use> |
|
|
|
</svg> |
|
|
|
</span> |
|
|
|
</el-input> |
|
|
|
</el-col> |
|
|
|
<el-col :span="10" |
|
|
|
class="login-captcha"> |
|
|
|
<img :src="captchaPath" |
|
|
|
@click="getCaptcha()"> |
|
|
|
<el-col :span="10" class="login-captcha"> |
|
|
|
<img :src="captchaPath" @click="getCaptcha()" /> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<el-button type="primary" |
|
|
|
@click="dataFormSubmitHandle()" |
|
|
|
class="w-percent-100">{{ $t('login.title') }}</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
@click="dataFormSubmitHandle()" |
|
|
|
class="w-percent-100" |
|
|
|
>{{ $t('login.title') }}</el-button |
|
|
|
> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
</div> |
|
|
|
<div class="login-footer"> |
|
|
|
<p> |
|
|
|
<a href="https://demo.cloud.renren.io/renren-cloud" |
|
|
|
target="_blank">{{ $t('login.demo') }}</a> |
|
|
|
<a |
|
|
|
href="https://demo.cloud.renren.io/renren-cloud" |
|
|
|
target="_blank" |
|
|
|
>{{ $t('login.demo') }}</a |
|
|
|
> |
|
|
|
</p> |
|
|
|
<!-- 2020 © renren.io --> |
|
|
|
<p><a href="https://www.renren.io/" |
|
|
|
target="_blank">{{ $t('login.copyright') }}</a></p> |
|
|
|
<p> |
|
|
|
<a href="https://www.renren.io/" target="_blank">{{ |
|
|
|
$t('login.copyright') |
|
|
|
}}</a> |
|
|
|
</p> |
|
|
|
</div> |
|
|
|
</main> |
|
|
|
</div> |
|
|
|
@ -92,12 +98,13 @@ |
|
|
|
import Cookies from 'js-cookie' |
|
|
|
import debounce from 'lodash/debounce' |
|
|
|
import { messages } from '@/i18n' |
|
|
|
import { getUUID } from '@/utils' |
|
|
|
import { getUUID, encryptedData } from '@/utils' |
|
|
|
export default { |
|
|
|
data () { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
i18nMessages: messages, |
|
|
|
captchaPath: '', |
|
|
|
pubKey: '', |
|
|
|
dataForm: { |
|
|
|
app: 'oper', |
|
|
|
client: 'web', |
|
|
|
@ -110,11 +117,9 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
dataRule () { |
|
|
|
dataRule() { |
|
|
|
return { |
|
|
|
phone: [ |
|
|
|
{ required: true, message: '手机号不能为空', trigger: 'blur' } |
|
|
|
], |
|
|
|
phone: [{ required: true, message: '手机号不能为空', trigger: 'blur' }], |
|
|
|
password: [ |
|
|
|
{ required: true, message: '密码不能为空', trigger: 'blur' } |
|
|
|
], |
|
|
|
@ -124,32 +129,62 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
created () { |
|
|
|
created() { |
|
|
|
this.getCaptcha() |
|
|
|
|
|
|
|
//获取公钥 |
|
|
|
this.getPubKey() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 获取验证码 |
|
|
|
getCaptcha () { |
|
|
|
getCaptcha() { |
|
|
|
this.dataForm.uuid = getUUID() |
|
|
|
this.captchaPath = `${window.SITE_CONFIG['apiURL']}/auth/login/captcha?uuid=${this.dataForm.uuid}` |
|
|
|
}, |
|
|
|
// 表单提交 |
|
|
|
dataFormSubmitHandle: debounce(function () { |
|
|
|
this.$refs['dataForm'].validate((valid, messageObj) => { |
|
|
|
if (!valid) { |
|
|
|
app.util.validateRule(messageObj) |
|
|
|
} |
|
|
|
this.$http.post('/auth/login/operweb/loginbypassword', this.dataForm).then(({ data: res }) => { |
|
|
|
|
|
|
|
// 获取公钥 |
|
|
|
getPubKey() { |
|
|
|
this.$http |
|
|
|
.post('/auth/govweb/getKey') |
|
|
|
.then(({ data: res }) => { |
|
|
|
if (res.code !== 0) { |
|
|
|
this.getCaptcha() |
|
|
|
return this.$message.error(res.msg) |
|
|
|
} |
|
|
|
localStorage.setItem('userType', 'oper') |
|
|
|
Cookies.set('token', res.data.token) |
|
|
|
this.$router.replace({ name: 'home' }).catch(() => { }) |
|
|
|
}).catch(() => { }) |
|
|
|
}) |
|
|
|
}, 1000, { 'leading': true, 'trailing': false }) |
|
|
|
|
|
|
|
this.pubKey = res.data // 获取到公钥; |
|
|
|
}) |
|
|
|
.catch(() => {}) |
|
|
|
}, |
|
|
|
|
|
|
|
// 表单提交 |
|
|
|
dataFormSubmitHandle: debounce( |
|
|
|
function () { |
|
|
|
this.$refs['dataForm'].validate((valid, messageObj) => { |
|
|
|
if (!valid) { |
|
|
|
app.util.validateRule(messageObj) |
|
|
|
} |
|
|
|
const { pubKey } = this |
|
|
|
this.$http |
|
|
|
.post('/auth/login/operweb/loginbypassword', { |
|
|
|
...this.dataForm, |
|
|
|
phone: encryptedData(pubKey, this.dataForm.phone), |
|
|
|
password: encryptedData(pubKey, this.dataForm.password) |
|
|
|
}) |
|
|
|
.then(({ data: res }) => { |
|
|
|
if (res.code !== 0) { |
|
|
|
this.getCaptcha() |
|
|
|
return this.$message.error(res.msg) |
|
|
|
} |
|
|
|
localStorage.setItem('userType', 'oper') |
|
|
|
Cookies.set('token', res.data.token) |
|
|
|
this.$router.replace({ name: 'home' }).catch(() => {}) |
|
|
|
}) |
|
|
|
.catch(() => {}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
1000, |
|
|
|
{ leading: true, trailing: false } |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
dai
3 years ago