From a58b2255448fe6c0e19d12f7d214352ce3e8eedd Mon Sep 17 00:00:00 2001 From: john Date: Fri, 28 Jun 2024 18:00:45 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- postcss.config.js | 4 +- src/App.tsx | 34 +- ...{Header.module.css => Header-m.module.css} | 0 src/components/Header.tsx | 15 +- ...em.module.css => RecordsItem-m.module.css} | 0 src/components/RecordsItem.tsx | 4 +- src/pages/Feature/useHome.ts | 103 ++++ src/pages/Feature/useInvitationList.ts | 41 ++ src/pages/Feature/useMint.ts | 118 ++++ .../{Home.module.css => Home-m.module.css} | 0 src/pages/Home.tsx | 537 +++++++++--------- src/pages/InvitationList.tsx | 34 +- .../{Mint.module.css => Mint-m.module.css} | 0 src/pages/Mint.tsx | 112 +--- src/utils/index.ts | 2 +- 15 files changed, 582 insertions(+), 422 deletions(-) rename src/components/{Header.module.css => Header-m.module.css} (100%) rename src/components/{RecordsItem.module.css => RecordsItem-m.module.css} (100%) create mode 100644 src/pages/Feature/useHome.ts create mode 100644 src/pages/Feature/useInvitationList.ts create mode 100644 src/pages/Feature/useMint.ts rename src/pages/{Home.module.css => Home-m.module.css} (100%) rename src/pages/{Mint.module.css => Mint-m.module.css} (100%) diff --git a/postcss.config.js b/postcss.config.js index f39d419..25fd456 100644 --- a/postcss.config.js +++ b/postcss.config.js @@ -1,7 +1,7 @@ /* * @LastEditors: John * @Date: 2024-06-17 18:25:10 - * @LastEditTime: 2024-06-19 16:14:06 + * @LastEditTime: 2024-06-28 17:46:23 * @Author: John */ export default { @@ -11,7 +11,7 @@ export default { rootValue: 37.5, propList: ["*"], exclude: (e) => { - if (/.*-m\.css$/.test(e) || /.module\.css$/.test(e)) { + if (/.*-m\.css$/.test(e) || /.*-m.module\.css$/.test(e)) { // console.log(e); return false; } diff --git a/src/App.tsx b/src/App.tsx index 0e6bc38..82514cb 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,7 +1,7 @@ /* * @LastEditors: John * @Date: 2024-06-17 17:20:03 - * @LastEditTime: 2024-06-26 16:00:00 + * @LastEditTime: 2024-06-28 17:44:02 * @Author: John */ import { Route, Routes } from "react-router-dom"; @@ -16,7 +16,7 @@ import InvitationList from "./pages/InvitationList"; import { useEffect } from "react"; import { useTranslation } from "react-i18next"; import useUserStore from "./store/User"; -import { getUrlQueryParam } from "./utils"; +import { getUrlQueryParam, isMobile } from "./utils"; import { UrlQueryParamsKey } from "./constants"; import { signAndLogin } from "./utils/wallet"; import { useAccount } from "wagmi"; @@ -45,12 +45,30 @@ function App() { return ( <> -
- - } /> - } /> - }> - + {isMobile ? ( + <> + + + <> + } /> + } /> + } + > + + + + ) : ( + <> + + + <> + } /> + + + + )} ); diff --git a/src/components/Header.module.css b/src/components/Header-m.module.css similarity index 100% rename from src/components/Header.module.css rename to src/components/Header-m.module.css diff --git a/src/components/Header.tsx b/src/components/Header.tsx index 4ef53e3..2f1cdc5 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -1,7 +1,7 @@ /* * @LastEditors: John * @Date: 2024-06-18 15:16:31 - * @LastEditTime: 2024-06-27 15:29:00 + * @LastEditTime: 2024-06-28 14:05:29 * @Author: John */ import Picker, { @@ -11,7 +11,7 @@ import Picker, { import { useContext, useEffect, useMemo, useState } from "react"; import IconFont from "./iconfont"; import logo from "@/assets/logo.svg"; -import classes from "./Header.module.css"; +import classes from "./Header-m.module.css"; import { useLocation, useNavigate, useNavigation } from "react-router-dom"; import { RouterLogContext } from "@/context/RouterContext"; import { useTranslation } from "react-i18next"; @@ -27,7 +27,7 @@ const langColums: Action[] = [ { text: "日本語", key: Lang.jp }, { text: "DEUTSCH", key: Lang.de }, ]; -export default function () { +function Mobile() { const { UpdateLang } = useUserStore(); const route = useContext(RouterLogContext); @@ -79,3 +79,12 @@ export default function () { ); } + +function Desktop() { + return <>; +} + +export default { + Mobile, + Desktop, +}; diff --git a/src/components/RecordsItem.module.css b/src/components/RecordsItem-m.module.css similarity index 100% rename from src/components/RecordsItem.module.css rename to src/components/RecordsItem-m.module.css diff --git a/src/components/RecordsItem.tsx b/src/components/RecordsItem.tsx index c6c74c4..52ddc6d 100644 --- a/src/components/RecordsItem.tsx +++ b/src/components/RecordsItem.tsx @@ -1,10 +1,10 @@ /* * @LastEditors: John * @Date: 2024-06-19 10:49:42 - * @LastEditTime: 2024-06-19 10:52:32 + * @LastEditTime: 2024-06-28 14:05:45 * @Author: John */ -import classes from "./RecordsItem.module.css"; +import classes from "./RecordsItem-m.module.css"; export default function RecordsItem({ itemList, }: { diff --git a/src/pages/Feature/useHome.ts b/src/pages/Feature/useHome.ts new file mode 100644 index 0000000..56e7d78 --- /dev/null +++ b/src/pages/Feature/useHome.ts @@ -0,0 +1,103 @@ +/* + * @LastEditors: John + * @Date: 2024-06-28 14:09:55 + * @LastEditTime: 2024-06-28 14:14:29 + * @Author: John + */ +import useUserStore from "@/store/User"; +import { useWeb3Modal } from "@web3modal/wagmi/react"; +import { useEffect, useMemo, useRef, useState } from "react"; +import { useTranslation } from "react-i18next"; +import { useAccount } from "wagmi"; +import { useNavigate } from "react-router-dom"; +import { Dialog } from "antd-mobile"; +import { + api_get_homepage_user_data, + api_query_user_invitation_code, +} from "@/server/api"; +import { UserHomeData } from "@/server/module"; +import { UrlQueryParamsKey } from "@/constants"; +import usePollingCheckBuyStatus from "@/hook/usePollingCheckBuyStatus"; +import { ToastHandler } from "antd-mobile/es/components/toast"; +import { PullStatus } from "antd-mobile/es/components/pull-to-refresh"; +export default function () { + const { Token, UpdateToken } = useUserStore(); + const { open } = useWeb3Modal(); + + const { t } = useTranslation(); + const { address } = useAccount(); + + const [tabIndex, setTabIndex] = useState(0); + const navigate = useNavigate(); + const [userData, setUserData] = useState(); + const [inviteCode, setInviteCode] = useState(""); + + const userInviteLink = useMemo( + () => + `${location.origin}/#/?${UrlQueryParamsKey.INVITE_CODE}=${inviteCode}`, + [inviteCode] + ); + const receiveLoadingToast = useRef(); + const { + transcationStatus, + startPollingCheckBuyStatus, + stopPollingCheckBuyStatus, + } = usePollingCheckBuyStatus("NORMAL"); + + const statusRecord: Record = { + pulling: "Pull down to refresh", + canRelease: "Release to refresh immediately", + refreshing: "Loading...", + complete: "Refresh complete", + }; + + useEffect(() => { + if (Token) { + getHomeData(); + getInviteCode(); + } + return () => {}; + }, [Token]); + + useEffect(() => { + if (transcationStatus == "success") { + receiveLoadingToast.current?.close(); + stopPollingCheckBuyStatus(); + Dialog.alert({ + content: `${t("领取成功，前往钱包查看")}`, + confirmText: "OK", + }); + } + + return () => {}; + }, [transcationStatus]); + + async function getHomeData() { + const { data } = await api_get_homepage_user_data().send({}); + setUserData(data?.data); + } + + async function getInviteCode() { + const { data } = await api_query_user_invitation_code().send({}); + setInviteCode(data?.data.invitationCode || ""); + } + + useEffect(() => { + console.log("user token:", Token); + + return () => {}; + }, [Token]); + return { + getHomeData, + statusRecord, + Token, + address, + setUserData, + userData, + tabIndex, + t, + setTabIndex, + navigate, + userInviteLink, + }; +} diff --git a/src/pages/Feature/useInvitationList.ts b/src/pages/Feature/useInvitationList.ts new file mode 100644 index 0000000..fceb974 --- /dev/null +++ b/src/pages/Feature/useInvitationList.ts @@ -0,0 +1,41 @@ +import usePagination from "@/hook/usePagination"; +import { api_recommended_list } from "@/server/api"; +import { RecommendedListItem } from "@/server/module"; +import { Empty, InfiniteScroll } from "antd-mobile"; +import DataTable, { TableColumn } from "react-data-table-component"; +import { useTranslation } from "react-i18next"; + +export default function () { + const { t } = useTranslation(); + const columns: TableColumn[] = [ + { + name: t("地址"), + selector: (row) => row.walletAddress, + grow: 9, + }, + { + name: "Node", + selector: (row) => row.nodeNumber, + grow: 1, + // @ts-ignore + right: "true", + }, + ]; + + const { list, hasMore, loadMore } = usePagination({ + service({ pageNum, pageSize }) { + return new Promise(async (reslove) => { + const { data } = await api_recommended_list().send({ + queryParams: { pageNum, pageSize }, + }); + reslove(data?.data.records || []); + }); + }, + }); + return { + columns, + list, + loadMore, + hasMore, + }; +} diff --git a/src/pages/Feature/useMint.ts b/src/pages/Feature/useMint.ts new file mode 100644 index 0000000..c59ed75 --- /dev/null +++ b/src/pages/Feature/useMint.ts @@ -0,0 +1,118 @@ +import { cn, filterAddressBeforeZero, filterAmountBeforeZero } from "@/utils"; +import classes from "./Mint-m.module.css"; +import nft_bg from "@/assets/nft_bg.svg"; +import Button from "antd-mobile/es/components/button"; +import Space from "antd-mobile/es/components/space"; +import { useTranslation } from "react-i18next"; +import { useEffect, useMemo, useRef, useState } from "react"; +import { + api_get_homepage_user_data, + api_get_nft_configuration_data, + api_node_order, + api_users_cancel_orders, +} from "@/server/api"; +import { + NftConfigurationData, + NftOrder, + NodeOrder, + UserHomeData, +} from "@/server/module"; +import { + authorizedU, + getApproveUsdt, + getBalance, + payByContract, +} from "@/contract/utils"; +import { Dialog, Modal, Stepper, Toast } from "antd-mobile"; +import useUserStore from "@/store/User"; +import usePollingCheckBuyStatus from "@/hook/usePollingCheckBuyStatus"; +import { ToastHandler } from "antd-mobile/es/components/toast"; +import { BaseError } from "wagmi"; +import { useNavigate } from "react-router-dom"; +import { toWei } from "web3-utils"; + +export default function () { + const { t } = useTranslation(); + const { Token } = useUserStore(); + const [nodeConfig, setNodeConfig] = useState(); + const [approveUsdt, setApproveUsdt] = useState(0n); + const [balance, setBalance] = useState(0n); + const orderInfo = useRef(); + const navigate = useNavigate(); + const [num, setNum] = useState(1); + + const buyLoadingToast = useRef(); + const approveLoadingToast = useRef(); + const { + transcationStatus, + startPollingCheckBuyStatus, + stopPollingCheckBuyStatus, + } = usePollingCheckBuyStatus("NORMAL"); + + const costNum = useMemo( + () => + BigInt( + toWei(`${parseFloat(`${nodeConfig?.nodePrice || "0"}`) * num}`, "ether") + ), + [nodeConfig?.nodePrice, num] + ); + + useEffect(() => { + updateNodeConfig(); + + return () => {}; + }, []); + + useEffect(() => { + (async () => { + Toast.show({ icon: "loading", content: t("正在获取已授权金额") }); + setBalance(await getBalance()); + setApproveUsdt(await getApproveUsdt()); + Toast.clear(); + })(); + + return () => {}; + }, [Token]); + + async function updateNodeConfig() { + const { data } = await api_get_homepage_user_data().send({}); + setNodeConfig(data?.data); + } + useEffect(() => { + if (transcationStatus == "success") { + buyLoadingToast.current?.close(); + stopPollingCheckBuyStatus(); + Dialog.alert({ + content: `${t( + "Buy successful. Please return to the homepage to view." + )}`, + confirmText: "OK", + onConfirm() { + navigate("/"); + }, + }); + } + + return () => {}; + }, [transcationStatus]); + + useEffect(() => { + return () => {}; + }, []); + + return { + nodeConfig, + num, + setNum, + approveUsdt, + t, + balance, + approveLoadingToast, + costNum, + setApproveUsdt, + buyLoadingToast, + orderInfo, + updateNodeConfig, + startPollingCheckBuyStatus, + }; +} diff --git a/src/pages/Home.module.css b/src/pages/Home-m.module.css similarity index 100% rename from src/pages/Home.module.css rename to src/pages/Home-m.module.css diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index 2d5db22..5daa3c1 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -1,314 +1,287 @@ -import classes from "./Home.module.css"; -import useUserStore from "@/store/User"; +/* + * @LastEditors: John + * @Date: 2024-06-26 15:04:10 + * @LastEditTime: 2024-06-28 14:36:37 + * @Author: John + */ +import classes from "./Home-m.module.css"; import { cn, copyText, getLevelName, shortenString } from "@/utils"; -import { useWeb3Modal } from "@web3modal/wagmi/react"; -import { useEffect, useMemo, useRef, useState } from "react"; -import { useTranslation } from "react-i18next"; import logo from "@/assets/logo.svg"; import nftBg from "@/assets/nft_bg.svg"; -import usdtBg from "@/assets/usdt_bg.svg"; import IconFont from "@/components/iconfont"; -import { BaseError, useAccount } from "wagmi"; -import { config } from "@/components/WalletProvider"; -import { createSearchParams, useNavigate } from "react-router-dom"; -import { Button, Dialog, Empty, PullToRefresh, Toast } from "antd-mobile"; +import { PullToRefresh } from "antd-mobile"; import { loginOut } from "@/utils/wallet"; -import { - api_claim_income, - api_get_homepage_user_data, - api_query_user_invitation_code, -} from "@/server/api"; -import { UserHomeData } from "@/server/module"; -import { UrlQueryParamsKey } from "@/constants"; -import usePollingCheckBuyStatus from "@/hook/usePollingCheckBuyStatus"; -import { ToastHandler } from "antd-mobile/es/components/toast"; -import { disconnect, getAccount } from "@wagmi/core"; -import { PullStatus } from "antd-mobile/es/components/pull-to-refresh"; -export default function () { - const { Token, UpdateToken } = useUserStore(); - const { open } = useWeb3Modal(); - const { t } = useTranslation(); - const { address } = useAccount(); - - const [tabIndex, setTabIndex] = useState(0); - const navigate = useNavigate(); - const [userData, setUserData] = useState(); - const [inviteCode, setInviteCode] = useState(""); - - const userInviteLink = useMemo( - () => - `${location.origin}/#/?${UrlQueryParamsKey.INVITE_CODE}=${inviteCode}`, - [inviteCode] - ); - const receiveLoadingToast = useRef(); +import useHome from "./Feature/useHome"; +import useMint from "./Feature/useMint"; +import useInvitationList from "./Feature/useInvitationList"; +function Mobile() { const { - transcationStatus, - startPollingCheckBuyStatus, - stopPollingCheckBuyStatus, - } = usePollingCheckBuyStatus("NORMAL"); - - const statusRecord: Record = { - pulling: "Pull down to refresh", - canRelease: "Release to refresh immediately", - refreshing: "Loading...", - complete: "Refresh complete", - }; - - useEffect(() => { - if (Token) { - getHomeData(); - getInviteCode(); - } - return () => {}; - }, [Token]); - - useEffect(() => { - if (transcationStatus == "success") { - receiveLoadingToast.current?.close(); - stopPollingCheckBuyStatus(); - Dialog.alert({ - content: `${t("领取成功，前往钱包查看")}`, - confirmText: "OK", - }); - } - - return () => {}; - }, [transcationStatus]); - - async function getHomeData() { - const { data } = await api_get_homepage_user_data().send({}); - setUserData(data?.data); - } - - async function getInviteCode() { - const { data } = await api_query_user_invitation_code().send({}); - setInviteCode(data?.data.invitationCode || ""); - } - - useEffect(() => { - console.log("user token:", Token); - - return () => {}; - }, [Token]); + getHomeData, + statusRecord, + Token, + address, + setUserData, + userData, + tabIndex, + t, + setTabIndex, + navigate, + userInviteLink, + } = useHome(); return ( - <> - { - await getHomeData(); - }} - renderText={(status) => { - return
{statusRecord[status]}
; - }} - disabled={!Token} - > -
-
-
- + { + await getHomeData(); + }} + renderText={(status) => { + return
{statusRecord[status]}
; + }} + disabled={!Token} + > +
+
+
+ - {address ? ( -
-
- {shortenString(address, 6, 4)} - { - loginOut(); - setUserData(undefined); - }} - name="tuichu" - className={classes.userinfo_top_right_wallet_disconnect} - color={"#fff"} - /> -
-
- {userData && ( - <> -
- {getLevelName(userData.level)} -
- - )} -
-
- ) : ( - <> -
{ - open(); + {address ? ( +
+
+ {shortenString(address, 6, 4)} + { + loginOut(); + setUserData(undefined); }} - > - {t("链接钱包")} -
- - )} -
-
    -
  • - - {userData?.directPushNode || 0} - - - {t("Direct Node")} - -
    • -
  • - - {userData?.teamNode || 0} - - - {t("Team Node")} - -
    • -
  • - - {userData?.revenueUsdt || 0} -

    USDT

    -     - - {t("Push income")} - -
    • -
-
- -
-
    -
  • setTabIndex(0)} - > - NODE -
    • -
- -
- {tabIndex == 0 && ( - <> - {address ? ( + name="tuichu" + className={classes.userinfo_top_right_wallet_disconnect} + color={"#fff"} + /> +
+
+ {userData && ( <> - {userData?.nodeNumber && userData?.nodeNumber > 0 ? ( -
-
- You own {userData.nodeNumber} nodes - { - navigate("/mint"); - }} - > - {t("Buy Node")} - - -
- - - {t("Start mining after node subscription ends.")} - -
- ) : ( -
-
+ {getLevelName(userData.level)} +
+ + )} +
+
+ ) : ( + <> +
{ + open(); + }} + > + {t("链接钱包")} +
+ + )} +
+
    +
  • + + {userData?.directPushNode || 0} + + + {t("Direct Node")} + +
    • +
  • + + {userData?.teamNode || 0} + + + {t("Team Node")} + +
    • +
  • + + {userData?.revenueUsdt || 0} +

    USDT

    +     + + {t("Push income")} + +
    • +
+
+ +
+
    +
  • setTabIndex(0)} + > + NODE +
    • +
+ +
+ {tabIndex == 0 && ( + <> + {address ? ( + <> + {userData?.nodeNumber && userData?.nodeNumber > 0 ? ( +
+
+ You own {userData.nodeNumber} nodes + { navigate("/mint"); }} > - {t("Buy Node")} + {t("Buy Node")} -
- {t("Buy Edge AI Node.")} +
- )} - - ) : ( - <> -
- - {t( - "The wallet is not linked and cannot show you the Node." - )} + + + {t("Start mining after node subscription ends.")}
- - )} - - )} -
-
- -
-
- {t("邀请")} - {address && ( - { - navigate("/invitationlist"); - }} - > - {t("邀请列表")}{" "} - - - )} -
- -
- {t("邀请链接")} -
- {address ? ( - <> - {userData?.nodeNumber && userData?.nodeNumber > 0 ? ( - <> - {shortenString(userInviteLink, 15, 15)} - { - copyText(userInviteLink); - }} - className={classes.invite_content_icon} - name="fuzhi" - color={"#fff"} - />{" "} - ) : ( - <> - - {t("Buy Edge AI Node to get invitation link")} - - +
+
{ + navigate("/mint"); + }} + > + {t("Buy Node")} + +
+ {t("Buy Edge AI Node.")} +
)} ) : ( <> - {t("Link wallet to get invitation link")} +
+ + {t( + "The wallet is not linked and cannot show you the Node." + )} + +
)} -
- - - {t( - "Invite your friends to become YOTTA nodes and you will get a 20% rebate." - )} - -
+ + )}
- - + +
+
+ {t("邀请")} + {address && ( + { + navigate("/invitationlist"); + }} + > + {t("邀请列表")}{" "} + + + )} +
+ +
+ {t("邀请链接")} +
+ {address ? ( + <> + {userData?.nodeNumber && userData?.nodeNumber > 0 ? ( + <> + {shortenString(userInviteLink, 15, 15)} + { + copyText(userInviteLink); + }} + className={classes.invite_content_icon} + name="fuzhi" + color={"#fff"} + />{" "} + + ) : ( + <> + + {t("Buy Edge AI Node to get invitation link")} + + + )} + + ) : ( + <> + {t("Link wallet to get invitation link")} + + )} +
+ + + {t( + "Invite your friends to become YOTTA nodes and you will get a 20% rebate." + )} + +
+
+
+ ); } + +function Desktop() { + const { + getHomeData, + statusRecord, + Token, + address, + setUserData, + userData, + tabIndex, + t, + setTabIndex, + navigate, + userInviteLink, + } = useHome(); + const { + nodeConfig, + num, + setNum, + approveUsdt, + balance, + approveLoadingToast, + costNum, + setApproveUsdt, + buyLoadingToast, + orderInfo, + updateNodeConfig, + startPollingCheckBuyStatus, + } = useMint(); + const { columns, list, loadMore, hasMore } = useInvitationList(); + return <>; +} + +export default { + Mobile, + Desktop, +}; diff --git a/src/pages/InvitationList.tsx b/src/pages/InvitationList.tsx index 8689cee..d3095b8 100644 --- a/src/pages/InvitationList.tsx +++ b/src/pages/InvitationList.tsx @@ -4,40 +4,12 @@ * @LastEditTime: 2024-06-27 15:33:01 * @Author: John */ -import usePagination from "@/hook/usePagination"; -import { api_recommended_list } from "@/server/api"; -import { RecommendedListItem } from "@/server/module"; import { Empty, InfiniteScroll } from "antd-mobile"; -import DataTable, { TableColumn } from "react-data-table-component"; -import { useTranslation } from "react-i18next"; +import DataTable from "react-data-table-component"; +import useInvitationList from "./Feature/useInvitationList"; export default function () { - const { t } = useTranslation(); - const columns: TableColumn[] = [ - { - name: t("地址"), - selector: (row) => row.walletAddress, - grow: 9, - }, - { - name: "Node", - selector: (row) => row.nodeNumber, - grow: 1, - // @ts-ignore - right: "true", - }, - ]; - - const { list, hasMore, loadMore } = usePagination({ - service({ pageNum, pageSize }) { - return new Promise(async (reslove) => { - const { data } = await api_recommended_list().send({ - queryParams: { pageNum, pageSize }, - }); - reslove(data?.data.records || []); - }); - }, - }); + const { columns, list, loadMore, hasMore } = useInvitationList(); return ( <> diff --git a/src/pages/Mint.module.css b/src/pages/Mint-m.module.css similarity index 100% rename from src/pages/Mint.module.css rename to src/pages/Mint-m.module.css diff --git a/src/pages/Mint.tsx b/src/pages/Mint.tsx index 6b64117..72074b6 100644 --- a/src/pages/Mint.tsx +++ b/src/pages/Mint.tsx @@ -1,110 +1,36 @@ /* * @LastEditors: John * @Date: 2024-06-18 15:28:03 - * @LastEditTime: 2024-06-27 17:17:09 + * @LastEditTime: 2024-06-28 14:33:02 * @Author: John */ import { cn, filterAddressBeforeZero, filterAmountBeforeZero } from "@/utils"; -import classes from "./Mint.module.css"; +import classes from "./Mint-m.module.css"; import nft_bg from "@/assets/nft_bg.svg"; import Button from "antd-mobile/es/components/button"; import Space from "antd-mobile/es/components/space"; -import { useTranslation } from "react-i18next"; -import { useEffect, useMemo, useRef, useState } from "react"; -import { - api_get_homepage_user_data, - api_get_nft_configuration_data, - api_node_order, - api_users_cancel_orders, -} from "@/server/api"; -import { - NftConfigurationData, - NftOrder, - NodeOrder, - UserHomeData, -} from "@/server/module"; -import { - authorizedU, - getApproveUsdt, - getBalance, - payByContract, -} from "@/contract/utils"; -import { Dialog, Modal, Stepper, Toast } from "antd-mobile"; -import useUserStore from "@/store/User"; -import usePollingCheckBuyStatus from "@/hook/usePollingCheckBuyStatus"; -import { ToastHandler } from "antd-mobile/es/components/toast"; +import { api_node_order } from "@/server/api"; +import { authorizedU, getApproveUsdt, payByContract } from "@/contract/utils"; +import { Stepper, Toast } from "antd-mobile"; import { BaseError } from "wagmi"; -import { useNavigate } from "react-router-dom"; import { toWei } from "web3-utils"; +import useMint from "./Feature/useMint"; export default function () { - const { t } = useTranslation(); - const { Token } = useUserStore(); - const [nodeConfig, setNodeConfig] = useState(); - const [approveUsdt, setApproveUsdt] = useState(0n); - const [balance, setBalance] = useState(0n); - const orderInfo = useRef(); - const navigate = useNavigate(); - const [num, setNum] = useState(1); - - const buyLoadingToast = useRef(); - const approveLoadingToast = useRef(); const { - transcationStatus, + nodeConfig, + num, + setNum, + approveUsdt, + t, + balance, + approveLoadingToast, + costNum, + setApproveUsdt, + buyLoadingToast, + orderInfo, + updateNodeConfig, startPollingCheckBuyStatus, - stopPollingCheckBuyStatus, - } = usePollingCheckBuyStatus("NORMAL"); - - const costNum = useMemo( - () => - BigInt( - toWei(`${parseFloat(`${nodeConfig?.nodePrice || "0"}`) * num}`, "ether") - ), - [nodeConfig?.nodePrice, num] - ); - - useEffect(() => { - updateNodeConfig(); - - return () => {}; - }, []); - - useEffect(() => { - (async () => { - Toast.show({ icon: "loading", content: t("正在获取已授权金额") }); - setBalance(await getBalance()); - setApproveUsdt(await getApproveUsdt()); - Toast.clear(); - })(); - - return () => {}; - }, [Token]); - - async function updateNodeConfig() { - const { data } = await api_get_homepage_user_data().send({}); - setNodeConfig(data?.data); - } - useEffect(() => { - if (transcationStatus == "success") { - buyLoadingToast.current?.close(); - stopPollingCheckBuyStatus(); - Dialog.alert({ - content: `${t( - "Buy successful. Please return to the homepage to view." - )}`, - confirmText: "OK", - onConfirm() { - navigate("/"); - }, - }); - } - - return () => {}; - }, [transcationStatus]); - - useEffect(() => { - return () => {}; - }, []); - + } = useMint(); return ( <>
diff --git a/src/utils/index.ts b/src/utils/index.ts index e74f9a9..78e7c54 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,7 +1,7 @@ /* * @LastEditors: John * @Date: 2024-06-17 18:19:27 - * @LastEditTime: 2024-06-27 11:40:59 + * @LastEditTime: 2024-06-28 15:32:57 * @Author: John */ import { type ClassValue, clsx } from "clsx";