diff --git a/src/admin/Admin.tsx b/src/admin/Admin.tsx deleted file mode 100644 index a2de9c5..0000000 --- a/src/admin/Admin.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import { useQuery } from '@tanstack/react-query'; -import { AlignCenter, LayOut, StyleLink } from './style'; -import api from '../apis/axios/instance'; -import type Quiz from './types/Quiz'; -export default function Admin() { - const { data: quizzes } = useQuery({ - queryKey: ['quizzes', 'all'], - queryFn: () => api.get('/quizzes'), - }); - return ( - - - 문제 생성 - - {quizzes?.data.map((quiz: Quiz) => ( - - 섹션: {quiz.sectionId} 파트 : {quiz.part} 타이틀: {quiz.title}: - {quiz.question} - - ))} - - - - ); -} diff --git a/src/admin/CreateQuiz.tsx b/src/admin/CreateQuiz.tsx deleted file mode 100644 index 08b4e3c..0000000 --- a/src/admin/CreateQuiz.tsx +++ /dev/null @@ -1,127 +0,0 @@ -import { useState, useRef } from 'react'; -import { - AlignCenter, - FlexDiv, - InputBox, - Label, - LayOut, - SelectBox, -} from './style'; -import Quiz from './types/Quiz'; -import QUIZ from '../apis/quiz'; -import { useMutation } from '@tanstack/react-query'; - -export default function CreateQuiz() { - //퀴즈의 정보를 저장하는 상태 - const [quiz, setQuiz] = useState({ - sectionId: 1, - part: 'EASY', - title: '', - question: '', - answer: [], - category: 'MULTIPLE_CHOICE', - answerChoice: [], - }); - const sectionRef = useRef(null); - const mutation = useMutation({ - mutationFn: QUIZ.postQuiz, - }); - - const handelQuizChange = ( - e: React.ChangeEvent - ) => { - const { id, value } = e.target; - - if (id === 'answerChoice' || id === 'answer') { - setQuiz({ ...quiz, [id]: value.split(',') }); - } else { - setQuiz({ ...quiz, [id]: value }); - } - }; - - return ( - - - - 섹션 선택하기 - 파트 선택하기 - - - - 변수 - 자료형 - 등등.. - - - { - //api 생기면 기능 추가 - console.log(sectionRef.current?.value); - }} - > - 섹션추가 - - - Easy - Normal - Hard - Very Hard - - - 문제 지문 입력(title) - - - 문제(question) - 정답(answer) - - - - - - - 문제 유형 선택하기 - - 객관식, 조합식의 경우만 보기를 작성해주시면 됩니다. - - - - - - 객관식 - 조합식 - O/X - 단답형 - - - - - { - mutation.mutate(quiz); - }} - > - 확인 - - - - ); -} diff --git a/src/admin/style.ts b/src/admin/style.ts deleted file mode 100644 index e51bf16..0000000 --- a/src/admin/style.ts +++ /dev/null @@ -1,45 +0,0 @@ -import { Link } from 'react-router-dom'; -import styled from 'styled-components'; -import type { InputBoxStyle, LabelStyle, SelectBoxStyle } from './types/style'; -export const AlignCenter = styled.div` - display: flex; - justify-content: center; -`; -export const LayOut = styled.div` - width: 1280px; - display: flex; - flex-direction: column; -`; -export const StyleLink = styled(Link)` - color: #000000; - display: block; - text-decoration: none; - width: 300px; - height: 70px; - font-size: 24px; - text-align: center; - align-content: center; - background-color: lightgray; - border: 2px solid #000000; -`; -export const Label = styled.label` - margin-left: ${({ $marginLeft }) => $marginLeft || '30px'}; - font-size: 18px; -`; -export const SelectBox = styled.select` - margin: 20px; - font-size: 18px; - width: 400px; - height: 30px; - margin-right: ${({ $marginRight }) => $marginRight || '0px;'}; -`; -export const InputBox = styled.textarea` - width: 500px; - margin: 20px; - height: ${({ $height }) => $height || '40px'}; - resize: none; -`; -export const FlexDiv = styled.div` - display: flex; - align-items: center; -`; diff --git a/src/admin/types/Quiz.ts b/src/admin/types/Quiz.ts deleted file mode 100644 index 7367b25..0000000 --- a/src/admin/types/Quiz.ts +++ /dev/null @@ -1,10 +0,0 @@ -export default interface Quiz { - id?: number; - part: 'EASY' | 'NORAML' | 'HARD' | 'VERY_HARD'; - sectionId: number; - title: string; - question: string; - answer: string[]; - category: 'COMBINATION' | 'MULTIPLE_CHOICE' | 'OXSELECTOR' | 'SHORTANSWER'; - answerChoice?: string[]; -} diff --git a/src/admin/types/style.ts b/src/admin/types/style.ts deleted file mode 100644 index dc175e1..0000000 --- a/src/admin/types/style.ts +++ /dev/null @@ -1,9 +0,0 @@ -export interface InputBoxStyle { - $height?: string; -} -export interface LabelStyle { - $marginLeft?: string; -} -export interface SelectBoxStyle { - $marginRight?: string; -} diff --git a/src/apis/quiz.ts b/src/apis/quiz.ts index 8e98e0b..2dd6291 100644 --- a/src/apis/quiz.ts +++ b/src/apis/quiz.ts @@ -1,9 +1,9 @@ import { useQuery } from '@tanstack/react-query'; -import Quiz from '../admin/types/Quiz'; import api from './axios/instance'; +import Quiz from '../types/Quiz'; const QUIZ = { - getQuizzes: (sectionId: number, part: Quiz['part']) => { + getQuizzes: (sectionId: Quiz['sectionId'], part: Quiz['part']) => { return useQuery({ queryKey: ['quizzes', { sectionId, part }], queryFn: () => api.get(`/quizzes?sectionId=${sectionId}&part=${part}`), @@ -13,6 +13,5 @@ const QUIZ = { staleTime: 1 * 60 * 1000, }); }, - postQuiz: (quiz: Quiz) => api.post(`/quizzes`, quiz), }; export default QUIZ; diff --git a/src/route/Router.tsx b/src/route/Router.tsx index 90d9473..f849dca 100644 --- a/src/route/Router.tsx +++ b/src/route/Router.tsx @@ -3,9 +3,7 @@ import Main from '../pages/main/Main'; import Quest from '../pages/Quest/Quest'; import Ranking from '../pages/Ranking/Ranking'; import Quiz from '../pages/Quiz/Quiz'; -import Admin from '../admin/Admin'; -import CreateQuiz from '../admin/CreateQuiz'; -import Login from '../pages/login/login'; +import Login from '../pages/login/Login'; export default function Router() { return ( <> @@ -16,9 +14,6 @@ export default function Router() { }> }> }> - {/*어드민 페이지 부분 문제조회/추가 이외에 규모 확장 시 레포 분리 */} - } /> - }> > diff --git a/src/types/Quiz.ts b/src/types/Quiz.ts index 34f8b92..e7bff38 100644 --- a/src/types/Quiz.ts +++ b/src/types/Quiz.ts @@ -1,6 +1,6 @@ export default interface Quiz { id: number; - partId: number; + part: string; sectionId: number; title: string; question: string;