Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
survey
Commits
4f3d7a8c
Commit
4f3d7a8c
authored
Aug 17, 2022
by
Yoon, Daeki
😅
Browse files
answer survey 로직 변경
parent
be1ba639
Changes
2
Show whitespace changes
Inline
Side-by-side
frontend/src/surveys/Accordion.tsx
View file @
4f3d7a8c
import
React
,
{
useState
,
useRef
,
useEffect
}
from
"
react
"
;
import
React
,
{
useState
,
useRef
,
useEffect
}
from
"
react
"
;
import
{
IQuestionData
}
from
"
../types
"
;
import
{
IQuestionData
}
from
"
../types
"
;
// import {
// REssay,
// RCheckbox,
// RRadio,
// RDropdown,
// RFile,
// RRating,
// RDate,
// } from "../forms";
import
{
getResultElementByType
}
from
"
../helpers/question.helper
"
;
import
{
getResultElementByType
}
from
"
../helpers/question.helper
"
;
type
AccordionProps
=
{
type
AccordionProps
=
{
...
@@ -20,36 +11,14 @@ export const Accordion = ({ question }: AccordionProps) => {
...
@@ -20,36 +11,14 @@ export const Accordion = ({ question }: AccordionProps) => {
const
[
height
,
setHeight
]
=
useState
<
string
>
(
"
0px
"
);
const
[
height
,
setHeight
]
=
useState
<
string
>
(
"
0px
"
);
const
contentElement
=
useRef
<
HTMLDivElement
>
(
null
);
const
contentElement
=
useRef
<
HTMLDivElement
>
(
null
);
const
H
andleOpening
=
()
=>
{
const
h
andleOpening
=
()
=>
{
setOpened
(
!
isOpened
);
setOpened
(
!
isOpened
);
setHeight
(
!
isOpened
?
`
${
contentElement
.
current
?.
scrollHeight
}
px`
:
"
0px
"
);
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
(
return
(
<
div
className
=
"p-1"
>
<
div
className
=
"p-1"
>
<
div
onClick
=
{
H
andleOpening
}
>
<
div
onClick
=
{
h
andleOpening
}
>
<
div
<
div
className
=
{
className
=
{
"
bg-themeColor rounded-r-lg p-4 flex justify-between text-white
"
"
bg-themeColor rounded-r-lg p-4 flex justify-between text-white
"
...
...
frontend/src/surveys/AnswerSurvey.tsx
View file @
4f3d7a8c
import
React
,
{
useEffect
,
useState
}
from
"
react
"
;
import
React
,
{
FormEvent
,
useEffect
,
useState
}
from
"
react
"
;
import
{
useParams
}
from
"
react-router-dom
"
;
import
{
useParams
}
from
"
react-router-dom
"
;
import
{
surveyApi
}
from
"
../apis
"
;
import
{
answerApi
,
surveyApi
}
from
"
../apis
"
;
import
{
catchErrors
}
from
"
../helpers
"
;
import
{
catchErrors
}
from
"
../helpers
"
;
import
{
SpinnerIcon
}
from
"
../icons
"
;
import
{
SpinnerIcon
}
from
"
../icons
"
;
import
{
ISurvey
}
from
"
../types
"
;
import
{
IAnswer
,
ISurvey
}
from
"
../types
"
;
import
{
AQuestion
}
from
"
./AQuestion
"
;
export
const
AnswerSurvey
=
()
=>
{
export
const
AnswerSurvey
=
()
=>
{
let
{
surveyId
}
=
useParams
<
{
surveyId
:
string
}
>
();
let
{
surveyId
}
=
useParams
<
{
surveyId
:
string
}
>
();
const
[
survey
,
setSurvey
]
=
useState
<
ISurvey
>
();
const
[
survey
,
setSurvey
]
=
useState
<
ISurvey
>
();
const
[
answers
,
setAnswers
]
=
useState
<
IAnswer
[]
>
([]);
const
[
error
,
setError
]
=
useState
(
""
);
const
[
error
,
setError
]
=
useState
(
""
);
useEffect
(()
=>
{
useEffect
(()
=>
{
surveyId
&&
getSurvey
(
surveyId
);
surveyId
&&
getSurvey
(
surveyId
);
},
[
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
)
{
async
function
getSurvey
(
surveyId
:
string
)
{
try
{
try
{
setError
(
""
);
setError
(
""
);
const
survey
:
an
y
=
await
surveyApi
.
getSurveyById
(
surveyId
);
const
survey
:
ISurve
y
=
await
surveyApi
.
getSurveyById
(
surveyId
);
console
.
log
(
"
survey가져옴ㅎㅎ
"
,
survey
);
console
.
log
(
"
survey가져옴ㅎㅎ
"
,
survey
);
// answerSurvey.current._id = survey._id;
const
answers
=
survey
.
questions
.
map
((
question
)
=>
{
// answerSurvey.current.questions = survey.questions;
return
{
surveyId
:
survey
.
_id
!
,
question
:
question
,
requiredCheck
:
false
,
content
:
null
,
};
});
setSurvey
(
survey
);
setSurvey
(
survey
);
setAnswers
(
answers
);
// setSuccess(true);
// setSuccess(true);
}
catch
(
error
)
{
}
catch
(
error
)
{
catchErrors
(
error
,
setError
);
catchErrors
(
error
,
setError
);
...
@@ -47,16 +117,15 @@ export const AnswerSurvey = () => {
...
@@ -47,16 +117,15 @@ export const AnswerSurvey = () => {
<
div
className
=
"flex flex-col container place-items-center mt-4"
>
<
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-4xl text-center m-2"
>
{
survey
.
title
}
</
p
>
<
p
className
=
"font-bold text-1xl text-center m-2"
>
{
survey
.
comment
}
</
p
>
<
p
className
=
"font-bold text-1xl text-center m-2"
>
{
survey
.
comment
}
</
p
>
{
/* {survey.questions.map((question, index
) => {
{
answers
.
map
((
answer
)
=>
{
return
(
return
(
<
AQuestion
<
AQuestion
key={question._id}
key
=
{
answer
.
question
.
_id
}
question={question}
question
=
{
answer
.
question
}
answerQuestion={answerSurvey.current.questions[index]}
answer
=
{
answer
}
addFiles={addFiles}
/>
></AQuestion>
);
);
})}
*/
}
})
}
<
div
>
<
div
>
<
button
<
button
type
=
"submit"
type
=
"submit"
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment