You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
104 lines
2.6 KiB
104 lines
2.6 KiB
10 months ago
|
<template>
|
||
|
|
<div class="loginMain">
|
||
|
|
<div class="login">
|
||
|
|
<el-card shadow="hover" style="width: 450px">
|
||
|
|
<template #header>
|
||
|
|
<div style="text-align: center">
|
||
|
|
<el-button class="button" text @click="regist = false">
|
||
|
|
登录
|
||
|
|
</el-button>
|
||
|
|
<el-button class="button" text @click="regist = true">
|
||
|
|
注册
|
||
|
|
</el-button>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<div>
|
||
|
|
<el-form :model="regForm" label-suffix=":">
|
||
|
|
<el-form-item label="账号">
|
||
|
|
<el-input v-model="regForm.name" placeholder="请输入账号" />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="密码">
|
||
|
|
<el-input v-model="regForm.password" type="password" placeholder="请输入密码" show-password />
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item label="邮箱" v-if="regist">
|
||
|
|
<el-input v-model="regForm.email" placeholder="请输入邮箱" />
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
</div>
|
||
|
|
<template #footer>
|
||
|
|
<div style="text-align: center">
|
||
|
|
<el-button class="button" v-if="regist" @click="login">
|
||
|
|
注册
|
||
|
|
</el-button>
|
||
|
|
<el-button class="button" v-else @click="login"> 登录 </el-button>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-card>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
import {
|
||
|
|
loginFun, //登录
|
||
|
|
} from "@/api/login";
|
||
|
|
import md5 from "md5"
|
||
|
|
export default {
|
||
|
|
name: "login",
|
||
|
|
components: {},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
regist: false,
|
||
|
|
regForm: {
|
||
|
|
name: "",
|
||
|
|
password: "",
|
||
|
|
email: "",
|
||
|
|
},
|
||
|
|
};
|
||
|
|
},
|
||
|
|
watch: {},
|
||
|
|
computed: {},
|
||
|
|
async mounted() {
|
||
|
|
await this.init();
|
||
|
|
},
|
||
|
|
beforeUnmount() { },
|
||
|
|
|
||
|
|
methods: {
|
||
|
|
dealForm() {
|
||
|
|
return {
|
||
|
|
regist: this.regist,
|
||
|
|
name: this.regForm.name,
|
||
|
|
password: md5(this.regForm.password),
|
||
|
|
email: this.regForm.email,
|
||
|
|
}
|
||
|
|
},
|
||
|
|
async init() { },
|
||
|
|
async login() {
|
||
|
|
let formData = this.dealForm()
|
||
|
|
let res = await loginFun(formData)
|
||
|
|
if (!res.hasError) {
|
||
|
|
ElMessage.success("登陆成功");
|
||
|
|
localStorage.setItem("userId", res.list._id)
|
||
|
|
localStorage.setItem("userName", res.list.name)
|
||
|
|
this.$router.push("/bug")
|
||
|
|
} else {
|
||
|
|
ElMessage.error(res.msg);
|
||
|
|
localStorage.clear()
|
||
|
|
}
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
<style scoped>
|
||
|
|
.loginMain {
|
||
|
|
background-image: url("@/assets/img/login.jpg");
|
||
|
|
background-size: 100% 100%;
|
||
|
|
height: 100vh;
|
||
|
|
width: 100vw;
|
||
|
|
}
|
||
|
|
|
||
|
|
.login {
|
||
|
|
padding-top: calc(50vh - 165px);
|
||
|
|
padding-left: calc(50vw - 225px);
|
||
|
|
}
|
||
|
|
</style>
|