登录注册接口对接

src/api/user.ts

@@ -6,6 +6,13 @@ export const getBindPhoneApi = () => {
     });
 };
 
+export const getCheckUserPhoneExistApi = (params: any) => {
+    return server.post<any>({
+        url: "/v1/api/user/check_user_phone_exist",
+        params
+    });
+};
+
 export const getFindPwdApi = () => {
     return server.post<any>({
         url: "/v1/api/user/find_pwd"

src/app/[locale]/login/component/FromCom/index.tsx

@@ -8,15 +8,16 @@ import "./style.scss";
 /**
  * @description 登录注册From表单
  * @param {string} type 使用类型
+ * @param {string} msgError 错误提示 login 或 register
  * @param {(params: any) => void} callbackFun 回调方法
  */
 export interface FromComProps {
     type?: string;
-    text?: string;
+    msgError?: string;
     callbackFun?: (params: any) => void;
 }
 
-const FromCom: FC<PropsWithChildren<FromComProps>> = ({type = 'login', callbackFun}) => {
+const FromCom: FC<PropsWithChildren<FromComProps>> = ({type = 'login', msgError = '', callbackFun}) => {
     let [pwdVisible, setPwdVisible] = useState(false)
     const spanClassName = clsx("iconfont", {
         "icon-kejian": pwdVisible,
@@ -30,7 +31,7 @@ const FromCom: FC<PropsWithChildren<FromComProps>> = ({type = 'login', callbackF
 
     const activeCls = useMemo(() => {
         let { userPhone, pwd } = fromParam
-        if (userPhone && userPhone.length==11 && pwd && pwd.length>6) {
+        if (userPhone && userPhone.length==11 && pwd && pwd.length>5) {
             return true
         }
         return false
@@ -66,7 +67,7 @@ const FromCom: FC<PropsWithChildren<FromComProps>> = ({type = 'login', callbackF
                 <span className={spanClassName} onClick={() => setPwdVisible(!pwdVisible)}></span>
             </div>
             <div className="btnContent">
-                <div className="tips"> O número de telefone não existe. </div>
+                { msgError && <div className="tips"> {msgError} </div> }
                 <ButtonOwn active={activeCls} callbackFun={submitRequest}>{type == 'login'? 'Login' : 'Criar conta'}</ButtonOwn>
             </div>
             <div className="link">

src/app/[locale]/login/page.tsx

@@ -1,5 +1,6 @@
 "use client";
-import { FC, PropsWithChildren } from "react";
+import { FC, PropsWithChildren, useState } from "react";
+import { useRouter } from "@/i18n";
 import HeaderBack from "@/components/HeaderBack";
 import GoogleCom from "./component/GoogleCom";
 import FromCom from "./component/FromCom";
@@ -10,16 +11,25 @@ import {getLoginApi} from "@/api/user";
 interface Props {}
 
 const Login: FC<PropsWithChildren<Props>> = () => {
-
-    const loginRequest = async (params: any) => {
-        let data = await getLoginApi(params)
+    const router:any = useRouter()
+    const [msgError, setMsgError] = useState('')
+    const loginRequest = async ({userPhone, pwd}: any) => {
+        let params = {user_phone: userPhone, pwd}
+        let res = await getLoginApi(params)
+        if(res.code == 200) {
+            alert('登录成功')
+            window.localStorage.setItem('userInfo',JSON.stringify(res.data))
+            router.replace('/')
+        } else {
+            setMsgError(res.msg)
+        }
     }
 
     return (
         <div className="login-box">
             <HeaderBack />
             <GoogleCom />
-            <FromCom callbackFun={loginRequest}/>
+            <FromCom callbackFun={loginRequest} msgError={msgError}/>
             <DomainFooter />
         </div>
     );

src/app/[locale]/register/page.tsx

@@ -1,5 +1,6 @@
 "use client";
-import { FC, PropsWithChildren } from "react";
+import { FC, PropsWithChildren, useState } from "react";
+import { useRouter } from "@/i18n";
 import HeaderBack from "@/components/HeaderBack";
 import GoogleCom from "../login/component/GoogleCom";
 import FromCom from "../login/component/FromCom";
@@ -10,15 +11,23 @@ import {getRegisterApi} from "@/api/user";
 interface Props {}
 
 const Register: FC<PropsWithChildren<Props>> = () => {
-
-    const registerRequest = async (params: any) => {
-        let data = await getRegisterApi(params)
+    const router:any = useRouter()
+    const [msgError, setMsgError] = useState('')
+    const registerRequest = async ({userPhone, pwd}: any) => {
+        let params = {user_phone: userPhone, pwd, code: '123456'}
+        let { code, msg } = await getRegisterApi(params)
+        if(code == 200) {
+            alert('注册成功')
+            router.replace('/login')
+        } else {
+            setMsgError(msg)
+        }
     }
     return (
         <div className="register-box">
             <HeaderBack />
             <GoogleCom title="Bem-vindo à 9F.COM" text="Registre-se com Google+"/>
-            <FromCom type="register" callbackFun={registerRequest} />
+            <FromCom type="register" callbackFun={registerRequest} msgError={msgError}/>
             <DomainFooter />
         </div>
     );

src/app/[locale]/resetPhone/page.tsx

@@ -1,14 +1,24 @@
+"use client";
 import { FC, PropsWithChildren } from "react";
 import HeaderBack from "@/components/HeaderBack";
 import ButtonOwn from "@/components/ButtonOwn";
 import DomainFooter from "@/components/DomainFooter";
 import './page.scss'
 import React from "react";
+import {getCheckUserPhoneExistApi} from "@/api/user";
 
 interface Props {}
 
 const ResetPhone: FC<PropsWithChildren<Props>> = () => {
-
+    const checkUserPhoneRequest = async () => {
+        let { code, msg } = await getCheckUserPhoneExistApi({user_phone: '18215519037'})
+        if(code == 200) {
+            alert('验证成功')
+            // router.replace('/login')
+        } else {
+            // setMsgError(msg)
+        }
+    }
     return (
         <div className="resetPhone-box">
             <HeaderBack />
@@ -23,7 +33,7 @@ const ResetPhone: FC<PropsWithChildren<Props>> = () => {
                 </div>
                 <div className="tips"> O número de telefone não existe. </div>
                 <div className="btnContent">
-                    <ButtonOwn active={true}>Continuar</ButtonOwn>
+                    <ButtonOwn active={true} callbackFun={checkUserPhoneRequest}>Continuar</ButtonOwn>
                 </div>
             </div>
             <DomainFooter />