Commit 6d061a01 authored by baesangjune's avatar baesangjune
Browse files

.

parent e72f0060
import React from 'react'; import React from 'react';
import { BrowserRouter } from 'react-router-dom' import { BrowserRouter, Switch, Route } from 'react-router-dom'
import { AuthProvider } from './auth/auth-context'; import { AuthProvider } from './auth/auth-context';
import MainRouter from './MainRouter'; import MainRouter from './MainRouter';
import Problems from './quiz/Problems';
function App() { function App() {
return ( return (
<AuthProvider> <AuthProvider>
<BrowserRouter> <BrowserRouter>
<MainRouter /> <MainRouter />
<Switch>
<Route path="/problems" component={Problems}/>
</Switch>
</BrowserRouter> </BrowserRouter>
</AuthProvider> </AuthProvider>
); );
......
...@@ -6,10 +6,11 @@ import { read as readUser } from '../user/api-user'; ...@@ -6,10 +6,11 @@ import { read as readUser } from '../user/api-user';
import { list, read as readCourse } from '../course/api-course'; import { list, read as readCourse } from '../course/api-course';
import { useEffect } from "react"; import { useEffect } from "react";
import Card from "react-bootstrap/esm/Card"; import Card from "react-bootstrap/esm/Card";
import { Link, Redirect } from 'react-router-dom';
function Warning() { function Warning() {
const [data, setData] = useState({ name: "", }) const [data, setData] = useState({ name: "", })
const [courses, setCourses] = useState({ name: "", description: "", code: "", }) const [courses, setCourses] = useState([{ name: "", description: "", code: "", }])
const [values, setValues] = useState({ const [values, setValues] = useState({
title: "", title: "",
problems: [], problems: [],
...@@ -72,7 +73,9 @@ function Warning() { ...@@ -72,7 +73,9 @@ function Warning() {
))} ))}
</Form.Control> </Form.Control>
<div className="text-right"> <div className="text-right">
<a href="#" className="btn btn-danger">Quiz Start</a> <Link to="/problems">
<a className="btn btn-danger">Quiz Start</a>
</Link>
{/* <a href="#" class="card-link">Another link</a> */} {/* <a href="#" class="card-link">Another link</a> */}
</div> </div>
{/* <p>시험문제 수 :</p> {/* <p>시험문제 수 :</p>
......
import React from 'react' // import React, { useState, useEffect } from 'react'
// import { Link, Redirect } from 'react-router-dom';
// import Timer from 'react-compound-timer'; // 타이머쓰기위해 import
function Problems() {
// function Problems() {
// let Time = 0
// if (JSON.parse(localStorage.getItem("Set")) === null) { // let Time = 0
// Time = 30010 // if (JSON.parse(localStorage.getItem("Set")) === null) {
// } // Time = 30010
// else { // }
// Time = Number(JSON.parse(localStorage.getItem("Set"))[0].Time) // else {
// } // Time = Number(JSON.parse(localStorage.getItem("Set"))[0].Time)
// }
// const [question, setQuestion] = useState({
// ...localQnA[0] // const [question, setQuestion] = useState({
// }) // ...localQnA[0]
// const [selected, setSelected] = useState("") //선택한 답을 보여줄 것 // })
// const [selected, setSelected] = useState("") //선택한 답을 보여줄 것
// const [timeout, settimeout] = useState(false)
// //for each 사용하기 // const [timeout, settimeout] = useState(false)
// let Solutions = [] //빈 배열 // //for each 사용하기
// console.log(localQnA) // let Solutions = [] //빈 배열
// console.log(localQnA)
// localQnA.forEach((element) => {
// Solutions.push(Number(element.A)) // localQnA.forEach((element) => {
// }); // Solutions.push(Number(element.A))
// useEffect(() => { // });
// for (let i = 1; i <= Solutions.length; i++) { // useEffect(() => {
// Answers.push(0) // for (let i = 1; i <= Solutions.length; i++) {
// localStorage.setItem('Answers', JSON.stringify(Answers)) // Answers.push(0)
// localStorage.setItem("Solutions", JSON.stringify(Solutions)) // localStorage.setItem('Answers', JSON.stringify(Answers))
// } // localStorage.setItem("Solutions", JSON.stringify(Solutions))
// // eslint-disable-next-line // }
// }, []) // // eslint-disable-next-line
// }, [])
// function handleQuestion() {
// setQuestion({ ...localQnA[question.N] }) // function handleQuestion() {
// setSelected("") //페이지 넘어가면 selected 초기화 // setQuestion({ ...localQnA[question.N] })
// } // setSelected("") //페이지 넘어가면 selected 초기화
// }
// let handleChange = (ev) => {
// setSelected(ev.target.value) //selected값 변경 // let handleChange = (ev) => {
// Answers[question.N - 1] = Number(ev.target.id) + 1 // setSelected(ev.target.value) //selected값 변경
// localStorage.setItem('Answers', JSON.stringify(Answers)) // Answers[question.N - 1] = Number(ev.target.id) + 1
// } // localStorage.setItem('Answers', JSON.stringify(Answers))
// return ( // }
// <> // return (
// <div className="container-fluid"> // <>
// <div className="text-center font-italic font-weight-bold py-2 text-muted">해석학 2 (이연주 교수)</div> // <div className="container-fluid">
// <div className="row justify-content-md-center"> // <div className="text-center font-italic font-weight-bold py-2 text-muted">해석학 2 (이연주 교수)</div>
// <div className="row justify-content-md-center">
// <div className="col-md-auto mt-4">
// <div className="mb-4small">문제 진척도 {question.N}/{localQnA.length}</div> // <div className="col-md-auto mt-4">
// <span className="h5 text-left text-danger "> // <div className="mb-4small">문제 진척도 {question.N}/{localQnA.length}</div>
// <Timer // <span className="h5 text-left text-danger ">
// initialTime={Time} // <Timer
// direction="backward" // initialTime={Time}
// checkpoints={[ // direction="backward"
// { // checkpoints={[
// time: 1, // {
// callback: () => alert('시간이 초과되었습니다.'), // time: 1,
// }, // callback: () => alert('시간이 초과되었습니다.'),
// { // },
// time: 0, // {
// callback: () => settimeout(true), // time: 0,
// callback: () => settimeout(true),
// }
// ]} // }
// > // ]}
// {() => ( // >
// <> // {() => (
// <Timer.Minutes /> : <Timer.Seconds></Timer.Seconds> / 30 : 00 </> // <>
// )} // <Timer.Minutes /> : <Timer.Seconds></Timer.Seconds> / 30 : 00 </>
// </Timer> {/* npm i react-compound-timer */} // )}
// </span> // </Timer> {/* npm i react-compound-timer */}
// <span className=" float-right "> {(question.N - 1 === localQnA.length - 1) // </span>
// ? <Link to="/end"> // <span className=" float-right "> {(question.N - 1 === localQnA.length - 1)
// <button className="btn btn-outline-success" /*onClick={localStorage.setItem('Solutions', JSON.stringify(Solutions))}*/>제출</button> // ? <Link to="/end">
// </Link> // <button className="btn btn-outline-success" /*onClick={localStorage.setItem('Solutions', JSON.stringify(Solutions))}*/>제출</button>
// : <button type="button" className="btn btn-outline-dark" onClick={handleQuestion}>다음</button> // </Link>
// } // : <button type="button" className="btn btn-outline-dark" onClick={handleQuestion}>다음</button>
// </span> // }
// </span>
// <div className="h2 mt-5">
// <span className='mr-4 font-weight-bold text-danger'>Quiz{question.N}.</span>{question.Q} // <div className="h2 mt-5">
// </div> // <span className='mr-4 font-weight-bold text-danger'>Quiz{question.N}.</span>{question.Q}
// <div className="mt-2"> // </div>
// <form> // <div className="mt-2">
// {question.Choose.map((a, index) => // <form>
// {question.Choose.map((a, index) =>
// <div>
// <input type="radio" name='answer' id={index} value={a} onChange={handleChange} checked={selected === String(a)} />
// <label className="font-weight-bold" htmlFor={a}>{a}</label>
// </div>
// )}
// </form>
// <span className="h5 font-weight-bold"> Your Answer :</span>
// <span className="h2 font-weight-bold text-danger"> {selected}</span> {/* 선택한 값 보여줌 */}
// </div>
// </div>
// <div className="col">
// </div>
// </div>
// </div>
// {timeout ? <Redirect to='/end' /> : ''}
// </>
// )
// // return (
// // <div> </div>
// // )
// }
// export default Problems
import React, { useEffect, useState } from "react";
import { Link, useParams } from 'react-router-dom';
import Card from "react-bootstrap/Card";
import Button from "react-bootstrap/Button";
import { listByUserId } from "./api-quiz";
import authHelpers from "../auth/auth-helpers";
function Problem({ problem, number, onUpdate, onRemove }) {
const { userId } = useParams();
const [quizzes, setQuizzes] = useState([]);
const jwt = authHelpers.isAuthenticated();
useEffect(() => {
const abortController = new AbortController();
const signal = abortController.signal;
listByUserId({ userId: userId }, { t: jwt.token }, signal).then((data) => {
if (data.error) {
console.log(data.error);
} else {
// console.log(data);
setQuizzes(data);
}
});
return () => {
abortController.abort();
};
}, [userId]);
return (
<div>{console.log(quizzes)})</div>
// <div> // <div>
// <input type="radio" name='answer' id={index} value={a} onChange={handleChange} checked={selected === String(a)} />
// <label className="font-weight-bold" htmlFor={a}>{a}</label>
// </div>
// )}
// </form>
// <span className="h5 font-weight-bold"> Your Answer :</span>
// <span className="h2 font-weight-bold text-danger"> {selected}</span> {/* 선택한 값 보여줌 */}
// </div>
// {quizzes.map((quiz, i) => {
// return (
// <Link key={i} to={`/quiz/${quiz._id}`}>
// // <Card>
// <Card.Body>
// <Card.Title>
// {i + 1}번. {quiz}
// </Card.Title>
// Answers
// {problem.answers.map((answer, index) => {
// return <Card.Text key={index}>{answer}</Card.Text>;
// })}
// <Link to={`/quiz/problem/edit/${problem._id}`}>
// <Button onClick={(event) => onUpdate(number)}>수정</Button>
// </Link>
// <Button onClick={() => onRemove(number)}>삭제</Button>
// </Card.Body>
// </Card>
// </Link>
// );
// })}
// </div> // </div>
// <div className="col">
// </div>
// </div>
// </div>
// {timeout ? <Redirect to='/end' /> : ''}
// </>
// )
// <Card>
return ( // <Card.Body>
<div> // <Card.Title>
// {number + 1}번. {problem.question}
</div> // </Card.Title>
) // Answers
// {problem.answers.map((answer, index) => {
// return <Card.Text key={index}>{answer}</Card.Text>;
// })}
// <Link to={`/quiz/problem/edit/${problem._id}`}>
// <Button onClick={(event) => onUpdate(number)}>수정</Button>
// </Link>
// <Button onClick={() => onRemove(number)}>삭제</Button>
// </Card.Body>
// </Card>
);
} }
export default Problem;
export default Problems
...@@ -31,6 +31,7 @@ function Quizzes() { ...@@ -31,6 +31,7 @@ function Quizzes() {
return ( return (
<div> <div>
All Quizzes Here All Quizzes Here
{console.log("quizzes=", quizzes)}
{quizzes.map((quiz, i) => { {quizzes.map((quiz, i) => {
return ( return (
<Link key={i} to={`/quiz/${quiz._id}`}> <Link key={i} to={`/quiz/${quiz._id}`}>
......
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