feat: 修改

src/api/activity.ts

@@ -230,10 +230,11 @@ export interface RankItem {
     desc: string;
 }
 
-export const getRank = async () => {
+export const getRank = async (params = {}) => {
     ///v1/api/user/rank/getRank
     return server.post<RankItem[]>({
         url: "/v1/api/user/rank/getRank",
+        data: params,
     });
 };
 
@@ -282,5 +283,6 @@ export interface RankRequestParams {
 export const getRankDetail = async (params: RankRequestParams) => {
     return server.post<RankDetail>({
         url: "/v1/api/user/rank/getRankList",
+        data: params,
     });
 };

src/app/[locale]/(TabBar)/[[...share]]/_home/NavigateBar.tsx

@@ -18,7 +18,7 @@ const NavigateBar: React.FC<Props> = ({ data }) => {
     }, [data]);
     if (!data?.length) return null;
     return (
-        <div className="pt-[.1rem]">
+        <div className="px-[.1rem] py-[.05rem]">
             <Swiper spaceBetween={15} slidesPerView={slidesPerView}>
                 {data.map((item) => {
                     return (

src/app/[locale]/(navbar)/gameList2/Left.tsx

@@ -1,5 +1,6 @@
 "use client";
 import { GameListRep, GroupType } from "@/api/home";
+import { GameListTypeEnum } from "@/enums";
 import { useRouter } from "@/i18n/routing";
 import { useProviderStore } from "@/stores/useProvider";
 import { server } from "@/utils/client";
@@ -8,8 +9,8 @@ import React from "react";
 import styles from "./page.module.scss";
 
 interface Props {
-    actId: number;
-    onChage?: (id: number) => void;
+    actInfo: { type: string; id: number };
+    onChage?: (p: { type: GameListTypeEnum; id: number }) => void;
     onInit?: () => void;
 }
 
@@ -25,7 +26,10 @@ const getGames = async () => {
         });
 };
 
-const Left: React.FC<Props> = ({ actId, onChage, onInit }) => {
+const Left: React.FC<Props> = ({ actInfo, onChage, onInit }) => {
+    const [tags, setTags] = React.useState([
+        { id: 1, text: "Popular", img: "https://bcwin.s3.sa-east-1.amazonaws.com/quente.png" },
+    ]);
     const { providers, setProviders } = useProviderStore();
     const router = useRouter();
 
@@ -40,42 +44,79 @@ const Left: React.FC<Props> = ({ actId, onChage, onInit }) => {
     }, [providers, setProviders]);
 
     React.useEffect(() => {
-        if (actId) {
-            const res = providers.find((item) => item.id === actId);
+        if (actInfo?.id) {
+            let res;
+            if (actInfo.type === GameListTypeEnum.TAG) {
+                res = tags.find((item) => item.id === actInfo.id);
+            }
+            if (actInfo.type === GameListTypeEnum.PROVIDER) {
+                res = providers.find((item) => item.id === actInfo.id);
+            }
+
             if (res) {
                 if (typeof onInit === "function") onInit();
                 return;
             }
         }
-        if (providers?.length && typeof onChage === "function") {
-            onChage(providers[0].id);
+        if ((providers?.length || tags?.length) && typeof onChage === "function") {
+            onChage({ type: GameListTypeEnum.TAG, id: tags[0].id });
             router.replace({
                 pathname: "/gameList2",
-                query: { provider_id: providers[0].id },
+                query: { tag_id: tags[0].id },
             });
             if (typeof onInit === "function") onInit();
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [providers, onChage, actId, onInit]);
+    }, [providers, onChage, actInfo, onInit, tags]);
 
     const changeProvider = (item: GameListRep) => {
+        if (item.id === actInfo.id && actInfo.type === GameListTypeEnum.PROVIDER) return;
         if (providers?.length && typeof onChage === "function") {
             router.replace({
                 pathname: "/gameList2",
                 query: { provider_id: item.id },
             });
-            onChage(item.id);
+            onChage({ type: GameListTypeEnum.PROVIDER, id: item.id });
+        }
+    };
+
+    const changeTag = (item: any) => {
+        if (item.id === actInfo.id && actInfo.type === GameListTypeEnum.TAG) return;
+        if (tags?.length && typeof onChage === "function") {
+            router.replace({
+                pathname: "/gameList2",
+                query: { tag_id: item.id },
+            });
+            onChage({ type: GameListTypeEnum.TAG, id: item.id });
         }
     };
-    if (!providers?.length) return null;
+
+    // if (!providers?.length) return null;
     return (
         <div className={styles.left}>
+            {tags.map((item) => {
+                return (
+                    <div
+                        key={item.id}
+                        className={clsx(styles.providerItem, {
+                            [styles.active]:
+                                actInfo.id === item.id && actInfo.type === GameListTypeEnum.TAG,
+                        })}
+                        onClick={() => changeTag(item)}
+                    >
+                        <img src={item.img} alt="" />
+                        <div className="text-[.12rem] text-[#fff]">{item.text}</div>
+                    </div>
+                );
+            })}
             {providers.map((item) => {
                 return (
                     <div
                         key={item.id}
                         className={clsx(styles.providerItem, {
-                            [styles.active]: actId === item.id,
+                            [styles.active]:
+                                actInfo.id === item.id &&
+                                actInfo.type === GameListTypeEnum.PROVIDER,
                         })}
                         onClick={() => changeProvider(item)}
                     >

src/app/[locale]/(navbar)/gameList2/Right.tsx

@@ -1,17 +1,17 @@
 import { GameListRep, searchGameListApi } from "@/api/home";
 import Card from "@/components/Card/Card";
 import Empty from "@/components/Empty";
+import { GameListTypeEnum } from "@/enums";
 import { debounce } from "@/utils/methods";
 import { InfiniteScroll } from "antd-mobile";
 import React from "react";
 import styles from "./page.module.scss";
 
 interface Props {
-    providerId?: number;
-    tagId?: number;
+    actInfo?: { type: GameListTypeEnum; id: number } | null;
 }
 
-const Left: React.FC<Props> = ({ providerId, tagId }) => {
+const Left: React.FC<Props> = ({ actInfo }) => {
     const [data, setData] = React.useState<GameListRep[]>([]);
     const [loading, setLoading] = React.useState<boolean>(false);
     const [hasMore, setHasMore] = React.useState(true);
@@ -27,9 +27,10 @@ const Left: React.FC<Props> = ({ providerId, tagId }) => {
         setLoading(false);
         setIsInit(true);
         PageRef.current.current_page = 0;
-    }, [providerId]);
+    }, [actInfo]);
 
     const getData = async () => {
+        if (!actInfo?.id) return;
         try {
             setLoading(true);
             setIsInit(false);
@@ -37,11 +38,9 @@ const Left: React.FC<Props> = ({ providerId, tagId }) => {
                 ...PageRef.current,
                 use_page: true,
             };
-            if (providerId) {
-                params.provider_id = providerId;
-            }
-            if (tagId) {
-                params.tag_id = tagId;
+
+            if (actInfo) {
+                params[actInfo.type] = actInfo.id;
             }
 
             const res = await searchGameListApi(params);
@@ -57,7 +56,7 @@ const Left: React.FC<Props> = ({ providerId, tagId }) => {
         }
     };
     const loadMore = debounce(async () => {
-        if (!hasMore || loading || !providerId) return;
+        if (!hasMore || loading || !actInfo?.id) return;
         PageRef.current.current_page += 1;
         getData();
     }, 500) as () => Promise<void>;

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

@@ -1,27 +1,47 @@
 "use client";
+import { GameListTypeEnum } from "@/enums";
 import { useSearchParams } from "next/navigation";
 import React from "react";
 import Left from "./Left";
 import Right from "./Right";
 import styles from "./page.module.scss";
+
 const Page = () => {
     const searchParams = useSearchParams();
     const [isInited, setIsInited] = React.useState(false);
-    const [curProvider, setCurProvider] = React.useState(
-        Number(searchParams.get("provider_id")) || 0
-    );
+    const [curInfo, setCurInfo] = React.useState({
+        type: GameListTypeEnum.DEFAULT,
+        id: 0,
+    });
+
+    React.useEffect(() => {
+        if (searchParams.has(GameListTypeEnum.TAG)) {
+            setCurInfo({
+                type: GameListTypeEnum.TAG,
+                id: Number(searchParams.get(GameListTypeEnum.TAG)),
+            });
+            return;
+        }
+        if (searchParams.has(GameListTypeEnum.PROVIDER)) {
+            setCurInfo({
+                type: GameListTypeEnum.PROVIDER,
+                id: Number(searchParams.get(GameListTypeEnum.PROVIDER)),
+            });
+            return;
+        }
+    }, []);
 
     return (
         <div className={styles.page}>
             <Left
-                actId={curProvider}
+                actInfo={curInfo}
                 onChage={(val) => {
-                    setCurProvider(val);
+                    setCurInfo(val);
                     setIsInited(true);
                 }}
                 onInit={() => setIsInited(true)}
             ></Left>
-            <Right providerId={isInited ? curProvider : 0}></Right>
+            <Right actInfo={isInited ? curInfo : null}></Right>
         </div>
     );
 };

src/enums/index.tsx

@@ -91,3 +91,9 @@ export const ChannelEnumMap = new Map<ChannelEnum, Record<string, string>>([
         },
     ],
 ]);
+
+export enum GameListTypeEnum {
+    PROVIDER = "provider_id",
+    TAG = "tag_id",
+    DEFAULT = "",
+}