登录 修改 注册 接口完成

src/pages/use/login/index.tsx

@@ -12,6 +12,7 @@ import {
   upLoginAtom,
 } from "@/store/system/user.ts";
 import React, { memo, useEffect, useLayoutEffect, useState } from "react";
+import systemServ from "@/service/system.ts";
 const { Title, Text, Link } = Typography;
 const { TabPane } = Tabs;
 
@@ -21,7 +22,7 @@ const Login = memo(() => {
   const [emailform] = Form.useForm();
   const [telegramform] = Form.useForm();
   const { mutate: upLoginFun } = useAtomValue(upLoginAtom);
-  const { mutate: emailCodeMutate } = useAtomValue(emailCodeAtom);
+  const [emailCodeData, setEmailCodeData] = useState({});
   const { mutate: emailLoginMutate } = useAtomValue(emailLoginAtom);
   const { mutate: telegramCodeMutate } = useAtomValue(telegramCodeAtom);
   const { mutate: telegramLoginMutate } = useAtomValue(telegramLoginAtom);
@@ -35,7 +36,7 @@ const Login = memo(() => {
     const email = emailform.getFieldValue("email");
     setCountdown(10);
     setIsButtonDisabled(true);
-    emailCodeMutate({ is_register: false, email });
+    setEmailCodeData(systemServ.emailCode({ is_register: false, email }));
   };
   const emailhandleSubmit = (values: any) => {
     emailLoginMutate(values);

src/pages/use/password/retrieve.tsx

@@ -1,32 +1,73 @@
-import { Layout, Input, Button, Typography, Row, Col, Form } from "antd";
+import {Layout, Input, Button, Typography, Row, Col, Form, message, Modal} from "antd";
 import { LockOutlined, MailOutlined, SecurityScanOutlined } from "@ant-design/icons";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
 import { useAtomValue } from "jotai";
 import React, { memo, useEffect, useState } from "react";
 import { emailCodeAtom } from "@/store/system/user.ts";
-import {passwordRules} from "@/pages/use/useTools.tsx";
+import { passwordRules } from "@/pages/use/useTools.tsx";
+import { useAtom } from "jotai/index";
+import systemServ from "@/service/system.ts";
+import { setToken } from "@/store/system.ts";
 const { Title, Text, Link } = Typography;
 
 const PwdRetrieve = memo(() => {
   const navigate = useNavigate();
   const [retrieveForm] = Form.useForm();
-  const { mutate: emailCodeMutate } = useAtomValue(emailCodeAtom);
+  const [emailCodeData, setEmailCodeData] = useState({});
+  const [pwdRetrieveData, setPwdRetrieveData] = useState({});
 
-  const handleRetrieveSubmit = (values: any) => {
-    console.log(values);
-    // 调用找回密码API
+  const handleRetrieveSubmit = async (values: any) => {
+    const param = {
+      email: values.email,
+      password: values.password,
+      code: values.code,
+    };
+    const result = await systemServ.pwdRetrieve(param);
+    setPwdRetrieveData(result);
   };
 
-  const handleGetCode = () => {
+  const handleGetCode = async () => {
     const email = retrieveForm.getFieldValue("email");
-    setCountdown(10);
-    setIsButtonDisabled(true);
-    emailCodeMutate({ email });
+    const result = await systemServ.emailCode({ is_register: false, email });
+    setEmailCodeData(result);
   };
 
   const [countdown, setCountdown] = useState<number>(0);
   const [isButtonDisabled, setIsButtonDisabled] = useState<boolean>(false);
 
+
+
+  const [gotoLoginModalVisible, SetGotoLoginModalVisible] = useState(false);
+
+  const showGotoLoginModal= () => {
+    SetGotoLoginModalVisible(true);
+  };
+
+  const gotoLoginModalHandleOk = () => {
+    SetGotoLoginModalVisible(false);
+    navigate({ to: "/login" });
+  };
+
+  // const gotoLoginModalHandleCancel = () => {
+  //   SetGotoLoginModalVisible(false);
+  // };
+  //
+
+
+  useEffect(() => {
+    if ((emailCodeData as any)?.code === 0) {
+      setCountdown(10);
+      setIsButtonDisabled(true);
+    }
+  }, [emailCodeData]);
+
+  useEffect(() => {
+    if ((pwdRetrieveData as any)?.code === 0) {
+      message.success("密码找回成功");
+      showGotoLoginModal();
+    }
+  }, [pwdRetrieveData, navigate]);
+
   useEffect(() => {
     let timer: number;
     if (countdown > 0) {
@@ -124,6 +165,18 @@ const PwdRetrieve = memo(() => {
           </Row>
         </Col>
       </Row>
+      <Modal
+              title="修改成功"
+              visible={gotoLoginModalVisible}
+              onOk={gotoLoginModalHandleOk}
+              footer={[
+                <Button key="ok" type="primary" onClick={gotoLoginModalHandleOk}>
+                  确认
+                </Button>,
+              ]}
+      >
+        <p>密码修改成功，返回登录。</p>
+      </Modal>
     </Layout>
   );
 });

src/pages/use/register/index.tsx

@@ -1,39 +1,38 @@
 import { Layout, Input, Button, Typography, Row, Col, Form } from "antd";
-import { LockOutlined, MailOutlined, SecurityScanOutlined } from "@ant-design/icons";
+import {LockOutlined, MailOutlined, SecurityScanOutlined, UserOutlined} from "@ant-design/icons";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
-import { useAtom, useAtomValue } from "jotai";
+import { useAtomValue } from "jotai";
 import React, { memo, useEffect, useState } from "react";
-import { emailCodeAtom, emailRegisterAtom } from "@/store/system/user.ts";
+import { emailRegisterAtom } from "@/store/system/user.ts";
 import { passwordRules } from "@/pages/use/useTools";
+import systemServ from "@/service/system.ts";
 const { Title, Text, Link } = Typography;
 
 const Register = memo(() => {
   const navigate = useNavigate();
   const [registerForm] = Form.useForm();
   const { mutate: emailRegisterMutate } = useAtomValue(emailRegisterAtom);
-  const { mutateAsync: emailCodeMutate, data: emailData } = useAtomValue(emailCodeAtom);
-  //const [{ mutate: emailCodeMutate, data: emailData }] = useAtom(emailCodeAtom);
-  //const [, mutate: emailCodeMutate] = useAtom(emailCodeAtom);
+  const [countdown, setCountdown] = useState(10);
+  const [emailCodeData, setEmailCodeData] = useState({});
+  const [isButtonDisabled, setIsButtonDisabled] = useState<boolean>(false);
+
   const getEmailCode = () => {
     const email = registerForm.getFieldValue("email");
     setCountdown(10);
     setIsButtonDisabled(true);
-    const data = emailCodeMutate({ is_register: true, email });
-    console.log(data);
+    setEmailCodeData(systemServ.emailCode({ is_register: true, email }));
   };
+
   const emailRegisterSubmit = (values: any) => {
     emailRegisterMutate({ email: values.email, password: values.password, code: values.code });
   };
 
-  const [countdown, setCountdown] = useState<number>(0);
-  const [isButtonDisabled, setIsButtonDisabled] = useState<boolean>(false);
-
   useEffect(() => {
-    if ((emailData as any)?.countdown === -1) {
+    if ((emailCodeData as any)?.countdown === -1) {
       setCountdown(0);
       setIsButtonDisabled(false);
     }
-  }, [emailData]);
+  }, [emailCodeData]);
 
   useEffect(() => {
     let timer: number;
@@ -134,7 +133,7 @@ const Register = memo(() => {
                     >
                 <span
                         style={{
-                    cursor: "pointer", // 设置手型光标
+                          cursor: "pointer",
                           position: "absolute",
                           top: "-70px",
                           right: "0px",

src/request.ts

@@ -54,7 +54,12 @@ axiosInstance.interceptors.response.use(
       case 0:
       case 200:
         //login
-        if (response.config.url?.includes("/sys/login")) {
+        if (
+          response.config.url?.includes("/sys/login") ||
+          response.config.url?.includes("/sys/email/reg") ||
+          response.config.url?.includes("/sys/email/login") ||
+          response.config.url?.includes("/sys/login/telegram")
+        ) {
           setToken(result.data.token);
           const search = new URLSearchParams(window.location.search);
           // eslint-disable-next-line no-case-declarations

src/service/system.ts

@@ -21,7 +21,7 @@ const systemServ = {
   },
 
   emailLogin: (data: any) => {
-    return request.post<System.LoginResponse>("/sys/login/email", data);
+    return request.post<System.LoginResponse>("/sys/email/login", data);
   },
   emailRegister: (data: any) => {
     return request.post<System.LoginResponse>("/sys/email/reg", data);
@@ -35,6 +35,9 @@ const systemServ = {
   telegramLogin: (data: any) => {
     return request.post<System.LoginResponse>("/sys/login/telegram", data);
   },
+  pwdRetrieve: (data: any) => {
+    return request.post<System.LoginResponse>("/sys/email/pws", data);
+  },
 
 
 

src/store/system/user.ts

@@ -40,26 +40,31 @@ export const  upLoginAtom = atomWithMutation<any, UPLoginRequest>((get) => ({
   },
   onSuccess: (res) => {
     message.success(t("login.success"));
-    get(userMenuDataAtom).refetch().then();
+    // setToken(res.data.token);
+    // get(userMenuDataAtom).refetch().then();
     return res.data;
   },
   retry: false,
 }));
 
 
-export const emailCodeAtom = atomWithMutation<any, any>((get) => ({
-  mutationKey: ["emailCode"],
-  mutationFn: async (params) => {
+export const emailCodeAtom =  (params) =>atomWithQuery(() => {
+  return {
+    queryKey: ["emailCode",params],
+    queryFn: async () => {
       return await systemServ.emailCode(params);
     },
-  onSuccess: (res) => {
-    if(res.data.countdown===-1){
-      message.error(res.message);
-    }
-    return res.data;
+    select: (data) => {
+      return data.data;
     },
-  retry: false,
-}));
+  };
+});
+
+
+
+
+
+
 export const emailLoginAtom = atomWithMutation<any, any>((get) => ({
   mutationKey: ["emailLogin"],
   mutationFn: async (params) => {
@@ -67,18 +72,23 @@ export const emailLoginAtom = atomWithMutation<any, any>((get) => ({
   },
   onSuccess: (res) => {
     message.success(t("login.success"));
-    // console.log('login success', res)
     return res.data;
   },
   retry: false,
 }));
+
+
+
+
+
 export const emailRegisterAtom = atomWithMutation<any, any>((get) => ({
   mutationKey: ["emailRegister"],
   mutationFn: async (params) => {
     return await systemServ.emailRegister(params);
   },
   onSuccess: (res) => {
-    // console.log('login success', res)
+    // setToken(res.data.token);
+    // window.location.href = "/";
     return res.data;
   },
   retry: false,

vite.config.ts

@@ -14,7 +14,7 @@ const proxyMap = {
   //'/api/v1/certold': 'http://192.168.31.41:8000',
   "/api/v1/cert": "http://127.0.0.1:8000",
   //'/api/v1/cert': 'http://192.168.31.41:8000',
-  "/api/v1/sys": "http://192.168.31.41:8686/",
+  //"/api/v1/sys": "http://192.168.31.41:8686/",
 } as Record<any, string>;
 
 const proxyConfig = Object.keys(proxyMap).reduce(