add win popup

This commit is contained in:
Arseniy Sitnikov 2024-12-13 15:26:27 +03:00
parent 0cb8a5c7a9
commit c8a3049349
12 changed files with 163 additions and 30 deletions

View File

@ -14,6 +14,51 @@ export function AuctionMainPopups() {
const [closeAnim, setCloseAnim] = useState(false);
const topAuctions = useAppSelector<Array<IAuctionItem> | undefined>(state=>state.me.data.topAuctions);
const loseAuctions = useAppSelector<Array<IAuctionItem> | undefined>(state => state.me.data.loseAuctions);
const winAuctions = useAppSelector<Array<IAuctionItem> | undefined>(state => state.me.data.winAuctions);
const [winInfo, setWinInfo] = useState<IAuctionItem>();
useEffect(() => {
let showWindow = false;
if (winAuctions && winAuctions.length != 0) {
for (let i = 0; i < winAuctions.length; i++) {
const winShow = localStorage.getItem('wS');
if (winShow) {
const winArray = JSON.parse(winShow);
if (winArray && winArray.length != 0) {
let isExist = false;
for (let k = 0; k < winArray.length; k++) {
if (Number(winArray[k]) === Number(winAuctions[i].id)) {
isExist = true;
}
}
if(!isExist) {
winArray.push(winAuctions[i].id);
localStorage.setItem('wS', JSON.stringify(winArray));
showWindow = true;
setWinInfo(winAuctions[i]);
}
} else {
const newArray = [];
newArray.push(winAuctions[i].id);
localStorage.setItem('wS', JSON.stringify(newArray));
showWindow = true;
setWinInfo(winAuctions[i]);
}
} else {
const newArray = [];
newArray.push(winAuctions[i].id);
localStorage.setItem('wS', JSON.stringify(newArray));
showWindow = true;
setWinInfo(winAuctions[i]);
}
}
}
if(showWindow) {
setCloseWin(false);
}
}, [winAuctions]);
useEffect(() => {
const show = sessionStorage.getItem('shT');
@ -38,7 +83,7 @@ export function AuctionMainPopups() {
return (
<div>
{!closeWin && <ModalWindow closeAnimOut={closeAnim} setCloseAnimOut={setCloseAnim} setClose={setCloseWin} removeBtn={true} modalBlock={
<AuctionWinPopup name='iPhone 15 Pro Max ' img='' setClose={setCloseAnim}/>
<AuctionWinPopup name={winInfo?.name ? winInfo?.name : ''} img={winInfo?.img ? winInfo?.img : ''} setClose={setCloseAnim}/>
} />}
{!closeTop && topAuctions != undefined && <ModalWindow closeAnimOut={closeAnim} setCloseAnimOut={setCloseAnim} setClose={setCloseTop} removeBtn={true} modalBlock={
<AuctionTopPopup items={topAuctions} setClose={setCloseAnim}/>

View File

@ -67,7 +67,7 @@ export function AuctionPopup({ setClose, setCloseErrorBet, auctionId, img, name,
dispatch<any>(updatePointsRequestAsync());
dispatch<any>(updateAuction(auctionId));
setBet(bet);
setLead(true);
//setLead(true);
const timer = setInterval(() => {
setCloseResultPopup(false);
clearTimeout(timer);

View File

@ -16,6 +16,7 @@ export function Timer({initTime}: ITimer) {
const tick = () => {
if (hour === 0 && min === 0 && sec === 0) {
setOver(true);
window.location.reload();
} else if (min === 0 && sec === 0) {
setTime([hour - 1, 59, 59]);
} else if (sec == 0) {

View File

@ -49,24 +49,25 @@ export function PointsZoom({ points, sameInterval, setSameInterval, sameCoords,
let initSameInterval = sameInterval;
let avtTime = 500;
if (points > 1) {
avtTime = clickTimeInit / (initPoints - 1);
avtTime = clickTimeInit / initPoints;
}
setClickTime(0);
setSameCoords(false);
if ((avtTime < 100 && initSameCoords) || (initSameInterval) && initPoints > 20) {
/*axios.post(`${URL}/api/v1/users/warn/`, {}, {
if ((avtTime < 100 && initPoints > 20) || (avtTime < 130 && initPoints > 300)) {
axios.post(`${URL}/api/v1/users/warn/`, {}, {
headers: {
"Authorization": `TelegramToken ${token}`
}
}).then(resp => {
console.log(resp);
//console.log(resp);
}).catch(err => {
//console.log(err)
})*/
sendAutoClickData(userData.tgId, points, avtTime);
})
//sendAutoClickData(userData.tgId, points, avtTime);
setCloseAutoClick(false);
setSameInterval(false);
const returnEnergy = energy + initPoints;

View File

@ -29,7 +29,9 @@ export function AuctionPage() {
{errorAuction ? <ErrorPage fullScreen={true} title='Возникла ошибка загрузки аукционов' text='Перезагрузите страницу или попробуйте позже' detail={errorAuction} /> :
<div>
<h1 className={styles.title} style={ETextStyles.RwSb26100}> <span>Соревнуйся за товары</span> на аукционе!</h1>
{auctionBlock}
{dataAuction.length != 0 ? auctionBlock
: <p style={ETextStyles.InRg14120}>Скоро тут появятся новые аукционы.</p>
}
</div>
}
</div>

View File

@ -7,15 +7,16 @@ interface IErrorPage {
detail: String,
title?: string,
text?: string,
fullScreen ?: boolean
fullScreen ?: boolean,
isBtn?: boolean,
}
export function ErrorPage({ detail, title, text, fullScreen=true }: IErrorPage) {
export function ErrorPage({ detail, title, text, fullScreen = true, isBtn=true }: IErrorPage) {
return (
<div className={`${styles.container} ${fullScreen ? styles.fullscreen : styles.margin}`}>
<h1 className={styles.title} style={ETextStyles.RwSb24100}>{title ? title : 'Возникла ошибка при загрузке ваших данных'}</h1>
<p className={styles.text} style={ETextStyles.RwSb14120}>{text ? text : 'Попробуйте перезагрузить страницу или войдите позже.'}</p>
<Button text='Перезагрузить' stroke={true} onClick={() => window.location.reload()}/>
{isBtn && <Button text='Перезагрузить' stroke={true} onClick={() => window.location.reload()}/>}
{detail.length > 0 && <p className={styles.detail} style={ETextStyles.RwRg12120}>{detail}</p>}
</div>
);

View File

@ -1,4 +1,4 @@
import React, { useEffect } from 'react';
import React, { useEffect, useState } from 'react';
import styles from './routepage.module.css';
import { WrongSourcePage } from '../WrongSourcePage';
import { ClickerPage } from '../ClickerPage';
@ -15,6 +15,10 @@ import { ErrorPage } from '../ErrorPage';
import { useNavigate } from 'react-router-dom';
import { DevPage } from '../DevPage';
import { useRankData } from '../../hooks/useRankData';
import { useDispatch } from 'react-redux';
import { loadWinAuction } from '../../../store/auction/actions';
import { useAppSelector } from '../../hooks/useAppSelector';
import { checkMobile } from '../../../utils/checkMobile';
interface IRoutePage {
page: string
@ -23,12 +27,19 @@ interface IRoutePage {
export function RoutePage({ page }: IRoutePage) {
const verified = useTgData();
const { dataUser, loadingUser, errorUser } = useUserData();
const token = useAppSelector<string>(state => state.token);
const [mobile, setMobile] = useState(false);
useRankData();
const navigate = useNavigate();
const dispatch = useDispatch();
//@ts-ignore
const tg = window.Telegram.WebApp;
var BackButton = tg.BackButton;
useEffect(() => {
dispatch<any>(loadWinAuction());
}, [token]);
useEffect(() => {
updateBackground(page);
updateStyles();
@ -43,19 +54,26 @@ export function RoutePage({ page }: IRoutePage) {
navigate(-1);
});
useEffect(() => {
setMobile(checkMobile());
}, []);
return (
<div>
{!verified ? <WrongSourcePage /> : <div>
{ //@ts-ignore
page === 'main' && (!loadingUser || dataUser.username) && !errorUser && dataUser.name && <ClickerPage name={dataUser.name} points={Number(dataUser.points)} img={dataUser.avatar} energy={Number(dataUser.energy)}/>}
{page === 'rating' && (!loadingUser || dataUser.username) && !errorUser && <RatingPage />}
{page === 'referral' && (!loadingUser || dataUser.username) && !errorUser && <StoragePage />}
{page === 'auction' && (!loadingUser || dataUser.username) && !errorUser && <AuctionPage />}
{page === 'styles' && (!loadingUser || dataUser.username) && !errorUser && <StylesPage />}
{page === 'dev' && <DevPage/>}
{(loadingUser) && <div className={styles.spinnerContainer}><Spinner color='#FFFFFF' size='50px' thickness='6px' className={styles.spinner} /></div> }
{errorUser && !loadingUser && <ErrorPage detail={errorUser}/>}
</div>}
{!mobile ? <ErrorPage title='Войдите через мобильное устройство' text='Приложение доступно только в мобильном приложении Telegram.' isBtn={false} detail={''} /> :
<div>
{!verified ? <WrongSourcePage /> : <div>
{ //@ts-ignore
page === 'main' && (!loadingUser || dataUser.username) && !errorUser && dataUser.name && <ClickerPage name={dataUser.name} points={Number(dataUser.points)} img={dataUser.avatar} energy={Number(dataUser.energy)} />}
{page === 'rating' && (!loadingUser || dataUser.username) && !errorUser && <RatingPage />}
{page === 'referral' && (!loadingUser || dataUser.username) && !errorUser && <StoragePage />}
{page === 'auction' && (!loadingUser || dataUser.username) && !errorUser && <AuctionPage />}
{page === 'styles' && (!loadingUser || dataUser.username) && !errorUser && <StylesPage />}
{page === 'dev' && <DevPage />}
{(loadingUser) && <div className={styles.spinnerContainer}><Spinner color='#FFFFFF' size='50px' thickness='6px' className={styles.spinner} /></div>}
{errorUser && !loadingUser && <ErrorPage detail={errorUser} />}
</div>}
</div> }
</div>
);
}

View File

@ -57,6 +57,7 @@ export const auctionRequestAsync = (): ThunkAction<void, RootState, unknown, Act
const userTg = getState().userTg.id;
if (token) {
dispatch(auctionRequest());
axios.get(`${URL}/api/v1/auction/auction?is_active=true`,
{
headers: {
@ -88,9 +89,12 @@ export const auctionRequestAsync = (): ThunkAction<void, RootState, unknown, Act
const loseAuctions = [];
for (let i = 0; i < data.length; i++) {
const active = Boolean(data[i].is_active);
let active = true;
const nowDate = new Date();
const endDate = new Date(data[i].end_time);
if (nowDate > endDate) {
active = false;
}
const time = Math.ceil(Math.abs(endDate.getTime() - nowDate.getTime()) / 1000);
let maxBet = Number(data[i].initial_cost);
let isLead = false;
@ -108,12 +112,13 @@ export const auctionRequestAsync = (): ThunkAction<void, RootState, unknown, Act
isLead = true;
const topItem = {
id: data[i].id,
name: data[i].product.name,
img: data[i].product.cover,
bet: dataBet[k].value
}
if(active) {
if (active) {
topAuctions.push(topItem);
}
}
@ -127,14 +132,15 @@ export const auctionRequestAsync = (): ThunkAction<void, RootState, unknown, Act
if (Number(userData[z].value) > myBet) {
myBet = Number(userData[z].value);
if(!isLead) {
if (!isLead) {
const loseItem = {
id: data[i].id,
name: data[i].product.name,
img: data[i].product.cover,
bet: userData[z].value
}
if(active) {
if (active) {
loseAuctions.push(loseItem)
}
}
@ -156,7 +162,7 @@ export const auctionRequestAsync = (): ThunkAction<void, RootState, unknown, Act
myBet: myBet.toString()
};
if(active) {
if (active) {
auctionResults.push(item);
}
}
@ -250,3 +256,55 @@ export const updateAuction = (id: string): ThunkAction<void, RootState, unknown,
})
}
export const loadWinAuction = (): ThunkAction<void, RootState, unknown, Action<string>> => (dispatch, getState) => {
const URL = getState().url;
const token = getState().token;
const userId = getState().userTg.id;
if (token) {
axios.get(`${URL}/api/v1/auction/auction?is_active=false`,
{
headers: {
"Authorization": `TelegramToken ${token}`
}
}
).then(resp => {
const dataOver = resp.data.results;
axios.get(`${URL}/api/v1/auction/bet?order_by=-value&is_winning=true`,
{
headers: {
"Authorization": `TelegramToken ${token}`
}
}
).then(resp2 => {
const dataBet = resp2.data.results;
const winAuctions = [];
if (dataBet.length != 0) {
if (dataOver.length != 0) {
for (let i = 0; i < dataOver.length; i++) {
for (let k = 0; k < dataBet.length; k++) {
if (dataOver[i].id === dataBet[k].auction) {
if (Number(userId) === Number(dataBet[k].user.tg_id)) {
const item = {
id: dataOver[i].id,
name: dataOver[i].product.name,
img: dataOver[i].product.cover,
bet: dataBet[k].value
}
winAuctions.push(item);
}
}
}
}
}
}
dispatch(updateMyAuctions(winAuctions, 'win'));
})
})
}
};

View File

@ -52,6 +52,7 @@ export const friendsRequestAsync = (): ThunkAction<void, RootState, unknown, Act
const userTg = getState().userTg.id;
if(token) {
dispatch(friendsRequest());
axios.get(`${URL}/api/v1/users/rank/friends`,
{
headers: {

View File

@ -6,6 +6,7 @@ import { saveMult } from "../mult";
import { saveToken } from "../token";
export interface IAuctionItem {
id: string,
name: string,
img: string,
bet: string
@ -23,6 +24,7 @@ export interface IUserData {
rank ?: number,
loseAuctions?: Array<IAuctionItem>,
topAuctions?: Array<IAuctionItem>,
winAuctions?: Array<IAuctionItem>,
}
export const ME_REQUEST = 'ME_REQUEST';
@ -369,6 +371,8 @@ export const updateMyAuctions = (data: Array<IAuctionItem>, type: string): Thunk
if(type === 'top') {
newData.topAuctions = data;
} else if(type === 'win') {
newData.winAuctions = data;
} else {
newData.loseAuctions = data;
}

View File

@ -46,6 +46,7 @@ export const rankRequestAsync = (): ThunkAction<void, RootState, unknown, Action
const result: Array<IUserRank> = [];
if(token) {
dispatch(rankRequest());
axios.get(`${URL}/api/v1/users/rank/top?limit=3`,
{
headers: {

View File

@ -2,6 +2,7 @@ import { getTgUserId } from "./verification";
export const isWhiteList = () => {
let isWhiteList = false;
//123456,
const whiteList = [
//TODO!
];