import Fade from "@mui/material/Fade";
import {ClickAwayListener} from "@mui/base/ClickAwayListener";
import Grow from "@mui/material/Grow";
import WWheel from "@widgets/WCashWheel/WWheel/WWheel";
import Modal from "@mui/material/Modal";
import styles from "./styles.module.scss";
import WShare from "@widgets/WCashWheel/WShare/WShare";
import React, {useState} from "react";
import WRetainPop from "@widgets/WCashWheel/WRetainPop/WRetainPop";
import {localStorageGet, localStorageSet} from "@utils/helpers";
import {LOCAL_WHEEL_RETAIN} from "@constants/localkey";
import {useSelector} from "react-redux";
import {isLogined} from "@features/mainSlice";
import {getTurnplate} from "@features/turnplateSlice";

const WHallWheel=({open,onClose})=>{
    const [openShare,setOpenShare]=useState(false);
    const [openRetain,setOpenRetain]=useState(false);
    const isLogin=useSelector(isLogined);
    const turnplate=useSelector(getTurnplate);
    const onCheckClose=()=>{
        let isclose=true;
        if (isLogin){
            if (turnplate!=null){
                let collect_amount=turnplate.collect_amount;
                let total_amount=turnplate.total_amount;
                if (collect_amount>0&&collect_amount<total_amount){
                    let lsttime=localStorageGet(LOCAL_WHEEL_RETAIN,"0");
                    lsttime=Number(lsttime);
                    let now=Date.now();
                    let dis=now-lsttime;
                    // dis+=86400000;
                    if (dis>86400000){
                        setOpenRetain(true);
                        isclose=false;
                    }
                }
            }
        }
        if (isclose){
            if (onClose)onClose();
        }
    }
    const renderShare=()=>{
        return (
            <WShare open={openShare} onClose={()=>{
                setOpenShare(false);
            }}></WShare>
        )
    }
    const renderRetainPop=()=>{
        return (
            <WRetainPop open={openRetain} onClose={()=>{
                setOpenRetain(false);
            }} openShare={openShareBox} closeP={()=>{
                localStorageSet(LOCAL_WHEEL_RETAIN,Date.now())
                if (onClose)onClose();
            }}></WRetainPop>
        )
    }
    const openShareBox=()=>{
        setOpenShare(true);
    }
    return (
        <>
            <Modal open={open} onClose={onCheckClose} closeAfterTransition>
                <Fade in={open} timeout={500}>
                    <div className={styles.container}>
                        {/*<ClickAwayListener onClickAway={onCheckClose}>*/}
                        <ClickAwayListener onClickAway={()=>{
                            onCheckClose()
                        }}>
                            <Grow in={open} timeout={500}>
                                <div className={styles.content}>
                                    <button className={styles.close} onClick={onCheckClose} aria-label="Close popup">
                                        <i className="icon-xmark"/>
                                    </button>
                                    <WWheel showShare={false} openShare={openShareBox} onClose={onClose}></WWheel>
                                </div>
                            </Grow>
                        </ClickAwayListener>
                    </div>
                </Fade>
            </Modal>
            {renderShare()}
            {renderRetainPop()}
        </>
    )

}
export default WHallWheel;