Commit e7ae6d3f authored by Yoon, Daeki's avatar Yoon, Daeki 😅
Browse files

verion 0.1 시작

parent 1ea0c555
import React from "react";
import { BrowserRouter, Route, Routes } from "react-router-dom";
import { Login, SignUp } from "./auth";
import { NotFound } from "./commons";
import {
Profile,
CreateSurvey,
Preview,
EditSurvey,
AnswerSurvey,
} from "./surveys";
import { AnswerLayout, BaseLayout, ModifyLayout } from "./layouts";
import { Home } from "./home";
import { RequireAuth } from "./auth/RequireAuth";
export const MainRouter = () => {
return (
<BrowserRouter>
<Routes>
<Route element={<BaseLayout />}>
<Route path="/" element={<Home />}></Route>
<Route path="/login" element={<Login />} />
<Route path="/signup" element={<SignUp />} />
<Route element={<AnswerLayout />}>
<Route path="/answers/:surveyId" element={<AnswerSurvey />} />
</Route>
<Route
path="/surveys"
element={
<RequireAuth>
<ModifyLayout />
</RequireAuth>
}
>
<Route path="create" element={<CreateSurvey />} />
<Route path="profile" element={<Profile />} />
<Route path=":surveyId" element={<Preview />} />
<Route path=":surveyId/edit" element={<EditSurvey />} />
</Route>
<Route path="*" element={<NotFound />} />
</Route>
</Routes>
</BrowserRouter>
);
};
import React, { useState } from "react";
import { CheckboxType, AnswerProps } from "../types";
import { ICheckbox, AnswerProps } from "../types";
interface Props extends AnswerProps {
element: CheckboxType;
element: ICheckbox;
}
export const ACheckboxForm = ({ element, answerQuestion }: Props) => {
......
import React, { useState } from "react";
import { DropdownType, AnswerProps } from "../types";
import { IDropdown, AnswerProps } from "../types";
interface Props extends AnswerProps {
element: DropdownType;
element: IDropdown;
}
export const ADropdownForm = ({ element, answerQuestion }: Props) => {
......
import React from "react";
import { BasicQuestionType, AnswerQuestionType } from "../types";
import { IQuestionData, AnswerQuestionType } from "../types";
import { ACheckboxForm } from "./ACheckboxForm";
import { ADateForm } from "./ADateForm";
import { ADropdownForm } from "./ADropdownForm";
......@@ -9,12 +9,12 @@ import { ARadioForm } from "./ARadioForm";
import { ARatingForm } from "./ARatingForm";
type Props = {
question: BasicQuestionType;
question: IQuestionData;
answerQuestion: AnswerQuestionType;
addFiles: (oneFile: { questionId: string; file: File }) => void;
};
export const AQuestion = ({ question, answerQuestion, addFiles }: Props) => {
function getContent(question: BasicQuestionType) {
function getContent(question: IQuestionData) {
switch (question.type) {
case "essay":
return (
......
import React, { useState } from "react";
import { RadioType, AnswerProps } from "../types";
import { IRadio, AnswerProps } from "../types";
interface Props extends AnswerProps {
element: RadioType;
element: IRadio;
}
export const ARadioForm = ({ element, answerQuestion }: Props) => {
......
import React, { useState } from "react";
import { RatingType, AnswerProps } from "../types";
import { IRating, AnswerProps } from "../types";
interface Props extends AnswerProps {
element: RatingType;
element: IRating;
}
export const ARatingForm = ({ element, answerQuestion }: Props) => {
......
......@@ -2,7 +2,7 @@ import React, { FormEvent, useEffect, useRef, useState } from "react";
import { useNavigate, useParams } from "react-router-dom";
import { surveyApi, answerApi } from "../apis";
import { catchErrors } from "../helpers";
import { AnswerSurveyType, AnswerType, SurveyType } from "../types";
import { AnswerSurveyType, AnswerType, ISurvey } from "../types";
import { AQuestion } from "./AQuestion";
export const AnswerSurveyForm = () => {
......@@ -12,7 +12,7 @@ export const AnswerSurveyForm = () => {
const [loading, setLoading] = useState(false);
const [success, setSuccess] = useState(false);
const navigate = useNavigate();
const [survey, setSurvey] = useState<SurveyType>({
const [survey, setSurvey] = useState<ISurvey>({
_id: surveyId || "",
user: {},
title: "",
......@@ -48,7 +48,7 @@ export const AnswerSurveyForm = () => {
async function ansSurvey() {
try {
if (surveyId) {
const getSurvey: any = await surveyApi.ansSurvey(surveyId);
const getSurvey: any = await surveyApi.getSurveyById(surveyId);
console.log("survey가져옴ㅎㅎ", getSurvey);
if (getSurvey) {
answerSurvey.current._id = getSurvey._id;
......
import axios from "axios";
import { BasicQuestionType } from "../types";
import { IQuestionData } from "../types";
import baseUrl from "./baseUrl";
export const createQuestion = async (surveyId: string) => {
......@@ -16,7 +16,7 @@ export const createQuestion = async (surveyId: string) => {
return data;
};
export const updateQuestion = async (question: BasicQuestionType) => {
export const updateQuestion = async (question: IQuestionData) => {
const { data } = await axios.put(
`${baseUrl}/questions/update/${question._id}`,
question
......
import axios from "axios";
import { SurveyType } from "../types";
import { ISurvey } from "../types";
import baseUrl from "./baseUrl";
export const createSurvey = async (survey: SurveyType) => {
export const createSurvey = async (survey: ISurvey) => {
const { data } = await axios.post(`${baseUrl}/surveys`, survey);
return data;
};
......@@ -12,7 +12,7 @@ export const getSurvey = async (surveyId: string) => {
return data;
};
export const ansSurvey = async (surveyId: string) => {
export const getSurveyById = async (surveyId: string) => {
const { data } = await axios.get(`${baseUrl}/surveys/${surveyId}`);
return data;
};
......@@ -22,14 +22,12 @@ export const getSurveys = async () => {
return data;
};
export const editSurvey = async (survey: SurveyType) => {
const { data } = await axios.put(
`${baseUrl}/surveys/${survey._id}/edit`,
survey
);
export const updateSurvey = async (survey: ISurvey) => {
const { data } = await axios.put(`${baseUrl}/surveys/${survey._id}`, survey);
return data;
};
export const resultSurvey = async (survey: SurveyType) => {
export const resultSurvey = async (survey: ISurvey) => {
const { data } = await axios.put(
`${baseUrl}/surveys/${survey._id}/result`,
survey
......@@ -38,6 +36,6 @@ export const resultSurvey = async (survey: SurveyType) => {
};
export const deleteSurvey = async (surveyId: string) => {
const { data } = await axios.delete(`${baseUrl}/surveys/${surveyId}/delete`);
const { data } = await axios.delete(`${baseUrl}/surveys/${surveyId}`);
return data;
};
......@@ -7,6 +7,7 @@ export const RequireAuth: FC<{ children: JSX.Element }> = ({ children }) => {
const location = useLocation();
if (!user.isLoggedIn) {
alert("로그인이 필요합니다.");
return (
<Navigate to={"/login"} state={{ from: location.pathname }} replace />
);
......
import React from "react";
import { Link } from "react-router-dom";
export const NotFound = () => {
return (
<div className="flex flex-col mt-10 justify-center text-center text-5xl">
<h1 className="text-4xl">페이지를 찾을 수 없습니다.</h1>
<Link to={"/"} className="mt-4">
홈으로
</Link>
</div>
);
};
export { Header } from "./Header";
export { Footer } from "./Footer";
export { NotFound } from "./NotFound";
export { QUESTION_TYPES } from "./constants";
......@@ -2,12 +2,14 @@ import React from "react";
import "tailwindcss/tailwind.css";
import { createRoot } from "react-dom/client";
import { SurveyRouter } from "./SurveyRouter";
import { MainRouter } from "./MainRouter";
const container = document.getElementById("root");
const root = createRoot(container!);
root.render(
<React.StrictMode>
<SurveyRouter />
{/* <SurveyRouter /> */}
<MainRouter />
</React.StrictMode>
);
import React from "react";
import { Outlet } from "react-router-dom";
export const AnswerLayout = () => {
return (
<>
<Outlet />
</>
);
};
import React from "react";
import { Outlet } from "react-router-dom";
import { AuthProvider } from "../auth";
import { Header } from "../commons";
export const BaseLayout = () => {
return (
<AuthProvider>
<Header />
<Outlet />
</AuthProvider>
);
};
import React from "react";
import { Outlet } from "react-router-dom";
export const ModifyLayout = () => {
return (
<>
<Outlet />
</>
);
};
export { AnswerLayout } from "./AnswerLayout";
export { BaseLayout } from "./BaseLayout";
export { ModifyLayout } from "./ModifyLayout";
import React, { useState } from "react";
import { useNavigate } from "react-router-dom";
import { surveyApi } from "../apis";
import { SurveyType } from "../types";
import { ISurvey } from "../types";
import { catchErrors } from "../helpers";
import { DuplicateIcon } from "../icons";
type Props = {
data: SurveyType;
data: ISurvey;
};
export const MySurveyCard = ({ data }: Props) => {
......
import React, { useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import { baseImageUrl, surveyApi } from "../apis";
import { SurveyType } from "../types";
import { ISurvey } from "../types";
import { MySurveyCard } from "./MySurveyCard";
export const Profile = () => {
const navigate = useNavigate();
const [survey, setSurvey] = useState<SurveyType>({
const [survey, setSurvey] = useState<ISurvey>({
_id: "",
user: {},
title: "",
comment: "",
questions: [],
});
const [cardDatas, setCardDatas] = useState<SurveyType[]>([]);
const [cardDatas, setCardDatas] = useState<ISurvey[]>([]);
useEffect(() => {
getSurveys();
}, []);
async function createSurvey() {
const newSurvey: SurveyType = await surveyApi.createSurvey(survey);
const newSurvey: ISurvey = await surveyApi.createSurvey(survey);
navigate(`/surveys/${newSurvey._id}/create`, {
replace: true,
});
}
async function getSurveys() {
const surveys: SurveyType[] = await surveyApi.getSurveys();
const surveys: ISurvey[] = await surveyApi.getSurveys();
// console.log(surveys);
setCardDatas(surveys);
}
......
import React, { useState } from "react";
import { CheckboxType } from "../types";
import { ICheckbox } from "../types";
type Props = {
element: CheckboxType;
element: ICheckbox;
handleQuestion: (id: string) => void;
isEditing: boolean;
};
......
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