fix: 更改cashWheel ui

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

@@ -244,126 +244,40 @@ const WheelWallet = () => {
     const user = useUserInfoStore((state) => state.userInfo);
     const wheel = useContext(WheelContext);
     return (
-        <Box className={"absolute top-0 w-[100%]"}>
+        <Box className={"w-[100%]"}>
             <div
-                style={{
-                    background: "url(/wheels/wheel-wallet.png)",
-                    backgroundSize: "100% 100%",
-                }}
-                className={"relative h-[1.4583rem] w-[100%] p-[0.1389rem]"}
+                className={
+                    "relative h-[1.6389rem] w-[100%] " +
+                    " flex flex-col bg-[url(/wheels/wheel-wallet.png)]" +
+                    " bg-[length:100%_100%]"
+                }
             >
-                <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>{wheel.activate?.amount || 0}</span>
+                <div className={"flex-1 p-[0.1389rem]"}>
+                    <div className={"text-[#49c25a]"}>
+                        <span className={"iconfont icon-yonghu"}></span>
+                        <span>Conta</span>
+                        <span>{user.user_phone}</span>
+                    </div>
+                    <div className={"text-[0.4861rem] font-bold text-[#008213]"}>
+                        R$ <span>{wheel.activate?.amount || 0}</span>
+                    </div>
                 </div>
-                <div className={"mt-[0.2083rem] w-[100%] text-center text-[18px]"}>
+                <div
+                    className={
+                        "flex h-[0.4167rem] w-[100%] items-center justify-center text-center text-[0.125rem] font-bold"
+                    }
+                >
                     <span className={"mr-[10px] text-[#008213]"}>Faltam para O saque</span>
-                    <span className={"text-[yellow]"}>
+                    <span className={"text-[#eef100]"}>
                         R${(wheel.num! - wheel.activate?.amount! || 0).toFixed(2)}
                     </span>
                 </div>
+                {/*top*/}
             </div>
         </Box>
     );
 };
 
-// 数据
-const blocks = [
-    {
-        padding: "0",
-        imgs: [
-            {
-                src: "/wheels/wheel.png",
-                width: "100%",
-                height: "100%",
-            },
-        ],
-    },
-];
-const prizes = [
-    {
-        fonts: [
-            { text: "5000", top: "30%", fontColor: "#a47716", fontWeight: "bold", type: "bonus" },
-        ],
-    },
-    {
-        fonts: [{ text: "", top: "30%", fontColor: "#a47716", fontWeight: "bold", type: "empty" }],
-        imgs: [
-            {
-                src: "/wheels/prizes-empty.png",
-                top: "30%",
-                width: "0.2778rem",
-            },
-        ],
-    },
-    {
-        fonts: [
-            { text: "50", top: "30%", fontColor: "#a47716", fontWeight: "bold", type: "bonus" },
-        ],
-    },
-    {
-        fonts: [
-            { text: "", top: "30%", fontColor: "#a47716", fontWeight: "bold", type: "balance" },
-        ],
-        imgs: [
-            {
-                src: "/wheels/prizes-money.png",
-                top: "30%",
-                width: "0.3472rem",
-            },
-        ],
-    },
-
-    {
-        fonts: [
-            { text: "1000", top: "30%", fontColor: "#a47716", fontWeight: "bold", type: "bonus" },
-        ],
-    },
-    {
-        imgs: [
-            {
-                src: "/wheels/prizes-empty.png",
-                top: "30%",
-                width: "0.2778rem",
-                height: "0.2778rem",
-            },
-        ],
-    },
-
-    { fonts: [{ text: "1", top: "30%", fontColor: "#a47716", fontWeight: "bold", type: "bonus" }] },
-    {
-        fonts: [
-            { text: "", top: "30%", fontColor: "#a47716", fontWeight: "bold", type: "balance" },
-        ],
-        imgs: [
-            {
-                src: "/wheels/prizes-money.png",
-                top: "30%",
-                width: "0.3472rem",
-            },
-        ],
-    },
-];
-const buttons = [
-    {
-        radius: "30%",
-        imgs: [
-            {
-                src: "/wheels/pointer.png",
-                width: "100%",
-                top: "-130%",
-            },
-        ],
-    },
-];
-const defaultConfig = {
-    offsetDegree: 20,
-};
 const DrawMain = () => {
     const wheel = useContext(WheelContext);
 
@@ -371,7 +285,7 @@ const DrawMain = () => {
         <div className={"relative"}>
             <WheelWallet />
 
-            <div className={"pt-[0.1389rem]"}>
+            <div className={"-mt-[0.2083rem] transform"}>
                 <WheelClient isRotate={true} wheel={wheel} onRotateEnd={wheel.handler!} />
             </div>
         </div>