From 9e9e7b3bd346f5189becc20fb6ac127c320ec1ee Mon Sep 17 00:00:00 2001
From: wang <3597712270@qq.com>
Date: 星期二, 26 三月 2024 13:31:38 +0800
Subject: [PATCH] 前端页面
---
UI-Project/src/views/RegisterView.vue | 188 ++++++++++++++++++++++++++++++++--------------
1 files changed, 130 insertions(+), 58 deletions(-)
diff --git a/UI-Project/src/views/RegisterView.vue b/UI-Project/src/views/RegisterView.vue
index 605158d..44b8078 100644
--- a/UI-Project/src/views/RegisterView.vue
+++ b/UI-Project/src/views/RegisterView.vue
@@ -4,7 +4,8 @@
import type { FormProps,FormInstance, FormRules } from 'element-plus'
import {ElMessage,ElMessageBox} from "element-plus";
import request from "@/utils/request";
- import {Avatar, UserFilled} from "@element-plus/icons-vue";
+import { Lock,Avatar } from '@element-plus/icons-vue'
+ // import {Avatar, UserFilled} from "@element-plus/icons-vue";
const router = useRouter()
const route = useRoute()
@@ -101,6 +102,12 @@
}
})
}
+ const toLogin = () => {
+ router.push({
+ path:'/login',
+ })
+ }
+
@@ -108,76 +115,141 @@
</script>
<template>
- <h2 style="color: #1890FF">
- <span>
- <el-icon><UserFilled /></el-icon>
- <p>鍖楃幓ERP鐢ㄦ埛娉ㄥ唽</p>
- </span>
- </h2>
- <div id="main-div">
-
- <div id="register">
- <el-form
- :label-position="labelPosition"
- label-width="100px"
- :model="register"
- ref="ruleFormRef"
- status-icon
- :rules="rules"
- >
- <el-form-item label="濮撳悕锛�" prop="userName">
- <el-input v-model="register.userName" />
- </el-form-item>
-<!-- <el-form-item label="鐧婚檰鍚嶏細" prop="loginName">-->
-<!-- <el-input v-model="register.loginName" />-->
-<!-- </el-form-item>-->
- <el-form-item label="瀵嗙爜锛�" prop="passWord">
- <el-input type="password" v-model="register.passWord" />
- </el-form-item>
- <el-form-item label="纭瀵嗙爜锛�" prop="confirmPassword">
- <el-input type="password" v-model="register.confirmPassword" />
- </el-form-item>
- <el-form-item >
- <el-button
- :loading="loginLoadings"
- type="primary"
- @click="submitForm(ruleFormRef)"
- >娉ㄥ唽
- </el-button>
- </el-form-item>
- </el-form>
+
+ <div class="mainDiv" >
+ <div id="main-login">
+ <div>
+ <div style="position: absolute; left: 8vw; top: 6vw; ">
+ <img src="../../src/assets/3.png">
+ </div>
+ <div style="position: absolute; left: 15vw; top: 22vw; font-size: 55px;color: rgba(29, 33, 41, 1);">
+ 鍖楃幓MES绯荤粺
+ </div>
</div>
- </div>
+ <div id="div-login">
+ <el-form
+ @submit.native.prevent
+ ref="ruleFormRef"
+ :model="register"
+ status-icon
+ :rules="rules"
+ label-width="75px"
+ >
+ <div id="title">娉ㄥ唽鏂扮敤鎴�</div>
+ <div id="center">
+ <!-- <div style="color: rgba(78, 89, 105, 1);margin-bottom: 10px;">濮撳悕</div> -->
+ <el-form-item prop="userName" label="濮撳悕:">
+ <el-input
+ style="width: 200px;"
+ v-model="register.userName"
+ type="text"
+ autocomplete="off"
+ :prefix-icon="Avatar"
+ placeholder="璇疯緭鍏ュ鍚�"
+ />
+ </el-form-item>
+ <!-- <div style="color: rgba(78, 89, 105, 1);margin-bottom: 10px;">瀵嗙爜</div> -->
+ <el-form-item prop="passWord" label="瀵嗙爜:">
+ <el-input
+ style="width: 200px;"
+ v-model="register.passWord"
+ type="password"
+ autocomplete="off"
+ :prefix-icon="Lock"
+ placeholder="璇疯緭鍏ュ瘑鐮�"
+ show-password
+ />
+ </el-form-item>
+ <!-- <div style="color: rgba(78, 89, 105, 1);margin-bottom: 10px;">纭瀵嗙爜</div> -->
+ <el-form-item prop="confirmPassword" label="纭瀵嗙爜:">
+ <el-input
+ style="width: 200px;"
+ v-model="register.confirmPassword"
+ type="password"
+ :prefix-icon="Lock"
+ autocomplete="off"
+ show-password
+ placeholder="璇风‘璁ゅ瘑鐮�"
+ />
+ </el-form-item>
+ <el-form-item id="submitForm">
+ <el-button
+ :loading="loginLoadings"
+ type="primary"
+ @click="submitForm(ruleFormRef)"
+ plain
+ >纭娉ㄥ唽
+ </el-button>
+ <el-button
+ type="primary"
+ @click="toLogin"
+ plain
+ >鍙栨秷
+ </el-button>
+ </el-form-item>
+ </div>
+ </el-form>
+ </div>
+</div>
+</div>
</template>
<style scoped>
-#main-div{
- //overflow: hidden;
+/* #main-div{
position: absolute;
- left:50%;
- top:50%;
+ left:75%;
+ top:45%;
transform: translate(-50%, -50%);
-
-}
-h2{
- text-align: center;
- width: 100vw;
- margin-top: 10vh;
-}
-#register{
- background-color: #FAFAFA;
- width: 50vw;
- height: 50vh;
- border-radius: 12px;
+} */
+/* #register{
+ background-color: #fff;
+ width: 32vw;
+ height: 35vh;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0), 0 6px 5px 0 rgba(0,0,0,0.19);
display:flex;
align-items:center;
justify-content:center;
min-height: 280px;
-}
-.el-form{
+} */
+/* .el-form{
max-width: 300px;
+} */
+#div-login{
+ margin-top: 5%;
+ /* margin-top: 20%; */
+ /* margin-left: 650px; */
+ background-color: #fff;
+ border-radius: 4px;
+ float: right;
+ width: 40%;
+ height: 60%;
+ min-width: 318px;
+ box-shadow: 0 8px 16px 0 rgba(0,0,0,0), 0 6px 5px 0 rgba(0,0,0,0.19);
}
+#center{
+ margin-top: 45px;
+ margin-left: 100px;
+}
+.mainDiv{
+ overflow: hidden;
+ min-width: 718px;
+ background-image: url("../../src/assets/background.jpg");
+
+}
+#main-login{
+ margin: 150px auto 0 auto;
+ height: 70vh;
+ width: 80vw;
+}
+#submitForm{
+ margin-top: 30px;
+ margin-left: -10px;
+}
+#title{
+ font-size: 25px;
+ text-align: center;
+ margin-top: 10px;
+}
</style>
\ No newline at end of file
--
Gitblit v1.8.0