浏览代码

fix: 修改反水页面详情

Before 7 月之前
父节点
当前提交
77423580d7

+ 2 - 0
src/app/[locale]/(navbar)/cashbackDetails/DetailsTable.tsx

@@ -66,6 +66,8 @@ const DetailsTable = (props: Props) => {
             hasMore={false}
             isLoadMore={false}
             isBackground={false}
+            headerClassName={"odd:bg-[#ffd9c1] even:bg-[#d1d1d1]"}
+            bodyClassName={"odd:bg-[#ffe8da] even:bg-[#ffd9c1]"}
         />
     );
 };

+ 1 - 1
src/app/[locale]/(navbar)/cashbackDetails/page.tsx

@@ -47,7 +47,7 @@ const Page = async () => {
                 <div
                     className={
                         "bg-[url(/cashback/content-2.png)] bg-[length:100%_100%] pt-[0.5556rem]" +
-                        " -mt-[1rem] pb-[0.1389rem]"
+                        " -mt-[1rem] px-[0.1389rem] pb-[0.1389rem]"
                     }
                 >
                     <DetailsTable data={result.data} />

+ 16 - 2
src/components/Table/index.tsx

@@ -23,6 +23,8 @@ interface Props {
     hasMore: boolean;
     isLoadMore?: boolean;
     isBackground?: boolean;
+    headerClassName?: string;
+    bodyClassName?: string;
 }
 
 /**
@@ -54,16 +56,28 @@ const Table: FC<Props> = (props) => {
         threshold = 100,
         isLoadMore = true,
         isBackground = false,
+        headerClassName,
+        bodyClassName,
     } = props;
 
     const cls = clsx(" table-header-group text-[grey] text-[.11rem] ");
 
     const bodyCls = clsx(maxHeight ? ` max-h-[${maxHeight}]` : "", "overflow-y-scroll");
 
+    const hasBackgroundCls = clsx(isBackground && "odd:bg-[#dedede] even:bg-[#d1d1d1] ");
+
     const headerTrCls = clsx(
         "h-[40px] border-b-1 border-[#e8e8e8]",
-        isBackground && "odd:bg-[#dedede] even:bg-[#d1d1d1] "
+        hasBackgroundCls,
+        headerClassName
+    );
+
+    const borderClass = clsx(
+        "h-[40px] border-b-1 border-[#e8e8e8]  text-center text-[#999]",
+        hasBackgroundCls,
+        bodyClassName
     );
+
     const colGroup = columns.map((item, index) => {
         return <col key={index} style={{ width: item.width }} />;
     });
@@ -86,7 +100,7 @@ const Table: FC<Props> = (props) => {
                     <colgroup>{colGroup}</colgroup>
                     <tbody className={""}>
                         {dataSource.map((item, index) => (
-                            <tr key={index} className={`${headerTrCls} text-center text-[#999]`}>
+                            <tr key={index} className={`${borderClass}`}>
                                 {columns.map((head, headIndex) => (
                                     <TbodyItem
                                         index={index + 1}