diff --git a/src/Admin.js b/src/Admin.js new file mode 100644 index 0000000000000000000000000000000000000000..18ca0d23566fc39528d1c6cfd4d014af5c73181d --- /dev/null +++ b/src/Admin.js @@ -0,0 +1,106 @@ +import React, { useState } from 'react'; +import { Container, Nav } from 'react-bootstrap'; +// import { Link } from 'react-router-dom'; + +function Admin() { + + + // let QnAadmin = [] + // let Q = [] + // let choose = [] + // let N = [] + + const [number, setNumber] = useState('') + const [question, setQuestion] = useState('') + const [choose, setChoose] = useState('') + const [answer, setAnswer] = useState('') + const [done, setDone] = useState(false) + + const handleChangenumber = (event) => { + setNumber(event.target.value) + } + const handleChangequestion = (event) => { + setQuestion(event.target.value) + } + const handleChangechoose = (event) => { + setChoose(event.target.value) + } + const handleChangeanswer = (event) => { + setAnswer(event.target.value) + } + + function handleClick() { + + alert('입력이 완료되었습니다') + localStorage.setItem('N', number) + localStorage.setItem('Q', question) + localStorage.setItem('Choose', choose) + localStorage.setItem('Answer', answer) + setDone(true) + + + } + + return ( + <> + {done ? alert('모두 입력되었습니다.') : ''} + + + +
+
+
+
+ +

관리자 문제제출 창

+
+

문제번호를 입력하세요

+ + +
+
+

문제를 입력하세요

+ + +
+
+

보기를 입력하세요(배열형태)

+ + +
+
+

답을 입력하세요

+ + +
+ + + +
+
+
+ {/*
+

패스워드를 입력하세요

+ + +
*/} +
+ + ) +} + +export default Admin \ No newline at end of file diff --git a/src/AdminSetting.js b/src/AdminSetting.js new file mode 100644 index 0000000000000000000000000000000000000000..28afb3fe7b11ccc156d4f7c913d660c521d93f70 --- /dev/null +++ b/src/AdminSetting.js @@ -0,0 +1,92 @@ +import React, { useState } from 'react'; +import { Container } from 'react-bootstrap'; +// import { Link } from 'react-router-dom'; + +function AdminSetting() { + + + // let QnAadmin = [] + // let Q = [] + // let choose = [] + // let N = [] + + const [password, setPassword] = useState('') + const [adminpassword, setAdminPassword] = useState('') + const [time, setTime] = useState('') + const [done, setDone] = useState(false) + + const handleChangePassword = (event) => { + setPassword(event.target.value) + } + const handleChangeAdminPassword = (event) => { + setAdminPassword(event.target.value) + } + const handleChangeTime = (event) => { + setTime(event.target.value) + } + + function handleClick() { + if (!password) { + alert('비밀번호를 입력하세요') + } + else if (!adminpassword) { + alert('관리자 비밀번호를 입력하세요') + } + else if (!time) { + alert('타이머를 설정해주세요') + } + else { + alert('입력이 완료되었습니다') + localStorage.setItem('P', password) + localStorage.setItem('AP', adminpassword) + localStorage.setItem('T', time*1000) + setDone(true) + } + } + + return ( + <> + {done ? alert('모두 입력되었습니다.') : ''} + + +
+
+
+
+ +

관리자 설정 변경 창

+
+

변경할 비밀번호를 입력하세요

+ + +
+
+

변경할 관리자 비밀번호를 입력하세요

+ + +
+
+

타이머를 설정하세요(초단위)

+ + +
+ + + + +
+
+
+ {/*
+

패스워드를 입력하세요

+ + +
*/} +
+ + ) + } + + export default AdminSetting \ No newline at end of file diff --git a/src/App.js b/src/App.js index dfc338bfe17b8b7270803c68afc3811f596d2b76..3c5ae18d7be7340aeea5b1188fa440479725519c 100644 --- a/src/App.js +++ b/src/App.js @@ -3,8 +3,10 @@ import './App.css'; import Home from './Home' import Quiz from './Quiz' import End from './End' +import Admin from './Admin' +import AdminSetting from './AdminSetting' -import { BrowserRouter as Router, Link, Switch, Route } from 'react-router-dom'; +import { BrowserRouter as Router, Link, Switch, Route, Redirect } from 'react-router-dom'; function App() { return ( @@ -14,18 +16,20 @@ function App() { -
+
- - - - - - - - - + + + + + + + + + + +
diff --git a/src/App2.js b/src/App2.js new file mode 100644 index 0000000000000000000000000000000000000000..a16e69d331164404795f21a076ddf25e7edac887 --- /dev/null +++ b/src/App2.js @@ -0,0 +1,21 @@ +import React from 'react'; +import './App.css'; + +function App() { + return ( + +
+
+ + + +
+
+
+ + + ) +} + + +export default App; \ No newline at end of file diff --git a/src/End.js b/src/End.js index 2c0910b8e91957cb641b9ea03b791bea8b879ff1..53466fdc8a8b056476bf90ed3d6ce414c3c075e9 100644 --- a/src/End.js +++ b/src/End.js @@ -1,5 +1,5 @@ import React from 'react' -import tr from './img_end.jpg'; +// import tr from './img_end.jpg'; // import { Link } from 'react-router-dom'; diff --git a/src/Home.js b/src/Home.js index 169f1597b454b93370a22770cec0d3e57576bee8..7a469ba84f2bed92f6eec31481364ea7481e8cc3 100644 --- a/src/Home.js +++ b/src/Home.js @@ -1,14 +1,15 @@ // import bg from './img_study.jpg' // import korea from './img_korea.jpg' -import React, { useState } from 'react' +import React, { useState} from 'react' import { Redirect } from 'react-router-dom'; - function Home() { const [name, setName] = useState('') const [password, SetPassword] = useState('') const [done, setDone] = useState(false) + const [admin, setAdmin] = useState(false); + const handleChangename = (event) => { setName(event.target.value) } @@ -16,13 +17,20 @@ function Home() { SetPassword(event.target.value) } - function checking() { + function handleClick() { if (!name) { alert('이름을 입력하세요') } else if (!password) { alert('비밀번호를 입력하세요') } + else if (name === 'admin' && password === '0001') { + console.log('done') + + return (setAdmin(true) + + ) + } else if (password !== '0319') { alert('유효한 비밀번호를 입력하세요') } @@ -35,59 +43,41 @@ function Home() { } + + + return ( <> + {admin ? : ''} {done ? : ''} - {/*
-
*/} -
- {/* korea */} +

KOREA UNIVERSITY -

- + +
-
+
-
+
- - {/*
*/} - {/*
- 이름(Name) - -
-
- 비밀번호(Password) - -
-
- -
*/} - - {/* localStorage를 사용해야는지 localstorage를 사용해야하는지 */} - {/*
*/} - - - {/*
*/} ) diff --git a/src/Quiz.js b/src/Quiz.js index e069e6db251b9b50cfae0df56ab162844abcc47f..603479dc720aa5425fc0013965da45e5d69b84e9 100644 --- a/src/Quiz.js +++ b/src/Quiz.js @@ -1,5 +1,5 @@ import React, { useState } from 'react' -import { Link } from 'react-router-dom'; +import { Link, Redirect } from 'react-router-dom'; import Timer from 'react-compound-timer'; // 타이머쓰기위해 import import logo from './img_question.png' @@ -11,7 +11,8 @@ const QnA = [ { Q: "3 - 1 = ?", Choose: [1, 2, 3, 4], A: "2", N: 3 } ] -let Answers = [] +let Answers = [0,0,0] +localStorage.setItem('Answers', JSON.stringify(Answers)) let Solutions = [4, 3, 2] localStorage.setItem('Solutions', JSON.stringify(Solutions)) @@ -24,6 +25,8 @@ function Quiz() { const [selected, setSelected] = useState("") //선택한 답을 보여줄 것들 // const [checked, setChecked] = useState(false) + const [timeout, settimeout] = useState(false) + function handleQuestion() { setQuestion({ ...QnA[question.i + 1], i: question.i + 1, page: question.page + 1 }) // setChecked(false) @@ -35,9 +38,10 @@ function Quiz() { Answers[question.N - 1] = Number(ev.target.id) + 1 localStorage.setItem('Answers', JSON.stringify(Answers)) - } + } return ( -
+ <> +
미적분학 퀴즈
@@ -53,30 +57,32 @@ function Quiz() {
{question.Choose.map((a, index) =>
- +
- )} - {/*버튼 숨김*/} + )}
Your Answer : {selected} {/* 선택한 값 보여줌 */}
{(question.page === QnA.length - 1) ? - + : }

alert('시간이 초과되었습니다.'), + }, { time: 0, - callback: 제출 - // history.go(1) + callback: () => settimeout(true), + } ]} > @@ -92,6 +98,8 @@ function Quiz() {

+ {timeout ? : '' } + ) diff --git a/src/index.js b/src/index.js index e10a9d0c9df3c0824decb34ebe6f126b1779f6aa..c39d898eeed3c29fcaa29b9b7feb7f8b1a344423 100644 --- a/src/index.js +++ b/src/index.js @@ -1,5 +1,6 @@ import React from 'react'; import ReactDOM from 'react-dom'; +import 'react-dom' import './index.css'; import App from './App'; // import Quiz from './Quiz'; diff --git a/src/index2.js b/src/index2.js new file mode 100644 index 0000000000000000000000000000000000000000..d789e1ff3d31706f80a0a21d9ce9bd66e98017f7 --- /dev/null +++ b/src/index2.js @@ -0,0 +1,27 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import 'react-dom' +import './index.css'; + +import Home from './Home' +import Quiz from './Quiz' +import End from './End' + +import { BrowserRouter as Router, Route } from 'react-router-dom'; +// import Quiz from './Quiz'; +import * as serviceWorker from './serviceWorker'; +import 'bootstrap/dist/css/bootstrap.css' + +ReactDOM.render( + + + + + , + document.getElementById('root') +); + +// If you want your app to work offline and load faster, you can change +// unregister() to register() below. Note this comes with some pitfalls. +// Learn more about service workers: https://bit.ly/CRA-PWA +serviceWorker.unregister();