This commit is contained in:
wangjinlei
2021-06-24 15:48:23 +08:00
parent a3100f3c73
commit f0e4bdbd5e
2 changed files with 165 additions and 154 deletions

View File

@@ -1,167 +1,178 @@
<template>
<div class="login-wrap">
<div class="ms-login">
<div class="ms-title">{{ $t('system.title') }}</div>
<el-form :model="param" :rules="rules" ref="login" label-width="0px" class="ms-content">
<el-form-item prop="username">
<el-input v-model="param.username" auto-complete="off" placeholder="username">
<i slot="prefix" class="el-icon-lx-people" />
<!-- <el-button slot="prepend" icon="el-icon-lx-people"></el-button> -->
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input type="password" auto-complete="off" placeholder="password" v-model="param.password">
<i slot="prefix" class="el-icon-lx-lock" />
<!-- <el-button slot="prepend" icon="el-icon-lx-lock"></el-button> -->
</el-input>
</el-form-item>
<div class="login-btn">
<el-button type="primary" @click="submitForm()">{{ $t('system.login') }}</el-button>
</div>
<el-row style="text-align: left">
<el-col :span="12">
<el-link :underline="false" type="primary" @click="doRetrieve()">{{ $t('system.repassword') }}</el-link>
</el-col>
<el-col :span="12" style="text-align: right">
<el-link :underline="false" type="primary" @click="doRegister()">{{ $t('system.register') }}</el-link>
</el-col>
<el-col :span="24" style="margin-top: 5px;">
<el-link :underline="false" type="primary" @click="doRetrieve()">
<img class="orcid" src="../../assets/img/orcid.png" style="float: left;margin: -1px 5px 0 0;"/>Login with your orcid
</el-link>
</el-col>
</el-row>
</el-form>
</div>
</div>
<div class="login-wrap">
<div class="ms-login">
<div class="ms-title">{{ $t('system.title') }}</div>
<el-form :model="param" :rules="rules" ref="login" label-width="0px" class="ms-content">
<el-form-item prop="username">
<el-input v-model="param.username" auto-complete="off" placeholder="username">
<i slot="prefix" class="el-icon-lx-people" />
<!-- <el-button slot="prepend" icon="el-icon-lx-people"></el-button> -->
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input type="password" auto-complete="off" placeholder="password" v-model="param.password">
<i slot="prefix" class="el-icon-lx-lock" />
<!-- <el-button slot="prepend" icon="el-icon-lx-lock"></el-button> -->
</el-input>
</el-form-item>
<div class="login-btn">
<el-button type="primary" @click="submitForm()">{{ $t('system.login') }}</el-button>
</div>
<el-row style="text-align: left">
<el-col :span="12">
<el-link :underline="false" type="primary" @click="doRetrieve()">{{ $t('system.repassword') }}</el-link>
</el-col>
<el-col :span="12" style="text-align: right">
<el-link :underline="false" type="primary" @click="doRegister()">{{ $t('system.register') }}</el-link>
</el-col>
<el-col :span="24" style="margin-top: 5px">
<el-link :underline="false" type="primary" @click="skip_check()">
<img class="orcid" src="../../assets/img/orcid.png" style="float: left; margin: -1px 5px 0 0" />Login with your
orcid
</el-link>
</el-col>
</el-row>
</el-form>
</div>
</div>
</template>
<script>
export default {
data: function() {
return {
aa: localStorage.getItem('ms_journal'),
param: {
username: '',
password: ''
},
rules: {
username: [{
required: true,
message: 'enter one user name',
trigger: 'blur'
}],
password: [{
required: true,
message: 'Please input a password',
trigger: 'blur'
}]
}
};
},
methods: {
submitForm() {
//登录操作
this.$refs.login.validate((valid) => {
if (valid) {
this.$api
.post('api/user/checkLogin', this.param)
.then((res) => {
console.log(res);
if (res.code == 1) {
this.$message.error('Login failed, user name or password error!');
return false;
} else {
this.$message.success('login success');
localStorage.setItem('ms_username', res.userinfo.account);
if (this.param.username == 'superadmin' || this.param.username == 'wuxiongzhi2') {
localStorage.setItem('ms_userrole', 'admin');
} else if (res.userinfo.type == 1 && res.userinfo.is_reviewer) {
localStorage.setItem('ms_userrole', 'reviewer');
} else {
localStorage.setItem('ms_userrole', res.userinfo.type);
}
this.$router.push('/');
}
})
.catch((err) => {
console.log(err);
});
} else {
this.$message.error('Please enter the correct account and password');
console.log('error submit!!');
return false;
}
});
},
doRegister() {
//注册页面
this.$router.push({
path: '/register'
});
},
doRetrieve() {
//找回密码
this.$router.push({
path: '/retrieve'
});
}
}
};
export default {
data: function () {
return {
aa: localStorage.getItem('ms_journal'),
orcidLink:
'https://orcid.org/oauth/authorize?client_id=APP-PKF0BGRP6DWM6FUB&response_type=code&scope=/authenticate&redirect_uri=https://submission.tmrjournals.com/orcidLink',
param: {
username: '',
password: ''
},
rules: {
username: [
{
required: true,
message: 'enter one user name',
trigger: 'blur'
}
],
password: [
{
required: true,
message: 'Please input a password',
trigger: 'blur'
}
]
}
};
},
methods: {
submitForm() {
//登录操作
this.$refs.login.validate((valid) => {
if (valid) {
this.$api
.post('api/user/checkLogin', this.param)
.then((res) => {
console.log(res);
if (res.code == 1) {
this.$message.error('Login failed, user name or password error!');
return false;
} else {
this.$message.success('login success');
localStorage.setItem('ms_username', res.userinfo.account);
if (this.param.username == 'superadmin' || this.param.username == 'wuxiongzhi2') {
localStorage.setItem('ms_userrole', 'admin');
} else if (res.userinfo.type == 1 && res.userinfo.is_reviewer) {
localStorage.setItem('ms_userrole', 'reviewer');
} else {
localStorage.setItem('ms_userrole', res.userinfo.type);
}
this.$router.push('/');
}
})
.catch((err) => {
console.log(err);
});
} else {
this.$message.error('Please enter the correct account and password');
console.log('error submit!!');
return false;
}
});
},
doRegister() {
//注册页面
this.$router.push({
path: '/register'
});
},
doRetrieve() {
//找回密码
this.$router.push({
path: '/retrieve'
});
},
skip_check() {
location.href = this.orcidLink;
}
}
};
</script>
<style scoped>
.login-wrap {
position: relative;
width: 100%;
height: 100%;
background-image: url(../../assets/img/login-bg.jpg);
background-size: 100%;
}
.login-wrap {
position: relative;
width: 100%;
height: 100%;
background-image: url(../../assets/img/login-bg.jpg);
background-size: 100%;
}
.ms-title {
width: 100%;
line-height: 50px;
text-align: center;
font-size: 20px;
color: #fff;
border-bottom: 1px solid #ddd;
}
.ms-title {
width: 100%;
line-height: 50px;
text-align: center;
font-size: 20px;
color: #fff;
border-bottom: 1px solid #ddd;
}
.ms-login {
position: absolute;
left: 50%;
top: 50%;
width: 350px;
margin: -190px 0 0 -175px;
border-radius: 5px;
background: rgba(255, 255, 255, 0.3);
overflow: hidden;
}
.ms-login {
position: absolute;
left: 50%;
top: 50%;
width: 350px;
margin: -190px 0 0 -175px;
border-radius: 5px;
background: rgba(255, 255, 255, 0.3);
overflow: hidden;
}
.ms-content {
padding: 30px 30px;
}
.ms-content {
padding: 30px 30px;
}
.login-btn {
text-align: center;
}
.login-btn {
text-align: center;
}
.login-btn button {
width: 100%;
height: 36px;
margin-bottom: 10px;
}
.login-btn button {
width: 100%;
height: 36px;
margin-bottom: 10px;
}
.login-tips {
font-size: 12px;
line-height: 30px;
color: #fff;
}
.login-tips {
font-size: 12px;
line-height: 30px;
color: #fff;
}
.orcid {
display: block;
width: 15px;
height: 15px;
}
.orcid {
display: block;
width: 15px;
height: 15px;
}
</style>

View File

@@ -99,12 +99,12 @@
registerRules: {
username: [{
required: true,
message: '请输入用户名',
message: 'Please enter your username.',
trigger: 'blur'
}],
password: [{
required: true,
message: '请输入密码',
message: 'Please enter your password.',
trigger: 'blur'
}],
name: [{