diff --git a/Front/vue-unilife/package.json b/Front/vue-unilife/package.json index 6656b96..97c4fc1 100644 --- a/Front/vue-unilife/package.json +++ b/Front/vue-unilife/package.json @@ -10,6 +10,7 @@ }, "dependencies": { "axios": "^1.8.3", + "element-plus": "^2.9.7", "vee-validate": "^4.15.0", "vue": "^3.5.13", "yup": "^1.6.1" diff --git a/Front/vue-unilife/pnpm-lock.yaml b/Front/vue-unilife/pnpm-lock.yaml index 024ecc5..9d06602 100644 --- a/Front/vue-unilife/pnpm-lock.yaml +++ b/Front/vue-unilife/pnpm-lock.yaml @@ -11,6 +11,9 @@ importers: axios: specifier: ^1.8.3 version: 1.8.3 + element-plus: + specifier: ^2.9.7 + version: 2.9.7(vue@3.5.13(typescript@5.7.3)) vee-validate: specifier: ^4.15.0 version: 4.15.0(vue@3.5.13(typescript@5.7.3)) @@ -56,6 +59,15 @@ packages: resolution: {integrity: sha512-emqcG3vHrpxUKTrxcblR36dcrcoRDvKmnL/dCL6ZsHaShW80qxCAcNhzQZrpeM765VzEos+xOi4s+r4IXzTwdQ==} engines: {node: '>=6.9.0'} + '@ctrl/tinycolor@3.6.1': + resolution: {integrity: sha512-SITSV6aIXsuVNV3f3O0f2n/cgyEDWoSqtZMYiAmcsYHydcKrOz3gUxB/iXd/Qf08+IZX4KpgNbvUdMBmWz+kcA==} + engines: {node: '>=10'} + + '@element-plus/icons-vue@2.3.1': + resolution: {integrity: sha512-XxVUZv48RZAd87ucGS48jPf6pKu0yV5UCg9f4FFwtrYxXOwWuVJo6wOvSLKEoMQKjv8GsX/mhP6UsC1lRwbUWg==} + peerDependencies: + vue: ^3.2.0 + '@esbuild/aix-ppc64@0.25.1': resolution: {integrity: sha512-kfYGy8IdzTGy+z0vFGvExZtxkFlA4zAxgKEahG9KE1ScBjpQnFsNOX8KTU5ojNru5ed5CVoJYXFtoxaq5nFbjQ==} engines: {node: '>=18'} @@ -206,6 +218,15 @@ packages: cpu: [x64] os: [win32] + '@floating-ui/core@1.6.9': + resolution: {integrity: sha512-uMXCuQ3BItDUbAMhIXw7UPXRfAlOAvZzdK9BWpE60MCn+Svt3aLn9jsPTi/WNGlRUu2uI0v5S7JiIUsbsvh3fw==} + + '@floating-ui/dom@1.6.13': + resolution: {integrity: sha512-umqzocjDgNRGTuO7Q8CU32dkHkECqI8ZdMZ5Swb6QAM0t5rnlrN3lGo1hdpscRd3WS8T6DKYK4ephgIH9iRh3w==} + + '@floating-ui/utils@0.2.9': + resolution: {integrity: sha512-MDWhGtE+eHw5JW7lq4qhc5yRLS11ERl1c7Z6Xd0a58DozHES6EnNNwUWbMiG4J9Cgj053Bhk8zvlhFYKVhULwg==} + '@jridgewell/sourcemap-codec@1.5.0': resolution: {integrity: sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==} @@ -304,9 +325,21 @@ packages: cpu: [x64] os: [win32] + '@sxzz/popperjs-es@2.11.7': + resolution: {integrity: sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ==} + '@types/estree@1.0.6': resolution: {integrity: sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==} + '@types/lodash-es@4.17.12': + resolution: {integrity: sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==} + + '@types/lodash@4.17.16': + resolution: {integrity: sha512-HX7Em5NYQAXKW+1T+FiuG27NGwzJfCX3s1GjOa7ujxZa52kjJLOr4FUxT+giF6Tgxv1e+/czV/iTtBw27WTU9g==} + + '@types/web-bluetooth@0.0.16': + resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==} + '@vitejs/plugin-vue@5.2.1': resolution: {integrity: sha512-cxh314tzaWwOLqVes2gnnCtvBDcM1UMdn+iFR+UjAn411dPT3tOmqrJjbMd7koZpMAmBM/GqeV4n9ge7JSiJJQ==} engines: {node: ^18.0.0 || >=20.0.0} @@ -383,9 +416,21 @@ packages: vue: optional: true + '@vueuse/core@9.13.0': + resolution: {integrity: sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==} + + '@vueuse/metadata@9.13.0': + resolution: {integrity: sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==} + + '@vueuse/shared@9.13.0': + resolution: {integrity: sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==} + alien-signals@1.0.4: resolution: {integrity: sha512-DJqqQD3XcsaQcQ1s+iE2jDUZmmQpXwHiR6fCAim/w87luaW+vmLY8fMlrdkmRwzaFXhkxf3rqPCR59tKVv1MDw==} + async-validator@4.2.5: + resolution: {integrity: sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==} + asynckit@0.4.0: resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==} @@ -416,6 +461,9 @@ packages: csstype@3.1.3: resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==} + dayjs@1.11.13: + resolution: {integrity: sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==} + de-indent@1.0.2: resolution: {integrity: sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg==} @@ -427,6 +475,11 @@ packages: resolution: {integrity: sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==} engines: {node: '>= 0.4'} + element-plus@2.9.7: + resolution: {integrity: sha512-6vjZh5SXBncLhUwJGTVKS5oDljfgGMh6J4zVTeAZK3YdMUN76FgpvHkwwFXocpJpMbii6rDYU3sgie64FyPerQ==} + peerDependencies: + vue: ^3.2.0 + entities@4.5.0: resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==} engines: {node: '>=0.12'} @@ -452,6 +505,9 @@ packages: engines: {node: '>=18'} hasBin: true + escape-html@1.0.3: + resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==} + estree-walker@2.0.2: resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==} @@ -511,6 +567,19 @@ packages: resolution: {integrity: sha512-ZhMwEosbFJkA0YhFnNDgTM4ZxDRsS6HqTo7qsZM08fehyRYIYa0yHu5R6mgo1n/8MgaPBXiPimPD77baVFYg+A==} engines: {node: '>=12.13'} + lodash-es@4.17.21: + resolution: {integrity: sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==} + + lodash-unified@1.0.3: + resolution: {integrity: sha512-WK9qSozxXOD7ZJQlpSqOT+om2ZfcT4yO+03FuzAHD0wF6S0l0090LRPDx3vhTTLZ8cFKpBn+IOcVXK6qOcIlfQ==} + peerDependencies: + '@types/lodash-es': '*' + lodash: '*' + lodash-es: '*' + + lodash@4.17.21: + resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==} + magic-string@0.30.17: resolution: {integrity: sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==} @@ -518,6 +587,9 @@ packages: resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==} engines: {node: '>= 0.4'} + memoize-one@6.0.0: + resolution: {integrity: sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==} + mime-db@1.52.0: resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==} engines: {node: '>= 0.6'} @@ -541,6 +613,9 @@ packages: engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} hasBin: true + normalize-wheel-es@1.2.0: + resolution: {integrity: sha512-Wj7+EJQ8mSuXr2iWfnujrimU35R2W4FAErEyTmJoJ7ucwTn2hOUSsRehMb5RSYkxXGTM7Y9QpvPmp++w5ftoJw==} + path-browserify@1.0.1: resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==} @@ -647,6 +722,17 @@ packages: vscode-uri@3.1.0: resolution: {integrity: sha512-/BpdSx+yCQGnCvecbyXdxHDkuk55/G3xwnC0GqY4gmQ3j+A+g8kzzgB4Nk/SINjqn6+waqw3EgbVF2QKExkRxQ==} + vue-demi@0.14.10: + resolution: {integrity: sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==} + engines: {node: '>=12'} + hasBin: true + peerDependencies: + '@vue/composition-api': ^1.0.0-rc.1 + vue: ^3.0.0-0 || ^2.6.0 + peerDependenciesMeta: + '@vue/composition-api': + optional: true + vue-tsc@2.2.8: resolution: {integrity: sha512-jBYKBNFADTN+L+MdesNX/TB3XuDSyaWynKMDgR+yCSln0GQ9Tfb7JS2lr46s2LiFUT1WsmfWsSvIElyxzOPqcQ==} hasBin: true @@ -679,6 +765,12 @@ snapshots: '@babel/helper-string-parser': 7.25.9 '@babel/helper-validator-identifier': 7.25.9 + '@ctrl/tinycolor@3.6.1': {} + + '@element-plus/icons-vue@2.3.1(vue@3.5.13(typescript@5.7.3))': + dependencies: + vue: 3.5.13(typescript@5.7.3) + '@esbuild/aix-ppc64@0.25.1': optional: true @@ -754,6 +846,17 @@ snapshots: '@esbuild/win32-x64@0.25.1': optional: true + '@floating-ui/core@1.6.9': + dependencies: + '@floating-ui/utils': 0.2.9 + + '@floating-ui/dom@1.6.13': + dependencies: + '@floating-ui/core': 1.6.9 + '@floating-ui/utils': 0.2.9 + + '@floating-ui/utils@0.2.9': {} + '@jridgewell/sourcemap-codec@1.5.0': {} '@rollup/rollup-android-arm-eabi@4.35.0': @@ -813,8 +916,18 @@ snapshots: '@rollup/rollup-win32-x64-msvc@4.35.0': optional: true + '@sxzz/popperjs-es@2.11.7': {} + '@types/estree@1.0.6': {} + '@types/lodash-es@4.17.12': + dependencies: + '@types/lodash': 4.17.16 + + '@types/lodash@4.17.16': {} + + '@types/web-bluetooth@0.0.16': {} + '@vitejs/plugin-vue@5.2.1(vite@6.2.2)(vue@3.5.13(typescript@5.7.3))': dependencies: vite: 6.2.2 @@ -927,8 +1040,29 @@ snapshots: typescript: 5.7.3 vue: 3.5.13(typescript@5.7.3) + '@vueuse/core@9.13.0(vue@3.5.13(typescript@5.7.3))': + dependencies: + '@types/web-bluetooth': 0.0.16 + '@vueuse/metadata': 9.13.0 + '@vueuse/shared': 9.13.0(vue@3.5.13(typescript@5.7.3)) + vue-demi: 0.14.10(vue@3.5.13(typescript@5.7.3)) + transitivePeerDependencies: + - '@vue/composition-api' + - vue + + '@vueuse/metadata@9.13.0': {} + + '@vueuse/shared@9.13.0(vue@3.5.13(typescript@5.7.3))': + dependencies: + vue-demi: 0.14.10(vue@3.5.13(typescript@5.7.3)) + transitivePeerDependencies: + - '@vue/composition-api' + - vue + alien-signals@1.0.4: {} + async-validator@4.2.5: {} + asynckit@0.4.0: {} axios@1.8.3: @@ -962,6 +1096,8 @@ snapshots: csstype@3.1.3: {} + dayjs@1.11.13: {} + de-indent@1.0.2: {} delayed-stream@1.0.0: {} @@ -972,6 +1108,27 @@ snapshots: es-errors: 1.3.0 gopd: 1.2.0 + element-plus@2.9.7(vue@3.5.13(typescript@5.7.3)): + dependencies: + '@ctrl/tinycolor': 3.6.1 + '@element-plus/icons-vue': 2.3.1(vue@3.5.13(typescript@5.7.3)) + '@floating-ui/dom': 1.6.13 + '@popperjs/core': '@sxzz/popperjs-es@2.11.7' + '@types/lodash': 4.17.16 + '@types/lodash-es': 4.17.12 + '@vueuse/core': 9.13.0(vue@3.5.13(typescript@5.7.3)) + async-validator: 4.2.5 + dayjs: 1.11.13 + escape-html: 1.0.3 + lodash: 4.17.21 + lodash-es: 4.17.21 + lodash-unified: 1.0.3(@types/lodash-es@4.17.12)(lodash-es@4.17.21)(lodash@4.17.21) + memoize-one: 6.0.0 + normalize-wheel-es: 1.2.0 + vue: 3.5.13(typescript@5.7.3) + transitivePeerDependencies: + - '@vue/composition-api' + entities@4.5.0: {} es-define-property@1.0.1: {} @@ -1017,6 +1174,8 @@ snapshots: '@esbuild/win32-ia32': 0.25.1 '@esbuild/win32-x64': 0.25.1 + escape-html@1.0.3: {} + estree-walker@2.0.2: {} follow-redirects@1.15.9: {} @@ -1069,12 +1228,24 @@ snapshots: is-what@4.1.16: {} + lodash-es@4.17.21: {} + + lodash-unified@1.0.3(@types/lodash-es@4.17.12)(lodash-es@4.17.21)(lodash@4.17.21): + dependencies: + '@types/lodash-es': 4.17.12 + lodash: 4.17.21 + lodash-es: 4.17.21 + + lodash@4.17.21: {} + magic-string@0.30.17: dependencies: '@jridgewell/sourcemap-codec': 1.5.0 math-intrinsics@1.1.0: {} + memoize-one@6.0.0: {} + mime-db@1.52.0: {} mime-types@2.1.35: @@ -1091,6 +1262,8 @@ snapshots: nanoid@3.3.9: {} + normalize-wheel-es@1.2.0: {} + path-browserify@1.0.1: {} perfect-debounce@1.0.0: {} @@ -1168,6 +1341,10 @@ snapshots: vscode-uri@3.1.0: {} + vue-demi@0.14.10(vue@3.5.13(typescript@5.7.3)): + dependencies: + vue: 3.5.13(typescript@5.7.3) + vue-tsc@2.2.8(typescript@5.7.3): dependencies: '@volar/typescript': 2.4.12 diff --git a/Front/vue-unilife/src/components/LogPage.vue b/Front/vue-unilife/src/components/LogPage.vue index 41ad970..9f37792 100644 --- a/Front/vue-unilife/src/components/LogPage.vue +++ b/Front/vue-unilife/src/components/LogPage.vue @@ -8,7 +8,7 @@ import { ref ,watch} from 'vue' // 注册登录切换 const transRate = ref('90') const switchLogin = ref(true); -const switchLoginMethod = ref(true); +const switchLoginMethod = ref(true); const switchLoginMethodEvent = () =>{ password.value = vericode.value = verifyPassword.value = ""; switchLoginMethod.value = !switchLoginMethod.value; @@ -50,11 +50,25 @@ const form_box = ref(null); //表单验证 -const {handleSubmit, errors} = useForm({ - validationSchema: yup.object({ - email: yup.string().email("请输入正确的邮箱").required("请输入邮箱"), - password: yup.string().required("请输入密码").min(6, "密码至少6位"), - verifyPassword: yup.string().required("请再次输入密码").oneOf([yup.ref('password')], '两次密码不一致'), //验证两次密码是否一致 +//注册表单 +const RegisterForm = useForm({ + validationSchema : yup.object({ + email: yup.string().email("请输入邮箱").required("请输入正确的邮箱"), + password: yup.string().min(6,"密码至少6位").required("请输入密码"), + verifyPassword: yup.string().oneOf([yup.ref('password')],"两次密码不一致").required("请确认密码"), + vericode: yup.string().required("请输入验证码") + }), +}) +//登录表单 +const LoginPasswordForm = useForm({ + validationSchema : yup.object({ + email: yup.string().email("请输入邮箱").required("请输入正确的邮箱"), + password: yup.string().min(6,"密码至少6位").required("请输入密码"), + }), +}) +const LoginEmailForm = useForm({ + validationSchema : yup.object({ + email: yup.string().email("请输入邮箱").required("请输入正确的邮箱"), vericode: yup.string().required("请输入验证码") }), }) @@ -66,29 +80,24 @@ const {value: vericode} = useField('vericode')//验证码 //错误提示 const showErrors = ref(false) +const ErrorsMessage = ref('') +const checkErrors = () => { + if(RegisterForm.errors.value.email || RegisterForm.errors.value.password || RegisterForm.errors.value.verifyPassword || RegisterForm.errors.value.vericode) { + showErrors.value = true + ErrorsMessage.value = '请检查输入是否正确' + } + if(LoginPasswordForm.errors.value.email || LoginPasswordForm.errors.value.password) { + showErrors.value = true + ErrorsMessage.value = '请检查输入是否正确' + } + if(LoginEmailForm.errors.value.email || LoginEmailForm.errors.value.vericode) { + showErrors.value = true + ErrorsMessage.value = '请检查输入是否正确' + } +} - -const onSubmit = () => { - handleSubmit(() => { - if(!switchLogin.value)//登录 - { - if(switchLoginMethod.value)//邮箱登录 - { - testcode().then((res) => { - if(res.code === 200) { - console.log('登录成功') - } else { - console.log('登录失败') - } - }) - } - else//密码登录_未完成 - { - - } - } - else//注册 - { +const onRegisterSubmit = () => { + RegisterForm.handleSubmit(() => { testcode().then((res) => { if(res.code === 200) { register().then((res) => { @@ -102,33 +111,56 @@ const onSubmit = () => { console.log('注册失败') } }) - } - })() + })(); +} - watch(errors, (newErrors) => { - if(Object.keys(newErrors).length > 0) { - showErrors.value = true +const chooseLogin = () => { + if(!switchLoginMethod.value) { + onLoginPasswordSubmit() } else { - showErrors.value = false + onLoginEmailSubmit() } -}) +} + +const onLoginPasswordSubmit = () => { + LoginPasswordForm.handleSubmit(() => { + login().then((res) => { + if(res.code === 200) { + console.log('登录成功') + } else { + console.log('登录失败') + } + }) + })(); +} + +const onLoginEmailSubmit = () => { + LoginEmailForm.handleSubmit(() => { + testcode().then((res) => { + if(res.code === 200) { + console.log('登录成功') + } else { + console.log('登录失败') + } + }) + })(); } //axios接口 //发送邮箱验证码 async function emailcode(){ - const res = await request.get('/auth/email/code', { + const res = await request.get('/users/code', { data:{ email: email.value } }) - console.log(res.data); + console.log("success") } //验证邮箱验证码 async function testcode() { - const res = await request.post('/auth/login/code', { + const res = await request.post('/users/login/code', { data: { email: email.value, code: vericode.value @@ -139,7 +171,7 @@ async function testcode() { } async function register(){ - const res = await request.post('/auth/register', { + const res = await request.post('/users/register', { data:{ email: email.value, password: password.value, @@ -153,17 +185,31 @@ async function register(){ }) return res.data; } + +async function login(){ + const res = await request.post('/users/login', { + data:{ + email: email.value, + password: password.value + } + }) + return res.data; +}