SQuiz/frontPanel
2
0
Fork 0
Code Issues 18 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Merge branch 'dev' into 'main'

Browse Source 
стр результатов проверяет наличие линейного резулта + выход со стр резултов...

See merge request frontend/squiz!110
This commit is contained in:
Nastya 2024-01-05 14:55:23 +00:00
commit e81eb16c73
16 changed files with 128 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/pages/ResultPage/ResultSettings.tsx
View File

@ -18,7 +18,7 @@ import { ResultCard, checkEmptyData } from "./cards/ResultCard";
import { EmailSettingsCard } from "./cards/EmailSettingsCard";
import { useCurrentQuiz } from "@root/quizes/hooks";
import { useQuestionsStore } from "@root/questions/store";
import { deleteQuestion } from "@root/questions/actions";
import { createResult, deleteQuestion } from "@root/questions/actions";
import { QuizQuestionResult } from "@model/questionTypes/result";
import IconPlus from "@icons/IconPlus";
@ -57,6 +57,13 @@ export const ResultSettings = () => {
);
useEffect(() => {
//Всегда должен существовать хоть 1 резулт - "line"
if (
!questions?.find( (q) => (q.type === "result" && q.content.rule.parentId === "line"))
) {
createResult(quiz?.backendId, "line");
console.log("Я не нашёл линейный резулт и собираюсь создать новый");
}
return () => {
if (!isReadyToLeaveRef.current && window.location.pathname !== "/edit") {
setOpenNotificationModal(true);

23
src/pages/Tariffs/Tariffs.tsx
View File

@ -15,7 +15,7 @@ import {
Typography,
useMediaQuery,
useTheme,
IconButton
IconButton,
} from "@mui/material";
import { enqueueSnackbar } from "notistack";
import { Tariff, getMessageFromFetchError } from "@frontend/kitui";
@ -58,8 +58,8 @@ function TariffPage() {
setUser(user);
setTariffs(tariffs);
setDiscounts(discounts.Discounts);
let c = currencyFormatter.format(Number(user.wallet.cash) / 100)
setCash(c)
let c = currencyFormatter.format(Number(user.wallet.cash) / 100);
setCash(c);
};
get();
}, []);
@ -85,9 +85,8 @@ function TariffPage() {
method: "POST",
url: "https://squiz.pena.digital/customer/cart/pay",
});
setCash(currencyFormatter.format(Number(data.wallet.cash) / 100))
setCash(currencyFormatter.format(Number(data.wallet.cash) / 100));
enqueueSnackbar("Тариф успешно приобретён");
} catch (e) {
enqueueSnackbar("Произошла ошибка. Попробуйте позже");
}
@ -98,8 +97,9 @@ function TariffPage() {
// history.pushState({}, null, "https://hub.pena.digital/wallet?action=squizpay");
var link = document.createElement("a");
link.href = `https://hub.pena.digital/payment?action=squizpay&dif=${(price - Number(user.wallet.cash)) * 100
}`;
link.href = `https://hub.pena.digital/payment?action=squizpay&dif=${
(price - Number(user.wallet.cash)) * 100
}`;
document.body.appendChild(link);
// link.click();
}
@ -179,8 +179,9 @@ function TariffPage() {
display: "grid",
gap: "40px",
p: "20px",
gridTemplateColumns: `repeat(auto-fit, minmax(300px, ${isTablet ? "436px" : "360px"
}))`,
gridTemplateColumns: `repeat(auto-fit, minmax(300px, ${
isTablet ? "436px" : "360px"
}))`,
}}
>
{createTariffElements(
@ -231,7 +232,7 @@ export const Tariffs = withErrorBoundary(TariffPage, {
Ошибка загрузки тарифов
</Typography>
),
onError: () => { },
onError: () => {},
});
const LoadingPage = () => (
@ -269,7 +270,7 @@ export const inCart = () => {
}
});
} else {
localStorage.setItem("saveCart", "[]")
localStorage.setItem("saveCart", "[]");
}
};
const outCart = (cart: string[]) => {

9
src/pages/ViewPublicationPage/ContactForm.tsx
View File

@ -114,8 +114,6 @@ export const ContactForm = ({
borderRadius: "4px",
overflow: "auto",
height: "90vh",
boxShadow:
"rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px",
}}
>
<Box>
@ -133,6 +131,7 @@ export const ContactForm = ({
{quiz?.config.formContact.desc && (
<Typography
sx={{
color: theme.palette.text.primary,
textAlign: "center",
m: "20px 0",
fontSize: "18px",
@ -199,7 +198,7 @@ export const ContactForm = ({
checked={ready}
colorIcon={theme.palette.primary.main}
/>
<Typography>
<Typography sx={{ color: theme.palette.text.primary }}>
С&ensp;
<Link> Положением об обработке персональных данных </Link>
&ensp;и&ensp;
@ -328,7 +327,9 @@ const CustomInput = ({ title, desc, Icon }: any) => {
const isMobile = useMediaQuery(theme.breakpoints.down(600));
return (
<Box m="15px 0">
<Typography mb="7px">{title}</Typography>
<Typography mb="7px" color={theme.palette.text.primary}>
{title}
</Typography>
<TextField
sx={{
width: isMobile ? "300px" : "350px",

2
src/pages/ViewPublicationPage/Footer.tsx
View File

@ -109,6 +109,7 @@ export const Footer = ({
}, [question, answers]);
const showResult = (nextQuestion) => {
console.log("Следующий результат будет вот такой", nextQuestion);
if (nextQuestion && quiz?.config.resultInfo.when === "email") {
setShowContactForm(true);
return;
@ -241,6 +242,7 @@ export const Footer = ({
};
const followNextStep = () => {
console.log(" Я понимаю что нахожусь в линейном опроснике" + linear);
if (linear) {
setStepNumber((q) => q + 1);
const questionIndex = questions.findIndex(({ id }) => id === question.id);

20
src/pages/ViewPublicationPage/Question.tsx
View File

@ -90,15 +90,17 @@ export const Question = ({ questions }: QuestionProps) => {
}}
>
<QuestionComponent currentQuestion={currentQuestion} />
{mode[quiz.config.theme] ? (
<NameplateLogoFQ
style={{ fontSize: "34px", width: "200px", height: "auto" }}
/>
) : (
<NameplateLogoFQDark
style={{ fontSize: "34px", width: "200px", height: "auto" }}
/>
)}
<Box>
{mode[quiz.config.theme] ? (
<NameplateLogoFQ
style={{ fontSize: "34px", width: "200px", height: "auto" }}
/>
) : (
<NameplateLogoFQDark
style={{ fontSize: "34px", width: "200px", height: "auto" }}
/>
)}
</Box>
</Box>
)}
{showResultForm && quiz?.config.resultInfo.when === "before" && (

68
src/pages/ViewPublicationPage/ResultForm.tsx
View File

@ -1,4 +1,10 @@
import { Box, Typography, Button } from "@mui/material";
import {
Box,
Typography,
Button,
useMediaQuery,
useTheme,
} from "@mui/material";
import { getQuestionByContentId } from "@root/questions/actions";
import { useCurrentQuiz } from "@root/quizes/hooks";
@ -24,16 +30,33 @@ export const ResultForm = ({
}: ResultFormProps) => {
const quiz = useCurrentQuiz();
const mode = modes;
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(650));
const { questions } = useQuestionsStore();
const resultQuestion = (questions.find(
(question) =>
question.type === "result" &&
question.content.rule.parentId === currentQuestion.content.id,
) ||
questions.find(
(question) =>
question.type === "result" && question.content.rule.parentId === "line",
)) as AnyTypedQuizQuestion;
const searchResult = () => {
if (Boolean(quiz?.config.haveRoot)) {
//ищём для ветвления
return (questions.find(
(question) =>
question.type === "result" &&
question.content.rule.parentId === currentQuestion.content.id,
) ||
questions.find(
(question) =>
question.type === "result" &&
question.content.rule.parentId === "line",
)) as AnyTypedQuizQuestion;
} else {
return questions.find(
(question) =>
question.type === "result" &&
question.content.rule.parentId === "line",
) as AnyTypedQuizQuestion;
}
};
const resultQuestion = searchResult();
const followNextForm = () => {
setShowResultForm(false);
@ -41,6 +64,7 @@ export const ResultForm = ({
};
if (resultQuestion === undefined) return <></>;
console.log("Я форма показа резултата и он такой ", resultQuestion);
return (
<Box
sx={{
@ -58,15 +82,16 @@ export const ResultForm = ({
display: "flex",
flexDirection: "column",
alignItems: "start",
width: "490px",
width: isMobile ? "100%" : "490px",
padding: isMobile ? "0 16px" : undefined,
}}
>
{!resultQuestion?.content.useImage && resultQuestion.content.video && (
<YoutubeEmbedIframe
videoUrl={resultQuestion.content.video}
containerSX={{
width: "490px",
height: "280px",
width: isMobile ? "100%" : "490px",
height: isMobile ? "100%" : "280px",
}}
/>
)}
@ -75,10 +100,10 @@ export const ResultForm = ({
component="img"
src={resultQuestion.content.back}
sx={{
width: "490px",
height: "280px",
width: isMobile ? "100%" : "490px",
height: isMobile ? "100%" : "280px",
}}
></Box>
/>
)}
{resultQuestion.description !== "" &&
resultQuestion.description !== " " && (
@ -87,6 +112,7 @@ export const ResultForm = ({
fontSize: "23px",
fontWeight: 700,
m: "20px 0",
color: theme.palette.text.primary,
}}
>
{resultQuestion.description}
@ -97,6 +123,7 @@ export const ResultForm = ({
<Typography
sx={{
m: "20px 0",
color: theme.palette.text.primary,
}}
>
{resultQuestion.title}
@ -109,6 +136,7 @@ export const ResultForm = ({
sx={{
fontSize: "18px",
m: "20px 0",
color: theme.palette.text.primary,
}}
>
{resultQuestion.content.text}
@ -130,9 +158,15 @@ export const ResultForm = ({
display: "flex",
alignItems: "center",
mt: "15px",
gap: "10px",
}}
>
<NameplateLogo style={{ fontSize: "34px" }} />
<NameplateLogo
style={{
fontSize: "34px",
color: mode[quiz.config.theme] ? "#000000" : "#F5F7FF",
}}
/>
<Typography
sx={{
fontSize: "20px",

16
src/pages/ViewPublicationPage/StartPageViewPublication.tsx
View File

@ -26,6 +26,7 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
const mode = modes;
const { isMobileDevice } = useUADevice();
const isMobile = useMediaQuery(theme.breakpoints.down(650));
const isTablet = useMediaQuery(theme.breakpoints.down(1000));
if (!quiz) return null;
@ -100,7 +101,6 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
? "linear-gradient(180deg,transparent,#272626)"
: "linear-gradient(270deg,#272626,transparent)"
: theme.palette.background.default,
color: quiz.config.startpageType === "expanded" ? "white" : "black",
}}
>
@ -197,6 +197,10 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
quiz.config.startpageType === "centered"
? "center"
: "-moz-initial",
color:
quiz.config.startpageType === "expanded" && !isMobile
? "white"
: theme.palette.text.primary,
}}
>
{quiz.config.startpage.description}
@ -229,10 +233,10 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
sx={{
mt: "46px",
display: "flex",
alignItems: "center",
alignItems: isTablet ? "start" : "center",
justifyContent: "space-between",
width: "100%",
flexDirection: isMobile ? "column" : "row",
flexDirection: isTablet ? "column" : "row",
}}
>
<Box sx={{ maxWidth: "300px" }}>
@ -272,7 +276,11 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
width: "100%",
overflowWrap: "break-word",
fontSize: "12px",
textAlign: "end",
textAlign: isTablet ? "start" : "end",
color:
quiz.config.startpageType === "expanded" && !isMobile
? "white"
: theme.palette.text.primary,
}}
>
{quiz.config.info.law}

10
src/pages/ViewPublicationPage/questions/Variant.tsx
View File

@ -9,6 +9,7 @@ import {
Checkbox,
TextField,
useTheme,
useMediaQuery,
} from "@mui/material";
import {
@ -43,6 +44,7 @@ type VariantItemProps = {
export const Variant = ({ currentQuestion }: VariantProps) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(650));
const { answers, ownVariants } = useQuizViewStore();
const { answer } =
answers.find(
@ -65,7 +67,13 @@ export const Variant = ({ currentQuestion }: VariantProps) => {
<Typography variant="h5" color={theme.palette.text.primary}>
{currentQuestion.title}
</Typography>
<Box sx={{ display: "flex" }}>
<Box
sx={{
display: "flex",
gap: "20px",
flexDirection: isMobile ? "column-reverse" : undefined,
}}
>
<Group
name={currentQuestion.id}
value={currentQuestion.content.variants.findIndex(

2
src/pages/main.tsx
View File

@ -234,7 +234,7 @@ export default function Main({ sidebar, header, footer, Page }: Props) {
<LinkSimple />
</Box>
)}
{currentStep === 1 && (
{currentStep <= 1 && (
<Box sx={{ textAlign: "end", width: "100%" }}>
<IconButton
onClick={toggleQuizPreview}

3
src/pages/startPage/EditPage.tsx
View File

@ -54,13 +54,12 @@ export default function EditPage({
const { editQuizId } = useQuizStore();
const { questions } = useQuestionsStore();
console.log(questions);
const { whyCantCreatePublic, showConfirmLeaveModal } = useUiTools();
const { whyCantCreatePublic, showConfirmLeaveModal, nextStep } = useUiTools();
const theme = useTheme();
const navigate = useNavigate();
const currentStep = useQuizStore((state) => state.currentStep);
const isBranchingLogic = useMediaQuery(theme.breakpoints.down(1100));
const isMobile = useMediaQuery(theme.breakpoints.down(660));
const [nextStep, setNextStep] = useState<number>(0);
const quizConfig = quiz?.config;
// const [openBranchingPage, setOpenBranchingPage] = useState<boolean>(false);

3
src/stores/uiTools/actions.ts
View File

@ -40,3 +40,6 @@ export const setShowConfirmLeaveModal = (showConfirmLeaveModal: boolean) =>
export const updateSomeWorkBackend = (someWorkBackend: boolean) =>
useUiTools.setState({ someWorkBackend });
export const updateNextStep = (nextStep: number) =>
useUiTools.setState({ nextStep });

2
src/stores/uiTools/store.ts
View File

@ -12,6 +12,7 @@ export type UiTools = {
deleteNodeId: string | null;
showConfirmLeaveModal: boolean;
someWorkBackend: boolean;
nextStep: number
};
export type WhyCantCreatePublic = {
@ -30,6 +31,7 @@ const initialState: UiTools = {
deleteNodeId: null,
showConfirmLeaveModal: false,
someWorkBackend: false,
nextStep: -1
};
export const useUiTools = create<UiTools>()(

2
src/ui_kit/Header/Header.tsx
View File

@ -131,7 +131,6 @@ export const Header = ({ setMobileSidebar }: HeaderProps) => {
/>
) : (
<>
<ToTariffsButton />
<Box
sx={{
display: "flex",
@ -139,6 +138,7 @@ export const Header = ({ setMobileSidebar }: HeaderProps) => {
gap: "15px",
}}
>
<ToTariffsButton color={"#7e2aea"} />
<LogoutButton onClick={handleLogoutClick} />
</Box>
</>

2
src/ui_kit/Header/HeaderFull.tsx
View File

@ -58,7 +58,7 @@ export default function HeaderFull() {
<Logotip width={124} />
</Link>
<Box sx={{ display: "flex", ml: "auto" }}>
<ToTariffsButton />
<ToTariffsButton color={"#7e2aea"} />
<LogoutButton
onClick={handleLogoutClick}
sx={{

14
src/ui_kit/Sidebar/Sidebar.tsx
View File

@ -11,6 +11,7 @@ import MenuItem from "../MenuItem";
import { useCurrentQuiz } from "@root/quizes/hooks";
import { useLocation, useNavigate } from "react-router-dom";
import { setCurrentStep } from "@root/quizes/actions";
import { updateNextStep } from "@root/uiTools/actions";
const quizSettingsMenuItems = [
[TagIcon, "Дополнения"],
@ -37,6 +38,7 @@ export default function Sidebar({ changePage, disableCollapse }: SidebarProps) {
navigate("/edit");
}
updateNextStep(index)
changePage(index);
};
@ -106,9 +108,9 @@ export default function Sidebar({ changePage, disableCollapse }: SidebarProps) {
key={index}
text={menuItem.sidebarText}
isCollapsed={isMenuCollapsed}
isActive={currentStep === index}
isActive={currentStep === index && pathname.startsWith("/edit")}
disabled={
index === 0
pathname.startsWith("/edit")
? false
: quiz === undefined
? true
@ -117,7 +119,7 @@ export default function Sidebar({ changePage, disableCollapse }: SidebarProps) {
icon={
<Icon
color={
currentStep === index
currentStep === index && pathname.startsWith("/edit")
? theme.palette.brightPurple.main
: isMenuCollapsed
? "white"
@ -154,9 +156,9 @@ export default function Sidebar({ changePage, disableCollapse }: SidebarProps) {
}}
text={"Дизайн"}
isCollapsed={isMenuCollapsed}
isActive={currentStep === 6}
isActive={pathname.startsWith("/design")}
disabled={
currentStep === 6
pathname.startsWith("/design")
? false
: quiz === undefined
? true
@ -165,7 +167,7 @@ export default function Sidebar({ changePage, disableCollapse }: SidebarProps) {
icon={
<PencilCircleIcon
color={
currentStep === 6
pathname.startsWith("/design")
? theme.palette.brightPurple.main
: isMenuCollapsed
? "white"

1
src/ui_kit/StartPagePreview/index.tsx
View File

@ -123,6 +123,7 @@ export const StartPagePreview = () => {
overflow: "hidden",
pointerEvents: "auto",
borderRadius: "5px",
boxShadow: "0px 5px 10px 2px rgba(34, 60, 80, 0.2)",
}}
>
<QuizPreviewLayout />