правки результатов и формы еконтактов, переполнение вариантов ответа в вопросах

This commit is contained in:
Tamara 2024-01-25 04:26:58 +03:00
parent a978fe7c1e
commit ee09655fbf
15 changed files with 200 additions and 131 deletions

@ -60,30 +60,31 @@ export default function ContactFormPage() {
<Box
sx={{
p: isTablet ? "0 0 150px 0" : "0",
mt: "67px",
}}
>
<Box
sx={{
display: "flex",
alignItems: "center",
gap: "10px",
m: "67px 0 41px 0",
}}
>
<Link
sx={{
fontSize: "16px",
lineHeight: "19px",
color: theme.palette.brightPurple.main,
textDecorationColor: theme.palette.brightPurple.main,
}}
>
Как собрать данные посетителя
</Link>{" "}
{/* <Popover>
<Info />
</Popover> */}
</Box>
{/*<Box*/}
{/* sx={{*/}
{/* display: "flex",*/}
{/* alignItems: "center",*/}
{/* gap: "10px",*/}
{/* m: "67px 0 41px 0",*/}
{/* }}*/}
{/*>*/}
{/* <Link*/}
{/* sx={{*/}
{/* fontSize: "16px",*/}
{/* lineHeight: "19px",*/}
{/* color: theme.palette.brightPurple.main,*/}
{/* textDecorationColor: theme.palette.brightPurple.main,*/}
{/* }}*/}
{/* >*/}
{/* Как собрать данные посетителя*/}
{/* </Link>{" "}*/}
{/* /!* <Popover>*/}
{/* <Info />*/}
{/* </Popover> *!/*/}
{/*</Box>*/}
{!quiz?.config.formContact.fields.name.used &&
!quiz?.config.formContact.fields.email.used &&
!quiz?.config.formContact.fields.phone.used &&

@ -156,100 +156,100 @@ export const EmailSettingsCard = ({ quizExpand }: Props) => {
},
}}
/>
<Typography
sx={{
color: "#4D4D4D",
m: "20px 0 14px 0",
fontSize: "18px",
fontWeight: 500,
}}
>
E-mail ответа
</Typography>
<TextField
value={quiz.config.resultInfo.reply}
placeholder={"noreplay@example.ru"}
onChange={({ target }: { target: HTMLInputElement }) => {
updateQuiz(quiz.id, (quiz) => {
quiz.config.resultInfo.reply = target.value;
});
}}
sx={{
margin: isMobile ? "10px 0" : 0,
width: "100%",
"& .MuiInputBase-root": {
color: "#000000",
backgroundColor: expand
? theme.palette.background.default
: "transparent",
height: "48px",
borderRadius: "10px",
".MuiOutlinedInput-notchedOutline": {
borderWidth: "1px !important",
border: expand ? "none" : null,
},
"& .MuiInputBase-input::placeholder": {
color: "#4D4D4D",
opacity: 0.8,
},
},
}}
inputProps={{
sx: {
fontSize: "18px",
lineHeight: "21px",
py: 0,
paddingLeft: "18px",
},
}}
/>
<Typography
sx={{
color: "#4D4D4D",
m: "20px 0 14px 0",
fontSize: "18px",
fontWeight: 500,
}}
>
Имя отправителя
</Typography>
<TextField
value={quiz.config.resultInfo.replname}
placeholder={"Название компании"}
onChange={({ target }: { target: HTMLInputElement }) => {
updateQuiz(quiz.id, (quiz) => {
quiz.config.resultInfo.replname = target.value;
});
}}
sx={{
margin: isMobile ? "10px 0" : 0,
width: "100%",
"& .MuiInputBase-root": {
color: "#000000",
backgroundColor: expand
? theme.palette.background.default
: "transparent",
height: "48px",
borderRadius: "10px",
".MuiOutlinedInput-notchedOutline": {
borderWidth: "1px !important",
border: expand ? "none" : null,
},
"& .MuiInputBase-input::placeholder": {
color: "#4D4D4D",
opacity: 0.8,
},
},
}}
inputProps={{
sx: {
fontSize: "18px",
lineHeight: "21px",
py: 0,
paddingLeft: "18px",
},
}}
/>
{/*<Typography*/}
{/* sx={{*/}
{/* color: "#4D4D4D",*/}
{/* m: "20px 0 14px 0",*/}
{/* fontSize: "18px",*/}
{/* fontWeight: 500,*/}
{/* }}*/}
{/*>*/}
{/* E-mail ответа*/}
{/*</Typography>*/}
{/*<TextField*/}
{/* value={quiz.config.resultInfo.reply}*/}
{/* placeholder={"noreplay@example.ru"}*/}
{/* onChange={({ target }: { target: HTMLInputElement }) => {*/}
{/* updateQuiz(quiz.id, (quiz) => {*/}
{/* quiz.config.resultInfo.reply = target.value;*/}
{/* });*/}
{/* }}*/}
{/* sx={{*/}
{/* margin: isMobile ? "10px 0" : 0,*/}
{/* width: "100%",*/}
{/* "& .MuiInputBase-root": {*/}
{/* color: "#000000",*/}
{/* backgroundColor: expand*/}
{/* ? theme.palette.background.default*/}
{/* : "transparent",*/}
{/* height: "48px",*/}
{/* borderRadius: "10px",*/}
{/* ".MuiOutlinedInput-notchedOutline": {*/}
{/* borderWidth: "1px !important",*/}
{/* border: expand ? "none" : null,*/}
{/* },*/}
{/* "& .MuiInputBase-input::placeholder": {*/}
{/* color: "#4D4D4D",*/}
{/* opacity: 0.8,*/}
{/* },*/}
{/* },*/}
{/* }}*/}
{/* inputProps={{*/}
{/* sx: {*/}
{/* fontSize: "18px",*/}
{/* lineHeight: "21px",*/}
{/* py: 0,*/}
{/* paddingLeft: "18px",*/}
{/* },*/}
{/* }}*/}
{/*/>*/}
{/*<Typography*/}
{/* sx={{*/}
{/* color: "#4D4D4D",*/}
{/* m: "20px 0 14px 0",*/}
{/* fontSize: "18px",*/}
{/* fontWeight: 500,*/}
{/* }}*/}
{/*>*/}
{/* Имя отправителя*/}
{/*</Typography>*/}
{/*<TextField*/}
{/* value={quiz.config.resultInfo.replname}*/}
{/* placeholder={"Название компании"}*/}
{/* onChange={({ target }: { target: HTMLInputElement }) => {*/}
{/* updateQuiz(quiz.id, (quiz) => {*/}
{/* quiz.config.resultInfo.replname = target.value;*/}
{/* });*/}
{/* }}*/}
{/* sx={{*/}
{/* margin: isMobile ? "10px 0" : 0,*/}
{/* width: "100%",*/}
{/* "& .MuiInputBase-root": {*/}
{/* color: "#000000",*/}
{/* backgroundColor: expand*/}
{/* ? theme.palette.background.default*/}
{/* : "transparent",*/}
{/* height: "48px",*/}
{/* borderRadius: "10px",*/}
{/* ".MuiOutlinedInput-notchedOutline": {*/}
{/* borderWidth: "1px !important",*/}
{/* border: expand ? "none" : null,*/}
{/* },*/}
{/* "& .MuiInputBase-input::placeholder": {*/}
{/* color: "#4D4D4D",*/}
{/* opacity: 0.8,*/}
{/* },*/}
{/* },*/}
{/* }}*/}
{/* inputProps={{*/}
{/* sx: {*/}
{/* fontSize: "18px",*/}
{/* lineHeight: "21px",*/}
{/* py: 0,*/}
{/* paddingLeft: "18px",*/}
{/* },*/}
{/* }}*/}
{/*/>*/}
</Box>
)}
</Paper>

@ -11,7 +11,7 @@ export function calcIndividualTariffPrices(
priceBeforeDiscounts: number;
priceAfterDiscounts: number;
} {
console.log('MAGIC', purchasesAmount)
console.log("MAGIC", purchasesAmount);
const priceBeforeDiscounts =
tariff.price ||
tariff.privileges.reduce(
@ -47,7 +47,7 @@ export function calcIndividualTariffPrices(
priceAfterDiscounts *= findDiscountFactor(cart.appliedLoyaltyDiscount);
priceAfterDiscounts *= findDiscountFactor(cart.appliedCartPurchasesDiscount);
console.log("OLOLOLOLO", cart, discounts, purchasesAmount, tariff)
console.log("OLOLOLOLO", cart, discounts, purchasesAmount, tariff);
// cart.allAppliedDiscounts.forEach((discount) => {
// priceAfterDiscounts *= findDiscountFactor(discount)
// })

@ -16,7 +16,7 @@ export const createTariffElements = (
const tariffElements = filteredTariffs
.filter((tariff) => tariff.privileges.length > 0)
.map((tariff, index) => {
console.log('USSSSSES', user)
console.log("USSSSSES", user);
const { priceBeforeDiscounts, priceAfterDiscounts } =
calcIndividualTariffPrices(
tariff,

@ -102,6 +102,16 @@ export const Emoji = ({ currentQuestion }: EmojiProps) => {
color: theme.palette.text.primary,
display: "flex",
gap: "10px",
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
height: "80px",
"& .MuiFormControlLabel-label": {
wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
paddingLeft: "45px",
},
}}
value={index}
onClick={(event) => {

@ -72,7 +72,7 @@ export const Images = ({ currentQuestion }: ImagesProps) => {
}}
onClick={(event) => {
event.preventDefault();
console.log(variant.answer.length);
updateAnswer(
currentQuestion.content.id,
currentQuestion.content.variants[index].id,
@ -107,8 +107,16 @@ export const Images = ({ currentQuestion }: ImagesProps) => {
marginTop: "10px",
marginLeft: 0,
padding: "10px",
display: "flex",
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
height: "80px",
"& .MuiFormControlLabel-label": {
wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
paddingLeft: "45px",
},
}}
value={index}

@ -163,6 +163,8 @@ const VariantItem = ({
? "white"
: theme.palette.background.default,
display: "flex",
alignItems: variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
maxWidth: "685px",
maxHeight: "85px",
justifyContent: "space-between",
@ -172,6 +174,8 @@ const VariantItem = ({
},
"& .MuiFormControlLabel-label": {
wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
},
}}
value={index}

@ -88,9 +88,16 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
? theme.palette.primary.main
: "#9A9AAF",
display: "flex",
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
height: "80px",
margin: isMobile ? 0 : undefined,
"& .MuiFormControlLabel-label": {
wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
paddingLeft: "45px",
},
}}
value={index}
@ -108,6 +115,7 @@ export const Varimg = ({ currentQuestion }: VarimgProps) => {
}}
control={
<Radio
sx={{ position: "absolute" }}
checkedIcon={
<RadioCheck color={theme.palette.primary.main} />
}

@ -82,7 +82,7 @@ export default function MyQuizzesFull({
quiz.name = QuizgenegationName({ quiz });
});
}
return (
<QuizCard
key={quiz.id}

@ -93,6 +93,16 @@ export default function Emoji({ question }: Props) {
display: "flex",
gap: "10px",
background: theme.palette.background.default,
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
height: "80px",
"& .MuiFormControlLabel-label": {
wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
paddingLeft: "45px",
},
}}
control={
<Radio

@ -71,6 +71,7 @@ export default function Images({ question, widthPreview }: Props) {
sx={{
display: "flex",
flexDirection: "column",
justifyContent: "flex-end",
borderRadius: "8px",
overflow: "hidden",
border: "1px solid",
@ -78,6 +79,7 @@ export default function Images({ question, widthPreview }: Props) {
? theme.palette.primary.main
: "#E3E3E3",
maxWidth: "300px",
minHeight: "250px",
maxHeight: "340px",
}}
>
@ -99,8 +101,11 @@ export default function Images({ question, widthPreview }: Props) {
<Box
sx={{
display: "flex",
alignItems: "center",
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
justifyContent: "space-between",
overflow: "auto",
height: "80px",
gap: 2,
p: 1,
}}

@ -83,9 +83,17 @@ export default function Variant({ question }: Props) {
: theme.palette.background.default,
width: "100%",
margin: 0,
// "& .MuiFormControlLabel-label": {
// overflow: "hidden",
// }
display: "flex",
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
height: "80px",
"& .MuiFormControlLabel-label": {
wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "55px",
overflow: "auto",
paddingLeft: "45px",
},
}}
control={
question.content.multi ? (

@ -109,7 +109,17 @@ export default function Varimg({ question, widthPreview }: Props) {
backgroundColor: mode[quiz.config.theme]
? "white"
: theme.palette.background.default,
/*display: "flex",*/
display: "flex",
alignItems:
variant.answer.length <= 60 ? "center" : "flex-start",
position: "relative",
height: "80px",
"& .MuiFormControlLabel-label": {
wordBreak: "break-word",
height: variant.answer.length <= 60 ? undefined : "60px",
overflow: "auto",
paddingLeft: "45px",
},
}}
control={
<Radio

@ -1,10 +1,11 @@
import { Box, useTheme } from "@mui/material";
import { Box, SxProps, Theme, useTheme } from "@mui/material";
interface Props {
color?: string;
sx?: SxProps<Theme>;
}
export default function RadioCheck({ color = "#7E2AEA" }: Props) {
export default function RadioCheck({ color = "#7E2AEA", sx }: Props) {
const theme = useTheme();
return (
@ -15,6 +16,7 @@ export default function RadioCheck({ color = "#7E2AEA" }: Props) {
display: "flex",
alignItems: "center",
justifyContent: "center",
...sx,
}}
>
<svg

@ -1,6 +1,8 @@
import { Box, useTheme } from "@mui/material";
export default function RadioIcon() {
import { Box, SxProps, Theme, useTheme } from "@mui/material";
interface Props {
sx?: SxProps<Theme>;
}
export default function RadioIcon({ sx }: Props) {
const theme = useTheme();
return (
@ -11,6 +13,7 @@ export default function RadioIcon() {
display: "flex",
alignItems: "center",
justifyContent: "center",
...sx,
}}
>
<svg