feat: 修改BUG

src/app/[locale]/(TabBar)/deposit/Reward.tsx

@@ -26,15 +26,15 @@ const Reward: React.FC<Props> = ({ data }) => {
         if (!!(!data?.activity_reward || !data?.activity_reward)) return [];
         const result: any = {};
 
-        // if (data?.activity_reward?.length > 0) {
-        //     data?.activity_reward?.forEach((item) => {
-        //         if (item?.item_id <= 0 || item?.item_id > 4) return;
-        //         result[item?.item_id] = {
-        //             amount: `${item?.amount}${getSuffix(item.reward)}`,
-        //             reward: item?.reward,
-        //         };
-        //     });
-        // }
+        if (data?.activity_reward?.length > 0) {
+            data?.activity_reward?.forEach((item) => {
+                if (item?.item_id <= 0 || item?.item_id > 4) return;
+                result[item?.item_id] = {
+                    amount: `${item?.amount}${getSuffix(item.reward)}`,
+                    reward: item?.reward,
+                };
+            });
+        }
         if (data?.pay_reward?.length > 0) {
             data?.pay_reward?.forEach((item) => {
                 if (item?.item_id <= 0 || item?.item_id > 4) return;

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

@@ -1,12 +1,16 @@
 "use client";
 import { getShopInfoApi, getShopListApi, ShopInfo } from "@/api/depositsApi";
 import Loading from "@/components/Loading";
+import { useSearchParams } from "next/navigation";
 import React from "react";
 import DepositData from "./DepositData";
 import Left from "./Left";
 
 const Deposit = () => {
-    const [actIdx, setActIdx] = React.useState(0);
+    const searchParams = useSearchParams();
+    const [actIdx, setActIdx] = React.useState(
+        searchParams.get("target_id") ? Number(searchParams) : 0
+    );
     const [shopTypeList, setShopTypeList] = React.useState<any[]>([]);
     const [currentChannel, setCurrentChannel] = React.useState<any>({});
     const [shopInfo, setShopInfo] = React.useState<ShopInfo | null>(null);

src/app/[locale]/(doings)/card/page.module.scss

@@ -298,10 +298,28 @@
             top: 50%;
             transform: rotate(180deg);
             transform-origin: center center;
+            .redCircle {
+                width: 0.1rem;
+                height: 0.1rem;
+                border-radius: 50%;
+                background-color: red;
+                position: absolute;
+                top: 0.16rem;
+                left: 0.13rem;
+            }
         }
         &.arrowRight {
             right: 0;
             top: 50%;
+            .redCircle {
+                width: 0.1rem;
+                height: 0.1rem;
+                border-radius: 50%;
+                background-color: red;
+                position: absolute;
+                top: 0.16rem;
+                right: 0.07rem;
+            }
         }
     }
 }

src/app/[locale]/(doings)/card/page.tsx

@@ -26,11 +26,12 @@ const CardPage = () => {
     const searchParams = useSearchParams();
     const swiperRef = React.useRef<SwiperClass | null>(null);
 
-    // const [act, setAct] = React.useState(0);
+    const [act, setAct] = React.useState(0);
     const [amount, setAmount] = React.useState<any>({});
     const [visible, setVisible] = React.useState<boolean>(false);
     const [shopInfo, setShopInfo] = React.useState<ShopInfo>({} as ShopInfo);
     const [loading, setLoading] = React.useState(false);
+    const [canClaim, setCanClaim] = React.useState<number[]>([]);
 
     const shop_id = React.useMemo(() => {
         return Number(searchParams.get("shop_id"));
@@ -52,28 +53,38 @@ const CardPage = () => {
 
             if (res?.code === 200 && res?.data?.products) {
                 let actKey = 0;
+                let canClaimArray: number[] = [];
                 res.data.products.sort((a: any, b: any) => {
                     return a.pay - b.pay;
                 });
+
                 const result = res.data.products.map((item: ShopProductItem, idx: number) => {
                     item.btnType = BtnTypeEnum.DISABLED;
                     //|| item.is_suss === -1
                     if (item.days <= 0) {
                         item.btnType = BtnTypeEnum.DEPOSITE;
                     }
-                    if (!actKey && item.days > 0 && item.is_suss === 0) {
-                        actKey = idx;
+                    if (item.days > 0 && item.is_suss === 0) {
+                        canClaimArray.push(idx);
+                        if (!actKey) {
+                            actKey = idx;
+                        }
                     }
+
                     if (item.days > 0 && item.is_suss === 0) {
                         item.btnType = BtnTypeEnum.CANCLAIM;
                     }
 
                     return item;
                 });
+
                 //自动滚动到第一个买了的商品
                 setTimeout(() => {
+                    setAct(actKey);
                     swiperRef.current?.slideToLoop(actKey, 0, false);
                 }, 100);
+
+                setCanClaim(canClaimArray);
                 setShopInfo({ ...res.data, products: result || [] });
             }
         } finally {
@@ -87,10 +98,25 @@ const CardPage = () => {
             if (type === -1) swiperRef.current.slidePrev();
         }
     };
+    const redPointInfo = React.useMemo(() => {
+        const min = Math.min(...canClaim);
+        const max = Math.max(...canClaim);
+        const result = {
+            prev: false,
+            next: false,
+        };
+        if (act > min) {
+            result.prev = true;
+        }
+        if (act < max) {
+            result.next = true;
+        }
+        return result;
+    }, [act]);
 
-    const data = React.useMemo(() => {
-        return [1, 2, 3, 4, 5];
-    }, []);
+    // const data = React.useMemo(() => {
+    //     return [1, 2, 3, 4, 5];
+    // }, []);
 
     const getActiveInfo = (itemData: ShopProductItem) => {
         const amountInfo = itemData.activity_reward.find((item: ShopActivityRewardItem) => {
@@ -119,7 +145,7 @@ const CardPage = () => {
             return;
         }
         if (itemData.btnType === BtnTypeEnum.DEPOSITE) {
-            router.push(`/deposit`);
+            router.push(`/deposit?target_id=${shop_id}`);
             return;
         }
         if (itemData.btnType !== BtnTypeEnum.CANCLAIM) {
@@ -172,10 +198,10 @@ const CardPage = () => {
                     onSwiper={(swiper) => {
                         swiperRef.current = swiper;
                     }}
-                    // onSlideChange={(swiper) => {
-                    //     setAct(swiper.realIndex);
-                    // }}
-                    loop={data.length > 3}
+                    onSlideChange={(swiper) => {
+                        setAct(swiper.realIndex);
+                    }}
+                    loop={shopInfo?.products?.length > 3 || false}
                     modules={[Pagination]}
                     // loopAdditionalSlides={2}
                     pagination={{
@@ -210,7 +236,7 @@ const CardPage = () => {
                                                     "pr-[.12rem] pt-[.02rem] text-[.1rem]"
                                                 )}
                                             >
-                                                {item.is_buy && "Já foi comprado"}
+                                                {item.days > 0 && "Já foi comprado"}
                                             </div>
                                         </div>
                                         <div className={styles.cardContainerOut}>
@@ -248,7 +274,7 @@ const CardPage = () => {
                                                     </div>
                                                     <div className="flex-1 text-[.1rem]">
                                                         <div className={styles.text_1}>
-                                                            Nnuerário
+                                                            Numerário
                                                         </div>
                                                         <div
                                                             className={clsx(
@@ -371,6 +397,7 @@ const CardPage = () => {
                         onClick={() => doChange(-1)}
                     >
                         <i className="iconfont icon-xiangyou1"></i>
+                        {redPointInfo.prev && <div className={styles.redCircle}></div>}
                     </div>
 
                     <div
@@ -378,6 +405,7 @@ const CardPage = () => {
                         onClick={() => doChange(1)}
                     >
                         <i className="iconfont icon-xiangyou1"></i>
+                        {redPointInfo.next && <div className={styles.redCircle}></div>}
                     </div>
                 </div>
             </div>