Merge branch 'dev' into 'staging'
Dev See merge request frontend/marketplace!148
This commit is contained in:
commit
ebe7c3faa9
@ -2,32 +2,25 @@ import { makeRequest } from "@frontend/kitui";
|
||||
import { SendPaymentRequest, SendPaymentResponse } from "@root/model/wallet";
|
||||
import { parseAxiosError } from "@root/utils/parse-error";
|
||||
|
||||
const isStaging = (() => {
|
||||
const host = window.location.hostname;
|
||||
return host.includes("s") ? "s" : "";
|
||||
})();
|
||||
|
||||
const apiUrl = process.env.REACT_APP_DOMAIN + "/customer";
|
||||
|
||||
const testPaymentBody: SendPaymentRequest = {
|
||||
type: "bankCard",
|
||||
amount: 15020,
|
||||
currency: "RUB",
|
||||
bankCard: {
|
||||
number: "RUB",
|
||||
expiryYear: "2021",
|
||||
expiryMonth: "05",
|
||||
csc: "05",
|
||||
cardholder: "IVAN IVANOV",
|
||||
},
|
||||
phoneNumber: "79000000000",
|
||||
login: "login_test",
|
||||
returnUrl: window.location.origin + "/wallet",
|
||||
};
|
||||
interface PaymentBody {
|
||||
type: string;
|
||||
amount: number;
|
||||
}
|
||||
|
||||
export async function sendPayment({
|
||||
body = testPaymentBody,
|
||||
fromSquiz = false,
|
||||
body,
|
||||
fromSquiz
|
||||
}: {
|
||||
body?: SendPaymentRequest;
|
||||
body: PaymentBody;
|
||||
fromSquiz: boolean;
|
||||
}): Promise<[SendPaymentResponse | null, string?]> {
|
||||
if (fromSquiz) body.returnUrl = "squiz.pena.digital/list?action=fromhub";
|
||||
try {
|
||||
const sendPaymentResponse = await makeRequest<
|
||||
SendPaymentRequest,
|
||||
@ -38,7 +31,20 @@ export async function sendPayment({
|
||||
method: "POST",
|
||||
useToken: true,
|
||||
withCredentials: false,
|
||||
body,
|
||||
body: {
|
||||
currency: "RUB",
|
||||
bankCard: {
|
||||
number: "RUB",
|
||||
expiryYear: "2021",
|
||||
expiryMonth: "05",
|
||||
csc: "05",
|
||||
cardholder: "IVAN IVANOV",
|
||||
},
|
||||
phoneNumber: "79000000000",
|
||||
login: "login_test",
|
||||
returnUrl: `https://${isStaging}hub.pena.digital/afterpay?from=${fromSquiz ? "quiz" : "hub"}`,
|
||||
...body
|
||||
}
|
||||
});
|
||||
|
||||
return [sendPaymentResponse];
|
||||
@ -55,7 +61,7 @@ export const sendRSPayment = async (money: number): Promise<string | null> => {
|
||||
url: apiUrl + "/wallet/rspay",
|
||||
method: "POST",
|
||||
useToken: true,
|
||||
body: {money: money},
|
||||
body: { money: money },
|
||||
withCredentials: false,
|
||||
});
|
||||
|
||||
|
||||
50
src/assets/Icons/ColorWallet.svg
Normal file
50
src/assets/Icons/ColorWallet.svg
Normal file
@ -0,0 +1,50 @@
|
||||
<svg width="440" height="280" viewBox="0 0 440 280" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_4712_5560)">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M231.959 16.4365C198.92 13.9884 177.697 50.2473 157.653 76.6518C140.062 99.8243 127.322 125.703 126.922 154.806C126.496 185.768 133.432 217.709 155.415 239.495C178.059 261.936 211.143 275.338 242.421 269.268C271.103 263.702 282.562 231.478 303.232 210.809C325.675 188.367 368.731 176.579 366.816 144.878C364.897 113.13 318.762 108.809 295.742 86.884C271.898 64.1742 264.779 18.8684 231.959 16.4365Z" fill="#9A9AAF" fill-opacity="0.2"/>
|
||||
<circle cx="323.736" cy="253.787" r="18.1591" transform="rotate(-2.36964 323.736 253.787)" fill="#9A9AAF" fill-opacity="0.2"/>
|
||||
<circle cx="297.256" cy="53.2835" r="6.91775" transform="rotate(-2.36964 297.256 53.2835)" fill="#9A9AAF" fill-opacity="0.2"/>
|
||||
<mask id="mask0_4712_5560" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="27" y="-43" width="340" height="315">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M269.41 -42.2079C236.371 -44.656 93.7624 -33.2189 73.7186 -6.81442C56.1283 16.3581 27.8836 111.909 27.4837 141.011C27.0583 171.974 35.0061 226.607 56.9896 248.393C79.6336 270.834 211.14 275.339 242.419 269.269C271.1 263.703 282.56 231.48 303.229 210.811C325.673 188.368 368.729 176.58 366.813 144.88C364.894 113.131 357.483 67.3786 334.463 45.454C310.619 22.7442 302.23 -39.776 269.41 -42.2079Z" fill="#9A9AAF"/>
|
||||
</mask>
|
||||
<g mask="url(#mask0_4712_5560)">
|
||||
<path d="M313.593 129.318H303.32V138.221H313.593C318.73 138.221 320.014 136.441 320.014 133.473C320.014 130.505 318.088 129.318 313.593 129.318Z" fill="#8F3AFF"/>
|
||||
<path d="M85.1875 88.2439C85.1875 94.5178 86.4369 102.127 107.635 102.127L307.772 194.981V102.127V90.5591C307.772 80.618 299.728 72.5591 289.786 72.5591H107.632C88.3049 72.5591 85.1875 81.97 85.1875 88.2439Z" fill="#D5B5FF"/>
|
||||
<path d="M85.1875 88.2439C85.1875 94.5178 86.4369 102.127 107.635 102.127L307.772 194.981V102.127V90.5591C307.772 80.618 299.728 72.5591 289.786 72.5591H107.632C88.3049 72.5591 85.1875 81.97 85.1875 88.2439Z" fill="url(#paint0_linear_4712_5560)"/>
|
||||
<circle cx="159.968" cy="72.0292" r="43.4189" transform="rotate(-6.9748 159.968 72.0292)" fill="#F4C82D"/>
|
||||
<circle cx="159.968" cy="72.0292" r="43.4189" transform="rotate(-6.9748 159.968 72.0292)" fill="url(#paint1_linear_4712_5560)" fill-opacity="0.2"/>
|
||||
<circle cx="159.97" cy="72.0357" r="36.7391" transform="rotate(-6.9748 159.97 72.0357)" fill="#ECB907"/>
|
||||
<circle cx="159.97" cy="72.0357" r="36.7391" transform="rotate(-6.9748 159.97 72.0357)" fill="url(#paint2_linear_4712_5560)" fill-opacity="0.2"/>
|
||||
<path d="M160.722 108.795C161.73 108.758 162.745 108.677 163.764 108.553C163.034 108.708 161.994 108.802 160.722 108.795C142.173 109.476 125.836 95.5753 123.5 76.4814C121.038 56.3497 135.071 38.0687 154.845 35.6496C143.627 37.022 122.031 51.799 125.41 76.2477C129.131 103.173 151.301 108.743 160.722 108.795Z" fill="#CD9A16"/>
|
||||
<path d="M172.753 57.3134C170.15 54.1387 166.464 52.0421 162.408 51.4301C158.353 50.8181 154.217 51.7343 150.802 54.001C150.317 54.3223 149.849 54.6685 149.4 55.0383C146.237 57.6439 144.153 61.3305 143.548 65.3869C142.944 69.4434 143.862 73.5825 146.126 77.0058L159.215 96.7942L165.142 92.8741L159.579 84.464C160.57 84.488 161.557 84.4227 162.527 84.2714C164.404 83.9784 166.221 83.3629 167.895 82.4486C168.31 82.2221 168.716 81.9774 169.111 81.7147C169.597 81.3935 170.065 81.0473 170.514 80.6774C172.194 79.2926 173.585 77.5898 174.607 75.6662C175.629 73.7425 176.262 71.6357 176.47 69.4661C176.678 67.2964 176.456 65.1064 175.818 63.0211C175.181 60.9357 174.139 58.9959 172.752 57.3124L172.753 57.3134ZM169.395 68.7793C169.28 70.02 168.919 71.2252 168.335 72.3249C167.751 73.4246 166.955 74.3972 165.992 75.1861C165.734 75.3981 165.465 75.5967 165.187 75.7811C163.393 76.965 161.25 77.503 159.109 77.3068C156.967 77.1106 154.955 76.1918 153.402 74.7013C151.849 73.2109 150.848 71.2372 150.563 69.1043C150.278 66.9714 150.726 64.8059 151.833 62.9634C152.536 61.7935 153.479 60.7979 154.589 60.0359C155.227 59.5978 155.921 59.2369 156.657 58.9645C158.672 58.2181 160.883 58.18 162.925 58.8563C164.967 59.5326 166.72 60.8832 167.895 62.6863C169.071 64.4894 169.6 66.638 169.395 68.7793Z" fill="#FDDA5F"/>
|
||||
<path d="M172.752 57.3136C170.149 54.1388 166.463 52.0423 162.407 51.4303C158.352 50.8183 154.216 51.7345 150.801 54.0012C156.505 50.0378 169.11 45.3109 176.469 57.3136C183.705 69.1173 174.907 78.4395 168.23 82.2603C168.119 82.3245 168.007 82.3873 167.894 82.4488C166.22 83.3631 164.403 83.9786 162.526 84.2716L167.242 91.4066L165.141 92.8743L159.578 84.4642C160.569 84.4882 161.556 84.4229 162.526 84.2716C164.403 83.9786 166.22 83.3631 167.894 82.4488C168.006 82.3875 168.117 82.3247 168.23 82.2603C168.528 82.0881 168.822 81.9063 169.11 81.7149C169.596 81.3937 170.064 81.0475 170.513 80.6776C172.193 79.2928 173.584 77.59 174.606 75.6664C175.628 73.7427 176.261 71.6359 176.469 69.4663C176.677 67.2966 176.455 65.1066 175.818 63.0213C175.18 60.9359 174.138 58.9961 172.751 57.3126L172.752 57.3136Z" fill="#CC9B1B"/>
|
||||
<path d="M159.108 77.307C161.249 77.5032 163.392 76.9652 165.186 75.7813C162.916 76.4047 157.617 76.4257 154.588 71.5222C150.801 65.3928 153.232 61.2157 154.588 60.0361C153.478 60.7981 152.535 61.7937 151.832 62.9636C150.725 64.8061 150.277 66.9716 150.562 69.1045C150.847 71.2374 151.848 73.2111 153.401 74.7015C154.954 76.192 156.966 77.1108 159.108 77.307Z" fill="#CC9B1B"/>
|
||||
<path opacity="0.3" d="M165.241 115.129C179.817 113.346 191.818 104.533 198.262 92.5029L121.665 92.5029C129.875 107.856 146.923 117.37 165.241 115.129Z" fill="#A367C8"/>
|
||||
<path d="M307.772 116.655V185.029V211.481C307.772 221.423 299.713 229.481 289.772 229.481H103.188C93.2464 229.481 85.1875 221.423 85.1875 211.481V84.8013C85.1875 91.0622 86.4369 98.6552 107.635 98.6552H289.783C299.725 98.6552 307.772 106.714 307.772 116.655Z" fill="#BA84FF"/>
|
||||
<path d="M307.772 116.655V185.029V211.481C307.772 221.423 299.713 229.481 289.772 229.481H103.188C93.2464 229.481 85.1875 221.423 85.1875 211.481V84.8013C85.1875 91.0622 86.4369 98.6552 107.635 98.6552H289.783C299.725 98.6552 307.772 106.714 307.772 116.655Z" fill="url(#paint3_linear_4712_5560)" fill-opacity="0.4"/>
|
||||
<path d="M312.682 141.801C317.658 141.801 319.934 137.894 319.934 134.961V172.8H307.749V180.513H275.364C267.279 180.513 255.465 176.407 255.465 161.743C255.465 147.08 267.279 141.801 275.364 141.801H302.731H312.682Z" fill="#A765FC"/>
|
||||
<path d="M313.796 137.59C318.771 137.59 320.015 135.74 320.015 132.657V170.271C320.015 175.82 316.905 178.287 313.796 178.287H276.477C268.392 178.287 256.578 173.97 256.578 158.555C256.578 143.139 268.392 137.59 276.477 137.59H303.845H313.796Z" fill="#DABDFF"/>
|
||||
<circle cx="279.95" cy="158.257" r="11.1292" fill="#B07CF3"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_4712_5560" x1="151.046" y1="102.359" x2="158.064" y2="34.0042" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#7E2AEA"/>
|
||||
<stop offset="1" stop-color="#B47AFF" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_4712_5560" x1="132.58" y1="72.6972" x2="213.406" y2="72.6972" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="white"/>
|
||||
<stop offset="1" stop-color="#FEFEFE" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint2_linear_4712_5560" x1="194.705" y1="54.6681" x2="155.294" y2="87.3993" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="white"/>
|
||||
<stop offset="1" stop-color="#FFD74A" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint3_linear_4712_5560" x1="228" y1="102.004" x2="228.003" y2="279.504" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="white"/>
|
||||
<stop offset="1" stop-color="#7E2AEA" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_4712_5560">
|
||||
<rect width="440" height="280" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 7.7 KiB |
@ -35,6 +35,7 @@ import PrivacyPolicy from "@root/docs/content/PrivacyPolicy"
|
||||
import RecoverPassword from "@root/pages/auth/RecoverPassword"
|
||||
import OutdatedLink from "@root/pages/auth/OutdatedLink"
|
||||
import { verify } from "./pages/AccountSettings/helper"
|
||||
import AfterPay from "./pages/AfterPay"
|
||||
|
||||
pdfjs.GlobalWorkerOptions.workerSrc = new URL("pdfjs-dist/build/pdf.worker.min.js", import.meta.url).toString()
|
||||
|
||||
@ -98,7 +99,7 @@ const App = () => {
|
||||
<Route path="/recover" element={<Navigate to="/" replace state={{ redirectTo: "/recover" }} />} />
|
||||
<Route path="/changepwd" element={<Navigate to="/" replace state={{ redirectTo: window.location.pathname + window.location.search }} />} />
|
||||
<Route path="/changepwd/expired" element={<Navigate to="/" replace state={{ redirectTo: "/changepwd/expired" }} />} />
|
||||
|
||||
|
||||
<Route path={"/image/:srcImage"} element={<ChatImageNewWindow />} />
|
||||
<Route element={<PrivateRoute />}>
|
||||
<Route element={<ProtectedLayout />}>
|
||||
@ -117,12 +118,13 @@ const App = () => {
|
||||
<Route path="/tariffconstructor/savedtariffs" element={<SavedTariffs />} />
|
||||
</Route>
|
||||
</Route>
|
||||
<Route path="/ppdd" element={<PPofData/>}/>
|
||||
<Route path="/quizpayment" element={<QuizPayment/>} />
|
||||
<Route path="/ppdd" element={<PPofData />} />
|
||||
<Route path="/quizpayment" element={<QuizPayment />} />
|
||||
<Route element={<Docs />}>
|
||||
<Route path={"/docs/oferta"} element={<Oferta />}/>
|
||||
<Route path={"/docs/privacy"} element={<PrivacyPolicy />}/>
|
||||
<Route path={"/docs/oferta"} element={<Oferta />} />
|
||||
<Route path={"/docs/privacy"} element={<PrivacyPolicy />} />
|
||||
</Route>
|
||||
<Route path="/afterpay" element={<AfterPay />} />
|
||||
</Routes>
|
||||
</>
|
||||
)
|
||||
|
||||
70
src/pages/AfterPay/index.tsx
Normal file
70
src/pages/AfterPay/index.tsx
Normal file
@ -0,0 +1,70 @@
|
||||
import { Box, Button, Typography, useTheme, useMediaQuery } from "@mui/material"
|
||||
import wallet_icon from "@root/assets/Icons/ColorWallet.svg"
|
||||
import { Link } from "react-router-dom";
|
||||
//Привет :)
|
||||
const { domain, pathname } = (() => {
|
||||
const params = new URLSearchParams(window.location.search);
|
||||
const from = params.get("from") || "hub";
|
||||
if (window.location.pathname.includes("afterpay")) history.pushState(null, document.title, "/afterpay");
|
||||
const host = window.location.hostname;
|
||||
return {
|
||||
domain: (host.includes("s") ? "s" : "") + from,
|
||||
pathname: from === "hub" ? "/wallet" : ""
|
||||
}
|
||||
})();
|
||||
|
||||
export default () => {
|
||||
const theme = useTheme();
|
||||
const phone = useMediaQuery(theme.breakpoints.down(375));
|
||||
|
||||
return (
|
||||
<Box
|
||||
sx={{
|
||||
width: "100vw",
|
||||
height: "100vh",
|
||||
p: phone ? "76px 16px" : "117px 0 0 0"
|
||||
}}
|
||||
>
|
||||
<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={`https://${domain}.pena.digital${pathname}`}
|
||||
variant="pena-contained-dark"
|
||||
>На главную</Button>
|
||||
</Box>
|
||||
</Box >
|
||||
)
|
||||
}
|
||||
@ -22,7 +22,7 @@ import { sendPayment, sendRSPayment } from "@root/api/wallet";
|
||||
import { getMessageFromFetchError } from "@frontend/kitui";
|
||||
import { enqueueSnackbar } from "notistack";
|
||||
import { currencyFormatter } from "@root/utils/currencyFormatter";
|
||||
import { useLocation, useNavigate } from "react-router-dom";
|
||||
import { Link, useLocation, useNavigate } from "react-router-dom";
|
||||
import { useHistoryTracker } from "@root/utils/hooks/useHistoryTracker";
|
||||
import { useUserStore } from "@root/stores/user";
|
||||
import { VerificationStatus } from "@root/model/account";
|
||||
@ -62,6 +62,7 @@ export default function Payment() {
|
||||
const location = useLocation();
|
||||
const verificationStatus = useUserStore((state) => state.verificationStatus);
|
||||
const navigate = useNavigate();
|
||||
const handleCustomBackNavigation = useHistoryTracker();
|
||||
|
||||
const notEnoughMoneyAmount =
|
||||
(location.state?.notEnoughMoneyAmount as number) ?? 0;
|
||||
@ -86,6 +87,7 @@ export default function Payment() {
|
||||
|
||||
async function handleChoosePaymentClick() {
|
||||
if (!selectedPaymentMethod) {
|
||||
enqueueSnackbar("Введите метод оплаты")
|
||||
return;
|
||||
}
|
||||
|
||||
@ -100,17 +102,6 @@ export default function Payment() {
|
||||
body: {
|
||||
type: selectedPaymentMethod,
|
||||
amount: Number(paymentValueField) * 100,
|
||||
currency: "RUB",
|
||||
bankCard: {
|
||||
number: "RUB",
|
||||
expiryYear: "2021",
|
||||
expiryMonth: "05",
|
||||
csc: "05",
|
||||
cardholder: "IVAN IVANOV",
|
||||
},
|
||||
phoneNumber: "79000000000",
|
||||
login: "login_test",
|
||||
returnUrl: window.location.origin + "/wallet",
|
||||
},
|
||||
});
|
||||
|
||||
@ -178,7 +169,6 @@ export default function Payment() {
|
||||
|
||||
}
|
||||
|
||||
const handleCustomBackNavigation = useHistoryTracker();
|
||||
|
||||
return (
|
||||
<SectionWrapper
|
||||
|
||||
13
src/utils/hooks/useDomainDefine.ts
Normal file
13
src/utils/hooks/useDomainDefine.ts
Normal file
@ -0,0 +1,13 @@
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
export function useDomainDefine(): { isTestServer: boolean } {
|
||||
const [isTestServer, setIsTestServer] = useState<boolean>(false);
|
||||
|
||||
useEffect(() => {
|
||||
const host = window.location.hostname;
|
||||
let isTest = host.includes("s");
|
||||
setIsTestServer(isTest);
|
||||
}, []);
|
||||
|
||||
return { isTestServer };
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user