|
@@ -13,16 +13,17 @@ import spin_4 from "@assets/wheel/spin-4.png";
|
|
|
import spin_5 from "@assets/wheel/spin-5.png";
|
|
import spin_5 from "@assets/wheel/spin-5.png";
|
|
|
import draw from "@assets/wheel/draw.png";
|
|
import draw from "@assets/wheel/draw.png";
|
|
|
import {useDispatch, useSelector} from "react-redux";
|
|
import {useDispatch, useSelector} from "react-redux";
|
|
|
-import {getTurnplate, updateCollect, updateTimes} from "@features/turnplateSlice";
|
|
|
|
|
-import {formatCash, formatTime} from "@utils/helpers";
|
|
|
|
|
|
|
+import {getIsHelp, getTurnplate, updateCollect, updateTimes} from "@features/turnplateSlice";
|
|
|
|
|
+import {formatCash, formatTime, localStorageGet} from "@utils/helpers";
|
|
|
import SvgIcon from "@components/SvgIcon";
|
|
import SvgIcon from "@components/SvgIcon";
|
|
|
import {ReactComponent as ShareIcon} from '@assets/singlesvg/share.svg';
|
|
import {ReactComponent as ShareIcon} from '@assets/singlesvg/share.svg';
|
|
|
import {isLogined} from "@features/mainSlice";
|
|
import {isLogined} from "@features/mainSlice";
|
|
|
import {useNavigate} from "react-router";
|
|
import {useNavigate} from "react-router";
|
|
|
import {ROUTE_PATH} from "@constants/routes";
|
|
import {ROUTE_PATH} from "@constants/routes";
|
|
|
-import {reqTurnplateKan} from "@features/api";
|
|
|
|
|
|
|
+import {reqTurnplateHelp, reqTurnplateKan} from "@features/api";
|
|
|
import CountUp from "react-countup";
|
|
import CountUp from "react-countup";
|
|
|
import WPopInfo from "@widgets/WCashWheel/WPopInfo/WPopInfo";
|
|
import WPopInfo from "@widgets/WCashWheel/WPopInfo/WPopInfo";
|
|
|
|
|
+import {LOCAL_WHEEL_INVITE_CODE} from "@constants/localkey";
|
|
|
const i18n=global.i18n;
|
|
const i18n=global.i18n;
|
|
|
const spinImgSrc=[
|
|
const spinImgSrc=[
|
|
|
null,
|
|
null,
|
|
@@ -43,7 +44,8 @@ const turnObj={
|
|
|
result:null,
|
|
result:null,
|
|
|
resTimer:null,
|
|
resTimer:null,
|
|
|
flashTimer:null,
|
|
flashTimer:null,
|
|
|
- resetTimer:null
|
|
|
|
|
|
|
+ resetTimer:null,
|
|
|
|
|
+ ishelp:false
|
|
|
};
|
|
};
|
|
|
const WWheel=({openShare,showShare=true,onClose=null})=>{
|
|
const WWheel=({openShare,showShare=true,onClose=null})=>{
|
|
|
let turnplate=useSelector(getTurnplate);
|
|
let turnplate=useSelector(getTurnplate);
|
|
@@ -73,6 +75,7 @@ const WWheel=({openShare,showShare=true,onClose=null})=>{
|
|
|
const [collect,setCollect]=useState(0);
|
|
const [collect,setCollect]=useState(0);
|
|
|
const [isLock,setIsLock]=useState(false);
|
|
const [isLock,setIsLock]=useState(false);
|
|
|
const [openPopInfo,setOpenPopInfo]=useState(false);
|
|
const [openPopInfo,setOpenPopInfo]=useState(false);
|
|
|
|
|
+ const isHelpdone=useSelector(getIsHelp);
|
|
|
const loadImgs=()=>{
|
|
const loadImgs=()=>{
|
|
|
let totalCount=spinImgSrc.length;
|
|
let totalCount=spinImgSrc.length;
|
|
|
let loadedCount=0;
|
|
let loadedCount=0;
|
|
@@ -120,15 +123,31 @@ const WWheel=({openShare,showShare=true,onClose=null})=>{
|
|
|
},1000);
|
|
},1000);
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- const onTurnResult=(data)=>{
|
|
|
|
|
|
|
+ const onTurnResult=(data,code=200)=>{
|
|
|
|
|
+ if (code!==200){
|
|
|
|
|
+ resetWheel(0);
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ let type=data.type;
|
|
|
|
|
+ let curr_amount=turnplate.collect_amount;
|
|
|
let collect_amount=data.collect_amount;
|
|
let collect_amount=data.collect_amount;
|
|
|
- let ids=[0,4];
|
|
|
|
|
- let index=Math.floor(Math.random()*ids.length);
|
|
|
|
|
- let id=ids[index];
|
|
|
|
|
|
|
+ let change=(collect_amount-curr_amount);
|
|
|
|
|
+ let id=-1;
|
|
|
|
|
+ if (type===1){
|
|
|
|
|
+ id=5;
|
|
|
|
|
+ }
|
|
|
|
|
+ else if (type===2){
|
|
|
|
|
+ let ids=[0,4];
|
|
|
|
|
+ let index=Math.floor(Math.random()*ids.length);
|
|
|
|
|
+ id=ids[index];
|
|
|
|
|
+ }
|
|
|
turnObj.result={
|
|
turnObj.result={
|
|
|
|
|
+ type:type,
|
|
|
reward:id,
|
|
reward:id,
|
|
|
- amount:collect_amount
|
|
|
|
|
|
|
+ amount:collect_amount,
|
|
|
|
|
+ change:change
|
|
|
};
|
|
};
|
|
|
|
|
+ // turnObj.ishelp=ishelp;
|
|
|
}
|
|
}
|
|
|
const startSpin=()=>{
|
|
const startSpin=()=>{
|
|
|
// if (!isLogin){
|
|
// if (!isLogin){
|
|
@@ -195,7 +214,7 @@ const WWheel=({openShare,showShare=true,onClose=null})=>{
|
|
|
transition:`transform ${stopduring}s cubic-bezier(0.250, 0.460, 0.455, 0.995)`,
|
|
transition:`transform ${stopduring}s cubic-bezier(0.250, 0.460, 0.455, 0.995)`,
|
|
|
};
|
|
};
|
|
|
setDrawStyle(roteStyle);
|
|
setDrawStyle(roteStyle);
|
|
|
- playRes();
|
|
|
|
|
|
|
+ playRes(angle);
|
|
|
}
|
|
}
|
|
|
const flashDraw=()=>{
|
|
const flashDraw=()=>{
|
|
|
let show=false;
|
|
let show=false;
|
|
@@ -205,14 +224,19 @@ const WWheel=({openShare,showShare=true,onClose=null})=>{
|
|
|
drawWheel(result)
|
|
drawWheel(result)
|
|
|
},260)
|
|
},260)
|
|
|
}
|
|
}
|
|
|
- const playRes=()=>{
|
|
|
|
|
|
|
+ const playRes=(angle=0)=>{
|
|
|
clearResTimer();
|
|
clearResTimer();
|
|
|
let during=(stopduring+0.5)*1000;
|
|
let during=(stopduring+0.5)*1000;
|
|
|
turnObj.resTimer=setTimeout(()=>{
|
|
turnObj.resTimer=setTimeout(()=>{
|
|
|
flashDraw();
|
|
flashDraw();
|
|
|
- setCollect(turnObj.result.amount);
|
|
|
|
|
- startReset();
|
|
|
|
|
- dispatch(updateCollect({collect_amount:turnObj.result.amount}))
|
|
|
|
|
|
|
+ if (turnObj.result.type===2){
|
|
|
|
|
+ setCollect(turnObj.result.change);
|
|
|
|
|
+ }
|
|
|
|
|
+ else if (turnObj.result.type===1){
|
|
|
|
|
+
|
|
|
|
|
+ }
|
|
|
|
|
+ if(!turnObj.ishelp)dispatch(updateCollect({collect_amount:turnObj.result.amount}))
|
|
|
|
|
+ startReset(angle);
|
|
|
},during)
|
|
},during)
|
|
|
}
|
|
}
|
|
|
// const
|
|
// const
|
|
@@ -226,23 +250,34 @@ const WWheel=({openShare,showShare=true,onClose=null})=>{
|
|
|
turnObj.flashTimer=null;
|
|
turnObj.flashTimer=null;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- const startReset=()=>{
|
|
|
|
|
|
|
+ const startReset=(angle=0)=>{
|
|
|
turnObj.resetTimer=setTimeout(()=>{
|
|
turnObj.resetTimer=setTimeout(()=>{
|
|
|
- resetWheel();
|
|
|
|
|
|
|
+ checkShowPopInfo();
|
|
|
|
|
+ resetWheel(angle);
|
|
|
},resetduring*1000)
|
|
},resetduring*1000)
|
|
|
}
|
|
}
|
|
|
- const resetWheel=()=>{
|
|
|
|
|
|
|
+ const checkShowPopInfo=()=>{
|
|
|
|
|
+ let type=2;
|
|
|
|
|
+ if (turnObj.result){
|
|
|
|
|
+ type=turnObj.result.type;
|
|
|
|
|
+ }
|
|
|
|
|
+ if(type===2)setOpenPopInfo(true);
|
|
|
|
|
+ }
|
|
|
|
|
+ const resetWheel=(angle=0)=>{
|
|
|
|
|
+ clearTurnTimer();
|
|
|
turnObj.result=null;
|
|
turnObj.result=null;
|
|
|
turnObj.count=0;
|
|
turnObj.count=0;
|
|
|
|
|
+ turnObj.ishelp=false;
|
|
|
|
|
+ if (angle==null)angle=0;
|
|
|
|
|
+ else angle=angle%360;
|
|
|
let roteStyle={
|
|
let roteStyle={
|
|
|
- transform:"rotate(0deg)",
|
|
|
|
|
|
|
+ transform:"rotate("+angle+"deg)",
|
|
|
transition:``,
|
|
transition:``,
|
|
|
};
|
|
};
|
|
|
setDrawStyle(roteStyle);
|
|
setDrawStyle(roteStyle);
|
|
|
drawWheel(null);
|
|
drawWheel(null);
|
|
|
setCollect(0);
|
|
setCollect(0);
|
|
|
setIsLock(false);
|
|
setIsLock(false);
|
|
|
- setOpenPopInfo(true);
|
|
|
|
|
clearResTimer();
|
|
clearResTimer();
|
|
|
}
|
|
}
|
|
|
const clearResetTimer=()=>{
|
|
const clearResetTimer=()=>{
|
|
@@ -310,8 +345,20 @@ const WWheel=({openShare,showShare=true,onClose=null})=>{
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+ const onHelpResult=(data)=>{
|
|
|
|
|
+ console.log(data);
|
|
|
|
|
+ }
|
|
|
|
|
+ const checkHelpOther=()=>{
|
|
|
|
|
+ let act=localStorageGet(LOCAL_WHEEL_INVITE_CODE);
|
|
|
|
|
+ if (act!=null&&act!==""){
|
|
|
|
|
+ if (!isHelpdone){
|
|
|
|
|
+ dispatch(reqTurnplateHelp(onHelpResult));
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
useEffect(()=>{
|
|
useEffect(()=>{
|
|
|
loadImgs();
|
|
loadImgs();
|
|
|
|
|
+ checkHelpOther();
|
|
|
return ()=>{
|
|
return ()=>{
|
|
|
clearTurnTimer();
|
|
clearTurnTimer();
|
|
|
clearCDTimer();
|
|
clearCDTimer();
|