Merge branch 'dev' into 'staging'
Dev See merge request frontend/squiz!362
This commit is contained in:
commit
a4699983d5
@ -8,6 +8,7 @@ import { sendContactFormRequest } from "@/api/tariff"
|
||||
import { TimePicker } from "@mui/x-date-pickers"
|
||||
import moment, { Moment } from "moment"
|
||||
import { enqueueSnackbar } from "notistack"
|
||||
import { useState } from "react"
|
||||
|
||||
interface Props {
|
||||
open: boolean
|
||||
@ -88,8 +89,60 @@ export const ModalRequestCreate = ({
|
||||
}: Props) => {
|
||||
const theme = useTheme()
|
||||
const isMobile = useMediaQuery(theme.breakpoints.down(650));
|
||||
const [isSending, setIsSending] = useState(false)
|
||||
|
||||
if (isSending) return (
|
||||
<Modal
|
||||
open={open}
|
||||
onClose={onClose}
|
||||
>
|
||||
<Box sx={{
|
||||
position: 'absolute' as 'absolute',
|
||||
top: '50%',
|
||||
left: '50%',
|
||||
transform: 'translate(-50%, -50%)',
|
||||
bgcolor: 'background.paper',
|
||||
boxShadow: 24,
|
||||
width: isMobile ? "343px" : "418px",
|
||||
borderRadius: "10px",
|
||||
p: "50px"
|
||||
}}>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: "24px",
|
||||
fontWeight: 500,
|
||||
lineHeight: "28.44px",
|
||||
textAlign: "center"
|
||||
}}
|
||||
>Спасибо за заявку!</Typography>
|
||||
<Typography
|
||||
sx={{
|
||||
fontSize: "18px",
|
||||
lineHeight: "21.33px",
|
||||
color: "#4D4D4D",
|
||||
m: "5px 0 30px 0"
|
||||
|
||||
}}
|
||||
>С вами свяжутся в течение 24 часов</Typography>
|
||||
<Button
|
||||
variant="contained"
|
||||
fullWidth
|
||||
onClick={onClose}
|
||||
sx={{
|
||||
py: "12px",
|
||||
"&:hover": {
|
||||
backgroundColor: "#581CA7",
|
||||
},
|
||||
"&:active": {
|
||||
color: "white",
|
||||
backgroundColor: "black",
|
||||
},
|
||||
}}
|
||||
>Ок</Button>
|
||||
|
||||
</Box>
|
||||
</Modal>
|
||||
)
|
||||
return (
|
||||
<Modal
|
||||
open={open}
|
||||
@ -159,11 +212,11 @@ export const ModalRequestCreate = ({
|
||||
console.log(resp)
|
||||
if (resp[0]?.status === 200) {
|
||||
enqueueSnackbar("Запрос успешно отправлен")
|
||||
onClose()
|
||||
}
|
||||
setIsSending(true)
|
||||
}
|
||||
if (resp[1]) {
|
||||
enqueueSnackbar(resp[1])
|
||||
}
|
||||
}
|
||||
}}
|
||||
>
|
||||
{({ values, isSubmitting, setFieldValue }) => (<>
|
||||
|
||||
97
src/pages/Tariffs/NavSelect.tsx
Normal file
97
src/pages/Tariffs/NavSelect.tsx
Normal file
@ -0,0 +1,97 @@
|
||||
import { Box, Select, Typography, MenuItem } from "@mui/material"
|
||||
import SimpleArrowDown from "@ui_kit/SimpleArrowDown";
|
||||
import { useRef, useState } from "react";
|
||||
|
||||
interface Props {
|
||||
selectedItem: TypePages;
|
||||
setSelectedItem: (a: TypePages) => void;
|
||||
}
|
||||
export const NavSelect = ({
|
||||
selectedItem,
|
||||
setSelectedItem,
|
||||
}: Props) => {
|
||||
const ref = useRef<HTMLDivElement | null>(null)
|
||||
const [opened, setOpened] = useState<boolean>(false)
|
||||
return (
|
||||
<Box>
|
||||
<Box
|
||||
sx={{
|
||||
width: "300px",
|
||||
display: "inline-flex",
|
||||
alignItems: "center",
|
||||
position: "relative",
|
||||
m: "25px",
|
||||
}}
|
||||
onClick={() => setOpened((isOpened) => !isOpened)}
|
||||
>
|
||||
<Select
|
||||
ref={ref}
|
||||
value={selectedItem}
|
||||
onChange={({ target }) => setSelectedItem(target.value)}
|
||||
MenuProps={{ disablePortal: true }}
|
||||
open={opened}
|
||||
sx={{
|
||||
width: "300px",
|
||||
"& .MuiOutlinedInput-notchedOutline": {
|
||||
border: "none"
|
||||
},
|
||||
'& .MuiInputBase-input': {
|
||||
fontSize: "18px",
|
||||
fontWeight: 500,
|
||||
lineHeight: "20px",
|
||||
|
||||
borderRadius: "28px",
|
||||
position: 'relative',
|
||||
backgroundColor: "#EFF0F5",
|
||||
border: "2px solid white",
|
||||
padding: '10px 10px 10px 20px',
|
||||
color: "#7E2AEA",
|
||||
zIndex: 2,
|
||||
"&:forus": {
|
||||
borderRadius: "28px",
|
||||
},
|
||||
"&:focus-visible": {
|
||||
borderRadius: "28px",
|
||||
}
|
||||
},
|
||||
"& .MuiPaper-root.MuiMenu-paper": {
|
||||
paddingTop: "50px",
|
||||
marginTop: "-50px",
|
||||
borderRadius: "28px",
|
||||
border: "2px solid #ffffff",
|
||||
},
|
||||
"& .MuiPopover-root": {
|
||||
zIndex: 1
|
||||
},
|
||||
"& .MuiSvgIcon-root": {
|
||||
display: "none"
|
||||
}
|
||||
}}
|
||||
>
|
||||
<MenuItem value="count">Тарифы на время</MenuItem>
|
||||
<MenuItem value="day">Тарифы на объем</MenuItem>
|
||||
<MenuItem value="dop">Доп. услуги</MenuItem>
|
||||
<MenuItem value="hide" sx={{ ml: "15px" }}>Убрать логотип “PenaQuiz”</MenuItem>
|
||||
<MenuItem value="create" sx={{ ml: "15px" }}>Создать квиз на заказ</MenuItem>
|
||||
</Select >
|
||||
<Box
|
||||
sx={{
|
||||
width: "36px",
|
||||
height: "36px",
|
||||
bgcolor: "white",
|
||||
borderRadius: "30px",
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
position: "absolute",
|
||||
right: "10px",
|
||||
zIndex: 2,
|
||||
transform: opened ? "rotate(180deg)" : "none"
|
||||
}}
|
||||
>
|
||||
<SimpleArrowDown />
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
@ -12,9 +12,11 @@ import {
|
||||
IconButton,
|
||||
Modal,
|
||||
Paper,
|
||||
Select,
|
||||
Typography,
|
||||
useMediaQuery,
|
||||
useTheme,
|
||||
MenuItem,
|
||||
} from "@mui/material";
|
||||
import { clearQuizData } from "@root/quizes/store";
|
||||
import { cleanAuthTicketData } from "@root/ticket";
|
||||
@ -41,6 +43,7 @@ import type { Discount } from "@model/discounts";
|
||||
import { Other } from "./pages/Other";
|
||||
import { ModalRequestCreate } from "./ModalRequestCreate";
|
||||
import { cancelCC, useCC } from "@/stores/cc";
|
||||
import { NavSelect } from "./NavSelect";
|
||||
|
||||
const StepperText: Record<string, string> = {
|
||||
day: "Тарифы на время",
|
||||
@ -152,7 +155,7 @@ function TariffPage() {
|
||||
let cashDif = Number(payError.split(":")[1]);
|
||||
var link = document.createElement("a");
|
||||
link.href = `https://${isTestServer ? "s" : ""}hub.pena.digital/quizpayment?action=squizpay&dif=${cashDif}&data=${token}&userid=${userId}`;
|
||||
if (cc) link.href = link.href + "cc=true"//после покупки тарифа и возвращения будем знать что надо открыть модалку
|
||||
if (cc) link.href = link.href + "&&cc=true"//после покупки тарифа и возвращения будем знать что надо открыть модалку
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
return;
|
||||
@ -294,13 +297,21 @@ function TariffPage() {
|
||||
onPromocodeApply={handleApplyPromocode}
|
||||
/>
|
||||
</Box>
|
||||
<Tabs
|
||||
names={Object.values(StepperText)}
|
||||
items={Object.keys(StepperText)}
|
||||
selectedItem={selectedItem}
|
||||
setSelectedItem={setSelectedItem}
|
||||
toDop={() => setSelectedItem("dop")}
|
||||
/>
|
||||
{isMobile ?
|
||||
<NavSelect
|
||||
selectedItem={selectedItem}
|
||||
setSelectedItem={setSelectedItem}
|
||||
/>
|
||||
:
|
||||
<Tabs
|
||||
names={Object.values(StepperText)}
|
||||
items={Object.keys(StepperText)}
|
||||
selectedItem={selectedItem}
|
||||
setSelectedItem={setSelectedItem}
|
||||
toDop={() => setSelectedItem("dop")}
|
||||
/>
|
||||
}
|
||||
|
||||
|
||||
<Box
|
||||
sx={{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user