Commit eb4b5c31 authored by Jiwon Yoon's avatar Jiwon Yoon
Browse files

Merge branch 'seoyeon_' into develop0727

parents b430d9e4 1d61a97e
...@@ -11,6 +11,7 @@ import { EditSurvey } from "./survey/EditSurvey"; ...@@ -11,6 +11,7 @@ import { EditSurvey } from "./survey/EditSurvey";
import { ResultSurvey } from "./survey/ResultSurvey"; import { ResultSurvey } from "./survey/ResultSurvey";
import { CompleteSurvey } from "./survey/CompleteSurvey"; import { CompleteSurvey } from "./survey/CompleteSurvey";
import { SameSurvey } from "./survey/SameSurvey"; import { SameSurvey } from "./survey/SameSurvey";
import { CreateSurvey } from "./survey/CreateSurvey";
export const SurveyRouter = () => { export const SurveyRouter = () => {
return ( return (
...@@ -20,6 +21,7 @@ export const SurveyRouter = () => { ...@@ -20,6 +21,7 @@ export const SurveyRouter = () => {
<Route index element={<Home />} /> <Route index element={<Home />} />
<Route path="login" element={<Login />} /> <Route path="login" element={<Login />} />
<Route path="signup" element={<SignUp />} /> <Route path="signup" element={<SignUp />} />
<Route path="surveys/:surveyId/create" element={<CreateSurvey />} />
<Route path="surveys/:surveyId/" element={<EditResultButton />}> <Route path="surveys/:surveyId/" element={<EditResultButton />}>
<Route path="edit" element={<EditSurvey />} /> <Route path="edit" element={<EditSurvey />} />
<Route path="result" element={<ResultSurvey />} /> <Route path="result" element={<ResultSurvey />} />
......
...@@ -22,7 +22,7 @@ export const ADropdownForm = ({ element, answerQuestion }: Props) => { ...@@ -22,7 +22,7 @@ export const ADropdownForm = ({ element, answerQuestion }: Props) => {
return ( return (
<div className="flex flex-col container w-11/12 h-auto m-3 py-3"> <div className="flex flex-col container w-11/12 h-auto m-3 py-3">
<select <select
className="place-self-center py-2 w-48 hover:bg-gray-200 border border-black rounded" className="py-2 w-48 hover:bg-gray-200 border border-black rounded"
onChange={handleChange} onChange={handleChange}
> >
{element.content.choices.map((choice) => ( {element.content.choices.map((choice) => (
......
...@@ -21,7 +21,7 @@ export const Profile = () => { ...@@ -21,7 +21,7 @@ export const Profile = () => {
async function createSurvey() { async function createSurvey() {
const newSurvey: SurveyType = await surveyApi.createSurvey(survey); const newSurvey: SurveyType = await surveyApi.createSurvey(survey);
navigate(`/surveys/${newSurvey._id}/edit`, { navigate(`/surveys/${newSurvey._id}/create`, {
replace: true, replace: true,
}); });
} }
...@@ -39,7 +39,7 @@ export const Profile = () => { ...@@ -39,7 +39,7 @@ export const Profile = () => {
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 mt-6"> <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 mt-6">
<button <button
onClick={createSurvey} onClick={createSurvey}
className="flex w-40 h-48 md:h-60 md:w-52 items-center border-2 border-themeColor font-bold bg-gray-200 hover:bg-themeColor rounded-lg " className="flex w-40 h-48 md:h-60 md:w-52 items-center font-bold bg-gray-200 hover:bg-themeColor rounded-lg "
> >
<div className="text-center md:px-6 md:py-6 font-xs md:font-bold text-gray-500 place-items-center hover:text-white"> <div className="text-center md:px-6 md:py-6 font-xs md:font-bold text-gray-500 place-items-center hover:text-white">
CREATE NEW SURVEY! CREATE NEW SURVEY!
......
// import { useQuestion } from "./question.context";
...@@ -30,7 +30,7 @@ Props) => { ...@@ -30,7 +30,7 @@ Props) => {
try { try {
console.log(question); console.log(question);
const newQuestion: BasicQuestionType = await questionApi.updateQuestion( const newQuestion: BasicQuestionType = await questionApi.updateQuestion(
element question
); );
// console.log(newQuestion); // console.log(newQuestion);
handleQuestion(question); handleQuestion(question);
...@@ -184,7 +184,7 @@ Props) => { ...@@ -184,7 +184,7 @@ Props) => {
key={key} key={key}
id={question._id} id={question._id}
value={key} value={key}
// selected={key === element.type} selected={key === element.type}
> >
{value} {value}
</option> </option>
......
import React, { FormEvent, useEffect, useState } from "react";
import { useParams, useLocation, useNavigate } from "react-router-dom";
import { questionApi, surveyApi } from "../apis";
import { SpinnerIcon } from "../icons";
import { Question } from "../questions";
import { BasicQuestionType, SurveyType } from "../types";
import { catchErrors } from "../helpers";
export const CreateSurvey = () => {
let { surveyId } = useParams<{ surveyId: string }>();
interface CustomizedState {
save: boolean;
}
const location = useLocation();
const state = location.state as CustomizedState;
useEffect(() => {
getSurvey();
}, [surveyId]);
const [error, setError] = useState("");
const [loading, setLoading] = useState(false);
const [success, setSuccess] = useState(false);
const navigate = useNavigate();
const [survey, setSurvey] = useState<SurveyType>({
_id: surveyId || "",
user: {},
title: "",
comment: "",
questions: [],
});
async function getSurvey() {
try {
if (surveyId) {
const thisSurvey: SurveyType = await surveyApi.getSurvey(surveyId);
setSurvey(thisSurvey);
setSuccess(true);
setError("");
} else {
setLoading(true);
}
} catch (error) {
catchErrors(error, setError);
} finally {
setLoading(false);
}
}
const handleQuestion = (element: BasicQuestionType) => {
const index = survey.questions.findIndex(
(question) => question._id === element._id
);
survey.questions[index] = element;
const newList = [...survey.questions];
// const newList: BasicQuestionType[] = [...survey.questions];
console.log("new list in handle question", newList);
setSurvey({ ...survey, questions: newList });
};
const handleSurvey = (event: React.ChangeEvent<HTMLInputElement>) => {
const { name, value } = event.currentTarget;
setSurvey({ ...survey, [name]: value });
};
async function handleSubmit(event: FormEvent) {
event.preventDefault();
try {
const newSurvey: SurveyType = await surveyApi.editSurvey(survey);
console.log(newSurvey);
setSuccess(true);
alert("저장되었습니다");
navigate("/profile");
setError("");
} catch (error) {
catchErrors(error, setError);
} finally {
setLoading(false);
}
}
async function addQuestion() {
try {
if (surveyId) {
const questions: BasicQuestionType[] = await questionApi.createQuestion(
surveyId
);
console.log(questions);
setSurvey({ ...survey, questions: questions });
setSuccess(true);
setError("");
} else {
setLoading(true);
}
} catch (error) {
catchErrors(error, setError);
} finally {
setLoading(false);
}
}
async function deleteQuestion(id: string) {
const newList: BasicQuestionType[] = [...survey.questions];
try {
const newQuestion: BasicQuestionType = await questionApi.deleteQuestion(
id
);
setSurvey({ ...survey, questions: newList.filter((a) => a._id !== id) });
setSuccess(true);
setError("");
} catch (error) {
catchErrors(error, setError);
} finally {
setLoading(false);
}
}
const questions = survey.questions;
console.log(questions);
console.log(state);
return (
<>
{error ? alert(error) : <></>}
{loading && (
<SpinnerIcon className="animate-spin h-5 w-5 mr-1 text-slate" />
)}
<form onSubmit={handleSubmit}>
<div className="flex flex-col place-items-center">
<div className="flex flex-col container place-items-center mt-4">
<input
type="text"
name="title"
className="font-bold text-4xl text-center m-2 border-b-2"
placeholder="설문지 제목"
value={survey.title}
onChange={handleSurvey}
></input>
<input
type="text"
name="comment"
className="font-bold text-1xl text-center m-2 border-b-2 resize-none"
placeholder="설문조사에 대한 설명을 입력해주세요"
size={50}
value={survey.comment}
onChange={handleSurvey}
></input>
</div>
{questions.map((question) => (
<Question
key={question._id}
element={question}
// isSave={state ? true : false}
handleQuestion={handleQuestion}
deleteQuestion={deleteQuestion}
/>
))}
<div className="flex w-4/5 content-center justify-center border-2 border-black h-8 mt-3">
<button type="button" onClick={addQuestion}>
질문 추가
</button>
</div>
<div>
<button
type="submit"
className="border bg-themeColor my-5 py-2 px-3 font-bold text-white"
>
저장하기
</button>
</div>
</div>
</form>
</>
);
};
...@@ -28,6 +28,7 @@ export const EditSurvey = () => { ...@@ -28,6 +28,7 @@ export const EditSurvey = () => {
comment: "", comment: "",
questions: [], questions: [],
}); });
async function getSurvey() { async function getSurvey() {
try { try {
if (surveyId) { if (surveyId) {
...@@ -115,7 +116,6 @@ export const EditSurvey = () => { ...@@ -115,7 +116,6 @@ export const EditSurvey = () => {
const questions = survey.questions; const questions = survey.questions;
console.log(questions); console.log(questions);
console.log(state);
return ( return (
<> <>
{error ? alert(error) : <></>} {error ? alert(error) : <></>}
...@@ -136,7 +136,7 @@ export const EditSurvey = () => { ...@@ -136,7 +136,7 @@ export const EditSurvey = () => {
<input <input
type="text" type="text"
name="comment" name="comment"
className="font-bold text-1xl text-center m-2 resize-none" className="font-bold text-1xl text-center m-2 border-b-2 resize-none"
placeholder="설문조사에 대한 설명을 입력해주세요" placeholder="설문조사에 대한 설명을 입력해주세요"
size={50} size={50}
value={survey.comment} value={survey.comment}
...@@ -147,7 +147,6 @@ export const EditSurvey = () => { ...@@ -147,7 +147,6 @@ export const EditSurvey = () => {
<Question <Question
key={question._id} key={question._id}
element={question} element={question}
// isSave={state ? true : false}
handleQuestion={handleQuestion} handleQuestion={handleQuestion}
deleteQuestion={deleteQuestion} deleteQuestion={deleteQuestion}
/> />
......
...@@ -43,7 +43,7 @@ export const ResultSurvey = () => { ...@@ -43,7 +43,7 @@ export const ResultSurvey = () => {
<div className="font-bold text-4xl text-center m-2 border-b-2"> <div className="font-bold text-4xl text-center m-2 border-b-2">
{survey.title} {survey.title}
</div> </div>
<div className="font-bold text-1xl text-center m-2 resize-none"> <div className="font-bold text-xl text-center m-2 resize-none">
{survey.comment} {survey.comment}
</div> </div>
</div> </div>
......
...@@ -72,7 +72,7 @@ export const login = asyncWrap(async (req, res) => { ...@@ -72,7 +72,7 @@ export const login = asyncWrap(async (req, res) => {
const user = await userDb.findUserByEmail(email, true); const user = await userDb.findUserByEmail(email, true);
console.log("user =", user); console.log("user =", user);
if (!user) { if (!user) {
return res.status(422).send(`${email} 사용자가 존재하지 않습니다`); return res.status(422).send(`${email} 사용자가 존재하지않습니다 회원가입을 해주세요`);
} }
// 2) 비밀번호 확인 // 2) 비밀번호 확인
const passwordMatch = await bcrypt.compare(password, user.password); const passwordMatch = await bcrypt.compare(password, user.password);
......
...@@ -4,15 +4,10 @@ import { authCtrl, surveyCtrl, questionCtrl } from "../controllers"; ...@@ -4,15 +4,10 @@ import { authCtrl, surveyCtrl, questionCtrl } from "../controllers";
const router = express.Router(); const router = express.Router();
router.route("/").get(authCtrl.requireLogin, surveyCtrl.getSurveys); router.route("/").get(authCtrl.requireLogin, surveyCtrl.getSurveys);
router.route("/:surveyId")
.get(surveyCtrl.getSurveyById);
router.route("/create").post(authCtrl.requireLogin, surveyCtrl.createSurvey); router.route("/create").post(authCtrl.requireLogin, surveyCtrl.createSurvey);
router
.route("/:surveyId") router.route("/:surveyId").get(surveyCtrl.getSurveyById);
.get(surveyCtrl.getSurveyById);
router router
.route("/:surveyId/edit") .route("/:surveyId/edit")
.get(authCtrl.requireLogin, authCtrl.authenticate, surveyCtrl.getSurveyById) .get(authCtrl.requireLogin, authCtrl.authenticate, surveyCtrl.getSurveyById)
......
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