|
@@ -282,11 +282,13 @@ const FallAnimation = (props:any) => {
|
|
|
};
|
|
|
|
|
|
const HbyInfoDetail = (props:any) => {
|
|
|
- const { onCloseHby } = props;
|
|
|
+ const { iconImg,onCloseHby } = props;
|
|
|
return (
|
|
|
- <div className={`absolute left-1/2 top-[50%] -translate-x-1/2 -translate-y-1/2 w-[90%] p-[0.1rem] ${styles.promoRules}`}>
|
|
|
- <Image src={"/hby/close.png"} alt={"close"} width={25} height={25} onClick={onCloseHby} className={styles.closeIcon}/>
|
|
|
- <div className={`h-[0.15rem] text-[#ffd800] text-[0.20rem] text-center ${styles.promoTitle}`}>Dinheiro como chuva</div>
|
|
|
+ <div className={`absolute left-1/2 top-[50%] -translate-x-1/2 -translate-y-1/2 w-[90%] ${styles.promoRules}`}>
|
|
|
+ {/* <Image src={"/hby/close.png"} alt={"close"} width={25} height={25} onClick={onCloseHby} className={styles.closeIcon}/> */}
|
|
|
+ <div onClick={onCloseHby} className={styles.closeIcon}></div>
|
|
|
+ <Image src={iconImg} alt={'detail'} width={672} height={1044} />
|
|
|
+ {/* <div className={`h-[0.15rem] text-[#ffd800] text-[0.20rem] text-center ${styles.promoTitle}`}>Dinheiro como chuva</div>
|
|
|
<div className={styles.titleWrap}>
|
|
|
<span>R$200.00</span>
|
|
|
<span> por vez, </span>
|
|
@@ -319,17 +321,19 @@ const HbyInfoDetail = (props:any) => {
|
|
|
<li className={styles.ruleItem}>
|
|
|
Quanto maior o nivel de associacäo VP, maior o valor recebido
|
|
|
</li>
|
|
|
- </ul>
|
|
|
+ </ul> */}
|
|
|
</div>
|
|
|
)
|
|
|
}
|
|
|
|
|
|
const HbyInfo = (props:any)=>{
|
|
|
- const { onCloseHby,onReciveRed } = props;
|
|
|
+ const { iconImg,onCloseHby,onReciveRed } = props;
|
|
|
return (
|
|
|
<div className={`absolute left-1/2 top-[50%] -translate-x-1/2 -translate-y-1/2 ${styles.redclose}`}>
|
|
|
- <Image src={"/hby/close.png"} alt={"close"} width={20} height={20} onClick={onCloseHby} className={styles.closeIcon}/>
|
|
|
- <div className={styles.title}>Chuva de dinheiro</div>
|
|
|
+ {/* <Image src={"/hby/close.png"} alt={"close"} width={20} height={20} onClick={onCloseHby} className={styles.closeIcon}/> */}
|
|
|
+ <div onClick={onCloseHby} className={styles.closeIcon}></div>
|
|
|
+ <Image src={iconImg} alt={"icon"} width={559} height={687} onClick={onReciveRed} className={styles.redIcon}/>
|
|
|
+ {/* <div className={styles.title}>Chuva de dinheiro</div>
|
|
|
<div className={styles.desc}>
|
|
|
<ul className={styles.desclist}>
|
|
|
<li className={styles.descitem}> Membros recarregados podem reivindicar gratuitamente. </li>
|
|
@@ -337,7 +341,7 @@ const HbyInfo = (props:any)=>{
|
|
|
<li className={styles.descitem}> Valor máximo de queda em dinheiro: R$7.777 </li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
- <div className={styles.openBtn} onClick={onReciveRed}>AGARRAR</div>
|
|
|
+ <div className={styles.openBtn} onClick={onReciveRed}>AGARRAR</div> */}
|
|
|
</div>
|
|
|
// <div data-v-f333135e="" className={`absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 ${styles.redopen}`}>
|
|
|
// <Image src={"/hby/close.png"} alt={"close"} width={20} height={20} onClick={onCloseHby} className={styles.closeIcon}/>
|
|
@@ -349,13 +353,16 @@ const HbyInfo = (props:any)=>{
|
|
|
}
|
|
|
|
|
|
const HbyInfo2 = (props:any)=>{
|
|
|
- const { onCloseHby,redAmount } = props;
|
|
|
+ const { iconImg,onCloseHby,redAmount } = props;
|
|
|
return (
|
|
|
<div className={`absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 ${styles.redopen}`}>
|
|
|
- <Image src={"/hby/close.png"} alt={"close"} width={20} height={20} onClick={onCloseHby} className={styles.closeIcon}/>
|
|
|
- <div className={styles.title}>Chuva de dinheiro</div>
|
|
|
+ <Image src={"/hby/close.png"} alt={"close"} width={30} height={30} onClick={onCloseHby} className={styles.closeIcon}/>
|
|
|
+ {/* <div onClick={onCloseHby} className={styles.closeIcon}></div> */}
|
|
|
+ <Image src={iconImg} alt={"icon"} width={559} height={687}/>
|
|
|
<div className={styles.cash}>{redAmount}</div>
|
|
|
- <div className={styles.tips}>Valor máximo de queda em dinheiro:Cada sessäo de chuva de dinheiro é </div>
|
|
|
+ {/* <div className={styles.title}>Chuva de dinheiro</div>
|
|
|
+ <div className={styles.cash}>{redAmount}</div>
|
|
|
+ <div className={styles.tips}>Valor máximo de queda em dinheiro:Cada sessäo de chuva de dinheiro é </div> */}
|
|
|
</div>
|
|
|
)
|
|
|
}
|
|
@@ -368,6 +375,7 @@ const Popup = ( props:any) => {
|
|
|
const { onClose } = props;
|
|
|
const [maskVisible, setMaskVisible] = useState(true);
|
|
|
|
|
|
+ const [iconLists,setIconLists] = useState<any>([])
|
|
|
const [isShowRed,setIsShowRed] = useState(false)
|
|
|
const [isShowReciveRed,setIsShowReciveRed] = useState(false)
|
|
|
const [isShowRedDetail,setIsShowRedDetail] = useState(false)
|
|
@@ -382,19 +390,13 @@ const Popup = ( props:any) => {
|
|
|
const getRedPacketInfo =async()=>{
|
|
|
try{
|
|
|
let actList:any=[]
|
|
|
- console.log('redPacketInfo000000')
|
|
|
if(token){
|
|
|
let redPacketInfo =await lredPacketApi()
|
|
|
- console.log('redPacketInfo111111',redPacketInfo)
|
|
|
-
|
|
|
actList = redPacketInfo.data?.red_packets || []
|
|
|
}else{
|
|
|
let redPacketInfo =await redPacketApi()
|
|
|
- console.log('redPacketInfo222222',redPacketInfo)
|
|
|
-
|
|
|
actList = redPacketInfo.data
|
|
|
}
|
|
|
-
|
|
|
// 是否有已开始但是没领过的红包
|
|
|
let isHasStartAct = actList.filter((aItem:any)=>{
|
|
|
return !!aItem.is_start && !aItem.is_receive
|
|
@@ -403,7 +405,10 @@ const Popup = ( props:any) => {
|
|
|
let isShowRed = isHasStartAct.length>0
|
|
|
let isShowRedDetail = isHasStartAct.length === 0
|
|
|
let redInfo = isShowRed ? isHasStartAct[0] : {}
|
|
|
- console.log('isHasStartAct',isHasStartAct)
|
|
|
+ let curAct = !!isShowRedDetail ? findCurrentActivity(actList) : actList[0]
|
|
|
+ let iconList = JSON.parse(curAct.icon)
|
|
|
+
|
|
|
+ setIconLists(iconList)
|
|
|
setIsShowRed(isShowRed)
|
|
|
setIsShowRedDetail(isShowRedDetail)
|
|
|
setRedPacketInfo(redInfo)
|
|
@@ -415,6 +420,36 @@ const Popup = ( props:any) => {
|
|
|
}
|
|
|
|
|
|
|
|
|
+ // 筛选出离当前时间最近的活动
|
|
|
+ const findCurrentActivity=(activities:any)=> {
|
|
|
+ const now = Math.floor(Date.now() / 1000); // 获取当前时间的时间戳(单位:秒)
|
|
|
+ let closestActivity = null;
|
|
|
+ let isInRange = false;
|
|
|
+
|
|
|
+ // 遍历活动数据
|
|
|
+ for (let i = 0; i < activities.length; i++) {
|
|
|
+ const activity = activities[i];
|
|
|
+
|
|
|
+ // 检查当前时间是否在活动的时间范围内
|
|
|
+ if (now >= activity.start_time && now <= activity.end_time) {
|
|
|
+ isInRange = true;
|
|
|
+ return activity; // 如果在范围内,直接返回当前活动
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果不在范围内,记录离当前时间最近的活动
|
|
|
+ if (!closestActivity ||
|
|
|
+ Math.abs(now - activity.end_time) < Math.abs(now - closestActivity.end_time)) {
|
|
|
+ closestActivity = activity;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果不在任何活动范围内,返回离当前时间最近的活动
|
|
|
+ return closestActivity;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
const onReciveRed = async()=>{
|
|
|
try{
|
|
|
|
|
@@ -424,6 +459,7 @@ const Popup = ( props:any) => {
|
|
|
}
|
|
|
let receiveRedPacketInfo = await receiveRedPacketApi(paramsData)
|
|
|
let redNum = receiveRedPacketInfo.data
|
|
|
+ setIsShowRed(false)
|
|
|
setIsShowReciveRed(true)
|
|
|
setRedAmount(redNum?.amount)
|
|
|
}catch(error){
|
|
@@ -439,9 +475,10 @@ const Popup = ( props:any) => {
|
|
|
<FallAnimation onClose={onClose} />
|
|
|
{/* <Desc onClose={() => setMaskVisible(false)} /> */}
|
|
|
{/* <ReceivePackage /> */}
|
|
|
- {!!isShowRed && <HbyInfo onCloseHby={onClose} onReciveRed={onReciveRed}/>}
|
|
|
- {!!isShowReciveRed && <HbyInfo2 onCloseHby={onClose} onReciveRed={onReciveRed} redAmount={redAmount}/>}
|
|
|
- {!!isShowRedDetail && <HbyInfoDetail onCloseHby={onClose}/>}
|
|
|
+
|
|
|
+ {!!isShowRed && <HbyInfo onCloseHby={onClose} onReciveRed={onReciveRed} iconImg={iconLists[1]}/>}
|
|
|
+ {!!isShowReciveRed && <HbyInfo2 onCloseHby={onClose} redAmount={redAmount} iconImg={iconLists[2]}/>}
|
|
|
+ {!!isShowRedDetail && <HbyInfoDetail onCloseHby={onClose} iconImg={iconLists[0]}/>}
|
|
|
</Mask>
|
|
|
);
|
|
|
};
|