From bd21c609d3e0f325f10f20bb1f59ae24a4b35dc2 Mon Sep 17 00:00:00 2001
From: zhoushihao <zsh19950802@163.com>
Date: 星期一, 03 三月 2025 10:29:05 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
UI-Project/src/views/RegisterView.vue | 215 +++++++++++++++++++++++++++++++----------------------
1 files changed, 126 insertions(+), 89 deletions(-)
diff --git a/UI-Project/src/views/RegisterView.vue b/UI-Project/src/views/RegisterView.vue
index 605158d..28f731e 100644
--- a/UI-Project/src/views/RegisterView.vue
+++ b/UI-Project/src/views/RegisterView.vue
@@ -4,13 +4,15 @@
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";
+ import { useI18n } from 'vue-i18n'
+ const { t } = useI18n()
+ let language = ref(localStorage.getItem('lang') || 'zh')
const router = useRouter()
const route = useRoute()
let loginLoadings= ref(false)
const labelPosition = ref<FormProps['labelPosition']>('right')
-
//娉ㄥ唽鐢ㄦ埛鍙傛暟
const register = reactive({
userName: '',
@@ -18,40 +20,36 @@
passWord: '',
confirmPassword:''
})
-
/*鏂规硶*/
const checkName = (rule: any, value: any, callback: any) => {
if (value.trim() === '') {
- callback(new Error('濮撳悕涓嶈兘涓虹┖'))
+ callback(new Error(t('login.namea')))
}else if(value.length>16){
- callback(new Error('闀垮害涓嶈兘瓒呰繃16'))
+ callback(new Error(t('login.len')))
}else{
callback()
}
}
-
const checkPassword = (rule: any, value: any, callback: any) => {
if (value.trim() === '') {
- callback(new Error('瀵嗙爜涓嶈兘涓虹┖'))
+ callback(new Error(t('login.passnull')))
}else if(value.length>16 || value.length<6){
- callback(new Error('瀵嗙爜闀垮害涓嶈兘浣庝簬6鎴栬秴杩�16'))
+ callback(new Error(t('login.leng')))
}else{
callback()
}
}
-
const checkConfirmPassword = (rule: any, value: any, callback: any) => {
if (value.trim() === '') {
- callback(new Error('纭瀵嗙爜涓嶈兘涓虹┖'))
+ callback(new Error(t('login.spwn')))
}else if(value !== register.passWord){
- callback(new Error('涓ゆ瀵嗙爜涓嶇浉鍚�'))
+ callback(new Error(t('login.depass')))
}else if(value.length>16 || value.length<6){
- callback(new Error('瀵嗙爜闀垮害涓嶈兘浣庝簬6鎴栬秴杩�16'))
+ callback(new Error(t('login.leng')))
}else{
callback()
}
}
-
const ruleFormRef = ref<FormInstance>()
const rules = reactive<FormRules<typeof register>>({
userName: [{ validator: checkName, trigger: 'blur' }],
@@ -59,7 +57,6 @@
confirmPassword:[{ validator: checkConfirmPassword, trigger: 'blur' }],
// loginName: [{ validator: validateString, trigger: 'blur' }]
})
-
const submitForm = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.validate((valid) => {
@@ -86,98 +83,138 @@
}
})
})
-
- ElMessage.success(`娉ㄥ唽鎴愬姛`)
+ ElMessage.success(t('register.registerSuccessful'))
loginLoadings.value=false
} else {
ElMessage.error(res['msg'])
return false
}
}).catch(error => {
- ElMessage.error("鏈嶅姟鍣ㄨ繛鎺ュけ璐�")
+ ElMessage.error(t('main.connectErr'))
loginLoadings.value=false
return false
})
}
})
}
-
-
-
- // console.log(route.params)
+ const toLogin = () => {
+ router.push({
+ path:'/login',
+ })
+ }
</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);">
+ {{ $t('northglassMESsystem') }}
+ </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">{{ $t('register.newuserregister') }}</div>
+ <div id="center">
+ <!-- <div style="color: rgba(78, 89, 105, 1);margin-bottom: 10px;">濮撳悕</div> -->
+ <el-form-item prop="userName" :label="$t('register.name')">
+ <el-input
+ style="width: 200px;"
+ v-model="register.userName"
+ type="text"
+ autocomplete="off"
+ :prefix-icon="Avatar"
+ :placeholder="$t('register.inputname')"
+ />
+ </el-form-item>
+ <!-- <div style="color: rgba(78, 89, 105, 1);margin-bottom: 10px;">瀵嗙爜</div> -->
+ <el-form-item prop="passWord" :label="$t('register.password')">
+ <el-input
+ style="width: 200px;"
+ v-model="register.passWord"
+ type="password"
+ autocomplete="off"
+ :prefix-icon="Lock"
+ :placeholder="$t('register.pwErr')"
+ show-password
+ />
+ </el-form-item>
+ <!-- <div style="color: rgba(78, 89, 105, 1);margin-bottom: 10px;">纭瀵嗙爜</div> -->
+ <el-form-item prop="confirmPassword" :label="$t('register.passwordation')">
+ <el-input
+ style="width: 200px;"
+ v-model="register.confirmPassword"
+ type="password"
+ :prefix-icon="Lock"
+ autocomplete="off"
+ show-password
+ :placeholder="$t('register.pwErration')"
+ />
+ </el-form-item>
+ <el-form-item id="submitForm">
+ <el-button
+ :loading="loginLoadings"
+ type="primary"
+ @click="submitForm(ruleFormRef)"
+ plain
+ >{{ $t('register.registration') }}
+ </el-button>
+ <el-button
+ type="primary"
+ @click="toLogin"
+ plain
+ >{{ $t('register.false') }}
+ </el-button>
+ </el-form-item>
+ </div>
+ </el-form>
+ </div>
+</div>
+</div>
</template>
-
<style scoped>
-#main-div{
- //overflow: hidden;
- position: absolute;
- left:50%;
- top:50%;
- transform: translate(-50%, -50%);
-
-}
-h2{
- text-align: center;
- width: 100vw;
- margin-top: 10vh;
-}
-#register{
- background-color: #FAFAFA;
- width: 50vw;
- height: 50vh;
- border-radius: 12px;
+#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);
- display:flex;
- align-items:center;
- justify-content:center;
- min-height: 280px;
}
-.el-form{
- max-width: 300px;
+#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