Commit da97d437 authored by Lee SeoYeon's avatar Lee SeoYeon
Browse files

0708

parent 6c927ef1
......@@ -15,19 +15,28 @@ export interface EssayType extends BasicQuestionType {}
export interface RadioType extends BasicQuestionType {
content: {
hasOther: boolean;
choices: string[];
choices: {
value: number;
text: string;
}[];
otherText: string;
};
}
export interface CheckboxType extends BasicQuestionType {
content: {
choices: string[];
choices: {
value: number;
text: string;
}[];
maxCount: number;
};
}
export interface DropdownType extends BasicQuestionType {
content: {
choices: string[];
choices: {
value: number;
text: string;
}[];
hasNone: boolean;
};
}
......@@ -39,7 +48,7 @@ export interface FileType extends BasicQuestionType {
}
export interface RatingType extends BasicQuestionType {
content: {
rateValues: {
choices: {
value: number;
text: string;
}[];
......@@ -65,7 +74,11 @@ const RadioQ: RadioType = {
content: {
hasOther: false,
otherText: "",
choices: ["radio1", "radio2", "radio3"],
choices: [
{ value: 1, text: "radio1" },
{ value: 2, text: "radio2" },
{ value: 3, text: "radio3" },
],
},
};
const CheckboxQ: CheckboxType = {
......@@ -75,7 +88,11 @@ const CheckboxQ: CheckboxType = {
isRequired: false,
comment: "질문에 대한 설명을 입력해주세요",
content: {
choices: ["check1", "check2", "check3"],
choices: [
{ value: 1, text: "check1" },
{ value: 2, text: "check2" },
{ value: 3, text: "check3" },
],
maxCount: 2,
},
};
......@@ -86,7 +103,11 @@ const DropdownQ: DropdownType = {
isRequired: false,
comment: "질문에 대한 설명을 입력해주세요",
content: {
choices: ["drop1", "drop2", "drop3"],
choices: [
{ value: 1, text: "drop1" },
{ value: 2, text: "drop2" },
{ value: 3, text: "drop3" },
],
hasNone: false,
},
};
......@@ -108,7 +129,7 @@ const RatingQ: RatingType = {
isRequired: false,
comment: "질문에 대한 설명을 입력해주세요",
content: {
rateValues: [
choices: [
{ value: 1, text: "1" },
{ value: 2, text: "2" },
{ value: 3, text: "3" },
......
......@@ -49,7 +49,7 @@ export const QCheckbox = ({ element }: Props) => {
></input>
</div>
<div id="commentarea" className="flex mt-4">
{element.content.choices.map((e: string) => (
{element.content.choices.map((e: any) => (
<div>
<input type="checkbox" checked={false}></input>
<input
......
......@@ -47,7 +47,7 @@ export const QDropdown = ({ element }: Props) => {
></input>
</div>
<div id="commentarea" className="flex mt-4">
{element.content.choices.map((e: string) => (
{element.content.choices.map((e: any) => (
<div>
<input type="checkbox" checked={false}></input>
<input
......
......@@ -46,7 +46,7 @@ export const QRadio = ({ element }: Props) => {
></input>
</div>
<div className="flex mt-4">
{element.content.choices.map((e: string, index: number) => (
{element.content.choices.map((e: any, index: number) => (
<div>
<input
type="radio"
......
......@@ -56,7 +56,7 @@ export const QRating = ({ element }: Props) => {
size={10}
placeholder={element.content.minRateDescription}
></input>
{element.content.rateValues.map((e) => (
{element.content.choices.map((e) => (
<input
name="text"
id={element._id}
......
......@@ -36,11 +36,9 @@ export const Login = () => {
}
return (
<div className="flex justify-center mt-3">
<form
onSubmit={handleSubmit}
className="flex flex-col space-y-4 mt-5 text-xl font-bold"
>
<div className="flex flex-col items-center mt-5">
<div className="text-2xl mt-5">로그인</div>
<form onSubmit={handleSubmit} className="flex flex-col mt-3 w-80">
<label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
이메일
</label>
......@@ -75,7 +73,7 @@ export const Login = () => {
<button
type="submit"
disabled={loading ? true : false}
className="bg-themeColor text-white border rounded w-100 py-2 px-3 mt-3"
className="bg-themeColor text-white border rounded w-100 py-2 px-3 mt-5"
>
{loading && (
<SpinnerIcon className="animate-spin h-5 w-5 mr-1 text-white" />
......
......@@ -67,9 +67,9 @@ export const SignUp = () => {
}
return (
<div className="flex flex-col items-center mt-3">
<div className="text-2xl">회원 가입</div>
<form onSubmit={handleSubmit} className="flex flex-col mt-5 w-80">
<div className="flex flex-col items-center mt-5">
<div className="text-2xl mt-5">회원가입</div>
<form onSubmit={handleSubmit} className="flex flex-col mt-3 w-80">
<label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
이름
</label>
......
import React from "react";
import React, { InputHTMLAttributes } from "react";
export const SurveyForm = () => (
export const SurveyForm = () => {
return (
<div className="flex flex-col place-items-center">
<div className="flex flex-col container place-items-center mt-4">
<form className="font-bold text-4xl text-center m-2">설문지 제목</form>
......@@ -12,7 +13,9 @@ export const SurveyForm = () => (
></textarea>
<div className="flex flex-col container w-4/5 h-auto border-2 border-themeColor items-center m-3 py-3">
<div className="flex flexgi-row h-16 w-full place-content-between items-center">
<form className="text-xl font-bold ml-6 w-1/2">Q1. 첫번째 질문</form>
<form className="text-xl font-bold ml-6 w-1/2">
Q1. 첫번째 질문
</form>
</div>
<form className="border w-11/12 my-3">설문조사 설명</form>
<input
......@@ -23,14 +26,92 @@ export const SurveyForm = () => (
</div>
<div className="flex flex-col container w-4/5 h-auto border-2 border-themeColor items-center m-3 py-3">
<div className="flex flexgi-row h-16 w-full place-content-between items-center">
<form className="text-xl font-bold ml-6 w-1/2">Q1. 첫번째 질문</form>
<form className="text-xl font-bold ml-6 w-1/2">
Q2. 두번째 질문
</form>
</div>
<form className="border w-11/12 my-4">설문조사 설명</form>
<div className="flex flex-row items-center m-3">
<div className="mb-4 mx-3">
<input
className="border w-11/12 h-36 my-3"
type="text"
placeholder="설문조사 답변"
></input>
id="default-checkbox"
type="checkbox"
className="w-5 h-5 mt-3 text-blue-600 bg-gray-100 rounded border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label className="ml-2 text-lg font-medium">First checkbox</label>
</div>
<div className="mb-4 mx-3">
<input
id="default-checkbox"
type="checkbox"
className="w-5 h-5 mt-3 text-blue-600 bg-gray-100 rounded border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label className="ml-2 text-lg font-medium">
Second checkbox
</label>
</div>
<div className="mb-4 mx-3">
<input
id="default-checkbox"
type="checkbox"
value=""
className="w-5 h-5 mt-3 text-blue-600 bg-gray-100 rounded border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label className="ml-2 text-lg font-medium">Third checkbox</label>
</div>
<div className="mb-4 mx-4">
<input
id="default-checkbox"
type="checkbox"
value=""
className="w-5 h-5 mt-3 text-blue-600 bg-gray-100 rounded border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label className="ml-2 text-lg font-medium">
Fourth checkbox
</label>
</div>
</div>
</div>
<div className="flex flex-col container w-4/5 h-auto border-2 border-themeColor items-center m-3 py-3">
<div className="flex flexgi-row h-16 w-full place-content-between items-center">
<form className="text-xl font-bold ml-6 w-1/2">
Q3. 세번째 질문
</form>
</div>
<form className="border w-11/12 my-4">설문조사 설명</form>
<div className="flex flex-row items-center m-3">
<div className="flex items-center mb-4 mx-4">
<input
id="default-radio-1"
type="radio"
value=""
name="default-radio"
className="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label className="ml-2 text-lg">First radio</label>
</div>
<div className="flex items-center mb-4 mx-4">
<input
id="default-radio-1"
type="radio"
value=""
name="default-radio"
className="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label className="ml-2 text-lg">Second radio</label>
</div>
<div className="flex items-center mb-4 mx-4">
<input
checked
id="default-radio-2"
type="radio"
value=""
name="default-radio"
className="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label className="ml-2 text-lg">Checked state</label>
</div>
</div>
</div>
</div>
<div>
......@@ -39,4 +120,5 @@ export const SurveyForm = () => (
</button>
</div>
</div>
);
);
};
......@@ -3,8 +3,8 @@ import { Link } from "react-router-dom";
export const Profile = () => {
return (
<div className="flex justify-center">
<div className=" m-5">나의 설문조사</div>
<div className="flex flex-col items-center">
<div className="m-5">나의 설문조사</div>
<div className="flex flex-row space-x-4 mt-5">
<Link
to="/create"
......
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