From e208aa1ef8e861dba168e8d83ab3066fc9f1e02d Mon Sep 17 00:00:00 2001 From: 严智鑫 <test> Date: 星期二, 16 四月 2024 13:30:45 +0800 Subject: [PATCH] Merge branch 'master' of http://10.153.19.25:10101/r/HangZhouMes --- UI-Project/src/views/LoginView.vue | 207 +++++++++++++++++++++++++-------------------------- 1 files changed, 101 insertions(+), 106 deletions(-) diff --git a/UI-Project/src/views/LoginView.vue b/UI-Project/src/views/LoginView.vue index c1515b9..43eea2f 100644 --- a/UI-Project/src/views/LoginView.vue +++ b/UI-Project/src/views/LoginView.vue @@ -1,24 +1,22 @@ <script lang="ts" setup> -import {onMounted, onUnmounted, reactive, ref} from "vue" -import {useRouter,useRoute } from 'vue-router' +import {onMounted, onUnmounted, reactive, ref} from 'vue' +import {useRoute, useRouter} from 'vue-router' import type {FormInstance, FormRules} from 'element-plus' -import { ElMessage } from "element-plus"; -import { Lock,Avatar } from '@element-plus/icons-vue' +import {ElMessage} from 'element-plus' import request from '@/utils/request' import userInfo from '@/stores/userInfo' - -const store=userInfo() -let ruleFormRef = ref<FormInstance>() +const store = userInfo() +let ruleFormRef = ref<FormInstance>() const router = useRouter() const route = useRoute() const userForm = reactive({ - userId: '', - pass: '' + userName: '', + password: '', }) -if (typeof(route.query.id) != "undefined"){ +if (typeof route.query.id != 'undefined') { userForm.userId = <string>route.query.id } @@ -39,8 +37,8 @@ } const rules = reactive<FormRules<typeof userForm>>({ - userId: [{ validator: validateUser, trigger: 'blur' }], - pass: [{ validator: validatePass, trigger: 'blur' }] + userId: [{validator: validateUser, trigger: 'blur'}], + pass: [{validator: validatePass, trigger: 'blur'}], }) //鐧婚檰鏂规硶 @@ -48,37 +46,39 @@ if (!formEl) return formEl.validate((valid) => { if (valid) { - loginLoadings.value=true - request.post('/user/login', - userForm).then((res) => { - if(res['code']==200){ - store.$patch({user:res.data}) + loginLoadings.value = true + request + .post('/userinfo/login', userForm) + .then((res) => { + if (res['code'] == 200) { + store.$patch({user: res.data}) + console.log(res.data) - router.push('/main') - ElMessage.success(`鐧诲綍鎴愬姛`) - } else { - ElMessage.error(res['msg']) - loginLoadings.value=false - return false - } - }).catch(error => { - ElMessage.error("鏈嶅姟鍣ㄨ繛鎺ュけ璐�") - loginLoadings.value=false - return false - }) + router.push('/main') + ElMessage.success(`鐧诲綍鎴愬姛`) + } else { + ElMessage.error(res['msg']) + loginLoadings.value = false + return false + } + }) + .catch((error) => { + ElMessage.error('鏈嶅姟鍣ㄨ繛鎺ュけ璐�') + loginLoadings.value = false + return false + }) } }) } function register() { - router.push({ - path:'/register', + path: '/register', }) } -let loginLoadings= ref(false) -let registerLoadings= ref(false) +let loginLoadings = ref(false) +let registerLoadings = ref(false) const keyDown = (e) => { // 鍥炶溅鍒欐墽琛岀櫥褰曟柟娉� enter閿殑ASCII鏄�13 @@ -86,82 +86,71 @@ submitForm(ruleFormRef.value) } } -onMounted(()=>{ +onMounted(() => { window.addEventListener('keydown', keyDown) }) onUnmounted(() => { window.removeEventListener('keydown', keyDown) }) - </script> <template> - <div class="mainDiv" > + <div class="mainDiv"> <div id="main-login"> <!-- <img style="width: 100%; height: 99vh" src="../../src/assets/background.jpg" /> --> <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 id="div-login"> - <el-form - @submit.native.prevent - ref="ruleFormRef" - :model="userForm" - status-icon - :rules="rules" - > - <div id="center"> - <div style="color: rgba(78, 89, 105, 1);margin-bottom: 10px;">璐﹀彿</div> - <el-form-item prop="userId"> - <el-input - style="width: 340px;" - v-model="userForm.userId" - 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="pass"> - <el-input - style="width: 340px;" - v-model="userForm.pass" - type="password" - autocomplete="off" - :prefix-icon="Lock" - show-password - placeholder="璇疯緭鍏ュ瘑鐮�" - /> - </el-form-item> - <el-form-item id="submitForm"> - <el-button - :loading="loginLoadings" - type="primary" - native-type="submit" - @click="submitForm(ruleFormRef)" - @keyup.enter.native="keyDown(e)" - plain - >鐧诲綍 - </el-button> - <el-button - :loading="registerLoadings" - type="primary" - @click="register" - plain - >娉ㄥ唽 - </el-button> - - </el-form-item> + <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 id="div-login"> + <el-form @submit.native.prevent + ref="ruleFormRef" + :model="userForm" + status-icon + :rules="rules"> + <div id="center"> + <div style="color: rgba(78, 89, 105, 1);margin-bottom: 10px;">璐﹀彿</div> + <el-form-item prop="userId"> + <el-input style="width: 340px;" + v-model="userForm.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="pass"> + <el-input style="width: 340px;" + v-model="userForm.password" + type="password" + autocomplete="off" + :prefix-icon="Lock" + show-password + placeholder="璇疯緭鍏ュ瘑鐮�"/> + </el-form-item> + <el-form-item id="submitForm"> + <el-button :loading="loginLoadings" + type="primary" + native-type="submit" + @click="submitForm(ruleFormRef)" + @keyup.enter.native="keyDown(e)" + plain>鐧诲綍 + </el-button> + <el-button :loading="registerLoadings" + type="primary" + @click="register" + plain>娉ㄥ唽 + </el-button> + + </el-form-item> + </div> </el-form> </div> </div> @@ -170,18 +159,19 @@ </template> <style scoped> -.mainDiv{ +.mainDiv { overflow: hidden; min-width: 718px; - background-image: url("../../src/assets/background.jpg"); - + background-image: url('../../src/assets/background.jpg'); } -#main-login{ + +#main-login { margin: 150px auto 0 auto; height: 70vh; width: 80vw; } -#img-div{ + +#img-div { width: 55%; height: 100%; display: flex; @@ -189,11 +179,13 @@ align-items: center; float: left; } -#img-pic{ + +#img-pic { max-height: 90%; max-width: 100%; } -#div-login{ + +#div-login { margin-top: 5%; /* margin-top: 20%; */ /* margin-left: 650px; */ @@ -203,22 +195,25 @@ height: 60%; min-width: 318px; border-radius: 4px; - box-shadow: 0 8px 16px 0 rgba(0,0,0,0), 0 6px 5px 0 rgba(0,0,0,0.19); + box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0), 0 6px 5px 0 rgba(0, 0, 0, 0.19); } -#center{ + +#center { margin-top: -30px; } -.el-form{ + +.el-form { width: 60%; margin: 20% auto auto; } + #submitForm { display: flex; justify-content: space-evenly; margin-top: 2rem; } -:deep(.el-form-item__content){ - flex: unset +:deep(.el-form-item__content) { + flex: unset; } </style> \ No newline at end of file -- Gitblit v1.8.0