окошко для загрузки изображений в мобильной версии в зависимости от чека

This commit is contained in:
Tamara 2023-07-02 02:33:35 +03:00
parent 404b3edeb1
commit e842f1de5c
3 changed files with 30 additions and 6 deletions

@ -84,6 +84,7 @@ export default function QuestionsPage() {
background: theme.palette.brightPurple.main, background: theme.palette.brightPurple.main,
fontSize: "18px", fontSize: "18px",
}} }}
onClick={handleNext}
> >
Следующий шаг Следующий шаг
</Button> </Button>

@ -108,6 +108,11 @@ export default function StartPageSettings({ handleNext }: HandleNext) {
updateQuizesList(params, {config: SPageClone }) updateQuizesList(params, {config: SPageClone })
} }
const [mobileVersion, setMobileVersion] = React.useState(false);
const MobileVersionHC = (bool:boolean) => {
setMobileVersion(bool)
}
return ( return (
<> <>
<Typography variant="h5" sx={{marginTop: "60px"}}>Стартовая страница</Typography> <Typography variant="h5" sx={{marginTop: "60px"}}>Стартовая страница</Typography>
@ -238,16 +243,23 @@ export default function StartPageSettings({ handleNext }: HandleNext) {
display: backgroundType === "image" ? "flex" : "none", display: backgroundType === "image" ? "flex" : "none",
flexDirection: "column" flexDirection: "column"
}}> }}>
<Typography sx={{ fontWeight: 500, color: theme.palette.grey3.main, mt: "20px", mb: "14px" }}> <Box sx={{
Изображение</Typography> display: mobileVersion ? "none" : "flex",
<DropZone text={"5 MB максимум"} heightImg={"110px"}/> flexDirection: "column"
}}>
<Typography sx={{ fontWeight: 500, color: theme.palette.grey3.main, mt: "20px", mb: "14px" }}>
Изображение</Typography>
<DropZone text={"5 MB максимум"} heightImg={"110px"}/>
</Box>
<ModalSizeImage/> <ModalSizeImage/>
<Box sx={{ <Box sx={{
mt: "20px", mt: "20px",
display: "flex", display: "flex",
gap: "10px", gap: "10px",
alignItems: "center", flexDirection: "column"
}}> }}>
<FormControlLabel <FormControlLabel
@ -264,8 +276,18 @@ export default function StartPageSettings({ handleNext }: HandleNext) {
ml: "-9px", ml: "-9px",
userSelect: "none", userSelect: "none",
}} }}
onClick={() => {MobileVersionHC(!mobileVersion)}}
/> />
{mobileVersion ?
<Box sx={{display: "flex", flexDirection: "column"}}>
<Typography sx={{ fontWeight: 500, color: theme.palette.grey3.main, mt: "11px", mb: "14px" }}>
Изображение для мобильной версии</Typography>
<DropZone text={"5 MB максимум"} heightImg={"110px"}/>
</Box>
:
<></>
}
</Box> </Box>
</Box> </Box>

@ -3,6 +3,7 @@ import StepOne from "../pages/startPage/stepOne";
import Steptwo from "../pages/startPage/steptwo"; import Steptwo from "../pages/startPage/steptwo";
import StartPageSettings from "../pages/startPage/StartPageSettings"; import StartPageSettings from "../pages/startPage/StartPageSettings";
import QuestionsPage from "../pages/Questions/QuestionsPage"; import QuestionsPage from "../pages/Questions/QuestionsPage";
import ContactFormPage from "../pages/ContactFormPage/ContactFormPage";
interface Props { interface Props {
activeStep: number, activeStep: number,
@ -25,7 +26,7 @@ export default function SwitchStepPages({activeStep = 1, handleNext }: Props) {
return (<QuestionsPage/>); return (<QuestionsPage/>);
break; break;
case 5: case 5:
return (<StartPageSettings handleNext={handleNext}/>); return (<ContactFormPage/>);
break; break;
case 6: case 6:
return (<StartPageSettings handleNext={handleNext}/>); return (<StartPageSettings handleNext={handleNext}/>);