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
8b54a1b3
Commit
8b54a1b3
authored
Jul 05, 2022
by
Jiwon Yoon
Browse files
QRating
parent
551f6358
Changes
3
Hide whitespace changes
Inline
Side-by-side
frontend/src/CreateSurveyForm/CreateSurveyFormPage.tsx
View file @
8b54a1b3
...
...
@@ -38,8 +38,10 @@ export interface FileType extends BasicQuestionType {
}
export
interface
RatingType
extends
BasicQuestionType
{
content
:
{
rateMin
:
number
;
rateMax
:
number
;
rateValues
:
{
value
:
number
;
text
:
string
;
}[];
minRateDescription
:
string
;
maxRateDescription
:
string
;
};
...
...
@@ -105,8 +107,11 @@ const RatingQ: RatingType = {
isRequired
:
false
,
comment
:
"
질문에 대한 설명을 입력해주세요
"
,
content
:
{
rateMin
:
0
,
rateMax
:
10
,
rateValues
:
[
{
value
:
1
,
text
:
"
1
"
},
{
value
:
2
,
text
:
"
2
"
},
{
value
:
3
,
text
:
"
3
"
},
],
minRateDescription
:
"
가장 낮음
"
,
maxRateDescription
:
"
가장 높음
"
,
},
...
...
frontend/src/CreateSurveyForm/QRating.tsx
View file @
8b54a1b3
import
React
from
"
react
"
;
import
{
RatingType
}
from
"
./CreateSurveyFormPage
"
;
type
Props
=
{
element
:
RatingType
;
QuestionListChange
:
(
e
:
React
.
ChangeEvent
<
HTMLInputElement
>
)
=>
void
;
// deleteValue: (e: React.MouseEvent<HTMLButtonElement>) => void;
};
export
const
QRating
=
({
element
,
QuestionListChange
}:
Props
)
=>
{
return
(
<
div
className
=
"flex flex-col container w-4/5 h-auto border-2 border-themeColor items-center m-3 py-2"
>
<
div
className
=
"flex h-16 w-full place-content-between items-center"
>
<
input
type
=
"text"
name
=
"title"
id
=
{
element
.
id
}
className
=
"text-xl font-bold ml-6 border-b-2 w-1/2"
placeholder
=
{
element
.
title
}
onChange
=
{
QuestionListChange
}
></
input
>
<
select
id
=
{
element
.
id
}
className
=
"w-36 bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-themeColor w-full mr-3 p-2.5"
>
<
option
>
질문종류
</
option
>
<
option
value
=
"essay"
>
주관식
</
option
>
<
option
value
=
"radio"
>
객관식
</
option
>
<
option
value
=
"dropdown"
>
드롭다운(객관식)
</
option
>
<
option
value
=
"checkbox"
>
체크박스(객관식)
</
option
>
<
option
value
=
"file"
>
파일업로드
</
option
>
<
option
value
=
"rating"
selected
>
선형
</
option
>
<
option
value
=
"grid"
>
그리드
</
option
>
<
option
value
=
"date"
>
날짜
</
option
>
</
select
>
</
div
>
<
div
className
=
"flex w-full justify-center"
>
<
input
type
=
"text"
name
=
"comment"
id
=
{
element
.
id
}
className
=
"border w-11/12"
placeholder
=
"질문에 대한 설명을 입력해주세요"
onChange
=
{
QuestionListChange
}
></
input
>
</
div
>
<
div
className
=
"flex place-content-between items-center p-5"
>
<
input
name
=
"minRateDescription"
id
=
{
element
.
id
}
className
=
"border-b-2 text-center"
size
=
{
10
}
placeholder
=
{
element
.
content
.
minRateDescription
}
></
input
>
{
element
.
content
.
rateValues
.
map
((
e
)
=>
(
<
input
name
=
"text"
id
=
{
element
.
id
}
type
=
"text"
className
=
"border border-black rounded-full py-1 m-2 text-center"
size
=
{
1
}
placeholder
=
{
e
.
text
}
></
input
>
))
}
<
input
name
=
"maxRateDescription"
id
=
{
element
.
id
}
className
=
"border-b-2 text-center"
size
=
{
10
}
placeholder
=
{
element
.
content
.
maxRateDescription
}
></
input
>
</
div
>
<
div
>
<
button
// type="button"
name
=
"rateValues"
id
=
{
element
.
id
}
className
=
"border border-red-500 rounded mx-2 px-2"
// onClick={deleteValue}
>
삭제
</
button
>
<
button
className
=
"border border-blue-500 rounded mx-2 px-2"
>
추가
</
button
>
</
div
>
<
div
className
=
"flex w-full justify-end py-2"
>
<
button
className
=
"w-1/12"
>
필수
</
button
>
<
button
className
=
"w-1/12"
>
옵션
</
button
>
<
button
className
=
"w-1/12"
>
삭제
</
button
>
</
div
>
</
div
>
);
};
frontend/src/CreateSurveyForm/Question.tsx
View file @
8b54a1b3
...
...
@@ -5,6 +5,7 @@ import { QCheckbox } from "./QCheckbox";
import
{
QRadio
}
from
"
./QRadio
"
;
import
{
QDropdown
}
from
"
./QDropdown
"
;
import
{
QFile
}
from
"
./QFile
"
;
import
{
QRating
}
from
"
./QRating
"
;
type
Props
=
{
questionList
:
BasicQuestionType
[];
...
...
@@ -57,7 +58,13 @@ export const Question = ({
QuestionListChange
=
{
QuestionListChange
}
/>
);
case
"
rating
"
:
return
(
<
QRating
element
=
{
element
}
QuestionListChange
=
{
QuestionListChange
}
/>
);
default
:
break
;
}
...
...
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