feat: 修改

src/app/[locale]/(navbar)/vip/List.tsx

@@ -1,22 +1,14 @@
-import { VipProgressMap } from "@/enums";
-import { useVipStore } from "@/stores/useVipStore";
+import { LevelInfoItem } from "@/api/user";
 import clsx from "clsx";
 import React from "react";
 import styles from "./page.module.scss";
 
-const List = () => {
-    const { vipData } = useVipStore();
-    const VipList = React.useMemo(() => {
-        const result = [];
-        for (let [key, value] of VipProgressMap) {
-            result.push({
-                key,
-                ...value,
-            });
-        }
-        return result;
-    }, []);
+interface Props {
+    data: LevelInfoItem[];
+    level: number;
+}
 
+const List: React.FC<Props> = ({ data, level = 0 }) => {
     const DataList = React.useMemo(() => {
         return [
             {
@@ -26,6 +18,9 @@ const List = () => {
             {
                 key: "upgrade",
                 text: "Upgrade",
+                render(itemData: LevelInfoItem) {
+                    return itemData.reward[0].amount;
+                },
             },
             {
                 key: "weekly",
@@ -51,34 +46,38 @@ const List = () => {
             <div className="flex rounded-[var(--borderRadius)] bg-[#fff]">
                 <div className={clsx(styles.ListItemBox)}>
                     <div>Level</div>
-                    {VipList.map((item) => {
-                        return (
-                            <div
-                                key={item.key}
-                                className={clsx({ "text-[red]": item.key == vipData?.vip_level })}
-                            >
-                                Vip{item.key}
-                            </div>
-                        );
-                    })}
+                    {!!data?.length &&
+                        data.map((item) => {
+                            return (
+                                <div
+                                    key={item.id}
+                                    className={clsx({
+                                        "text-[red]": item.id == level,
+                                    })}
+                                >
+                                    Vip{item.id}
+                                </div>
+                            );
+                        })}
                 </div>
                 <div className="flex min-w-[0] flex-1 overflow-auto">
-                    {DataList.map((item) => {
+                    {DataList.map((item: any) => {
                         return (
                             <div key={item.key} className={clsx(styles.ListItemBox)}>
                                 <div>{item.text}</div>
-                                {VipList.map((citem) => {
-                                    return (
-                                        <div
-                                            className={clsx({
-                                                "text-[red]": citem.key == vipData?.vip_level,
-                                            })}
-                                            key={citem.key}
-                                        >
-                                            Vip{citem.key}
-                                        </div>
-                                    );
-                                })}
+                                {!!data?.length &&
+                                    data.map((citem: any) => {
+                                        return (
+                                            <div
+                                                className={clsx({
+                                                    "text-[red]": citem.id == level,
+                                                })}
+                                                key={citem.id}
+                                            >
+                                                {!!item.render && item.render(citem)}
+                                            </div>
+                                        );
+                                    })}
                             </div>
                         );
                     })}

src/app/[locale]/(navbar)/vip/page.tsx

@@ -5,10 +5,12 @@ import HeaderBack from "@/components/HeaderBack";
 import VipProgress from "@/components/VipProgress";
 import feedback from "@/feedback";
 import useCountdown from "@/hooks/useCountdown";
+import { useRouter } from "@/i18n/routing";
 import { formatAmount } from "@/utils";
 import { useRequest } from "ahooks";
 import { Toast } from "antd-mobile";
 import clsx from "clsx";
+import dayjs from "dayjs";
 import { useTranslations } from "next-intl";
 import React from "react";
 import List from "./List";
@@ -57,6 +59,7 @@ const Page = () => {
     const containerRef = React.useRef<HTMLDivElement | null>(null);
     const curReward = React.useRef<RewardItemData | any>(null);
     const t = useTranslations();
+    const router = useRouter();
 
     const { data: userVip, run: runVip } = useRequest<any, any>(getNewVip, {
         pollingErrorRetryCount: 1,
@@ -161,11 +164,19 @@ const Page = () => {
         return result;
     }, [vipInfo, actVipInfo]);
 
-    const multClick = (dialogProps: any) => {
-        console.log(dialogProps);
+    const multClick = async (data: any) => {
+        if (!curReward.current) return;
+        if ((curReward.current?.cur_pay || 0) < (curReward.current?.double_pay || 0)) {
+            router.replace("/deposit");
+            return;
+        }
+        data.doClose("confirm");
+    };
+    const doSingleClaim = async (data: any) => {
+        data.doClose("confirm");
     };
 
-    const multRender = (dialogProps: any) => {
+    const confirmRender = (contentProps: any) => {
         return (
             <div className="relative">
                 <div className="mb-[.1rem] text-center text-[.12rem] text-[var(--textColor1)]">
@@ -193,7 +204,7 @@ const Page = () => {
                                 );
                             })}
                         <CustomButton
-                            onClick={doRealClaim}
+                            onClick={() => doSingleClaim({ ...contentProps })}
                             disabled={
                                 (curReward.current?.cur_pay || 0) >=
                                 (curReward.current?.double_pay || 0)
@@ -226,7 +237,7 @@ const Page = () => {
                                 );
                             })}
                         <CustomButton
-                            onClick={() => multClick(dialogProps)}
+                            onClick={() => multClick({ ...contentProps })}
                             className="!min-w-[120px] !px-[12px] !py-[6px] !text-[12px]"
                         >
                             {(curReward.current?.cur_pay || 0) >=
@@ -258,21 +269,35 @@ const Page = () => {
 
     const doClaim = async (rewardData: RewardItemData) => {
         curReward.current = rewardData;
-        const res = await feedback.showModal({
-            content: multRender,
-            width: "80%",
-            useDefaultFooter: false,
-        });
+        if (rewardData.status !== 1) return;
+
+        if (renderType1.includes(rewardData.type) && rewardData.double_pay > 0) {
+            const isCanClaim =
+                dayjs().isAfter(rewardData.start_time * 1000) &&
+                dayjs().isBefore(rewardData.end_time * 1000);
+            if (!isCanClaim) return;
+            const res = await feedback.showModal({
+                content: confirmRender,
+                width: "80%",
+                useDefaultFooter: false,
+            });
+            if (res.cancel) {
+                return;
+            }
+        }
+        doRealClaim();
     };
 
     const doRealClaim = async () => {
         if (!curReward.current) return;
         try {
+            Toast.show({
+                icon: "loading",
+            });
             const res = await claimVip({ type: curReward.current?.type });
             if (res.code === 200) {
                 runVip();
                 Toast.show(t(`code.200`));
-
                 return;
             }
             throw new Error(`${res?.code || 400}`);
@@ -481,7 +506,7 @@ const Page = () => {
                         </div>
                     </div>
 
-                    <List></List>
+                    <List data={vipInfo?.level_info} level={vipInfo?.vip_level}></List>
 
                     {/* <Top data={userVip} cashbackInfo={cashbackInfo}></Top>
                     <RewardBox data={userVip} cashbackInfo={cashbackInfo}></RewardBox>

src/app/[locale]/layout.tsx

@@ -92,7 +92,7 @@ export default async function LocaleLayout({
     const messages = await getMessages();
 
     return (
-        <html lang={locale} suppressHydrationWarning data-returnid={process.env.RENTER_ID}>
+        <html lang={locale} suppressHydrationWarning data-renterid={process.env.RENTER_ID}>
             <head>
                 <script defer={true} src={"/iconfont.js"} />
             </head>

src/utils/client/axios.ts

@@ -76,8 +76,8 @@ export default class Request {
                     // header请求头添加token
                     config.headers["Token"] = getToken() || "";
                     config.headers["language"] = getCookies("language") || defaultLocale;
-                    config.headers["x-return-id"] =
-                        document?.querySelector("html")?.dataset?.returnid;
+                    config.headers["x-renter-id"] =
+                        document?.querySelector("html")?.dataset?.renterid;
                     if (config && config?.toast) {
                         Toast.show({
                             icon: "loading",

src/utils/server/index.ts

@@ -8,7 +8,7 @@ const requestInterceptor = (options: ServerOptions) => {
     if (!options.headers) {
         options.headers = {};
     }
-    options.headers["x-return-id"] = process.env.RENTER_ID;
+    options.headers["x-renter-id"] = process.env.RENTER_ID;
     // 判断token
     if (options.checkToken) {
         const token = cookies().has("Token");