axios连接完毕，但是没有相应的返回检查（即提示用户密码错误等等），错误信息提示依然有错，改不对了

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"

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

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<boolean>(true);
 const switchLoginMethodEvent = () =>{
     password.value = vericode.value = verifyPassword.value = "";
     switchLoginMethod.value = !switchLoginMethod.value;
@@ -50,11 +50,25 @@ const form_box = ref<HTMLElement | null>(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;
+}
 </script>
 
 <template>
     <title>登录</title>
+    <el-alert
+        v-if="showErrors"
+        title={{ ErrorsMessage }}
+        type="error"
+        :closable="true"
+        @close="showErrors = false"
+        center/>
     <div class = "container">
         <div ref = "form_box" class = "form-box">
             <!-- 注册表单 -->
             <div class = "register-box" :class = "{hidden: !switchLogin}">
-                <div v-if="showErrors" class="error-msg">
-                    <p v-show="Object.values(errors)[0]">{{ Object.values(errors)[0] }}</p>
-                </div>
                 <h1>register</h1>
                 <div class="email-vericode">
                     <input type="text" placeholder="邮箱" v-model="email">
@@ -172,13 +218,10 @@ async function register(){
                 <input type="password" placeholder="密码" v-model="password">
                 <input type ="password" placeholder = "确认密码" v-model = "verifyPassword">
                 <input type="text" placeholder="验证码" v-model="vericode">
-                <button @click = "onSubmit">注册</button>   
+                <button @click = "onRegisterSubmit;checkErrors">注册</button>   
             </div>
             <!-- 登录表单 -->
             <div class = "login-box" :class ="{hidden: switchLogin}">
-                <div v-if="showErrors" class="error-msg">
-                    <p v-show="Object.values(errors)[0]">{{ Object.values(errors)[0] }}</p>
-                </div>
                 <!--密码登录-->
                 <div class = password-method :class="{hidden: switchLoginMethod}">
                     <h1>login</h1>
@@ -194,7 +237,7 @@ async function register(){
                         <input type="text" placeholder="验证码" v-model="vericode">
                         <button class = "switch-btn" @click="switchLoginMethodEvent">密码登录</button>
                 </div>
-                <button @click="onSubmit">登录</button>
+                <button @click="chooseLogin;checkErrors">登录</button>
             </div>      
         </div>
     <div>

Front/vue-unilife/src/main.ts

@@ -1,5 +1,9 @@
 import { createApp } from 'vue'
 import './style.css'
 import App from './App.vue'
+import ElementPlus from 'element-plus'
+import 'element-plus/dist/index.css'
 
-createApp(App).mount('#app')
+const app = createApp(App)
+app.mount('#app')
+app.use(ElementPlus)

Front/前端环境.md

@@ -41,5 +41,8 @@ pnpm install yup
 ```
 用于表单验证
 
-
+### 安装ElementPlus
+```cmd
+pnpm add element-plus
+```