PenaSide/front-hub
3
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Payment userid param

Browse Source
This commit is contained in:
IlyaDoronin 2024-04-08 11:26:51 +03:00
parent e1a93be228
commit 3074ca383e
3 changed files with 104 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/index.tsx
View File

@ -189,7 +189,10 @@ const App = () => {
<Route path="/quizpayment" element={<QuizPayment />} />
<Route element={<Docs />}>
<Route path={"/docs/oferta"} element={<Oferta />} />
<Route path="/docs/ofertaQuizDevelop" element={<OfertaQuizDevelop />} />
<Route
path="/docs/ofertaQuizDevelop"
element={<OfertaQuizDevelop />}
/>
<Route path={"/docs/privacy"} element={<PrivacyPolicy />} />
</Route>
<Route path="/afterpay" element={<AfterPay />} />
@ -209,7 +212,7 @@ root.render(
<CssBaseline />
<SnackbarProvider />
<App />
<CheckFastlink/>
<CheckFastlink />
</BrowserRouter>
</ThemeProvider>
// </React.StrictMode>

176
src/pages/AfterPay/index.tsx
View File

@ -1,105 +1,121 @@
import { Box, Button, Typography, useTheme, useMediaQuery } from "@mui/material";
import {
Box,
Button,
Typography,
useTheme,
useMediaQuery,
} from "@mui/material";
import { payCart } from "@root/api/cart";
import { useUserStore } from "@root/stores/user";
import wallet_icon from "@root/assets/Icons/ColorWallet.svg";
import { Link } from "react-router-dom";
const MINUTE = 1000 * 60;
const { domain, pathname } = (() => {
const params = new URLSearchParams(window.location.search);
const from = params.get("from") || "hub";
const params = new URLSearchParams(window.location.search);
const from = params.get("from") || "hub";
const purpose = params.get("purpose");
const purpose = params.get("purpose");
if (purpose === "paycart" || from === "quiz") {
let tryCount = 0;
if (purpose === "paycart" || from === "quiz") {
let tryCount = 0;
const payCartPendingRequestDeadline = localStorage.getItem("payCartPendingRequestDeadline");
const deadline = payCartPendingRequestDeadline
? Number(payCartPendingRequestDeadline)
: Date.now() + 20 * MINUTE;
const payCartPendingRequestDeadline = localStorage.getItem(
"payCartPendingRequestDeadline"
);
const deadline = payCartPendingRequestDeadline
? Number(payCartPendingRequestDeadline)
: Date.now() + 20 * MINUTE;
localStorage.setItem("payCartPendingRequestDeadline", deadline.toString());
localStorage.setItem("payCartPendingRequestDeadline", deadline.toString());
tryPayCart();
tryPayCart();
async function tryPayCart() {
tryCount += 1;
async function tryPayCart() {
tryCount += 1;
const [, payCartError] = await payCart();
const [, payCartError] = await payCart();
if (!payCartError || Date.now() > deadline) {
localStorage.removeItem("payCartPendingRequestDeadline");
return;
}
if (!payCartError || Date.now() > deadline) {
localStorage.removeItem("payCartPendingRequestDeadline");
return;
}
setTimeout(tryPayCart, tryCount > 10 ? MINUTE / 60 : MINUTE / 6);
}
setTimeout(tryPayCart, tryCount > 10 ? MINUTE / 60 : MINUTE / 6);
}
}
const host = window.location.hostname;
return {
domain: (host.includes("s") ? "s" : "") + from,
pathname: from === "hub" ? "/tariffs" : "/list"
};
const host = window.location.hostname;
return {
domain: (host.includes("s") ? "s" : "") + from,
pathname: from === "hub" ? "/tariffs" : "/list",
};
})();
export default () => {
const theme = useTheme();
const phone = useMediaQuery(theme.breakpoints.down(375));
const redirectUrl = new URL(`https://${domain}.pena.digital${pathname}`);
redirectUrl.searchParams.append("afterpay", "true");
const theme = useTheme();
const phone = useMediaQuery(theme.breakpoints.down(375));
const userId = useUserStore((state) => state.user?._id);
const redirectUrl = new URL(`https://${domain}.pena.digital${pathname}`);
redirectUrl.searchParams.append("afterpay", "true");
redirectUrl.searchParams.append("userid", userId ?? "");
return (
return (
<Box
sx={{
width: "100vw",
height: "100vh",
p: phone ? "76px 16px" : "117px 0 0 0",
}}
>
<Box
sx={{
display: "flex",
flexDirection: "column",
alignItems: "center",
}}
>
<Box
sx={{
width: "100vw",
height: "100vh",
p: phone ? "76px 16px" : "117px 0 0 0"
}}
component="img"
src={wallet_icon}
sx={{
width: phone ? "338px" : "auto",
height: phone ? "215px" : "auto",
mb: "60px",
}}
/>
<Typography
sx={{
fontSize: phone ? "24px" : "36px",
fontWeight: 500,
lineHeight: "28.44px",
textAlign: "center",
mb: "10px",
}}
>
<Box
sx={{
display: "flex",
flexDirection: "column",
alignItems: "center"
}}
>
<Box
component="img"
src={wallet_icon}
sx={{
width: phone ? "338px" : "auto",
height: phone ? "215px" : "auto",
mb: "60px"
}}
/>
<Typography
sx={{
fontSize: phone ? "24px" : "36px",
fontWeight: 500,
lineHeight: "28.44px",
textAlign: "center",
mb: "10px"
}}
>Спасибо за оплату!</Typography>
<Typography
sx={{
fontSize: "18px",
lineHeight: "21.33px",
textAlign: "center",
color: theme.palette.gray.dark,
mb: "30px"
}}
>Ваш платеж принят и в течение 10 минут товары будут зачислены</Typography>
<Button
component={Link}
to={redirectUrl.toString()}
replace={true}
variant="pena-contained-dark"
>На главную</Button>
</Box>
</Box >
);
Спасибо за оплату!
</Typography>
<Typography
sx={{
fontSize: "18px",
lineHeight: "21.33px",
textAlign: "center",
color: theme.palette.gray.dark,
mb: "30px",
}}
>
Ваш платеж принят и в течение 10 минут товары будут зачислены
</Typography>
<Button
component={Link}
to={redirectUrl.toString()}
replace={true}
variant="pena-contained-dark"
>
На главную
</Button>
</Box>
</Box>
);
};

2
src/pages/QuizPayment/QuizPayment.tsx
View File

@ -50,7 +50,7 @@ export default function QuizPayment() {
useEffect(
function redirectIfSignedIn() {
if (!first && user?._id === userId)
navigate(`/payment?action=${action}&dif=${dif}`, { replace: true });
navigate(`/payment?action=${action}&dif=${dif}&user=${userId}`, { replace: true });
},
[navigate, user]
);