64 lines
2.4 KiB
Vue
64 lines
2.4 KiB
Vue
|
<template>
|
||
|
|
<div class="wrapper">
|
||
|
|
<div style="margin: 200px auto; background-color: #fff; width: 800px; height: 400px; border-radius: 10px">
|
||
|
|
<div >
|
||
|
|
<img
|
||
|
|
class="image"
|
||
|
|
style="height: 400px;width: 300px;float: left;"
|
||
|
|
src="../img/Login/login_top.png"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<div style="height: 400px;width: 430px;float: left;margin:30px 0 0 40px;">
|
||
|
|
<div style="margin: 20px 0; text-align: center; font-size: 24px"><b>匠承非遗后台管理系统</b></div>
|
||
|
|
<el-form :model="user" ref="userForm">
|
||
|
|
<el-form-item prop="username">
|
||
|
|
<h2>账号</h2>
|
||
|
|
<el-input size="medium" style="margin: 10px 0" prefix-icon="el-icon-user" v-model="username"></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
<el-form-item prop="password">
|
||
|
|
<h2>密码</h2>
|
||
|
|
<el-input size="medium" style="margin: 10px 0;" prefix-icon="el-icon-lock" show-password v-model="password"></el-input>
|
||
|
|
</el-form-item>
|
||
|
|
<div style="margin: 10px 0; text-align: right">
|
||
|
|
<div style="display: block;
|
||
|
|
font-size: 15px;
|
||
|
|
width: 80%;
|
||
|
|
margin: 50px auto 0 auto;
|
||
|
|
text-align: center;
|
||
|
|
border-radius: 20px;
|
||
|
|
background-color: rgb(172, 115, 82);
|
||
|
|
line-height: 40px;
|
||
|
|
" @click="login">登录</div>
|
||
|
|
</div>
|
||
|
|
</el-form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
import {ref, reactive} from 'vue'
|
||
|
|
import { ElMessage } from 'element-plus'
|
||
|
|
import {useRouter} from 'vue-router'
|
||
|
|
|
||
|
|
const user = ref({})
|
||
|
|
const username = ref('')
|
||
|
|
const password = ref('')
|
||
|
|
const router = useRouter()
|
||
|
|
const login = () => {
|
||
|
|
// console.log(username)
|
||
|
|
// console.log(password)
|
||
|
|
if(username.value ==="a"&& password.value ==="1"){
|
||
|
|
router.push("/UserManagement")
|
||
|
|
}}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.wrapper{
|
||
|
|
height: 100vh;
|
||
|
|
background-image:url("../img/Login/登录底图.png");
|
||
|
|
background-size: 100% 100%;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
</style>
|