Compare commits

..

No commits in common. "3881be316e222acb9149e5e12c27b48e8bbaea3c" and "902071013238ee8bbe3bc81cea69ca8d2874aa81" have entirely different histories.

1 changed files with 106 additions and 128 deletions

View File

@ -1,138 +1,116 @@
<template> <template>
<div class="login"> <div class="login">
<div class="login-header"> <div class="login-header">
<img src="../assets/image/logo.png" alt="" /> <img src="../assets/image/logo.png" alt="">
</div> </div>
<div class="login-view"> <div class="login-view">
<div class="login-title"> <div class="login-title">
<img src="../assets/image/login-icon.png" alt="" /> <img src="../assets/image/login-icon.png" alt="">
<span>用户登录</span> <span>用户登录</span>
</div> </div>
<div class="login-input username" :class="usernameAct ? 'active' : ''"> <div class="login-input username" :class="usernameAct?'active':''">
<img src="../assets/image/username.png" alt="" /> <img src="../assets/image/username.png" alt="">
<input <input v-model="username" @focus="usernameAct=true" @blur="usernameAct=false" type="text" placeholder="用户名">
v-model="username" </div>
@focus="usernameAct = true" <div class="login-input password" :class="passwordAct?'active':''">
@blur="usernameAct = false" <img src="../assets/image/password.png" alt="">
type="text" <input v-model="password" @focus="passwordAct=true" @blur="passwordAct=false" type="password" placeholder="密 码">
placeholder="用户名" </div>
/> <div class="save" @click="save=!save">
</div> <div>
<div class="login-input password" :class="passwordAct ? 'active' : ''"> <div><i v-if="save" class="el-icon-check"></i></div>
<img src="../assets/image/password.png" alt="" /> 记住密码
<input </div>
v-model="password" </div>
@focus="passwordAct = true" <div class="login-btn" @click="login">
@blur="passwordAct = false"
type="password" </div>
placeholder="密 码"
/>
</div>
<div class="save" @click="save = !save">
<div>
<div><i v-if="save" class="el-icon-check"></i></div>
记住密码
</div> </div>
</div>
<div class="login-btn" @keyup.enter="toLogin" @click="login"> </div>
</div> </div>
</div> </template>
</template>
<script> <script>
export default { export default {
data() { data(){
return { return {
usernameAct: false, usernameAct:false,
passwordAct: false, passwordAct:false,
save: false, save:false,
password: "", password:'',
username: "", username:'',
}; }
}, },
mounted() { mounted(){
if (localStorage.getItem("save")) { if(localStorage.getItem('save')){
this.password = localStorage.getItem("password"); this.password=localStorage.getItem('password')
this.username = localStorage.getItem("username"); this.username=localStorage.getItem('username')
this.save = true; this.save=true
} else { }else{
this.username = localStorage.getItem("username"); this.username=localStorage.getItem('username')
// this.save=true // this.save=true
}
if(localStorage.getItem('token')){
this.$router.push({ name: 'index' })
} }
if (localStorage.getItem("token")) { },
this.$router.push({ name: "index" }); methods:{
} login(){
this.toLogin(); var store=this.$store.state
},
methods: { // "username": "xiaomeng",
toLogin() { // "password": "lihe12345"
document.onkeydown = e =>{ if(!this.username){
if (!e.shiftKey && e.keyCode === 13) { this.$message.error("用户名未填写");
e.cancelBubble = true; //ie return
e.stopPropagation();//Firefox }
e.preventDefault(); //* if(!this.password){
if (e.srcElement.value) { this.$message.error("密码未填写");
this.login() return
}
var data = {
"username": this.username,
"password":this.password
}; //
this.api.login(data).then((res) => {
if(this.save){
localStorage.setItem('save',1)
localStorage.setItem('username',this.username)
localStorage.setItem('password',this.password)
}else{
localStorage.setItem('save',0)
localStorage.setItem('username',this.username)
if(localStorage.getItem('password')){
localStorage.removeItem('password')
}
} }
} if (res.data.code == 200) {
} this.$message({
message: '登陆成功',
type: "success",
});
store.equipmentIndex=1
localStorage.setItem('token',res.data.data.token)
localStorage.setItem('userInfo',JSON.stringify(res.data.data))
this.$router.push({ name: 'index' })
} else {
localStorage.removeItem('token')
this.$message.error(res.data.msg);
}
});
},
}, },
login() {
var store = this.$store.state; }
</script>
// "username": "xiaomeng",
// "password": "lihe12345"
if (!this.username) {
this.$message.error("用户名未填写");
return;
}
if (!this.password) {
this.$message.error("密码未填写");
return;
}
var data = {
username: this.username,
password: this.password,
}; //
this.api.login(data).then((res) => {
if (this.save) {
localStorage.setItem("save", 1);
localStorage.setItem("username", this.username);
localStorage.setItem("password", this.password);
} else {
localStorage.setItem("save", 0);
localStorage.setItem("username", this.username);
if (localStorage.getItem("password")) {
localStorage.removeItem("password");
}
}
if (res.data.code == 200) {
this.$message({
message: "登陆成功",
type: "success",
});
store.equipmentIndex = 1;
localStorage.setItem("token", res.data.data.token);
localStorage.setItem("userInfo", JSON.stringify(res.data.data));
this.$router.push({ name: "index" });
} else {
localStorage.removeItem("token");
this.$message.error(res.data.msg);
}
});
},
},
};
</script>
<style lang="scss" scoped> <style lang="scss" scoped>
.login { .login{
width: 100%; width: 100%;
height: 100%; height: 100%;
// min-height: 900px; // min-height: 900px;
background: url(../assets/image/login-bg.png) no-repeat center; background: url(../assets/image/login-bg.png) no-repeat center;
background-size: cover; background-size: cover;
background-position: center center; background-position:center center;
} }
</style> </style>