Commit 4f3d7a8c authored by Yoon, Daeki's avatar Yoon, Daeki 😅
Browse files

answer survey 로직 변경

parent be1ba639
import React, { useState, useRef, useEffect } from "react";
import { IQuestionData } from "../types";
// import {
// REssay,
// RCheckbox,
// RRadio,
// RDropdown,
// RFile,
// RRating,
// RDate,
// } from "../forms";
import { getResultElementByType } from "../helpers/question.helper";
type AccordionProps = {
......@@ -20,36 +11,14 @@ export const Accordion = ({ question }: AccordionProps) => {
const [height, setHeight] = useState<string>("0px");
const contentElement = useRef<HTMLDivElement>(null);
const HandleOpening = () => {
const handleOpening = () => {
setOpened(!isOpened);
setHeight(!isOpened ? `${contentElement.current?.scrollHeight}px` : "0px");
};
// function getContent(question: IQuestionData) {
// switch (question.type) {
// case "singletext":
// return <REssay question={question} />;
// case "radio":
// return <RRadio question={question} />;
// case "checkbox":
// return <RCheckbox question={question} />;
// case "dropdown":
// return <RDropdown question={question} />;
// case "file":
// return <RFile question={question} />;
// case "rating":
// return <RRating question={question} />;
// case "date":
// return <RDate question={question} />;
// default:
// return <></>;
// }
// }
// console.log(question);
return (
<div className="p-1">
<div onClick={HandleOpening}>
<div onClick={handleOpening}>
<div
className={
"bg-themeColor rounded-r-lg p-4 flex justify-between text-white"
......
import React, { useEffect, useState } from "react";
import React, { FormEvent, useEffect, useState } from "react";
import { useParams } from "react-router-dom";
import { surveyApi } from "../apis";
import { answerApi, surveyApi } from "../apis";
import { catchErrors } from "../helpers";
import { SpinnerIcon } from "../icons";
import { ISurvey } from "../types";
import { IAnswer, ISurvey } from "../types";
import { AQuestion } from "./AQuestion";
export const AnswerSurvey = () => {
let { surveyId } = useParams<{ surveyId: string }>();
const [survey, setSurvey] = useState<ISurvey>();
const [answers, setAnswers] = useState<IAnswer[]>([]);
const [error, setError] = useState("");
useEffect(() => {
surveyId && getSurvey(surveyId);
}, [surveyId]);
const handleSubmit = () => {};
const handleSubmit = async (e: FormEvent) => {
e.preventDefault();
console.log("answers:", answers);
const needAnswer = answers.some((answer) => !answer.requiredCheck);
if (needAnswer) {
alert("필수질문에 응답하셔야 합니다.");
return;
}
if (!survey) {
return;
}
try {
const fileAnswers = answers.filter(
(answer) => answer.question.type === "file"
);
const otherAnswers = answers.filter(
(answer) => answer.question.type !== "file"
);
console.log("file answers:", fileAnswers);
console.log("other answers:", otherAnswers);
const forms = fileAnswers.map((answer) => {
const formData = new FormData();
formData.append("surveyId", survey._id!);
formData.append("questionId", answer.question._id!);
formData.append("guestId", "guest");
const files: FileList = answer.content;
[...files].map((f) => {
formData.append("uploadFiles", f);
});
return formData;
});
setError("");
const results = await answerApi.save(
otherAnswers.map((answer) => ({
questionId: answer.question._id!,
surveyId: survey._id!,
questId: "guest",
content: answer.content,
}))
);
console.log("results:", results);
const result = await Promise.all(
forms.map(async (form) => await answerApi.saveForm(form))
);
console.log("result:", result);
// const newAnswer: IAnswer = await answerApi.saveAnswers(formData);
// console.log(newAnswer);
// sessionStorage.setItem(`survey_${surveyId}`, surveyId ?? "");
// navigate("/survey/complete", { replace: false });
} catch (error) {
catchErrors(error, setError);
} finally {
// setLoading(false);
}
};
async function getSurvey(surveyId: string) {
try {
setError("");
const survey: any = await surveyApi.getSurveyById(surveyId);
const survey: ISurvey = await surveyApi.getSurveyById(surveyId);
console.log("survey가져옴ㅎㅎ", survey);
// answerSurvey.current._id = survey._id;
// answerSurvey.current.questions = survey.questions;
const answers = survey.questions.map((question) => {
return {
surveyId: survey._id!,
question: question,
requiredCheck: false,
content: null,
};
});
setSurvey(survey);
setAnswers(answers);
// setSuccess(true);
} catch (error) {
catchErrors(error, setError);
......@@ -47,16 +117,15 @@ export const AnswerSurvey = () => {
<div className="flex flex-col container place-items-center mt-4">
<p className="font-bold text-4xl text-center m-2">{survey.title}</p>
<p className="font-bold text-1xl text-center m-2">{survey.comment}</p>
{/* {survey.questions.map((question, index) => {
{answers.map((answer) => {
return (
<AQuestion
key={question._id}
question={question}
answerQuestion={answerSurvey.current.questions[index]}
addFiles={addFiles}
></AQuestion>
key={answer.question._id}
question={answer.question}
answer={answer}
/>
);
})} */}
})}
<div>
<button
type="submit"
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment