feat: 登录/注册接口对接

src/api/login.ts

@@ -8,7 +8,7 @@ interface LoginParamsType {
   verifyCode?: string // 验证码
 }
 
-export const precheckAndSendEmail = (data: LoginParamsType) => {
+export const precheckAndSendEmail = (data: LoginParamsType): Promise<ApiResponse> => {
   return request({
     url: '/api/auth/precheckAndSendEmail',
     method: 'post',
@@ -16,7 +16,7 @@ export const precheckAndSendEmail = (data: LoginParamsType) => {
   })
 }
 
-export const fetchLogin = (data: LoginParamsType) => {
+export const fetchRegisterOrLogin = (data: LoginParamsType): Promise<LoginResponse> => {
   return request({
     url: '/api/auth/registerOrLogin',
     method: 'post',
@@ -24,10 +24,17 @@ export const fetchLogin = (data: LoginParamsType) => {
   })
 }
 
-export const resetPassword = (data: LoginParamsType) => {
+export const resetPassword = (data: LoginParamsType): Promise<ApiResponse> => {
   return request({
     url: '/api/auth/forgotPwd',
     method: 'post',
     data
   })
 }
+
+export const checkLoginStatus = (): Promise<ApiResponse<LoginResponse>> => {
+  return request({
+    url: '/api/auth/checkLoginStatus',
+    method: 'get'
+  })
+}

src/stores/modules/userInfo.ts

@@ -45,10 +45,6 @@ export const useUserInfoStore = defineStore('userInfo', () => {
     }
   }
 
-  const login = async (data: any) => {
-    return new Promise((resolve, reject) => {})
-  }
-
   const logOut = () => {
     // 处理退出登录的一些逻辑
     return new Promise((resolve) => {
@@ -69,7 +65,6 @@ export const useUserInfoStore = defineStore('userInfo', () => {
     setGenerateParams,
     getGenerateParams,
     resetGenerateParams,
-    logOut,
-    login
+    logOut
   }
 })

src/types/api.d.ts

@@ -0,0 +1,45 @@
+// 全局API响应类型定义
+declare global {
+  // 基础API响应结构
+  interface ApiResponse<T = any> {
+    success: boolean
+    message: string
+    data?: T
+    code?: number
+    errMsg?: string
+  }
+
+  // 登录/注册相关响应
+  interface LoginResponse {
+    token?: string
+    user?: {
+      id: string
+      name: string
+      email: string
+    }
+  }
+
+  // 通用列表响应
+  interface ListResponse<T> {
+    list: T[]
+    total: number
+    page: number
+    pageSize: number
+  }
+
+  // 分页参数
+  interface PaginationParams {
+    page: number
+    pageSize: number
+  }
+
+  // 通用错误响应
+  interface ErrorResponse {
+    success: false
+    message: string
+    code?: number
+    errMsg?: string
+  }
+}
+
+export {}

src/utils/request.ts

@@ -6,6 +6,18 @@ import { getLocal } from '@/utils/local'
 import router from '@/router/index'
 import { useOverallStore } from '@/stores'
 
+// 扩展 AxiosRequestConfig 接口
+declare module 'axios' {
+  interface AxiosRequestConfig {
+    loading?: boolean
+    loadingDom?: any
+    repeatRequest?: boolean
+    meta?: {
+      responseAll?: boolean
+    }
+  }
+}
+
 
 // 创建axios实例
 // console.log(import.meta.env,123)
@@ -36,7 +48,7 @@ service.interceptors.request.use(
     }
     // 如果登录了，有token，则请求携带token
     // Do something before request is sent
-    if (store.token) {
+    if (store.state.token) {
       config.headers.Authorization = getLocal('token') // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行修改
     //   config.headers['X-Token'] = getLocal('token') // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行修改
     }

src/views/login/LoginPage.vue

@@ -46,14 +46,16 @@
 <script setup lang="ts">
 import { ref, reactive, computed } from 'vue'
 import { useRouter } from 'vue-router'
+import { useUserInfoStore } from '@/stores'
 import { showToast } from 'vant'
 import { google } from '@/assets/base64'
-import { fetchLogin } from '@/api/login'
+import { fetchRegisterOrLogin } from '@/api/login'
 
 const router = useRouter()
+const userInfoStore = useUserInfoStore()
 
 // 表单数据
-const formData = reactive<Record<string, string>>({
+const formData = reactive({
   email: '',
   password: ''
 })
@@ -109,19 +111,14 @@ const handleLogin = async () => {
 
   isLoading.value = true
 
-  const response: any = await fetchLogin({ ...formData, operationType: 'LOGIN' } as any)
-  if (response.code === 200) {
-    console.log('登录成功', response)
-    // showToast('登录成功')
-    // router.push('/stylist/customer')
-  } else {
-    showToast(response.message)
-  }
+   fetchRegisterOrLogin({ ...formData, operationType: 'LOGIN' }).then((response) => {
+      console.log('登录成功', response)
+      userInfoStore.setToken(response.token)
+      userInfoStore.setUserInfo(response.user)
+      showToast('登录成功')
+      router.replace('/stylist/customer')
+  })
 
-  // showToast('登录成功')
-
-  // 登录成功后跳转到主页或工作台
-  // router.push('/stylist/customer')
 }
 
 // 处理忘记密码

src/views/login/SignupPage.vue

@@ -16,24 +16,12 @@
       </div>
 
       <div class="login-container">
-        <form @submit.prevent="handleConfirm" class="login-form">
+        <div class="login-form">
           <div class="input-group">
-            <input
-              type="text"
-              v-model="formData.name"
-              placeholder="Name"
-              class="input-field"
-              required
-            />
+            <input type="text" v-model="formData.name" placeholder="Name" class="input-field" />
           </div>
           <div class="input-group">
-            <input
-              type="email"
-              v-model="formData.email"
-              placeholder="Email"
-              class="input-field"
-              required
-            />
+            <input type="email" v-model="formData.email" placeholder="Email" class="input-field" />
           </div>
           <div class="input-group pwd">
             <input
@@ -41,19 +29,18 @@
               v-model="formData.password"
               placeholder="Your Password"
               class="input-field"
-              required
             />
           </div>
 
           <!-- 登录按钮 -->
-          <button type="submit" class="login-button">Sign Up</button>
+          <button type="button" class="login-button" @click="handleConfirm">Sign Up</button>
 
           <!-- Google登录按钮 -->
-          <div type="button" class="google-button" @click="handleGoogleLogin">
+          <div type="button" class="google-button" @click="handleSignupByGoogle">
             <img :src="google" class="google-icon" />
             Sign up with Google
           </div>
-        </form>
+        </div>
       </div>
     </div>
 
@@ -64,16 +51,16 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, computed } from 'vue'
+import { ref, reactive } from 'vue'
 import { useRouter } from 'vue-router'
 import { showToast } from 'vant'
 import { google } from '@/assets/base64'
-import { fetchLogin } from '@/api/login'
+import { fetchRegisterOrLogin } from '@/api/login'
 
 const router = useRouter()
 
 // 表单数据
-const formData = reactive<Record<string, string>>({
+const formData = reactive({
   name: '',
   email: '',
   password: ''
@@ -135,23 +122,12 @@ const validateForm = () => {
   return isValid
 }
 
-// 计算属性：表单是否有效
-const isFormValid = computed(() => {
-  return (
-    formData.name &&
-    formData.email &&
-    formData.password &&
-    validateEmail(formData.email) &&
-    validatePassword(formData.password)
-  )
-})
-
 // 返回上一页
 const goBack = () => {
   router.go(-1)
 }
 
-// 处理登录
+// 处理注册
 const handleConfirm = async () => {
   if (!validateForm()) {
     showToast('请检查输入信息')
@@ -160,26 +136,25 @@ const handleConfirm = async () => {
 
   isLoading.value = true
 
-  const res:any = await fetchLogin({...formData, operationType: 'REGISTER'} as any)
-  if(res.code === 200) {
-    console.log('注册成功', res)
-    // showToast('注册成功')
-    // router.push('/stylist/customer')
-  } else {
-    showToast(res.message)
-  }
-}
-
-// 处理忘记密码
-const handleForgotPassword = () => {
-  showToast('忘记密码功能开发中...')
-  console.log('11111111111')
-  // 这里可以跳转到忘记密码页面
-  // router.push('/forgot-password')
+  fetchRegisterOrLogin({ ...formData, operationType: 'REGISTER' })
+    .then((res) => {
+      if (res.success) {
+        showToast('注册成功')
+        router.push('/login')
+      } else {
+        showToast(res.message)
+      }
+    })
+    .catch((err) => {
+      showToast(err.message)
+    })
+    .finally(() => {
+      isLoading.value = false
+    })
 }
 
 // 处理Google登录
-const handleGoogleLogin = async () => {
+const handleSignupByGoogle = async () => {
   try {
     isLoading.value = true
     showToast('Google登录功能开发中...')
@@ -193,23 +168,6 @@ const handleGoogleLogin = async () => {
     isLoading.value = false
   }
 }
-
-// 实时验证输入
-const handleEmailInput = () => {
-  if (formData.email && !validateEmail(formData.email)) {
-    formErrors.email = '请输入有效的邮箱地址'
-  } else {
-    formErrors.email = ''
-  }
-}
-
-const handlePasswordInput = () => {
-  if (formData.password && !validatePassword(formData.password)) {
-    formErrors.password = '密码至少需要6位字符'
-  } else {
-    formErrors.password = ''
-  }
-}
 </script>
 
 <style scoped lang="less">

src/views/stylist/customer.vue

@@ -2,7 +2,7 @@
   <div class="customer-container safe-area-top" :class="{ 'form-mode': pageMode === 'form' }">
     <template v-if="pageMode === 'entry'">
       <div class="setting flex flex-between">
-        <van-icon name="arrow-left" color="#fff" size="70" />
+        <van-icon name="arrow-left" color="#fff" size="70" @click="handleBack" />
         <SvgIcon name="setting" size="70" />
       </div>
       <div class="content flex flex-center flex-column">
@@ -50,6 +50,10 @@ const router = useRouter()
 type PageMode = 'form' | 'entry'
 const pageMode = ref<PageMode>('entry')
 
+const handleBack = () => {
+  router.go(-1)
+}
+
 const handleChangeMode = (mode: PageMode) => {
   pageMode.value = mode
 }