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

новая обработка ответа для новых версий ответа на стр заявок

Browse Source
This commit is contained in:
Nastya 2024-09-23 22:08:21 +03:00
parent 8f401fe936
commit 92fc18b543
6 changed files with 162 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -1 +1,2 @@
1.0.1 Страница заявок корректно отображает мультиответ
1.0.0 Добавлены фичи "мультиответ", "перенос строки в своём ответе", "свой ответ", "плейсхолдер своего ответа"

2
src/pages/QuizAnswersPage/AnswerList.tsx
View File

@ -1,7 +1,7 @@
import { FC } from "react";
import { Box, Typography } from "@mui/material";
import { DateDefinition, TimeDefinition } from "./helper";
import { CardAnswer } from "./CardAnswer";
import { CardAnswer } from "./cardAnswers/CardAnswer";
import { Result } from "@root/results/store";
interface AnswerListProps {

58
src/pages/QuizAnswersPage/CardAnswer.tsx → src/pages/QuizAnswersPage/cardAnswers/CardAnswer.tsx
View File

@ -1,9 +1,9 @@
import { ArrowDownIcon } from "@icons/questionsPage/ArrowDownIcon";
import { Box, IconButton, Link, Typography, useMediaQuery, useTheme } from "@mui/material";
import { FC, MouseEvent, useState } from "react";
import { ContactIcon } from "./icons/ContactIcon";
import { MessageIcon } from "./icons/MessageIcon";
import { PhoneIcon } from "./icons/PhoneIcon";
import { ContactIcon } from "../icons/ContactIcon";
import { MessageIcon } from "../icons/MessageIcon";
import { PhoneIcon } from "../icons/PhoneIcon";
import { DeleteIcon } from "@icons/questionsPage/deleteIcon";
import { deleteResult, obsolescenceResult } from "@root/results/actions";
@ -12,10 +12,14 @@ import { useQuizStore } from "@root/quizes/store";
import { useQuestionsStore } from "@root/questions/store";
import AddressIcon from "@icons/ContactFormIcon/AddressIcon";
import { DeleteModal } from "./DeleteModal";
import { DeleteModal } from "../DeleteModal";
import type { AnyTypedQuizQuestion } from "@frontend/squzanswerer";
import { useCurrentQuiz } from "@/stores/quizes/hooks";
import { ListOfOptionsCardAnswer } from "./ListOfOptionsCardAnswer";
import { ListOfImagesCardAnswer } from "./ListOfImagesCardAnswer";
import { timewebContentFile, timewebContent } from "./helper"
interface CardAnswerProps {
isNew: boolean;
@ -312,6 +316,26 @@ export const CardAnswer: FC<CardAnswerProps> = ({
qid = quest[i].backendId
}
}
if (answer?.Version !== undefined) {
if (typeOuestion === "variant" || typeOuestion === "emoji") return (
<ListOfOptionsCardAnswer
title={titleQuestion || ""}
answer={answer.content}
id={id}
/>
)
if (typeOuestion === "varimg" || typeOuestion === "images" && answer.content.includes("Image")) return (
<ListOfImagesCardAnswer
title={titleQuestion || ""}
answer={answer.content}
id={id}
quizId={quiz?.id}
questionId={qid}
/>
)
}
return (
<Box
key={answer.id}
@ -325,7 +349,7 @@ export const CardAnswer: FC<CardAnswerProps> = ({
<Typography sx={{ fontSize: "18px", color: "#9A9AAF" }}>
{id + 1}. {titleQuestion}.
</Typography>
{typeOuestion === "file" && (
{typeOuestion === "file" && answer.content && (
<Link
download
href={timewebContentFile(quiz?.qid, answer.content, qid)}
@ -366,6 +390,7 @@ export const CardAnswer: FC<CardAnswerProps> = ({
{!(typeOuestion === "file" || typeOuestion === "images" || typeOuestion === "varimg") && (
<Typography sx={{ fontSize: "18px" }}>{answer.content}</Typography>
)}
</Box>
);
})}
@ -433,26 +458,3 @@ export const CardAnswer: FC<CardAnswerProps> = ({
</>
);
};
function timewebContentFile(editQuizId: string, content: string, qid: string) {
if (content.includes("<img")) {
//Старая версия: контент лежит в теге
//<img style="width:100%; max-width:250px; max-height:250px" src="https://s3.timeweb.cloud/3c580be9-30c7959dc17b/squizimages/03520c507b35e8/cq39gn7o73evdd30"/>
return content.split("<")[1].split('src="')[1].split('"/>')[0]
}
//Новая версия: контент просто записан с указанием расширения файла
return `https://s3.timeweb.cloud/3c580be9-cf31f296-d055-49cf-b39e-30c7959dc17b/squizanswer/${editQuizId}/${qid}/${content}`
}
function timewebContent(editQuizId: string, content: string, qid: string) {
if (content.includes("<img")) {
//Старая версия: контент лежит в теге
//<img style="width:100%; max-width:250px; max-height:250px" src="https://s3.timeweb.cloud/3c580be9-30c7959dc17b/squizimages/03520c507b35e8/cq39gn7o73evdd30"/>
return content.split("<")[1].split('src="')[1].split('"/>')[0]
}
if (content.includes(`"Image"`)) {
const data = JSON.parse(content)
return data.Image
}
//Новая версия: контент просто записан с указанием расширения файла(устарело)
return `https://s3.timeweb.cloud/3c580be9-cf31f296-d055-49cf-b39e-30c7959dc17b/squizimages/${editQuizId}/${content}`
}

55
src/pages/QuizAnswersPage/cardAnswers/ListOfImagesCardAnswer.tsx Normal file
View File

@ -0,0 +1,55 @@
import { Box, Typography } from "@mui/material";
import { splitUserText, timewebContent } from "./helper";
interface Props {
title: string;
id: number;
answer: string;
quizId: string;
questionId: string;
}
export const ListOfImagesCardAnswer = ({
title,
id,
answer,
quizId,
questionId,
}: Props) => {
console.log('"' + answer + '"')
console.log(splitUserText('"' + answer + '"'))
return <Box
sx={{
display: "flex",
alignItems: "start",
gap: "13px",
}}
onClick={(e) => e.stopPropagation()}
>
<Typography sx={{ fontSize: "18px", color: "#9A9AAF" }}>
{id + 1}. {title}.
</Typography>
<Box>
{
splitUserText(answer)
.filter(text => text.length)
.map(text => {
const { Image, Description } = JSON.parse(text)
console.log("Image, Descripton")
console.log(Image, Description)
console.log("Image, Descripton")
return (<>
<img
width={40}
height={40}
src={timewebContent(quizId, Image, questionId)}
/>
<Typography sx={{ fontSize: "18px", wordBreak: "break-word" }}>{Description}</Typography>
</>)
})
}
</Box>
</Box>
};

37
src/pages/QuizAnswersPage/cardAnswers/ListOfOptionsCardAnswer.tsx Normal file
View File

@ -0,0 +1,37 @@
import { Box, Typography } from "@mui/material";
import { splitUserText } from "./helper";
interface Props {
title: string;
id: number;
answer: string;
}
export const ListOfOptionsCardAnswer = ({
title,
id,
answer
}: Props) => {
return <Box
sx={{
display: "flex",
alignItems: "start",
gap: "13px",
}}
onClick={(e) => e.stopPropagation()}
>
<Typography sx={{ fontSize: "18px", color: "#9A9AAF" }}>
{id + 1}. {title}.
</Typography>
<Box>
{
splitUserText(answer)
.filter(text => text.length)
.map(text => <Typography sx={{ fontSize: "18px", wordBreak: "break-word" }}>{text}</Typography>)
}
</Box>
</Box>
};

38
src/pages/QuizAnswersPage/cardAnswers/helper.ts Normal file
View File

@ -0,0 +1,38 @@
export function splitUserText(input: string) {
// Регулярное выражение для поиска текста в обратных кавычках
const regex = /`([^`]*)`/g; // Изменено на ([^]*) для захвата пустых строк
let result = [];
let match;
// Найти все совпадения
while ((match = regex.exec(input)) !== null) {
// Добавляем найденный текст (включая пустые строки) в массив
result.push(match[1]);
}
return result;
}
export function timewebContentFile(editQuizId: string, content: string, qid: string) {
if (content.includes("<img")) {
//Старая версия: контент лежит в теге
//<img style="width:100%; max-width:250px; max-height:250px" src="https://s3.timeweb.cloud/3c580be9-30c7959dc17b/squizimages/03520c507b35e8/cq39gn7o73evdd30"/>
return content.split("<")[1].split('src="')[1].split('"/>')[0]
}
//Новая версия: контент просто записан с указанием расширения файла
return `https://s3.timeweb.cloud/3c580be9-cf31f296-d055-49cf-b39e-30c7959dc17b/squizanswer/${editQuizId}/${qid}/${content}`
}
export function timewebContent(editQuizId: string, content: string, qid: string) {
if (content.includes("<img")) {
//Старая версия: контент лежит в теге
//<img style="width:100%; max-width:250px; max-height:250px" src="https://s3.timeweb.cloud/3c580be9-30c7959dc17b/squizimages/03520c507b35e8/cq39gn7o73evdd30"/>
return content.split("<")[1].split('src="')[1].split('"/>')[0]
} else if (content.includes(`"Image"`)) {
const data = JSON.parse(content)
return data.Image
} else {
return content
}
//Новая версия: контент просто записан с указанием расширения файла(устарело)
return `https://s3.timeweb.cloud/3c580be9-cf31f296-d055-49cf-b39e-30c7959dc17b/squizimages/${editQuizId}/${content}`
}