✨ feat: 验证码2

src/App.vue

@@ -61,6 +61,16 @@
             </el-input>
           </el-form-item>
           <verify-input v-model="loginFormData" :disabled="logining" />
+          <el-form-item style="margin-bottom: 0">
+            <el-button
+              type="primary"
+              style="width: 100%"
+              @click="submitRegisterForm"
+              :loading="logining"
+            >
+              登录
+            </el-button>
+          </el-form-item>
         </el-form>
       </el-tab-pane>
       <el-tab-pane label="注册" name="register">
@@ -137,13 +147,9 @@
 </style>
 <script setup lang="ts">
 import axiosInstance from '@/api';
+import { type VerifyImagePath } from '@/components/VerifyInput.vue';
 import { getAvailableRoutes } from '@/router';
-import {
-  loginResponseSchema,
-  registerResponseSchema,
-  userInfoResponseSchema,
-  verifyResponseSchema
-} from '@/schemas';
+import { loginResponseSchema, registerResponseSchema, userInfoResponseSchema } from '@/schemas';
 import { useUserStore } from '@/stores';
 import { errorMessage } from '@/utils';
 import { Avatar, CloseBold } from '@element-plus/icons-vue';
@@ -152,8 +158,6 @@ import { ElMessage, type FormInstance, type FormRules } from 'element-plus';
 import { partial, pick } from 'lodash-es';
 import { onMounted, reactive, ref, watch } from 'vue';
 import { RouterView, useRoute, useRouter } from 'vue-router';
-import { type VerifyImagePath } from '@/components/VerifyInput.vue';
-import { z } from 'zod';
 const router = useRouter();
 const route = useRoute();
 const userStore = useUserStore();
@@ -221,9 +225,11 @@ const loginErrorMessage = partial(errorMessage, '登录');
 interface LoginParams {
   username: string;
   password: string;
+  key: string;
+  code: string;
 }
 
-async function login(params: LoginParams = pick(loginFormData, 'username', 'password')) {
+async function login(params: LoginParams) {
   try {
     const loginResp = loginResponseSchema.parse(
       (await axiosInstance.post('/api/user/login', params)).data

src/components/VerifyInput.vue

@@ -38,9 +38,7 @@ import { errorMessage, timeout } from '@/utils';
 import { AxiosError } from 'axios';
 import { ElMessage } from 'element-plus';
 import { partial } from 'lodash-es';
-import { toRef, watchEffect } from 'vue';
-import { watch } from 'vue';
-import { computed, ref } from 'vue';
+import { ref, toRef, watchEffect } from 'vue';
 
 export type VerifyImagePath =
   | 'none'