🐞 fix:

修复已知bug
2024-05-24 10:21:29 +08:00 · 2024-05-24 10:21:29 +08:00 · 3795aedede
parent 2173394a71
commit 3795aedede
5 changed files with 170 additions and 133 deletions
--- a/antd-demo/src/main.tsx
+++ b/antd-demo/src/main.tsx
@ -1,10 +1,5 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-import App from './App.tsx'
-import './index.css'
+import ReactDOM from "react-dom/client";
+import App from "./App.tsx";
+import "./index.css";

-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-)
+ReactDOM.createRoot(document.getElementById("root")!).render(<App />);
--- a/src/components/EmailForm.tsx
+++ b/src/components/EmailForm.tsx
@ -7,12 +7,12 @@ import { useCountdown } from "../hooks/useCountdown";
 import { sendCode, signUp } from "../api";
 import { sendCodeTypes, signUpTypes, ErrorType } from "../type/SignIn";
 import { Toast } from "antd-mobile";
-import { useLocation, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 import { Md5 } from "ts-md5";
+import { FormInstance } from "antd-mobile/es/components/form";

 function EmailForm() {
-  const formRef: any = useRef()
-  const location = useLocation()
+  const formRef = useRef<FormInstance>(null);
  const navigate = useNavigate();
  const { t } = useTranslation();
  const { start, time } = useCountdown();
@ -37,24 +37,22 @@ function EmailForm() {
          account: email,
          areaCode: "",
          status: 2,
-          signature: Md5.hashStr(
-            `Neer${email},${2},${timestamp}GetCode`
-          ),
-          timestamp
+          signature: Md5.hashStr(`Neer${email},${2},${timestamp}GetCode`),
+          timestamp,
        },
        config
      );
      console.log("res", res);
      if (res.status === 200 && res.data.data.sms) {
        Toast.show({
-          content: t('send successfully'),
+          content: t("send successfully"),
          afterClose: () => {
            start(60 * 1000);
          },
        });
      } else {
        Toast.show({
-          content: t('Send failure'),
+          content: t("Send failure"),
          afterClose: () => {
            // start(60 * 1000);
          },
@ -62,7 +60,7 @@ function EmailForm() {
      }
    } catch (error: unknown) {
      // 检查 error 是否是 ErrorType 类型
-      if (typeof error === 'object' && error !== null && 'msg' in error) {
+      if (typeof error === "object" && error !== null && "msg" in error) {
        const typedError = error as ErrorType; // 使用类型断言
        Toast.show({
          content: typedError.msg,
@ -72,27 +70,12 @@ function EmailForm() {
        });
      } else {
        // 处理不是 ErrorType 类型的错误
-        console.log('An unexpected error occurred');
+        console.log("An unexpected error occurred");
      }
      console.warn(error);
    }
  };

-  const getShareCode = (url: string) => {
-    const newStr = url.replace('?', '')?.split('&')
-    if (!newStr) return ''
-    const shareStr = newStr.find(item => item.includes('shareCode'))
-    if (!shareStr) return ''
-    if (shareStr) {
-      const code = shareStr.split('=')[1]
-      if (code) {
-        // setShareCode(code)
-        return code
-      }
-    }
-    return ''
-  }
-
  useEffect(() => {
    setRemainingTime(time / 1000);
  }, [time]);
@ -108,20 +91,20 @@ function EmailForm() {
          area: "",
          areaCode: "",
          authCode: authCode,
-          shareCode: shareCode || formRef.current?.getFieldValue('shareCode'),
-          userName: ""
+          shareCode: shareCode || formRef.current?.getFieldValue("shareCode"),
+          userName: "",
        },
        config
      );
      console.log("res", res);
      if (res.status === 200 && res.data.data.token) {
-        console.log(111)
+        console.log(111);
        Toast.show({
          content: res.data.msg,
        });
        setTimeout(() => {
-          navigate("/Download")
-        }, 1000)
+          navigate("/Download");
+        }, 1000);
      } else {
        Toast.show({
          content: res.data.msg,
@ -129,24 +112,25 @@ function EmailForm() {
      }
    } catch (error: unknown) {
      // 检查 error 是否是 ErrorType 类型
-      if (typeof error === 'object' && error !== null && 'msg' in error) {
+      if (typeof error === "object" && error !== null && "msg" in error) {
        const typedError = error as ErrorType; // 使用类型断言
        Toast.show({
          content: typedError.msg,
        });
      } else {
        // 处理不是 ErrorType 类型的错误
-        console.log('An unexpected error occurred');
+        console.log("An unexpected error occurred");
      }
      console.warn(error);
    }
  };
+
  return (
    <Form
      ref={formRef}
      name="form"
      initialValues={{
-        shareCode: getShareCode(location.search)
+        shareCode: getShareCode(window.location.search),
      }}
      footer={
        <Button
@ -209,4 +193,19 @@ function EmailForm() {
  );
 }

+const getShareCode = (url: string) => {
+  const newStr = url.replace("?", "")?.split("&");
+  if (!newStr) return "";
+  const shareStr = newStr.find((item) => item.includes("shareCode"));
+  if (!shareStr) return "";
+  if (shareStr) {
+    const code = shareStr.split("=")[1];
+    if (code) {
+      // setShareCode(code)
+      return code;
+    }
+  }
+  return "";
+};
+
 export default EmailForm;
--- a/src/components/PhoneForm.tsx
+++ b/src/components/PhoneForm.tsx
@ -1,7 +1,7 @@
 import { useState, useEffect, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import { Form, Input, Button } from "antd-mobile";
-import { useLocation, useNavigate } from "react-router-dom";
+import { useNavigate } from "react-router-dom";
 import "../pages/SignIn.scss";
 import useUserStore from "../store/user.ts";
 import { useCountdown } from "../hooks/useCountdown";
@ -9,9 +9,9 @@ import { sendCode, signUp } from "../api";
 import { sendCodeTypes, signUpTypes, ErrorType } from "../type/SignIn";
 import { Toast } from "antd-mobile";
 import { Md5 } from "ts-md5";
+import { FormInstance } from "antd-mobile/es/components/form/form";
 function PhoneForm() {
-  const formRef: any = useRef()
-  const location = useLocation()
+  const formRef = useRef<FormInstance>(null);
  const { t } = useTranslation();
  const { start, time } = useCountdown();
  const navigate = useNavigate();
@ -23,19 +23,19 @@ function PhoneForm() {
  } = useUserStore();

  const getShareCode = (url: string) => {
-    const newStr = url.replace('?', '')?.split('&')
-    if (!newStr) return ''
-    const shareStr = newStr.find(item => item.includes('shareCode'))
-    if (!shareStr) return ''
+    const newStr = url.replace("?", "")?.split("&");
+    if (!newStr) return "";
+    const shareStr = newStr.find((item) => item.includes("shareCode"));
+    if (!shareStr) return "";
    if (shareStr) {
-      const code = shareStr.split('=')[1]
+      const code = shareStr.split("=")[1];
      if (code) {
        // setShareCode(code)
-        return code
+        return code;
      }
    }
-    return ''
-  }
+    return "";
+  };

  const defaultAreaCode = "+1";
  const [authCode, setAuthCode] = useState("");
@ -60,27 +60,30 @@ function PhoneForm() {
        return;
      }
      const timestamp = `${new Date().getTime()}`;
-      const res = await sendCode<sendCodeTypes>({
-        account: CurrentPhoneNumber,
-        areaCode: SelectCountry?.code || defaultAreaCode,
-        status: 2,
-        signature: Md5.hashStr(
-          `Neer${CurrentPhoneNumber},${2},${timestamp}GetCode`
-        ),
-        timestamp
-      }, config);
+      const res = await sendCode<sendCodeTypes>(
+        {
+          account: CurrentPhoneNumber,
+          areaCode: SelectCountry?.code || defaultAreaCode,
+          status: 2,
+          signature: Md5.hashStr(
+            `Neer${CurrentPhoneNumber},${2},${timestamp}GetCode`
+          ),
+          timestamp,
+        },
+        config
+      );
      console.log("res", res);
      if (res.status === 200 && res.data.data.sms) {
-        console.log(111)
+        console.log(111);
        Toast.show({
-          content: t('send successfully'),
+          content: t("send successfully"),
          afterClose: () => {
            start(60 * 1000);
          },
        });
      } else {
        Toast.show({
-          content: t('Send failure'),
+          content: t("Send failure"),
          afterClose: () => {
            // start(60 * 1000);
          },
@ -88,7 +91,7 @@ function PhoneForm() {
      }
    } catch (error: unknown) {
      // 检查 error 是否是 ErrorType 类型
-      if (typeof error === 'object' && error !== null && 'msg' in error) {
+      if (typeof error === "object" && error !== null && "msg" in error) {
        const typedError = error as ErrorType; // 使用类型断言
        Toast.show({
          content: typedError.msg,
@ -98,62 +101,64 @@ function PhoneForm() {
        });
      } else {
        // 处理不是 ErrorType 类型的错误
-        console.log('An unexpected error occurred');
+        console.log("An unexpected error occurred");
      }
      console.warn(error);
    }
  };
  useEffect(() => {
-    setRemainingTime(time / 1000)
+    setRemainingTime(time / 1000);
  }, [time]);

  const handleSignUp = async () => {
-    if (CurrentPhoneNumber === '' || authCode === '') {
-      return
+    if (CurrentPhoneNumber === "" || authCode === "") {
+      return;
    }
    try {
-      const res = await signUp<signUpTypes>({
-        account: CurrentPhoneNumber,
-        area: SelectCountry?.cn,
-        areaCode: SelectCountry?.code,
-        authCode: authCode,
-        shareCode: shareCode || formRef.current?.getFieldValue('shareCode'),
-        userName: ""
-      }, config)
-      console.log('res', res)
+      const res = await signUp<signUpTypes>(
+        {
+          account: CurrentPhoneNumber,
+          area: SelectCountry?.cn,
+          areaCode: SelectCountry?.code,
+          authCode: authCode,
+          shareCode: shareCode || formRef.current?.getFieldValue("shareCode"),
+          userName: "",
+        },
+        config
+      );
+      console.log("res", res);
      if (res.status === 200 && res.data.data.token) {
        Toast.show({
          content: res.data.msg,
-        })
+        });
        setTimeout(() => {
-          navigate("/Download")
-        }, 1000)
+          navigate("/Download");
+        }, 1000);
      } else {
        Toast.show({
          content: res.data.msg,
-        })
+        });
      }
    } catch (error: unknown) {
      // 检查 error 是否是 ErrorType 类型
-      if (typeof error === 'object' && error !== null && 'msg' in error) {
+      if (typeof error === "object" && error !== null && "msg" in error) {
        const typedError = error as ErrorType; // 使用类型断言
        Toast.show({
          content: typedError.msg,
        });
      } else {
        // 处理不是 ErrorType 类型的错误
-        console.log('An unexpected error occurred');
+        console.log("An unexpected error occurred");
      }
      console.warn(error);
    }
-
-
  };
  return (
    <Form
      name="form"
+      ref={formRef}
      initialValues={{
-        shareCode: getShareCode(location.search)
+        shareCode: getShareCode(window.location.search),
      }}
      footer={
        <Button
--- a/src/main.tsx
+++ b/src/main.tsx
@ -1,10 +1,5 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-import App from './App.tsx'
-import './index.css'
-import './i18n/config.ts'
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>,
-)
+import ReactDOM from "react-dom/client";
+import App from "./App.tsx";
+import "./index.css";
+import "./i18n/config.ts";
+ReactDOM.createRoot(document.getElementById("root")!).render(<App />);
--- a/src/pages/SignIn.tsx
+++ b/src/pages/SignIn.tsx
@ -4,7 +4,7 @@ import phoneIconSelect from "../assets/iconfont/phone_Select.svg";
 import phoneIcon from "../assets/iconfont/phone.svg";
 import emailIcon from "../assets/iconfont/email.svg";
 import emailIconSelect from "../assets/iconfont/email_Select.svg";
-import Logo from "../assets/img/logo.png"
+import Logo from "../assets/img/logo.png";
 import "./SignIn.scss";
 import EmailForm from "../components/EmailForm";
 import PhoneForm from "../components/PhoneForm";
@ -14,15 +14,15 @@ import { Popover } from "antd-mobile";

 function SignIn() {
  const { t, i18n } = useTranslation();
-  const lang: string = getI18n().language
-  const [visible, setVisible] = useState(false)
+  const lang: string = getI18n().language;
+  const [visible, setVisible] = useState(false);

  const [selectIndex, setSelectIndex] = useState<number>(0);
-  const { previousPathName, UpdatePreviousPathName } = useUserStore()
+  const { previousPathName, UpdatePreviousPathName } = useUserStore();
  const navigate = useNavigate();
  const handleTabs = (num: number) => {
    return () => {
-      UpdatePreviousPathName('/');
+      UpdatePreviousPathName("/");
      setSelectIndex(num);
    };
  };
@ -40,33 +40,60 @@ function SignIn() {
      <div className="language">
        <Popover
          className="popoverContainer"
-          mode='dark'
+          mode="dark"
          visible={visible}
-          placement='bottom-end'
-          trigger='click'
-          content={<ul style={{
-            listStyle: 'none',
-            display: 'flex',
-            flexDirection: 'column',
-            justifyContent: 'flex-start',
-            alignItems: 'center',
-            margin: 0,
-            padding: '5px 10px',
-            fontSize: 14,
-            background: '#333333',
-            borderRadius: 6
-          }}>
-            <li style={{ borderBottom: '1px solid #2f2f2f', padding: '5px 10px', cursor: 'pointer' }}><span onClick={() => {
-              i18n.changeLanguage('cn')
-              setVisible(false)
-            }}>中文（繁体）</span></li>
-            <li style={{ padding: '5px 10px', cursor: 'pointer' }}><span onClick={() => {
-              i18n.changeLanguage('en')
-              setVisible(false)
-            }}>English</span></li>
-          </ul>}
+          placement="bottom-end"
+          trigger="click"
+          content={
+            <ul
+              style={{
+                listStyle: "none",
+                display: "flex",
+                flexDirection: "column",
+                justifyContent: "flex-start",
+                alignItems: "center",
+                margin: 0,
+                padding: "5px 10px",
+                fontSize: 14,
+                background: "#333333",
+                borderRadius: 6,
+              }}
+            >
+              <li
+                style={{
+                  borderBottom: "1px solid #2f2f2f",
+                  padding: "5px 10px",
+                  cursor: "pointer",
+                }}
+              >
+                <span
+                  onClick={() => {
+                    i18n.changeLanguage("cn");
+                    setVisible(false);
+                  }}
+                >
+                  中文（繁体）
+                </span>
+              </li>
+              <li style={{ padding: "5px 10px", cursor: "pointer" }}>
+                <span
+                  onClick={() => {
+                    i18n.changeLanguage("en");
+                    setVisible(false);
+                  }}
+                >
+                  English
+                </span>
+              </li>
+            </ul>
+          }
        >
-          <span style={{ cursor: 'pointer' }} onClick={() => setVisible(!visible)}>{lang === 'cn' ? '中文' : 'English'}</span>
+          <span
+            style={{ cursor: "pointer" }}
+            onClick={() => setVisible(!visible)}
+          >
+            {lang === "cn" ? "中文" : "English"}
+          </span>
        </Popover>
      </div>
      <div className="logo">
@ -91,14 +118,30 @@ function SignIn() {
      {selectIndex === 0 && <EmailForm></EmailForm>}
      {selectIndex === 1 && <PhoneForm></PhoneForm>}
      <div className="to-download">
-        <p style={{ color: '#999999' }}>{t("If you already have an account")}</p>
-        <p onClick={() => navigate("/Download")}>{t("Download the APP directly")}</p>
+        <p style={{ color: "#999999" }}>
+          {t("If you already have an account")}
+        </p>
+        <p onClick={() => navigate("/Download")}>
+          {t("download the APP directly")}
+        </p>
      </div>
      <div className="terms-service">
        <p>{t("Continuing to represent you in agreeing to our")}</p>
        <p>
-          <span><a target="_blank" href="https://lm0-1.gitbook.io/terms-of-service/">{t("Terms of Service")}</a></span> {t("and")}{" "}
-          <span><a target="_blank" href="https://lm0-1.gitbook.io/privacy-policy/">{t("Privacy Policy")}</a></span>
+          <span>
+            <a
+              target="_blank"
+              href="https://lm0-1.gitbook.io/terms-of-service/"
+            >
+              {t("Terms of Service")}
+            </a>
+          </span>{" "}
+          {t("and")}{" "}
+          <span>
+            <a target="_blank" href="https://lm0-1.gitbook.io/privacy-policy/">
+              {t("Privacy Policy")}
+            </a>
+          </span>
        </p>
      </div>
    </div>