feat: 修改

src/app/[locale]/(TabBar)/profile/agent.tsx

@@ -68,8 +68,8 @@ const Agent = () => {
                 shareUrl: `https://t.me/share/url?url=${url}`,
             },
             {
-                icon: "/summary/Twitter.png",
-                label: "Twitter",
+                icon: "/home/x.png",
+                label: "X",
                 shareUrl: `https://twitter.com/intent/tweet?text=${url}`,
             },
             {

src/app/[locale]/(navbar)/betrecord/components/list.tsx

@@ -15,18 +15,14 @@ const BetRecord: FC<Props> = (props) => {
 
     return (
         <>
-            <List
-                style={{
-                    "--border-bottom": "none",
-                    "--border-top": "none",
-                    "--border-inner": "solid 1px #333333",
-                }}
-            >
+            <List style={{ "--padding-left": "0", "--padding-right": "0" }}>
                 {record.map((item, index) => (
                     <List.Item key={index}>
-                        <div className={"flex justify-between"}>
-                            <div className={"text-[.13rem] text-[#fff]"}>{item.product}</div>
-                            <div>
+                        <div className={"mb-[.06rem] flex justify-between"}>
+                            <div className={"text-[.13rem] text-[.16rem] text-[#c6d4e1]"}>
+                                {item.product}
+                            </div>
+                            <div className="text-[.16rem] font-bold">
                                 {item.reward > 0 ? (
                                     <span className={"text-[#11de68]"}>+ {item.reward}</span>
                                 ) : (
@@ -37,7 +33,7 @@ const BetRecord: FC<Props> = (props) => {
 
                         <div
                             className={
-                                "flex justify-between text-[0.10rem] text-[#677787]" +
+                                "flex justify-between text-[0.12rem] text-[#677787]" +
                                 " mt-[0.02rem]"
                             }
                         >

src/app/[locale]/(navbar)/betrecord/layout.tsx

@@ -16,7 +16,7 @@ export default async function Layout({
 }) {
     const t = await getTranslations("ProfilePage");
     return (
-        <div className="h-[100%] overflow-auto">
+        <div className="betrecordPage h-[100%] overflow-auto">
             <HeaderBack showBack={true} title={t("gamblingBets")} />
             <main className={"main-header"}>{children}</main>
         </div>

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

@@ -11,12 +11,37 @@ const Transactions = async () => {
     const defaultTabs = [
         {
             id: 1,
-            name: t("main"),
+            name: (
+                <div className="jusyify-center flex items-center text-[.14rem]">
+                    <i className="iconfont icon-a-zhucaidan_huaban1 mr-[.06rem]"></i>
+                    <span>{t("main")}</span>
+                </div>
+            ),
             content: 0,
             render: <CashRecord></CashRecord>,
         },
-        { id: 2, name: t("gratis"), content: 0, render: <FreeRecord /> },
-        { id: 3, name: t("compensation"), content: 0, render: <ReplayRecord /> },
+        {
+            id: 2,
+            name: (
+                <div className="jusyify-center flex items-center text-[.14rem]">
+                    <i className="iconfont icon-meiyuan2 mr-[.06rem]"></i>
+                    <span>{t("gratis")}</span>
+                </div>
+            ),
+            content: 0,
+            render: <FreeRecord />,
+        },
+        {
+            id: 3,
+            name: (
+                <div className="jusyify-center flex items-center px-[.1rem] text-[.14rem]">
+                    <i className="iconfont icon-meiyuanzhanghuyue mr-[.06rem]"></i>
+                    <span>{t("compensation")}</span>
+                </div>
+            ),
+            content: 0,
+            render: <ReplayRecord />,
+        },
     ];
     return (
         <div className={clsx(styles.betrecordPage)}>

src/app/[locale]/(navbar)/betrecord/style.module.scss

@@ -21,12 +21,14 @@
     //     //     // border-radius: 0.15rem;
     //     //     // border-top-width: 1px;
     //     // }
-    //     :global(.adm-list-item-content) {
-    //         border-top: none;
-    //     }
-    //     :global(.adm-list-item-content-main) {
-    //         border-top: 1px solid #1b1a5d;
-    //     }
+    :global(.adm-list-item) {
+        margin-bottom: 0.1rem;
+    }
+    :global(.adm-list-item-content-main) {
+        padding: 0.1rem;
+        background: #1f2830;
+        border-radius: 0.1rem;
+    }
     //     :global(.adm-tabs-tab-list) {
     //         margin: 0.12rem;
     //         // border: 1px solid #e43bff;

src/app/[locale]/(navbar)/cashback/CashbackTable.tsx

@@ -43,7 +43,10 @@ const Page = (props: Props) => {
         return Promise.resolve();
     };
     return (
-        <>
+        <div className="mt-[.2rem] overflow-hidden rounded-[.1rem] bg-[#1f2830]">
+            <div className="p-[.1rem] text-[0.16rem] font-bold text-[#11de68]">
+                VIP cashback statuses
+            </div>
             <Table
                 columns={columns}
                 dataSource={cashbackInfo.rules || []}
@@ -54,27 +57,9 @@ const Page = (props: Props) => {
                 oddClassName={styles.odd}
                 evenClassName={styles.even}
                 tdClassName={styles.td}
+                headerClassName={styles.header}
             />
-            {/*<Box*/}
-            {/*    className={clsx(*/}
-            {/*        "mt-[10px] rounded-[10px] shadow-[0_0_20px_#3796b3_inset]",*/}
-            {/*        styles.tableBox*/}
-            {/*    )}*/}
-            {/*>*/}
-            {/*    <div className={"mb-[10px] text-[#00fffc]"}> {t("cashbackStatus")}</div>*/}
-            {/*    <Table*/}
-            {/*        columns={columns}*/}
-            {/*        dataSource={cashbackInfo.rules || []}*/}
-            {/*        loadMore={loadMore}*/}
-            {/*        hasMore={false}*/}
-            {/*        isLoadMore={false}*/}
-            {/*        isBackground={false}*/}
-            {/*        oddClassName={styles.odd}*/}
-            {/*        evenClassName={styles.even}*/}
-            {/*        tdClassName={styles.td}*/}
-            {/*    />*/}
-            {/*</Box>*/}
-        </>
+        </div>
     );
 };
 

src/app/[locale]/(navbar)/cashback/Week.tsx

@@ -13,14 +13,10 @@ const Week = (props: Props) => {
     const local = useLocale();
     const t = useTranslations("cashback");
     return (
-        <Box
-            className={
-                "rounded-[0_0_20px_20px] border-x-[2px] border-b-[2px] border-t-[1px] border-[#bf42df] shadow-[0_0_50px_#980cf9_inset]"
-            }
-        >
+        <Box className={"to rounded-[10px] bg-gradient-to-b from-[#1c2b2e] to-[#1d2a2f] p-[.1rem]"}>
             <div className={"flex"}>
                 <div className={"flex-1"}>
-                    <h1 className={"text-[0.16rem] font-black text-[#00fffc]"}>
+                    <h1 className={"text-[0.16rem] font-black text-[#11de68]"}>
                         {t("weekCashback")}
                     </h1>
                     <p className={"text-[0.12rem]"}>

src/app/[locale]/(navbar)/cashback/components/Extract.tsx

@@ -52,7 +52,7 @@ const Extract = (props: Props) => {
         <>
             <ul className={"mb-[0.2rem]"}>
                 <li className={styles.timelineItem}>
-                    <p className={"text-[.14rem]"}>{t("cashback.beforeTips")} </p>
+                    <p className={"text-[.14rem] leading-[1]"}>{t("cashback.beforeTips")} </p>
                     <div className={`${styles.timelineMarker} before:bg-[#fbc110]`}></div>
                     <div className={styles.timelineContent}>
                         <span className={"text-[0.1rem]"}>
@@ -62,7 +62,7 @@ const Extract = (props: Props) => {
                     </div>
                 </li>
                 <li className={styles.timelineItem}>
-                    <p className={"text-[.14rem]"}>{t("cashback.afterTips")} </p>
+                    <p className={"text-[.14rem] leading-[1]"}>{t("cashback.afterTips")} </p>
                     <div className={`${styles.timelineMarker} before:bg-[#9ae0b9]`}></div>
                     <div>
                         <span className={"text-[0.1rem]"} ref={scope}>
@@ -75,7 +75,7 @@ const Extract = (props: Props) => {
             <div
                 className={
                     styles.weekbtn +
-                    " flex h-[0.3472rem] items-center justify-center font-bold text-[#fff]"
+                    " flex h-[0.43rem] items-center justify-center font-bold text-[#fff]"
                 }
                 onClick={getCashbackGiveApi}
             >

src/app/[locale]/(navbar)/cashback/components/Progress.tsx

@@ -3,9 +3,10 @@ import { ProgressBar } from "antd-mobile";
 import { FC } from "react";
 type Props = {
     num: number;
+    style?: any;
 };
 const Progress: FC<Props> = (props) => {
-    const { num } = props;
+    const { num, style = {} } = props;
     return (
         <ProgressBar
             percent={num}
@@ -13,6 +14,7 @@ const Progress: FC<Props> = (props) => {
                 "--fill-color": "#bd37e0",
                 "--track-color": "#7468b6",
                 "--track-width": "0.0694rem",
+                ...style,
             }}
         />
     );

src/app/[locale]/(navbar)/cashback/components/style.module.scss

@@ -57,8 +57,9 @@
 }
 
 .weekbtn {
-    border-radius: 50%;
-    @include customButton(linear-gradient(to bottom, #b856ef, #6948d5), #f5a3ff, 0.2rem);
+    border-radius: 0.2rem;
+    background: #11de68;
+    // @include customButton(linear-gradient(to bottom, #b856ef, #6948d5), #f5a3ff, 0.2rem);
     span {
         position: relative;
         z-index: 2;
@@ -73,9 +74,7 @@
 }
 .even {
     position: relative;
-    border: 1px solid #46e3ff;
-    background: rgba(172, 89, 235, 0.25);
-    box-shadow: 0 0 10px #35a1b4 inset;
+    background: #2b363f;
     //border-radius: 0.1rem;
     &:after {
         //content: "";
@@ -96,3 +95,8 @@
     //     border-radius: 0.1rem 0 0 0.1rem;
     // }
 }
+
+.header {
+    background-color: #1c6042;
+    --primary-color: #fff;
+}

src/app/[locale]/(navbar)/cashback/layout.tsx

@@ -17,8 +17,8 @@ export default async function Layout({
 }) {
     const t = await getTranslations("cashback");
     return (
-        <div className="h-[100%] overflow-auto bg-[url('/home/bg.jpg')]">
-            <HeaderBack showBack={true} useBg={true} title={t("cashbackTitle")} />
+        <div className="h-[100%] overflow-auto bg-[#0b0e10]">
+            <HeaderBack showBack={true} title={t("cashbackTitle")} />
             <main className={"main-header"}>
                 {/*{Array.from({ length: 100 }).map((n, index) => (*/}
                 {/*    <div key={} className="bg-white h-[100px]">*/}

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

@@ -55,7 +55,6 @@ const CashbackInfo = async () => {
     const vipInfo = await getVipInfoApi();
     const cashbackInfo = await getCashBackApi();
 
-    console.log(112233, cashbackInfo);
     const currentGrade = cashbackInfo.rules?.find(
         (item) => item.level === (vipInfo.vip_level || 1)
     );
@@ -66,7 +65,7 @@ const CashbackInfo = async () => {
         if (item.leve === vipInfo.vip_level) {
             return (
                 <div key={index} className={"relative mr-[10px]"}>
-                    <Image src={item.src} alt={"vip"} height={100} width={100} />
+                    <Image src={item.src} alt={"vip"} height={80} width={80} />
                     <span
                         className={"absolute bottom-[25%] w-[100%] text-center text-[0.16rem]"}
                         style={{ color: item.color }}
@@ -81,7 +80,7 @@ const CashbackInfo = async () => {
         <>
             <Box
                 className={
-                    "w-full mx-[0.1rem] rounded-[20px_20px_0_0] border-x-[2px] border-b-[2px] border-t-[1px] border-[#bf42df] shadow-[0_0_50px_#980cf9_inset]"
+                    "w-full mb-[.1rem] rounded-[10px] bg-gradient-to-r from-[#1e2931] to-[#172f29]"
                 }
             >
                 <div className={"flex"}>
@@ -89,28 +88,35 @@ const CashbackInfo = async () => {
                     <div className={"flex-1"}>
                         <div className={"flex items-baseline"}>
                             <span
-                                className={"mr-[0.06rem] text-[0.25rem] font-bold text-[#bf42df]"}
+                                className={"mr-[0.06rem] text-[0.23rem] font-bold text-[#11de68]"}
                             >
                                 {currentGrade?.cashback}%
                             </span>
                             <span
-                                className={"mr-[0.06rem] text-[0.23rem] font-bold text-[#bf42df]"}
+                                className={"mr-[0.06rem] text-[0.23rem] font-bold text-[#11de68]"}
                             >
                                 {t("cashback.cashbackTitle")}
                             </span>
                             <span
                                 className={
-                                    "w-[100%] text-right align-text-bottom text-[0.1rem] text-[#f6d4ff]"
+                                    "w-[100%] text-right align-text-bottom text-[0.1rem] text-[#fff]"
                                 }
                             >
                                 Max {maxGrade?.cashback}%
                             </span>
                         </div>
                         <div className={"mt-[0.1rem]"}>
-                            <Progress num={percentage(vipInfo?.vip_exp, vipInfo.vip_score_exp)} />
+                            <Progress
+                                num={percentage(vipInfo?.vip_exp, vipInfo.vip_score_exp)}
+                                style={{
+                                    "--fill-color": "#11de68",
+                                    "--track-color": "#8f9498",
+                                    "--track-width": "0.06rem",
+                                }}
+                            />
                             <div
                                 className={
-                                    "font-lightl mt-[0.04rem] text-right text-[0.1rem] text-[#f6d4ff]"
+                                    "font-lightl mt-[0.04rem] text-right text-[0.1rem] text-[#5f7880]"
                                 }
                             >
                                 {t("ProfilePage.expTips", {
@@ -125,11 +131,11 @@ const CashbackInfo = async () => {
             <Week cashbackInfo={cashbackInfo} />
 
             <CashbackTable cashbackInfo={cashbackInfo} />
-            <div className={"mt-[0.0694rem]"}>
-                <h1 className={"font-bold text-[#01a5a5]"}>{t("cashback.rules")}</h1>
+            <div className={"mt-[0.2rem]"}>
+                <h1 className={"font-bold text-[#fff]"}>{t("cashback.rules")}</h1>
                 <ul
                     className={
-                        "list-decimal pl-[0.1389rem] text-[0.12rem] leading-[0.18rem] text-[#fff]"
+                        "list-decimal pl-[0.1389rem] text-[0.12rem] leading-[0.18rem] text-[#6e848b]"
                     }
                 >
                     <li>{t("cashback.rulesFirst")} </li>

src/components/Table/index.tsx

@@ -113,7 +113,6 @@ const Table: FC<Props> = (props) => {
                                     index % 2 === 0 ? oddClassName : evenClassName
                                 )}
                             >
-                               
                                 {columns.map((head, headIndex) => (
                                     <TbodyItem
                                         index={index + 1}

src/components/Tabs/index.tsx

@@ -4,7 +4,7 @@ import { FC, PropsWithChildren, ReactNode } from "react";
 import styles from "./style.module.scss";
 interface Item {
     id: number;
-    name: string;
+    name: string | ReactNode;
     content: number;
     render?: ReactNode;
 }