SQuiz/frontAnswerer
2
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

отрисовка данных с бека

Browse Source
This commit is contained in:
Nastya 2023-12-17 21:15:59 +03:00
parent 735ccca576
commit 7d436c9df3
14 changed files with 265 additions and 785 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/api/quizRelase.ts Normal file
View File

@ -0,0 +1,19 @@
import { makeRequest } from "@frontend/kitui";
function get(quizId: string) {
return makeRequest<any>({
url: `https://squiz.pena.digital/answer/settings`,
body: {
quiz_id: quizId,
limit: 100,
page: 0,
need_config: true,
},
method: "POST",
});
}
export const relaseApi = {
get: get,
};

20
src/model/settingsData.ts Normal file
View File

@ -0,0 +1,20 @@
import { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
import { QuizConfig } from "@model/quizSettings";
export type QuestionsStore = {
items: (AnyTypedQuizQuestion)[];
settings: Settings;
cnt: number;
};
export interface Settings {
fp: boolean,
rep: boolean,
name: string,
lim: number,
due: number,
delay: number,
pausable: boolean,
cfg: QuizConfig
}

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

@ -64,11 +64,11 @@ export const ContactForm = ({
fontSize: "28px"
}}
>
{settings.cfg.formContact.title || "Заполните форму, чтобы получить результаты теста"}
{settings?.cfg.formContact.title || "Заполните форму, чтобы получить результаты теста"}
</Typography>
{
settings.cfg.formContact.desc &&
settings?.cfg.formContact.desc &&
<Typography
sx={{
textAlign: "center",
@ -76,7 +76,7 @@ export const ContactForm = ({
fontSize: "18px"
}}
>
{settings.cfg.formContact.desc}
{settings?.cfg.formContact.desc}
</Typography>
}
</Box>
@ -107,7 +107,7 @@ export const ContactForm = ({
<Button
disabled={!ready}
variant="contained" onClick={() => {
if (settings.cfg.resultInfo.when === "after") followNextForm()
if (settings?.cfg.resultInfo.when === "after") followNextForm()
}}>
Получить результаты
</Button>
@ -143,7 +143,7 @@ const Inputs = () => {
const Icons = icons.map((data) => {
//@ts-ignore
const FC:any = settings.cfg.formContact[data.type]
const FC:any = settings?.cfg.formContact[data.type]
if (FC.used) someUsed.push(<CustomInput title={FC.innerText || data.defaultText} desc={FC.text || data.defaultTitle} Icon={data.icon} />)
return <CustomInput title={FC.innerText || data.defaultText} desc={FC.text || data.defaultTitle} Icon={data.icon} />
})

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

@ -98,7 +98,7 @@ export const Footer = ({
console.log(nextQuestion)
if (nextQuestion && settings.cfg.resultInfo.when === "before") {
if (nextQuestion && settings?.cfg.resultInfo.when === "before") {
setShowResultForm(true);
} else {
setShowContactForm(true);

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

@ -48,7 +48,7 @@ export const Question = ({ questions }: QuestionProps) => {
const [showResultForm, setShowResultForm] = useState<boolean>(false);
useEffect(() => {
const nextQuestion = getQuestionById(settings.cfg.haveRoot || "");
const nextQuestion = getQuestionById(settings?.cfg.haveRoot || "");
if (nextQuestion?.type) {
setCurrentQuestion(nextQuestion);
@ -57,6 +57,8 @@ export const Question = ({ questions }: QuestionProps) => {
}
setCurrentQuestion(questions[0]);
console.log(currentQuestion)
console.log(questions[0])
}, []);
if (!currentQuestion) return <>не смог отобразить вопрос</>;
@ -80,7 +82,7 @@ export const Question = ({ questions }: QuestionProps) => {
<QuestionComponent currentQuestion={currentQuestion} />
</Box>
)}
{showResultForm && settings.cfg.resultInfo.when === "before" && (
{showResultForm && settings?.cfg.resultInfo.when === "before" && (
<ResultForm
currentQuestion={currentQuestion}
showContactForm={showContactForm}
@ -96,7 +98,7 @@ export const Question = ({ questions }: QuestionProps) => {
setShowResultForm={setShowResultForm}
/>
)}
{showResultForm && settings.cfg.resultInfo.when === "after" && (
{showResultForm && settings?.cfg.resultInfo.when === "after" && (
<ResultForm
currentQuestion={currentQuestion}
showContactForm={showContactForm}

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

@ -105,7 +105,7 @@ export const ResultForm = ({
</Box>
{
settings.cfg.resultInfo.when === "before" &&
settings?.cfg.resultInfo.when === "before" &&
<Box
sx={{
height: "100px",

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

@ -27,14 +27,14 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
if (!settings) return null;
const handleCopyNumber = () => {
navigator.clipboard.writeText(settings.cfg.info.phonenumber);
navigator.clipboard.writeText(settings?.cfg.info.phonenumber);
};
const background = settings.cfg.startpage.background.type === "image"
? settings.cfg.startpage.background.desktop
const background = settings?.cfg.startpage.background.type === "image"
? settings?.cfg.startpage.background.desktop
? (
<img
src={settings.cfg.startpage.background.desktop}
src={settings?.cfg.startpage.background.desktop}
alt=""
style={{
width: "100%",
@ -45,19 +45,19 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
/>
)
: null
: settings.cfg.startpage.background.type === "video"
? settings.cfg.startpage.background.video
: settings?.cfg.startpage.background.type === "video"
? settings?.cfg.startpage.background.video
? (
<YoutubeEmbedIframe videoUrl={settings.cfg.startpage.background.video}
<YoutubeEmbedIframe videoUrl={settings?.cfg.startpage.background.video}
containerSX={{
width: settings.cfg.startpageType === "centered" ? "550px" : settings.cfg.startpageType === "expanded" ? "100vw" : "100%",
height: settings.cfg.startpageType === "centered" ? "275px" : settings.cfg.startpageType === "expanded" ? "100vh" : "100%",
borderRadius: settings.cfg.startpageType === "centered" ? "10px" : "0",
width: settings?.cfg.startpageType === "centered" ? "550px" : settings?.cfg.startpageType === "expanded" ? "100vw" : "100%",
height: settings?.cfg.startpageType === "centered" ? "275px" : settings?.cfg.startpageType === "expanded" ? "100vh" : "100%",
borderRadius: settings?.cfg.startpageType === "centered" ? "10px" : "0",
overflow: "hidden",
"& iframe": {
width: "100%",
height: "100%",
transform: settings.cfg.startpageType === "centered" ? "" : settings.cfg.startpageType === "expanded" ? "scale(1.5)" : "scale(2.4)",
transform: settings?.cfg.startpageType === "centered" ? "" : settings?.cfg.startpageType === "expanded" ? "scale(1.5)" : "scale(2.4)",
}
@ -71,18 +71,18 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
<Paper className="quiz-preview-draghandle"
sx={{
height: "100vh",
background: settings.cfg.startpageType === "expanded" ?
settings.cfg.startpage.position === "left" ? "linear-gradient(90deg,#272626,transparent)" :
settings.cfg.startpage.position === "center" ? "linear-gradient(180deg,transparent,#272626)" :
background: settings?.cfg.startpageType === "expanded" ?
settings?.cfg.startpage.position === "left" ? "linear-gradient(90deg,#272626,transparent)" :
settings?.cfg.startpage.position === "center" ? "linear-gradient(180deg,transparent,#272626)" :
"linear-gradient(270deg,#272626,transparent)"
: "",
color: settings.cfg.startpageType === "expanded" ? "white" : "black"
color: settings?.cfg.startpageType === "expanded" ? "white" : "black"
}}>
<QuizPreviewLayoutByType
quizHeaderBlock={<Box
p={settings.cfg.startpageType === "standard" ? "" : "16px"}
p={settings?.cfg.startpageType === "standard" ? "" : "16px"}
>
<Box sx={{
display: "flex",
@ -90,9 +90,9 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
gap: "20px",
mb: "7px"
}}>
{settings.cfg.startpage.logo && (
{settings?.cfg.startpage.logo && (
<img
src={settings.cfg.startpage.logo}
src={settings?.cfg.startpage.logo}
style={{
height: "37px",
maxWidth: "43px",
@ -102,12 +102,12 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
/>
)}
<Typography sx={{ fontSize: "14px" }}>
{settings.cfg.info.orgname}
{settings?.cfg.info.orgname}
</Typography>
</Box>
<Link mb="16px" href={settings.cfg.info.site}>
<Link mb="16px" href={settings?.cfg.info.site}>
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
{settings.cfg.info.site}
{settings?.cfg.info.site}
</Typography>
</Link>
</Box>}
@ -116,9 +116,9 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
display: "flex",
flexDirection: "column",
justifyContent: "center",
alignItems: settings.cfg.startpageType === "centered" ? "center" :
settings.cfg.startpageType === "expanded"
? settings.cfg.startpage.position === "center" ?
alignItems: settings?.cfg.startpageType === "centered" ? "center" :
settings?.cfg.startpageType === "expanded"
? settings?.cfg.startpage.position === "center" ?
"center"
: "start" : "start",
mt: "28px",
@ -135,19 +135,19 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
fontSize: "16px",
m: "16px 0"
}}>
{settings.cfg.startpage.description}
{settings?.cfg.startpage.description}
</Typography>
<Box width={settings.cfg.startpageType === "standard" ? "100%" : "auto"}>
<Box width={settings?.cfg.startpageType === "standard" ? "100%" : "auto"}>
<Button
variant="contained"
sx={{
fontSize: "16px",
padding: "10px 15px",
width: settings.cfg.startpageType === "standard" ? "100%" : "auto"
width: settings?.cfg.startpageType === "standard" ? "100%" : "auto"
}}
onClick={() => setVisualStartPage(false)}
>
{settings.cfg.startpage.button.trim() ? settings.cfg.startpage.button : "Пройти тест"}
{settings?.cfg.startpage.button.trim() ? settings?.cfg.startpage.button : "Пройти тест"}
</Button>
</Box>
</Box>
@ -156,33 +156,33 @@ export const StartPageViewPublication = ({ setVisualStartPage }: Props) => {
mt: "46px"
}}
>
{settings.cfg.info.clickable ? (
{settings?.cfg.info.clickable ? (
isMobileDevice ? (
<Link href={`tel:${settings.cfg.info.phonenumber}`}>
<Link href={`tel:${settings?.cfg.info.phonenumber}`}>
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
{settings.cfg.info.phonenumber}
{settings?.cfg.info.phonenumber}
</Typography>
</Link>
) : (
<ButtonBase onClick={handleCopyNumber}>
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
{settings.cfg.info.phonenumber}
{settings?.cfg.info.phonenumber}
</Typography>
</ButtonBase>
)
) : (
<Typography sx={{ fontSize: "16px", color: theme.palette.brightPurple.main }}>
{settings.cfg.info.phonenumber}
{settings?.cfg.info.phonenumber}
</Typography>
)}
<Typography sx={{ fontSize: "12px", textAlign: "end" }}>
{settings.cfg.info.law}
{settings?.cfg.info.law}
</Typography>
</Box>
</>}
backgroundBlock={background}
startpageType={settings.cfg.startpageType}
alignType={settings.cfg.startpage.position}
startpageType={settings?.cfg.startpageType}
alignType={settings?.cfg.startpage.position}
/>
</Paper>
);

53
src/pages/ViewPublicationPage/index.tsx
View File

@ -6,8 +6,10 @@ import { Question } from "./Question";
import { ApologyPage } from "./ApologyPage"
import { useQuestionsStore } from "@root/quizData/store"
import { relaseApi } from "@api/quizRelase"
import type { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
import { useGetSettings } from "../../utils/hooks/useGetSettings";
export const ViewPage = () => {
const { settings, cnt, items } = useQuestionsStore()
@ -15,20 +17,63 @@ export const ViewPage = () => {
const [visualStartPage, setVisualStartPage] = useState<boolean>();
useEffect(() => {
async function get() {
const data = await relaseApi.get("c1ee11d2-ed5a-47d1-b500-bda6fd442114")
//@ts-ignore
const settings = data.settings
console.log(data)
const parseData = {
settings: {
fp: settings.fp,
rep: settings.rep,
name: settings.name,
cfg: JSON.parse(settings?.cfg),
lim: settings.lim,
due: settings.due,
delay: settings.delay,
pausable: settings.pausable
},
//@ts-ignore
items: data.items.map((item) => {
const content = JSON.parse(item.c)
return {
description: item.desc,
id: item.id,
page: item.p,
required: item.req,
title: item.title,
type: item.typ,
content
}
}),
//@ts-ignore
cnt: data.cnt
}
console.log(parseData)
useQuestionsStore.setState(parseData)
}
get()
},[])
useEffect(() => {
if (Object.values(settings).length > 0) {
console.log(settings)
const link = document.querySelector('link[rel="icon"]');
if (link && settings.cfg.startpage.favIcon) {
link.setAttribute("href", settings.cfg.startpage.favIcon);
if (link && settings?.cfg.startpage.favIcon) {
link.setAttribute("href", settings?.cfg.startpage.favIcon);
}
setVisualStartPage(!settings.cfg.noStartPage);
setVisualStartPage(!settings?.cfg.noStartPage);}
}, [settings]);
console.log(items)
const filteredQuestions = (
items.filter(({ type }) => type) as AnyTypedQuizQuestion[]
).sort((previousItem, item) => previousItem.page - item.page);
console.log(filteredQuestions)
if (visualStartPage === undefined) return <Skeleton sx={{ bgcolor: 'grey', width: "100vw", height: "100vh" }} variant="rectangular" />;

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

@ -6,7 +6,7 @@ import {
IconButton,
} from "@mui/material";
import { useQuizViewStore, updateAnswer } from "@root/quizView/store";
import { UPLOAD_FILE_TYPES_MAP } from "@ui_kit/QuizPreview/QuizPreviewQuestionTypes/File";
import { UPLOAD_FILE_TYPES_MAP } from "../tools/File";
import UploadIcon from "@icons/UploadIcon";
import CloseBold from "@icons/CloseBold";

64
src/pages/ViewPublicationPage/tools/File.tsx Normal file
View File

@ -0,0 +1,64 @@
import { ChangeEvent, useEffect, useRef, useState } from "react";
import { Box, Button, Typography } from "@mui/material";
import type {
QuizQuestionFile,
UploadFileType,
} from "model/questionTypes/file";
export const UPLOAD_FILE_TYPES_MAP: Record<UploadFileType, string> = {
all: "file",
picture: "image/*",
video: "video/*",
audio: "audio/*",
document:
".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,.pdf",
} as const;
interface Props {
question: QuizQuestionFile;
}
export default function File({ question }: Props) {
const fileInputRef = useRef<HTMLInputElement>(null);
const [file, setFile] = useState<File | null>(null);
const [acceptedType, setAcceptedType] = useState<any>(
UPLOAD_FILE_TYPES_MAP.all
);
useEffect(() => {
setAcceptedType(UPLOAD_FILE_TYPES_MAP[question.content.type]);
}, [question.content.type]);
function handleFileChange(event: ChangeEvent<HTMLInputElement>) {
if (!event.target.files?.[0]) return setFile(null);
setFile(event.target.files[0]);
}
return (
<Box
sx={{
display: "flex",
flexDirection: "column",
alignItems: "start",
gap: 1,
}}
>
<Typography variant="h6" data-cy="question-title">{question.title}</Typography>
<Button variant="contained" onClick={() => fileInputRef.current?.click()}>
Загрузить файл
<input
ref={fileInputRef}
onChange={handleFileChange}
type="file"
accept={acceptedType}
data-cy="file-upload-input"
style={{
display: "none",
}}
/>
</Button>
{file && <Typography data-cy="chosen-file-name">Выбран файл: {file.name}</Typography>}
</Box>
);
}

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

@ -4,5 +4,6 @@ import { useQuestionsStore } from "./store";
export const getQuestionById = (questionId: string | null):AnyTypedQuizQuestion | null => {
if (questionId === null) return null;
return useQuestionsStore.getState().items.find(q => q.id === questionId) || null;
//@ts-ignore
return useQuestionsStore.getState().items.find(q => q.id === questionId || q.content.id === questionId) || null;
};

703
src/stores/quizData/store.ts
View File

@ -1,708 +1,15 @@
import { AnyTypedQuizQuestion } from "@model/questionTypes/shared";
import { Settings, QuestionsStore } from "@model/settingsData";
import { QuizConfig } from "@model/quizSettings";
import { create } from "zustand";
import { devtools } from "zustand/middleware";
export type QuestionsStore = {
items: (AnyTypedQuizQuestion)[];
settings: Settings;
cnt: number;
};
interface Settings {
fp: boolean,
rep: boolean,
name: string,
lim: number,
due: number,
delay: number,
pausable: boolean,
cfg: QuizConfig
}
const initialState: QuestionsStore = {
settings: {
fp: false, // собираем фингерпринт или нет. пока игнорим
rep: false, // можно ли перепроходить опрос
name: "название опроса", // название опроса
lim: 0, // ограничение на количество прохождений
due: 9999999999, // ограничение на дату окончания прохождения. т.е. если у опроса уже вышло время прохождения, уже нельзя давать пользователю проходить его
delay: 999999999, // сколько времени разрешено проходить опрос
pausable: true, //разрешено ли ставить опрос на паузу
// собственно, поле конфига
cfg: {
"type": null,
"noStartPage": false,
"startpageType": null,
"results": null,
"haveRoot": null,
"resultInfo": {
"when": "after",
"share": false,
"replay": false,
"theme": "",
"reply": "",
"replname": ""
},
"startpage": {
"description": "",
"button": "",
"position": "left",
"favIcon": null,
"logo": null,
"originalLogo": null,
"background": {
"type": null,
"desktop": null,
"originalDesktop": null,
"mobile": null,
"originalMobile": null,
"video": null,
"cycle": false
}
},
"info": {
"phonenumber": "",
"clickable": false,
"orgname": "",
"site": "",
"law": ""
},
"formContact": {
"title": "",
"desc": "",
"name": {
"text": "",
"innerText": "",
"key": "",
"required": false,
"used": true
},
"email": {
"text": "",
"innerText": "",
"key": "",
"required": false,
"used": true
},
"phone": {
"text": "",
"innerText": "",
"key": "",
"required": false,
"used": true
},
"text": {
"text": "",
"innerText": "",
"key": "",
"required": false,
"used": false
},
"address": {
"text": "",
"innerText": "",
"key": "",
"required": false,
"used": false
},
"button": ""
},
"meta": ""
}
},
//@ts-ignore
items: [
{
"id": "26064",
"description": "",
"page": 0,
"quizId": 4856,
"required": false,
"title": "Варианты ответов",
"type": "variant",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vblavi2c73fq9rb0",
"originalBack": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vblavi2c73fq9rb0",
"autofill": false,
"largeCheck": false,
"multi": false,
"own": false,
"innerNameCheck": false,
"required": false,
"innerName": "",
"variants": [
{
"id": "A2chQ9cZ1oSwGrGVthpd4",
"answer": "первый",
"extendedText": "",
"hints": "",
"originalImageUrl": ""
},
{
"id": "Sb6IR4kmFJeyVtpV8HVTh",
"answer": "второй",
"extendedText": "",
"hints": "",
"originalImageUrl": ""
},
{
"id": "4ZkVPXzSku_O7JDvR7guR",
"answer": "тритий",
"extendedText": "",
"hints": "",
"originalImageUrl": ""
}
]
}
},
{
"id": "26066",
"description": "",
"page": 1,
"quizId": 4856,
"required": false,
"title": "варианты с картинками",
"type": "images",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"own": false,
"multi": false,
"xy": "1:1",
"innerNameCheck": false,
"innerName": "",
"large": false,
"format": "carousel",
"required": false,
"variants": [
{
"id": "28xVXJS-dRr8wIbQmyfsb",
"answer": "первый",
"extendedText": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vfdavi2c73fq9rcg",
"originalImageUrl": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vf5avi2c73fq9rc0",
"hints": ""
},
{
"id": "pVj4-56rJ_neQfAkUTHcV",
"answer": "второй",
"extendedText": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vhlavi2c73fq9rdg",
"hints": "",
"originalImageUrl": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vh5avi2c73fq9rd0"
},
{
"id": "lMEkuOlzZI_4J1nlRf54V",
"answer": "тритий",
"extendedText": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vilavi2c73fq9reg",
"hints": "",
"originalImageUrl": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vidavi2c73fq9re0"
}
],
"largeCheck": false
}
},
{
"id": "26069",
"description": "",
"page": 2,
"quizId": 4856,
"required": false,
"title": "варианты и картинка",
"type": "varimg",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"own": false,
"innerNameCheck": false,
"innerName": "",
"required": false,
"variants": [
{
"id": "4uy_Vm9FXq-qPAzaBBkXu",
"answer": "первый ",
"hints": "",
"extendedText": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vmdavi2c73fq9rfg",
"originalImageUrl": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vm5avi2c73fq9rf0"
},
{
"id": "Lt7-FPzjBn67G6z8XSrBV",
"answer": "второй",
"extendedText": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vndavi2c73fq9rgg",
"hints": "",
"originalImageUrl": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9vn5avi2c73fq9rg0"
},
{
"id": "Du7e6TzwQEjPgAU3-5MDM",
"answer": "тритий",
"extendedText": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9votavi2c73fq9rhg",
"hints": "",
"originalImageUrl": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clv9volavi2c73fq9rh0"
}
],
"largeCheck": false,
"replText": ""
}
},
{
"id": "26073",
"description": "",
"page": 3,
"quizId": 4856,
"required": false,
"title": "эмоджи",
"type": "emoji",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"multi": false,
"own": false,
"innerNameCheck": false,
"innerName": "",
"required": false,
"variants": [
{
"id": "v3rYpKwP9C7NbCI9Q_jcO",
"answer": "первый",
"extendedText": "😍",
"hints": "",
"originalImageUrl": ""
},
{
"id": "m2qRUWk2nkCkgqz_XXXPW",
"answer": "текст",
"extendedText": "😆",
"hints": "",
"originalImageUrl": ""
},
{
"id": "xLkM2MKUdJPKDaH3sNGlD",
"answer": "",
"extendedText": "😄",
"hints": "",
"originalImageUrl": ""
},
{
"id": "Ng7YweDbm2g7fa3Fxf54L",
"answer": "выше пусто",
"extendedText": "😇",
"hints": "",
"originalImageUrl": ""
},
{
"id": "PvGj9SkpgE3gQ3IcLC0yv",
"answer": "аааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааааа",
"extendedText": "😀",
"hints": "",
"originalImageUrl": ""
}
]
}
},
{
"id": "26078",
"description": "",
"page": 4,
"quizId": 4856,
"required": false,
"title": "своё поле для ввода",
"type": "text",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
//@ts-ignore
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"placeholder": "пример ответа введён тут",
"innerNameCheck": false,
"innerName": "",
"required": false,
"answerType": "single",
"onlyNumbers": false
}
},
{
"id": "26084",
"description": "",
"page": 5,
"quizId": 4856,
"required": false,
"title": "выпадающий список",
"type": "select",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"multi": false,
"required": false,
"innerNameCheck": false,
"innerName": "",
"default": "",
"variants": [
{
"id": "nS0tFnCyjQtJH7yR392Ck",
"answer": "выпадашка",
"extendedText": "",
"hints": "",
"originalImageUrl": ""
},
{
"id": "lG0ffCvdX89o7En_LVCUG",
"answer": "подпадашка",
"extendedText": "",
"hints": "",
"originalImageUrl": ""
},
{
"id": "M6jG7SlNXuRw1x68M7-bE",
"answer": "западашка",
"extendedText": "",
"hints": "",
"originalImageUrl": ""
},
{
"id": "3TQ0t8750k3xKIrTp_h1T",
"answer": "впадашка",
"extendedText": "",
"hints": "",
"originalImageUrl": ""
}
]
}
},
{
"id": "26091",
"description": "",
"page": 6,
"quizId": 4856,
"required": false,
"title": "дата",
"type": "date",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"required": false,
"innerNameCheck": false,
"innerName": "",
"dateRange": false,
"time": false
}
},
{
"id": "26099",
"description": "",
"page": 7,
"quizId": 4856,
"required": false,
"title": "полузнок",
"type": "number",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"required": false,
"innerNameCheck": false,
"innerName": "",
"range": "1—100999999",
"defaultValue": 0,
"step": 1,
"steps": 5,
"start": 50,
"chooseRange": false,
"form": "star"
}
},
{
"id": "26108",
"description": "",
"page": 8,
"quizId": 4856,
"required": false,
"title": "загрузка файла",
"type": "file",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"required": false,
"innerNameCheck": false,
"innerName": "",
"type": "picture"
}
},
{
"id": "26118",
"description": "",
"page": 9,
"quizId": 4856,
"required": false,
"title": "страница",
"type": "page",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"innerNameCheck": false,
"innerName": "",
"text": "текст страница",
"picture": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clva0bdavi2c73fq9rig",
"originalPicture": "https://squiz.pena.digital/squizimages/c1ee11d2-ed5a-47d1-b500-bda6fd442114/clva0b5avi2c73fq9ri0",
"video": ""
}
},
{
"id": "26129",
"description": "",
"page": 10,
"quizId": 4856,
"required": false,
"title": "рейтинг",
"type": "rating",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"required": false,
"innerNameCheck": false,
"innerName": "",
"steps": 5,
"ratingExpanded": false,
"form": "star",
"ratingNegativeDescription": "",
"ratingPositiveDescription": ""
}
},
{
"id": "26141",
"description": "",
"page": 11,
"quizId": 4856,
"required": false,
"title": "страница конца",
"type": "page",
"expanded": true,
"openedModalSettings": false,
"deleted": false,
"deleteTimeoutId": 0,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"innerNameCheck": false,
"innerName": "",
"text": "",
"picture": "",
"originalPicture": "",
"video": ""
}
},
//@ts-ignore
{
id: "2364",
"quizId": 2364,
"type": "result",
"title": "заголовок линейности",
"description": "",
"deleted": false,
"expanded": true,
"page": 101,
"required": true,
"content": {
"hint": {
"text": "",
"video": ""
},
"rule": {
"children": [],
"main": [],
"parentId": "line",
"default": ""
},
"back": "",
"originalBack": "",
"autofill": false,
"video": "",
"innerName": "",
"text": "",
"price": [
0
],
"useImage": false
}
}
],
cnt: 13 // количество вопросов в опросе
settings: {},
//@ts-ignore
items: [],
cnt: 0
};
export const useQuestionsStore = create<QuestionsStore>()(

57
src/utils/hooks/useGetSettings.ts Normal file
View File

@ -0,0 +1,57 @@
import { useEffect, useLayoutEffect, useRef, useState } from "react"
import { useQuestionsStore } from "@root/quizData/store";
import { relaseApi } from "@api/quizRelase"
interface SettingsGetter {
quizId: string
}
export function useGetSettings(quizId: string) {
const [fetchState, setFetchState] = useState<"fetching" | "idle" | "all fetched">("idle")
useEffect(() => {
async function get() {
const data = await relaseApi.get(quizId)
//@ts-ignore
const settings = data.settings
console.log(data)
const parseData = {
settings: {
fp: settings.fp,
rep: settings.rep,
name: settings.name,
cfg: JSON.parse(settings?.cfg),
lim: settings.lim,
due: settings.due,
delay: settings.delay,
pausable: settings.pausable
},
//@ts-ignore
items: data.items.map((item) => {
const content = JSON.parse(item.c)
return {
description: item.desc,
id: item.id,
page: item.p,
required: item.req,
title: item.title,
type: item.typ,
content
}
}),
//@ts-ignore
cnt: data.cnt
}
console.log(parseData)
useQuestionsStore.setState(parseData)
}
get()
// const controller = new AbortController()
}, [])
return
// return
}

35
src/utils/hooks/useWindowSize.ts
View File

@ -1,35 +0,0 @@
import { useEffect, useLayoutEffect, useState } from "react";
interface WindowSize {
width: number;
height: number;
}
export function useWindowSize(): WindowSize {
const [windowSize, setWindowSize] = useState<WindowSize>({
width: 0,
height: 0,
});
const handleSize = () => {
setWindowSize({
width: window.innerWidth,
height: window.innerHeight,
});
};
useEffect(() => {
window.addEventListener("resize", handleSize);
return () => {
window.removeEventListener("resize", handleSize);
};
});
useLayoutEffect(() => {
handleSize();
}, []);
return windowSize;
}