Commit 819cc64b authored by Jiwon Yoon's avatar Jiwon Yoon
Browse files

ui수정

parent e23d0af8
import React, { useState } from "react"; import React, { useState } from "react";
import { AnswerProps, AnswerQuestionType, EssayType } from "../types"; import { AnswerProps } from "../types";
export const AEssayForm = ({ element, answerQuestion }: AnswerProps) => { export const AEssayForm = ({ element, answerQuestion }: AnswerProps) => {
const [answer, setAnswer] = useState(""); const [answer, setAnswer] = useState("");
......
...@@ -160,31 +160,17 @@ Props) => { ...@@ -160,31 +160,17 @@ Props) => {
style={{ borderColor: isSaved ? "#0A8A8A" : "red" }} style={{ borderColor: isSaved ? "#0A8A8A" : "red" }}
className="flex flex-col container w-4/5 h-auto border-2 items-center m-3 py-2 rounded-lg" className="flex flex-col container w-4/5 h-auto border-2 items-center m-3 py-2 rounded-lg"
> >
<div className="flex h-16 w-full place-content-between items-center"> <div className="flex h-16 w-full place-content-center items-center">
<input <input
type="text" type="text"
name="title" name="title"
id={question._id} id={question._id}
className="text-xl font-bold ml-6 border-b-2 w-1/2" className="text-xl font-bold border-b-2 w-11/12"
placeholder={"Question Title"} placeholder={"Question Title"}
value={question.title} value={question.title}
onChange={handleQuestionInfo} onChange={handleQuestionInfo}
disabled={isSaved} disabled={isSaved}
></input> ></input>
<select
id={question._id}
name="type"
onChange={handleSelect}
disabled={isSaved}
value={question.type}
className="w-32 md: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"
>
{Array.from(QUESTION_TYPES.entries()).map(([key, value]) => (
<option key={key} id={question._id} value={key}>
{value}
</option>
))}
</select>
</div> </div>
<div className="flex w-full justify-center"> <div className="flex w-full justify-center">
<input <input
...@@ -200,38 +186,58 @@ Props) => { ...@@ -200,38 +186,58 @@ Props) => {
</div> </div>
{getContent(question)} {getContent(question)}
<div className="place-self-end py-2"> <div className="flex flex-row place-content-between w-11/12 py-2">
<input <select
type="checkbox" id={question._id}
id="isRequired" name="type"
value="isRequired" onChange={handleSelect}
onChange={handleRequired}
disabled={isSaved} disabled={isSaved}
checked={question.isRequired} value={question.type}
/> className="w-32 h-10 md:w-36 bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-themeColor"
<label htmlFor="isRequired" className="px-1"> >
필수 {Array.from(QUESTION_TYPES.entries()).map(([key, value]) => (
</label> <option key={key} id={question._id} value={key}>
{isSaved ? ( {value}
<> </option>
<button type="button" className="px-1" onClick={handleDelete}> ))}
삭제 </select>
</button> <div className="place-self-center">
<button type="button" className="px-1" onClick={handleEditClick}> <input
수정 type="checkbox"
</button> id="isRequired"
</> value="isRequired"
) : ( onChange={handleRequired}
<> disabled={isSaved}
<button type="button" className="px-1" onClick={onCancel}> checked={question.isRequired}
취소 />
</button> <label htmlFor="isRequired" className="px-1">
필수
</label>
{isSaved ? (
<>
<button type="button" className="px-1" onClick={handleDelete}>
삭제
</button>
<button type="button" className="px-1" onClick={handleEditClick}>
수정
</button>
</>
) : (
<>
<button type="button" className="px-1" onClick={onCancel}>
취소
</button>
<button type="button" className="px-1" onClick={handleEditComplete}> <button
확인 type="button"
</button> className="px-1"
</> onClick={handleEditComplete}
)} >
확인
</button>
</>
)}
</div>
</div> </div>
</div> </div>
); );
......
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