Question.tsx 1.82 KB
Newer Older
Jiwon Yoon's avatar
Jiwon Yoon committed
1
import React, { useState } from "react";
Jiwon Yoon's avatar
Jiwon Yoon committed
2
3
import { BasicQuestionType } from "./CreateSurveyFormPage";
import { QEssay } from "./QEssay";
Jiwon Yoon's avatar
Jiwon Yoon committed
4
5
import { QCheckbox } from "./QCheckbox";
import { QRadio } from "./QRadio";
Jiwon Yoon's avatar
Jiwon Yoon committed
6
7
import { QDropdown } from "./QDropdown";
import { QFile } from "./QFile";
8

Jiwon Yoon's avatar
Jiwon Yoon committed
9
10
11
12
type Props = {
  questionList: BasicQuestionType[];
  QuestionListChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
  addQuestion: () => void;
Jiwon Yoon's avatar
Jiwon Yoon committed
13
};
14

Jiwon Yoon's avatar
Jiwon Yoon committed
15
16
17
18
19
export const Question = ({
  questionList,
  QuestionListChange,
  addQuestion,
}: Props) => {
Jiwon Yoon's avatar
Jiwon Yoon committed
20
21
22
23
24
  return (
    <>
      {console.log(questionList)}
      {questionList.map((element) => {
        switch (element.type) {
Jiwon Yoon's avatar
Jiwon Yoon committed
25
          case "essay":
Jiwon Yoon's avatar
Jiwon Yoon committed
26
            return (
Jiwon Yoon's avatar
Jiwon Yoon committed
27
              <QEssay
Jiwon Yoon's avatar
Jiwon Yoon committed
28
29
30
31
32
33
34
35
36
37
38
39
                element={element}
                QuestionListChange={QuestionListChange}
              />
            );
          case "radio":
            return (
              <QRadio
                element={element}
                QuestionListChange={QuestionListChange}
              />
            );
          case "checkbox":
Jiwon Yoon's avatar
Jiwon Yoon committed
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
            return (
              <QCheckbox
                element={element}
                QuestionListChange={QuestionListChange}
              />
            );
          case "dropdown":
            return (
              <QDropdown
                element={element}
                QuestionListChange={QuestionListChange}
              />
            );
          case "file":
            return (
              <QFile
                element={element}
                QuestionListChange={QuestionListChange}
              />
            );
Jiwon Yoon's avatar
Jiwon Yoon committed
60

Jiwon Yoon's avatar
Jiwon Yoon committed
61
62
63
64
          default:
            break;
        }
      })}
Jiwon Yoon's avatar
Jiwon Yoon committed
65
66
67
      <div className="flex w-4/5 content-center justify-center border-2 border-black h-8 mt-3">
        <button onClick={addQuestion}>질문 추가</button>
      </div>
Jiwon Yoon's avatar
Jiwon Yoon committed
68
69
70
    </>
  );
};