|
@@ -1,9 +1,10 @@
|
|
|
import { getUserMoneyApi } from "@/api/user";
|
|
|
import { Link } from "@/i18n";
|
|
|
import { useGlobalStore } from "@/stores";
|
|
|
+import { useRequest } from "ahooks";
|
|
|
import clsx from "clsx";
|
|
|
import { useTranslations } from "next-intl";
|
|
|
-import { FC, ReactNode, useEffect, useRef, useState } from "react";
|
|
|
+import { FC, ReactNode, useRef, useState } from "react";
|
|
|
import HeaderTitle from "./HerderTitle";
|
|
|
import styles from "./style.module.scss";
|
|
|
/**
|
|
@@ -23,23 +24,24 @@ const DefaultHeader: FC<HeaderProps> = (props) => {
|
|
|
const t = useTranslations("Header");
|
|
|
const { token, userInfo } = useGlobalStore();
|
|
|
const [money, setMoney] = useState(0);
|
|
|
-
|
|
|
const timer = useRef<NodeJS.Timeout | null>(null);
|
|
|
|
|
|
- useEffect(() => {
|
|
|
+ const getUserMoneyHandler = () => {
|
|
|
if (token) {
|
|
|
- timer.current = setInterval(() => {
|
|
|
- getUserMoneyApi().then((res) => {
|
|
|
- setMoney(res.data.Score);
|
|
|
- });
|
|
|
- }, 5000);
|
|
|
+ return getUserMoneyApi();
|
|
|
}
|
|
|
- return () => {
|
|
|
- clearTimeout(timer.current!);
|
|
|
- timer.current = null;
|
|
|
- };
|
|
|
- }, [token]);
|
|
|
-
|
|
|
+ return Promise.reject();
|
|
|
+ };
|
|
|
+ useRequest(getUserMoneyHandler, {
|
|
|
+ pollingInterval: 3000,
|
|
|
+ pollingWhenHidden: true,
|
|
|
+ pollingErrorRetryCount: 3,
|
|
|
+ refreshDeps: [token],
|
|
|
+ onError: (error) => {},
|
|
|
+ onSuccess: (res) => {
|
|
|
+ setMoney(res.data.Score);
|
|
|
+ },
|
|
|
+ });
|
|
|
return (
|
|
|
<div className={styles.headerMain}>
|
|
|
<div className={styles.headerLeft} onClick={menuHandler}>
|
|
@@ -64,7 +66,7 @@ const DefaultHeader: FC<HeaderProps> = (props) => {
|
|
|
) : (
|
|
|
<>
|
|
|
<Link href={"/login?redirect=/"}>{t("login")}</Link>
|
|
|
- <Link href={"/login?redirect=/"} className={styles.rightActive}>
|
|
|
+ <Link href={"/register?redirect=/"} className={styles.rightActive}>
|
|
|
{t("register")}
|
|
|
</Link>
|
|
|
</>
|