Jelajahi Sumber

fix:更改提现状颜色

Before 6 bulan lalu
induk
melakukan
6e3e786f52

+ 20 - 1
src/app/[locale]/(navbar)/transactions/Bets.tsx

@@ -4,6 +4,8 @@ import { Pagination } from "@/types";
 import { server } from "@/utils/client";
 import { useSetState } from "ahooks";
 import { InfiniteScroll } from "antd-mobile";
+import clsx from "clsx";
+import { useTranslations } from "next-intl";
 import { useRef } from "react";
 import Message from "./components/Message";
 
@@ -23,6 +25,7 @@ const Bets = () => {
         page: Partial<Pagination>;
     }>({ list: [], page: { is_end: false } });
 
+    const t = useTranslations();
     const getDepositsData = async () => {
         return getWithdrawsApi(params.current).then((res) => {
             const newData = (res.data || []).map((item) => {
@@ -41,7 +44,23 @@ const Bets = () => {
     };
     return (
         <>
-            <Message data={sourceData.list} isTranslate={true} />
+            <Message
+                data={sourceData.list}
+                isTranslate={true}
+                textRender={(value) => {
+                    const blues = [0, 2, 4];
+                    const reds = [5, 7];
+                    const greens = [3, 1];
+
+                    const cls = clsx(
+                        "text-[#acacac]",
+                        blues.includes(value.order_status ?? 0) && "text-[#2177b8]",
+                        reds.includes(value.order_status ?? 0) && "text-[#de2a18]",
+                        greens.includes(value.order_status ?? 0) && "text-[#45b787]"
+                    );
+                    return <p className={cls}>{t(`withdrawStatus.${value?.order_status}`)}</p>;
+                }}
+            />
             <InfiniteScroll loadMore={loadMore} hasMore={!sourceData.page.is_end!} />
         </>
     );

+ 7 - 2
src/app/[locale]/(navbar)/transactions/components/Message.tsx

@@ -3,13 +3,15 @@ import Box from "@/components/Box";
 import { copyText, timeFormat } from "@/utils/methods";
 import { Toast } from "antd-mobile";
 import { useTranslations } from "next-intl";
+import { ReactNode } from "react";
 
 type Props = {
     data: (DepositsRep & { order_status?: number })[];
     isTranslate?: boolean;
+    textRender?: (value: DepositsRep & { order_status?: number }) => ReactNode;
 };
 const Message = (props: Props) => {
-    const { data = [], isTranslate = false } = props;
+    const { data = [], isTranslate = false, textRender } = props;
     const t = useTranslations();
     const copyHandler = (text: string) => {
         copyText(text);
@@ -39,7 +41,10 @@ const Message = (props: Props) => {
                         </div>
                         <div className={"flex justify-between text-[12px] text-[#acacac]"}>
                             <p>{timeFormat(item.time)}</p>
-                            {isTranslate ? (
+
+                            {textRender ? (
+                                textRender(item)
+                            ) : isTranslate ? (
                                 <p>{t(`withdrawStatus.${item?.order_status}`)}</p>
                             ) : (
                                 <p>{item.status}</p>