fix: 提交谷歌模板

src/app/[locale]/(TabBar)/[[...share]]/@actionWidget/Service.tsx

@@ -8,17 +8,19 @@ import WheelModal, { WheelModalProps } from "@/components/ModalPopup/WheelModal"
 
 import { getWheelApi } from "@/api/cashWheel";
 import { getGiveInfoApi } from "@/api/slots";
+import SignInModal, { SignInModalProps } from "@/components/ModalPopup/SignInModal";
 import { useEventPoint } from "@/hooks/useEventPoint";
 import { Link } from "@/i18n/routing";
 import { useGlobalNoticeStore } from "@/stores/useGlobalNoticeStore";
+import { SignType, useSignStore } from "@/stores/useSignStore";
 import useWheelStore from "@/stores/useWheelStore";
+import { server } from "@/utils/client";
 import { getToken } from "@/utils/Cookies";
 import { useRequest } from "ahooks";
 import { Badge } from "antd-mobile";
 import { useTranslations } from "next-intl";
 import Image from "next/image";
 import { FC, useEffect, useRef } from "react";
-import SignInModal, { SignInModalProps } from "@/components/ModalPopup/SignInModal";
 
 interface Props {
     services: ServiceTypes[];
@@ -187,7 +189,7 @@ const RedPacketSection = () => {
             return actList.filter((aItem: any) => {
                 return aItem.is_start;
             });
-        } catch (error) { }
+        } catch (error) {}
     };
     // 红包雨轮询
     const { data: packets, run } = useRequest<any[], any>(getRedPacketInfo, {
@@ -275,19 +277,50 @@ const CustomerSection: FC<Omit<Props, "socials">> = (props) => {
 /**
  * 签到活动
  */
+
+const getSignDetailsApi = (data: { activity_id: number }) => {
+    return server.post<SignType>({
+        url: "/v1/api/user/activity/signInInfo",
+        data,
+    });
+};
 const SignInSection: FC = () => {
-    const SignInRef = useRef<SignInModalProps>(null)
+    const SignInRef = useRef<SignInModalProps>(null);
+
+    const { setSignData, signData } = useSignStore((state) => {
+        return {
+            setSignData: state.setSignData,
+            signData: state.signData,
+        };
+    });
+    useEffect(() => {
+        if (getToken()) {
+            // getSignDetailsApi({ activity_id: 3 }).then((res) => {
+            //     console.log(`🚀🚀🚀🚀🚀-> in Service.tsx on 299`, res.data);
+            //     setSignData(res.data);
+            // });
+        }
+    }, []);
 
     const signInHandle = () => {
-        SignInRef.current?.onOpen()
-    }
+        SignInRef.current?.onOpen();
+    };
     return (
         <>
-            <div style={{ width: 100, height: 100, backgroundColor: 'red' }} onClick={signInHandle}></div>
+            <div
+                className={
+                    "mt-[0.2778rem] flex h-[0.54rem] w-[0.54rem] items-center justify-center" +
+                    " rounded-[50%]" +
+                    " bg-gradient-to-t from-[#ff611b] to-[#ffcf35]"
+                }
+                onClick={signInHandle}
+            >
+                Sign
+            </div>
             <SignInModal ref={SignInRef}></SignInModal>
         </>
-    )
-}
+    );
+};
 const ServiceWidget: FC<Props> = (props) => {
     const { services } = props;
 
@@ -327,7 +360,7 @@ const ServiceWidget: FC<Props> = (props) => {
                 {/*客服*/}
                 <CustomerSection services={services} />
                 {/* 签到 */}
-                <SignInSection />
+                {/*<SignInSection />*/}
             </div>
 
             <div

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

@@ -6,7 +6,6 @@ import clsx from "clsx";
 import Image from "next/image";
 import { useSearchParams } from "next/navigation";
 import { FC, useEffect, useRef, useState } from "react";
-import { Autoplay } from "swiper/modules";
 import { Swiper, SwiperSlide } from "swiper/react";
 import style from "./style.module.scss";
 interface StoreDetailsType {
@@ -63,7 +62,7 @@ const Header = () => {
     );
 };
 
-const Footer = () => {
+const Footer: FC<{ onPress: () => void }> = ({ onPress }) => {
     const items = [
         { name: "Jogos", icon: "game" },
         { name: "Apps", icon: "app" },
@@ -83,6 +82,7 @@ const Footer = () => {
                     <div
                         key={index}
                         className={clsx(index === 1 ? "text-[#01875f]" : "", "cursor-pointer")}
+                        onClick={onPress}
                     >
                         <Image
                             src={`/store/${item.icon}.svg`}
@@ -170,11 +170,11 @@ const CardView: FC<{ details: StoreDetailsType | null; onPress: () => void }> =
             <div
                 className={"my-[0.1389rem] flex justify-center space-x-[0.2083rem] text-[#01875f]"}
             >
-                <div className={"flex items-center"}>
+                <div className={"flex items-center"} onClick={onPress}>
                     <i className={"iconfont icon-fenxiang1 mr-[8px] text-[0.1389rem]"} />
                     <span>Compartilhar</span>
                 </div>
-                <div className={"flex items-center"}>
+                <div className={"flex items-center"} onClick={onPress}>
                     <i className={"iconfont icon-shoucang" + " mr-[8px] text-[0.1389rem]"} />{" "}
                     <span>Adicionar à lista de desejos</span>
                 </div>
@@ -185,16 +185,15 @@ const CardView: FC<{ details: StoreDetailsType | null; onPress: () => void }> =
                     pagination={{
                         clickable: true,
                     }}
-                    loop
+                    slidesPerView={"auto"}
+                    spaceBetween={10}
                     autoplay={{
                         delay: 3000,
                     }}
-                    modules={[Autoplay]}
-                    className="mySwiper"
                 >
                     {details?.preview_images?.map((url, index: number) => (
-                        <SwiperSlide key={index}>
-                            <img src={url} alt={""} className={"h-[1.3rem] w-[100%]"} />
+                        <SwiperSlide key={index} className={"max-w-fit"}>
+                            <img src={url} alt={""} className={"h-[200px] rounded-[10px]"} />
                         </SwiperSlide>
                     ))}
                 </Swiper>
@@ -721,7 +720,7 @@ const Page = () => {
             />
             {details?.type === 1 ? <Header /> : null}
             <CardView details={details} onPress={() => setVisible(true)} />
-            <Footer />
+            <Footer onPress={() => setVisible(true)} />
         </div>
     );
 };

src/components/ModalPopup/SignInModal/index.tsx

@@ -1,154 +1,191 @@
 /* eslint-disable @next/next/no-img-element */
-'use client'
-import { FC, forwardRef, memo, useImperativeHandle, useRef, useState } from "react"
-import { Mask } from "antd-mobile"
+"use client";
 import { useRouter } from "@/i18n/routing";
-import styles from './style.module.scss'
+import { useSignStore } from "@/stores/useSignStore";
+import { Mask } from "antd-mobile";
+import { FC, forwardRef, memo, useImperativeHandle, useRef, useState } from "react";
+import styles from "./style.module.scss";
 
 export interface SignInModalProps {
     onClose: () => void;
-    onOpen: () => void
+    onOpen: () => void;
 }
 interface BoxParams {
     startDays?: number;
     num: number;
-    type?: 'page' | 'modal';
+    type?: "page" | "modal";
 }
 interface BoxList {
-    handleOpening: (index: number) => void
+    handleOpening: (index: number) => void;
 }
-export const BoxListCom = forwardRef<BoxList, BoxParams>(function BoxListCom({ startDays = 1, num, type = 'modal' }: BoxParams, ref) {
+export const BoxListCom = forwardRef<BoxList, BoxParams>(function BoxListCom(
+    { startDays = 1, num, type = "modal" }: BoxParams,
+    ref
+) {
+    const signData = useSignStore((state) => state.signData);
     const handleOpening = (index: number) => {
-        const box: any = document.getElementById(`box${index}`)
-        box.src = '/sign/box/box-open.png'
-        const img = document.getElementById(`opened${index}`)
-        img ? img.style.visibility = 'visible' : null
-    }
+        const box: any = document.getElementById(`box${index}`);
+        box.src = "/sign/box/box-open.png";
+        const img = document.getElementById(`opened${index}`);
+        img ? (img.style.visibility = "visible") : null;
+    };
     useImperativeHandle(ref, (): BoxList => {
         return {
-            handleOpening
-        }
-    })
+            handleOpening,
+        };
+    });
     return (
         <>
-            <div className={`w-[100%] ${type === 'page' ? styles.page : styles.modal}`}>
-                <div className="flex flex-wrap w-[100%] h-[100%] justify-start">
-                    {Array.from({ length: num }).map((item, index) => {
+            <div className={`w-[100%] ${type === "page" ? styles.page : styles.modal}`}>
+                <div className="flex h-[100%] w-[100%] flex-wrap justify-start">
+                    {signData?.list?.map((item, index) => {
                         return (
                             <div className="h-[100%] w-[20%]" key={index}>
                                 <div className="h-[100%] w-[100%]">
-                                    <div className={`relative text-center ${styles.text} text-[white]`}>
+                                    <div
+                                        className={`relative text-center ${styles.text} text-[white]`}
+                                    >
                                         <p>Day{startDays + index}</p>
                                     </div>
-                                    <div className={`relative ${styles.box} w-[100%]`} onClick={(e) => handleOpening(startDays + index)}>
+                                    <div className={`relative ${styles.box} w-[100%]`}>
+                                        {/*onClick={(e) => handleOpening(startDays + index)}*/}
                                         <img
-                                            id={'box' + (startDays + index)}
-                                            src={index >= 5 ? '/sign/box_pay/gift.png' : '/sign/box/box.png'}
-                                            className={"h-[100%] z-50 mx-[auto]"}
+                                            id={"box" + (startDays + index)}
+                                            src={
+                                                item.is_suss
+                                                    ? "/sign/box/box-open.png"
+                                                    : item.is_unlock_extra_reward
+                                                      ? "/sign/box_pay/gift.png"
+                                                      : "/sign/box/box.png"
+                                            }
+                                            className={"z-50 mx-[auto] h-[100%]"}
                                             alt=""
                                         />
                                         <div className="flex justify-center">
-                                            <img
-                                                id={'opened' + (startDays + index)}
-                                                src="/sign/opened.png"
-                                                className={"absolute h-[0.34rem] z-50 bottom-[0.035rem] invisible"}
-                                                alt=""
-                                            />
+                                            {item.is_suss ? (
+                                                <img
+                                                    id={"opened" + (startDays + index)}
+                                                    src={"/sign/opened.png"}
+                                                    className={
+                                                        "absolute bottom-[0.035rem] z-50 h-[0.34rem]"
+                                                    }
+                                                    alt=""
+                                                />
+                                            ) : null}
                                         </div>
-                                        {
-                                            index >= 5 ? <div className="h-[30%] absolute w-[90%] bottom-0 bg-[black] rounded mx-auto left-0 right-0 border-[0.02rem] border-[green]">
-                                                <p className={`${styles.green} text-[green] font-bold  text-center`}>Extra +50R</p>
-                                            </div> : null
-                                        }
+                                        {item.is_unlock_extra_reward ? (
+                                            <div className="absolute bottom-0 left-0 right-0 mx-auto h-[30%] w-[90%] rounded border-[0.02rem] border-[green] bg-[black]">
+                                                <p
+                                                    className={`${styles.green} text-center font-bold text-[green]`}
+                                                >
+                                                    Extra +{item.extra_num}R
+                                                </p>
+                                            </div>
+                                        ) : null}
                                     </div>
-                                    {
-                                        index >= 5 ? <div className={`${styles.lock} relative text-center text-[yellow] font-bold flex justify-center mt-[0.05rem]`}>
+                                    {item.is_unlock_extra_reward ? (
+                                        <div
+                                            className={`${styles.lock} relative mt-[0.05rem] flex justify-center text-center font-bold text-[yellow]`}
+                                        >
                                             <img
-                                                id={'opened' + (startDays + index)}
+                                                id={"opened" + (startDays + index)}
                                                 src="/sign/lock.png"
-                                                className={"h-[100%] block"}
+                                                className={"block h-[100%]"}
                                                 alt=""
                                             />
-                                            <span className="block">+5R</span>
-                                        </div> : null
-                                    }
+                                            <span className="block">+{item.extra_num}</span>
+                                        </div>
+                                    ) : null}
                                 </div>
                             </div>
-                        )
+                        );
                     })}
                 </div>
             </div>
         </>
-    )
-})
+    );
+});
 
 interface PayProps {
-    type?: 'page' | 'modal'
+    type?: "page" | "modal";
 }
-export const PayBoxList: FC<PayProps> = ({ type = 'modal' }) => {
+export const PayBoxList: FC<PayProps> = ({ type = "modal" }) => {
     return (
         <>
             <div className="flex justify-center">
                 {Array.from({ length: 4 }).map((item, index) => {
                     return (
                         <>
-                            <div className={`relative h-[100%] ${type === 'page' ? styles.payPage : styles.payModal}`}>
-                                <div className="relative h-[0.89rem] flex justify-center font-bold">
-                                    <span className="absolute z-50 top-[0.005rem] text-[white] leading-[]">5R</span>
+                            <div
+                                className={`relative h-[100%] ${type === "page" ? styles.payPage : styles.payModal}`}
+                            >
+                                <div className="relative flex h-[0.89rem] justify-center font-bold">
+                                    <span className="absolute top-[0.005rem] z-50 leading-[] text-[white]">
+                                        5R
+                                    </span>
                                     <img
                                         src="/sign/box_pay/bg.png"
-                                        className={"h-[100%]  z-10"}
+                                        className={"z-10 h-[100%]"}
                                         alt=""
                                     />
                                     <img
                                         src="/sign/box_pay/bg2.png"
-                                        className={"absolute h-[0.355rem]  z-30 bottom-0"}
+                                        className={"absolute bottom-0 z-30 h-[0.355rem]"}
                                         alt=""
                                     />
                                     <img
                                         src="/sign/box_pay/gift.png"
-                                        className={"absolute h-[0.505rem]  z-20 top-[0.18rem]"}
+                                        className={"absolute top-[0.18rem] z-20 h-[0.505rem]"}
                                         alt=""
                                     />
                                     <img
-                                        id={'lock' + index}
+                                        id={"lock" + index}
                                         src="/sign/box_pay/lock.png"
-                                        className={"absolute h-[0.315rem]  z-40 bottom-[0.17rem]"}
+                                        className={"absolute bottom-[0.17rem] z-40 h-[0.315rem]"}
                                         alt=""
                                     />
                                     <img
-                                        id={'opened' + index}
+                                        id={"opened" + index}
                                         src="/sign/opened.png"
-                                        className={"absolute h-[0.34rem] z-40 bottom-[0.3rem]"}
+                                        className={"absolute bottom-[0.3rem] z-40 h-[0.34rem]"}
                                         alt=""
                                     />
-                                    <span className="absolute z-50 bottom-[0.005rem] text-[white]">50R</span>
+                                    <span className="absolute bottom-[0.005rem] z-50 text-[white]">
+                                        50R
+                                    </span>
                                 </div>
-                                <div className={`${styles.text} text-center font-bold text-[white]`}>
-                                    <span>Day{index === 3 ? 10 + index * 5 + 5 : 10 + index * 5}</span>
+                                <div
+                                    className={`${styles.text} text-center font-bold text-[white]`}
+                                >
+                                    <span>
+                                        Day{index === 3 ? 10 + index * 5 + 5 : 10 + index * 5}
+                                    </span>
                                 </div>
                             </div>
                         </>
-                    )
+                    );
                 })}
             </div>
         </>
-    )
-}
+    );
+};
 
 const SignInModal = forwardRef(function SignInModal(props, ref) {
-    const [visible, setVisible] = useState(false)
+    const [visible, setVisible] = useState(false);
+    const signData = useSignStore((state) => state.signData);
 
-    const router = useRouter()
+    const totalData = signData.list;
+    const isSignNum = totalData?.reduce((pre, cur) => (cur.is_suss ? pre + 1 : pre), 0);
+    const router = useRouter();
 
-    const boxRef = useRef(null)
+    const boxRef = useRef(null);
 
     useImperativeHandle(ref, () => {
         return {
             onClose: () => setVisible(false),
-            onOpen: () => setVisible(true)
+            onOpen: () => setVisible(true),
         };
-    })
+    });
     return (
         <>
             <Mask visible={visible} destroyOnClose={true} onMaskClick={() => setVisible(false)}>
@@ -159,12 +196,12 @@ const SignInModal = forwardRef(function SignInModal(props, ref) {
                     <span className={"iconfont icon-guanbi"}></span>
                 </div>
                 <div className="absolute top-[5%] w-[100%]">
-                    <div className={"relative w-[100%] h-[6.25rem]"}>
-                        <div className={'h-[100%]'}>
-                            <div className="absolute h-[100%] w-[100%] overflow-hidden flex justify-center">
+                    <div className={"relative h-[6.25rem] w-[100%]"}>
+                        <div className={"h-[100%]"}>
+                            <div className="absolute flex h-[100%] w-[100%] justify-center overflow-hidden">
                                 <img
                                     src="/sign/light2.png"
-                                    className={"absolute h-[7.5rem] max-w-[none] top-[-1.215rem]"}
+                                    className={"absolute top-[-1.215rem] h-[7.5rem] max-w-[none]"}
                                     alt=""
                                 />
                                 <img
@@ -174,38 +211,49 @@ const SignInModal = forwardRef(function SignInModal(props, ref) {
                                 />
                             </div>
                             {/* 主题背景图 */}
-                            <div className="relative flex justify-center h-[3rem] w-[100%]">
-                                <img
-                                    src="/sign/theme.png"
-                                    className={"absolute h-[100%]"}
-                                    alt=""
-                                />
+                            <div className="relative flex h-[3rem] w-[100%] justify-center">
+                                <img src="/sign/theme.png" className={"absolute h-[100%]"} alt="" />
                             </div>
-                            <div className="absolute h-[3.95rem] top-[30%] w-[100%]">
-                                <div className="flex justify-center h-[100%]">
+                            <div className="absolute top-[30%] h-[3.95rem] w-[100%]">
+                                <div className="flex h-[100%] justify-center">
                                     {/* 宽度自动填充适应活动背景图宽度 */}
                                     <div className="relative h-[100%]">
                                         <img
-                                            src="/sign/bg2.png"
+                                            src={
+                                                signData.background_type === 1
+                                                    ? "/sign/bg2.png"
+                                                    : signData.Background
+                                            }
                                             className={"h-[100%]"}
                                             alt=""
                                         />
                                         {/* 右上角倒计时 */}
-                                        <div className="absolute w-[20%] h-[0.3rem] right-[0.15rem] top-0 z-50 text-center text-[0.1rem] font-bold text-[white]">
-                                            <p className={"h-[0.15rem]"}>CountDown</p>
-                                            <p className={"text-[yellow] h-[0.15rem]"}>Day 20</p>
+                                        <div className="absolute right-[0.15rem] top-0 z-50 flex h-[0.3rem] w-[20%] items-center justify-center space-x-[2px] text-center text-[0.125rem] font-bold text-[white]">
+                                            {/*<p
+                                             className={"h-[0.15rem]"}>{totalData?.length}</p>*/}
+                                            {/*<p className={"h-[0.15rem] text-[yellow]"}>Day 20</p>*/}
+                                            <p className={"text-[yellow]"}>{isSignNum}</p>
+                                            <span>/</span>
+                                            <p>{totalData?.length}</p>
                                         </div>
                                         {/* 签到body */}
-                                        <div className="absolute top-0 left-0 w-[100%]">
-                                            <div className="relative w-[100%] mt-[0.51rem]">
+                                        <div className="absolute left-0 top-0 w-[100%]">
+                                            <div className="relative mt-[0.51rem] w-[100%]">
                                                 <BoxListCom num={15} ref={boxRef} />
-                                                <div className="flex justify-center h-[0.62rem] mt-[0.25rem]" onClick={() => { router.push('/signIn') }}>
+                                                <div
+                                                    className="mt-[0.25rem] flex h-[0.62rem] justify-center"
+                                                    onClick={() => {
+                                                        router.push("/signIn");
+                                                    }}
+                                                >
                                                     <img
                                                         src="/sign/button_signed.png"
                                                         className={"h-[100%]"}
                                                         alt=""
                                                     />
-                                                    <span className="absolute leading-[0.375rem] text-[0.16rem] font-bold">Sign-in</span>
+                                                    <span className="absolute text-[0.16rem] font-bold leading-[0.375rem]">
+                                                        Sign-in
+                                                    </span>
                                                 </div>
                                             </div>
                                         </div>
@@ -217,7 +265,7 @@ const SignInModal = forwardRef(function SignInModal(props, ref) {
                 </div>
             </Mask>
         </>
-    )
-})
+    );
+});
 
-export default memo(SignInModal)
+export default memo(SignInModal);

src/stores/useSignStore.ts

@@ -0,0 +1,116 @@
+import { create } from "zustand";
+
+export interface SignType {
+    /**
+     * 活动也详情选择0跟随皮肤1样式1 2样式2
+     */
+    act_page: number;
+    /**
+     * 宣传预览图片链接
+     */
+    act_promotion_url: string;
+    /**
+     * 时间类型1永久2自定义
+     */
+    act_time_type: number;
+    /**
+     * 背景图片链接
+     */
+    Background: string;
+    /**
+     * //背景类型 1 默认 2自定义
+     */
+    background_type: number;
+    /**
+     * 活动展示结束时间
+     */
+    display_end_time: number;
+    /**
+     * 活动展示开始时间
+     */
+    display_start_time: number;
+    /**
+     * 活动结束时间
+     */
+    end_at: number;
+    /**
+     * 活动ID
+     */
+    id: number;
+    /**
+     * 内容展示
+     */
+    list: List[];
+    /**
+     * 名称
+     */
+    name: string;
+    /**
+     * 规则说明
+     */
+    remark: string;
+    /**
+     * 活动开始时间
+     */
+    start_at: number;
+    /**
+     * 活动类型
+     */
+    type: number;
+}
+
+export interface List {
+    /**
+     * 奖励货类型
+     */
+    coin_type: number;
+    /**
+     * 额外奖励有效投注条件
+     */
+    extra_bet: number;
+    /**
+     * 额外奖励
+     */
+    extra_num: number;
+    /**
+     * 额外奖励充值条件
+     */
+    extra_pay_amount: number;
+    /**
+     * 第几天
+     */
+    id: number;
+    /**
+     * 图片
+     */
+    img: string;
+    /**
+     * 是否完成
+     */
+    is_suss: boolean;
+    /**
+     * 是否解锁额外奖励
+     */
+    is_unlock_extra_reward: boolean;
+    /**
+     * 奖励数量
+     */
+    num: number;
+}
+interface State {
+    signData: Partial<SignType>;
+}
+
+interface Action {
+    setSignData: (data: SignType) => void;
+}
+
+const initState: State = {
+    signData: {},
+};
+export const useSignStore = create<State & Action>()((set, get) => {
+    return {
+        ...initState,
+        setSignData: (data) => set((value) => ({ ...value, signData: data })),
+    };
+});