fix: 增加体育

src/api/home.ts

@@ -163,7 +163,7 @@ export interface GameRequest {
     /**
      * 游戏列表ID
      */
-    id?: number;
+    id: string;
     /**
      * 语言，cn/en
      */

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

@@ -110,7 +110,6 @@ const Tabs: FC<Props> = (props) => {
     const [active, setActive] = useState<number>(0);
     const router = useRouter();
     const selectHandler = (item: TabItemType, index: number) => {
-        console.log(`🚀🚀🚀🚀🚀-> in HomeTabs.tsx on 113`, item);
         if (item.bet_type === 2) {
             router.push(`/gameList/?gameListFlag=${item.category[0].jump_id}&type=1`);
             return;

src/app/[locale]/(TabBar)/sports/page.scss

@@ -10,3 +10,4 @@
     color: #fff;
     font-size: .16rem;
 }
+

src/app/[locale]/(TabBar)/sports/page.tsx

@@ -1,14 +1,56 @@
 "use client";
 import { useTranslations } from "next-intl";
-import { FC } from "react";
-import "./page.scss";
+import Script from "next/script";
+import { FC, useEffect, useRef } from "react";
 
 interface Props {}
 
 const Sports: FC<Props> = () => {
     const t = useTranslations("ProfilePage");
+    const btRef = useRef(null);
+    const onLoad = () => {
+        // @ts-ignore
+        const bt = new BTRenderer();
 
-    return <div className="sports-box">to by continued</div>;
+        btRef.current = bt;
+        bt.initialize({
+            brand_id: "2438427001506373639",
+            token: "eyJhbGciOiJFUzI1NiIsInR5cCI6IkpXVCJ9.eyJjdXJyZW5jeSI6Ik1ZUiIsImV4cCI6MTczMjUxNTQ4MSwiaWF0IjoxNzMyNTAxMDgxLCJpc3MiOiIyNDM4NDI3MDAxNTA2MzczNjM5IiwianRpIjoiYTNVMWZjMmhKa2QxYTVaMkFiN2NjZWREYWQiLCJsYW5nIjoiY24iLCJuYW1lIjoiMTAwMDAxMDEiLCJzdWIiOiIxMDAwMDEwMSJ9.GraOmhETc1WhaUayTgyZMAkSYIxt9IE78JWwZ0SkYmw6YLCbxA-iL3WjJUBDhIU653CAO_ftcaPUPiFDOiq_zg",
+            onTokenExpired: function () {
+                console.log(`🚀🚀🚀🚀🚀-> in page.tsx on 20`, "token 过期");
+            },
+            themeName: "default",
+            lang: "pt-br",
+            target: document.getElementById("betby"),
+            betSlipOffsetBottom: 80,
+            betSlipOffsetRight: 750,
+            betSlipZIndex: 0,
+            onRouteChange: function () {},
+            onLogin: function () {},
+            onRegister: function () {},
+            onSessionRefresh: function () {},
+            onBetSlipStateChange: function () {},
+        });
+    };
+
+    useEffect(() => {
+        // @ts-ignore
+        if (window.BTRenderer) {
+            onLoad();
+        }
+        return () => {
+            // @ts-ignore
+            btRef.current?.kill();
+        };
+    }, []);
+
+    return (
+        <>
+            <div id="betby" className={"h-[100%]"}></div>
+
+            <Script src={"https://ui.invisiblesport.com/bt-renderer.min.js"} onLoad={onLoad} />
+        </>
+    );
 };
 
 export default Sports;

src/app/[locale]/(navbar)/cashWheel/CashWheelClient.tsx

@@ -1,5 +1,8 @@
 "use client";
 
+import Box from "@/components/Box";
+import { useUserInfoStore } from "@/stores/useUserInfoStore";
+import { LuckyWheel } from "@lucky-canvas/react";
 import { useEffect, useRef, useState } from "react";
 import LotteryWheel from "./LotteryWheel";
 import styles from "./style.module.scss";
@@ -51,7 +54,7 @@ const DrawMain1 = () => {
         </div>
     );
 };
-const DrawMain = () => {
+const DrawMain2 = () => {
     const [blocks] = useState([
         {
             padding: "20",
@@ -65,14 +68,14 @@ const DrawMain = () => {
         },
     ]);
     const [prizes] = useState([
-        { background: "#fde187", fonts: [{ text: "0" }] },
-        { background: "#faf3c3", fonts: [{ text: "1" }] },
-        { background: "#fde187", fonts: [{ text: "2" }] },
-        { background: "#faf3c3", fonts: [{ text: "3" }] },
-        { background: "#fde187", fonts: [{ text: "4" }] },
-        { background: "#faf3c3", fonts: [{ text: "5" }] },
-        { background: "#fde187", fonts: [{ text: "6" }] },
-        { background: "#faf3c3", fonts: [{ text: "7" }] },
+        { background: "#fde187", fonts: [{ text: "0", top: "20%" }] },
+        { background: "#faf3c3", fonts: [{ text: "1", top: "20%" }] },
+        { background: "#fde187", fonts: [{ text: "2", top: "20%" }] },
+        { background: "#faf3c3", fonts: [{ text: "3", top: "20%" }] },
+        { background: "#fde187", fonts: [{ text: "4", top: "20%" }] },
+        { background: "#faf3c3", fonts: [{ text: "5", top: "20%" }] },
+        { background: "#fde187", fonts: [{ text: "6", top: "20%" }] },
+        { background: "#faf3c3", fonts: [{ text: "7", top: "20%" }] },
     ]);
     const [buttons] = useState([
         {
@@ -103,7 +106,7 @@ const DrawMain = () => {
                 alt=""
                 className={"absolute -top-[13%] z-10 h-[1.4rem]"}
             />
-            <canvas id={"titleCanvas"} ref={titleRef} />
+            {/*<canvas id={"titleCanvas"} ref={titleRef} />*/}
 
             {/*<svg width="100%" height="2.7778rem" className={"absolute -top-[15%] z-[11]"}>*/}
             {/*    <path*/}
@@ -133,32 +136,129 @@ const DrawMain = () => {
             <img src={"/wheels/outer-circle.png"} className={"absolute h-[100%]"} />
 
             {/*<img src={"/wheels/inner-circle.png"} className={"absolute h-[98%]"} />*/}
-            <div>
-                {/*<LuckyWheel*/}
-                {/*    ref={myLucky}*/}
-                {/*    width="2.95rem"*/}
-                {/*    height="2.95rem"*/}
-                {/*    blocks={blocks}*/}
-                {/*    prizes={prizes}*/}
-                {/*    buttons={buttons}*/}
-                {/*    onStart={() => {*/}
-                {/*        // 点击抽奖按钮会触发star回调*/}
-                {/*        myLucky.current?.play();*/}
-                {/*        setTimeout(() => {*/}
-                {/*            const index = (Math.random() * 6) >> 0;*/}
-                {/*            myLucky.current?.stop(index);*/}
-                {/*        }, 2500);*/}
-                {/*    }}*/}
-                {/*    onEnd={(prize: any) => {*/}
-                {/*        // 抽奖结束会触发end回调*/}
-                {/*        alert("恭喜你抽到 " + prize.fonts[0].text + " 号奖品");*/}
-                {/*    }}*/}
-                {/*/>*/}
+            <div className={"flex w-[100%] flex-1 justify-center"}>
+                <LuckyWheel
+                    ref={myLucky}
+                    width="2.95rem"
+                    height="2.95rem"
+                    blocks={blocks}
+                    prizes={prizes}
+                    buttons={buttons}
+                    onStart={() => {
+                        // 点击抽奖按钮会触发star回调
+                        myLucky.current?.play();
+                        setTimeout(() => {
+                            const index = (Math.random() * 6) >> 0;
+                            myLucky.current?.stop(index);
+                        }, 2500);
+                    }}
+                    onEnd={(prize: any) => {
+                        // 抽奖结束会触发end回调
+                        alert("恭喜你抽到 " + prize.fonts[0].text + " 号奖品");
+                    }}
+                />
             </div>
         </div>
     );
 };
+const DrawMain3 = () => {
+    const myLucky = useRef<any>();
+
+    const [blocks] = useState([
+        {
+            padding: "20",
+            imgs: [
+                {
+                    src: "/wheels/inner-circle.png",
+                    width: "100%",
+                    height: "100%",
+                },
+            ],
+        },
+    ]);
+    const [prizes] = useState([
+        { fonts: [{ text: "0", top: "20%" }], background: "#e9e8fe" },
+        { fonts: [{ text: "1", top: "20%" }], background: "#b8c5f2" },
+        { fonts: [{ text: "2", top: "20%" }], background: "#e9e8fe" },
+        { fonts: [{ text: "3", top: "10%" }], background: "#b8c5f2" },
+        { fonts: [{ text: "4", top: "10%" }], background: "#e9e8fe" },
+        { fonts: [{ text: "5", top: "10%" }], background: "#b8c5f2" },
+    ]);
+    const [buttons] = useState([
+        {
+            radius: "30%",
+            imgs: [
+                {
+                    src: "/wheels/pointer.png",
+                    width: "100%",
+                    top: "-130%",
+                },
+            ],
+        },
+    ]);
+    return (
+        <div className={"relative flex h-[2.5rem] items-center justify-center border-4"}>
+            <img src={"/wheels/bg.png"} className={"absolute"} />
+            <div className={"mt-[40px] flex w-[100%] justify-center border-4"}>
+                <img src={"/wheels/outer-circle.png"} className={"absolute h-[100%]"} />
+                <img
+                    src="/wheels/header-bg.png"
+                    alt=""
+                    className={"absolute -bottom-[10px] z-10 h-[1.2rem]"}
+                />
+            </div>
 
+            {/*<svg width="100%" height="2.7778rem" className={"absolute -top-[15%] z-[11]"}>*/}
+            {/*    <path*/}
+            {/*        d="M 63 162 C 119 36, 341 0,470 120"*/}
+            {/*        stroke="blue"*/}
+            {/*        stroke-width="4"*/}
+            {/*        id="circle"*/}
+            {/*        fill="transparent"*/}
+            {/*    />*/}
+
+            {/*    <text*/}
+            {/*        style={{*/}
+            {/*            fill: "#ff3333",*/}
+            {/*            fontSize: "30px",*/}
+            {/*            fontWeight: "bold",*/}
+            {/*            textShadow: "0.1em 0.1em rgba(0,0,0,0.5)",*/}
+            {/*        }}*/}
+            {/*    >*/}
+            {/*        <textPath xlinkHref="#circle" textAnchor="middle" startOffset="50%" dy="0">*/}
+            {/*            <tspan>*/}
+            {/*                Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam, libero.*/}
+            {/*            </tspan>*/}
+            {/*        </textPath>*/}
+            {/*    </text>*/}
+            {/*</svg>*/}
+
+            {/*<img src={"/wheels/inner-circle.png"} className={"absolute h-[98%]"} />*/}
+            <div>
+                <LuckyWheel
+                    ref={myLucky}
+                    width="2.95rem"
+                    height="2.95rem"
+                    blocks={blocks}
+                    prizes={prizes}
+                    buttons={buttons}
+                    onStart={() => {
+                        // 点击抽奖按钮会触发star回调
+                        myLucky.current?.play();
+                        setTimeout(() => {
+                            const index = (Math.random() * 6) >> 0;
+                            myLucky.current?.stop(index);
+                        }, 2500);
+                    }}
+                    onEnd={(prize: any) => {
+                        // 抽奖结束会触发end回调
+                        alert("恭喜你抽到 " + prize.fonts[0].text + " 号奖品");
+                    }}
+                />
+            </div>
+        </div>
+    );
+};
 const DrawContent = () => {
     return (
         <div className={styles.drawContent}>
@@ -242,19 +342,119 @@ const Report = () => {
         </div>
     );
 };
+const WheelWallet = () => {
+    const user = useUserInfoStore((state) => state.userInfo);
+    return (
+        <Box className={"absolute top-0 w-[100%]"}>
+            <div
+                style={{
+                    background: "url(/wheels/wheel-wallet.png)",
+                    backgroundSize: "100% 100%",
+                }}
+                className={"relative h-[1.4583rem] w-[100%] p-[0.1389rem]"}
+            >
+                <div className={"mb-[10px] text-[#49c25a]"}>
+                    <span className={"iconfont icon-yonghu"}></span>
+                    <span>Conta</span>
+                    <span>{user.user_phone}</span>
+                </div>
+                <div className={"text-[0.3472rem] font-bold text-[#008213]"}>
+                    R$
+                    <span>111</span>
+                </div>
+                <div className={"mt-[0.2083rem] w-[100%] text-center text-[18px]"}>
+                    <span className={"mr-[10px] text-[#008213]"}>Faltam para O saque</span>
+                    <span className={"text-[yellow]"}>R$9.36</span>
+                </div>
+            </div>
+        </Box>
+    );
+};
+const DrawMain = () => {
+    const myLucky = useRef<any>();
 
+    const [blocks] = useState([
+        {
+            // padding: "20",
+            imgs: [
+                // {
+                //     src: "/wheels/wheel-bg.png",
+                //     width: "100%",
+                //     height: "100%",
+                // },
+            ],
+        },
+    ]);
+    const [prizes] = useState([
+        { fonts: [{ text: "0", top: "20%" }], background: "#e9e8fe" },
+        { fonts: [{ text: "1", top: "20%" }], background: "#b8c5f2" },
+        { fonts: [{ text: "2", top: "20%" }], background: "#e9e8fe" },
+        { fonts: [{ text: "3", top: "10%" }], background: "#b8c5f2" },
+        { fonts: [{ text: "4", top: "10%" }], background: "#e9e8fe" },
+        { fonts: [{ text: "5", top: "10%" }], background: "#b8c5f2" },
+    ]);
+    const [buttons] = useState([
+        {
+            radius: "30%",
+            imgs: [
+                {
+                    src: "/wheels/pointer.png",
+                    width: "100%",
+                    top: "-130%",
+                },
+            ],
+        },
+    ]);
+    return (
+        <div className={"relative"}>
+            <WheelWallet />
+            <div className={"relative border-[1px]"}>
+                <img
+                    src={"/wheels/wheel-bg.png"}
+                    className={"h-[5.5rem] w-[100%] pt-[0.1389rem]"}
+                />
+                {/*<div*/}
+                {/*    className={*/}
+                {/*        "absolute bottom-[0.2431rem] flex h-[2.3rem] w-[100%] pr-[0.0794rem]" +*/}
+                {/*        " justify-center"*/}
+                {/*    }*/}
+                {/*>*/}
+                {/*    <LuckyWheel*/}
+                {/*        ref={myLucky}*/}
+                {/*        width="2.3rem"*/}
+                {/*        height="2.3rem"*/}
+                {/*        blocks={blocks}*/}
+                {/*        prizes={prizes}*/}
+                {/*        buttons={buttons}*/}
+                {/*        onStart={() => {*/}
+                {/*            // 点击抽奖按钮会触发star回调*/}
+                {/*            myLucky.current?.play();*/}
+                {/*            setTimeout(() => {*/}
+                {/*                const index = (Math.random() * 6) >> 0;*/}
+                {/*                myLucky.current?.stop(index);*/}
+                {/*            }, 2500);*/}
+                {/*        }}*/}
+                {/*        onEnd={(prize: any) => {*/}
+                {/*            // 抽奖结束会触发end回调*/}
+                {/*            alert("恭喜你抽到 " + prize.fonts[0].text + " 号奖品");*/}
+                {/*        }}*/}
+                {/*    />*/}
+                {/*</div>*/}
+            </div>
+        </div>
+    );
+};
 const CashWheelClient = () => {
     return (
         <>
-            <div className={"mb-[40px] border-4"}>123</div>
             <DrawMain />
-            {/*<div className={styles.cashWheelClient}>*/}
-            {/*    <CashMainCom />*/}
-            {/*    <DrawMain />*/}
-            {/*    <DrawContent />*/}
-            {/*    <Report />*/}
-            {/*    /!* <LotteryWheel/> *!/*/}
-            {/*</div>*/}
+            <div className={"text-center"}></div>
+            <div className={styles.cashWheelClient}>
+                {/*<CashMainCom />*/}
+                {/*<DrawContent />*/}
+                <Report />
+                {/*<LotteryWheel />*/}
+            </div>
         </>
     );
 };

src/components/Card/Card.tsx

@@ -45,7 +45,7 @@ const Card: FC<PropsWithChildren<CardProps>> = (props) => {
             maskStyle: { zIndex: 99999, background: "rgba(0,0,0,0.5)" },
         });
         const params = {
-            id: game.id,
+            id: game.id + "",
             mode: groupType,
         };
         getGameDetailApi(params).then((res) => {

src/utils/constant.ts

@@ -1,27 +1,27 @@
 export const brandList = [
     {
         gid: "0600003",
-        brand: "",
+        brand: "pg",
     },
     {
         gid: "0600004",
-        brand: "",
+        brand: "pg",
     },
     {
         gid: "0600005",
-        brand: "",
+        brand: "pg",
     },
     {
         gid: "0610002",
-        brand: "",
+        brand: "pg",
     },
     {
         gid: "0610003",
-        brand: "",
+        brand: "pg",
     },
     {
         gid: "0610004",
-        brand: "",
+        brand: "pg",
     },
     {
         gid: "2000003",

src/utils/server/index.ts

@@ -64,6 +64,7 @@ class Server {
             }).then((res) => res.json());
             return responseInterceptor<T, R>(response, options, this.BASE_URL);
         } catch (error) {
+            console.log(`🚀🚀🚀🚀🚀-> in index.ts on 67`, error);
             return Promise.reject(error);
         }
     }