Commit 1dd02a47 authored by baesangjune's avatar baesangjune
Browse files

.

parent d42e8f9e
...@@ -6,30 +6,30 @@ let QuizBtn=[] ...@@ -6,30 +6,30 @@ let QuizBtn=[]
function Admin() { function Admin() {
const[result, setresult] = useState('') const [result, setresult] = useState('')
const[QuizBtnCount, setQuizBtnCount] = useState(4) const [QuizBtnCount, setQuizBtnCount] = useState(4)
function handleClickSetting(){ function handleClickSetting() {
setresult(<AdminSetting/>) setresult(<AdminSetting />)
} }
function handleClickQuiz(){ function handleClickQuiz(e) {
setresult(<AdminQuiz/>) setresult(<AdminQuiz QuizNum={e.target.id} data={JSON.parse(localStorage.getItem('QnA'))} />)
} }
function handleClickAddQuiz(){ function handleClickAddQuiz() {
QuizBtn.push( QuizBtn.push(
<button type='button' className='btn btn-outline-primary' id={QuizBtnCount} onClick={handleClickQuiz}>Quiz {QuizBtnCount}</button> <button type='button' className='btn btn-outline-primary' id={QuizBtnCount} onClick={handleClickQuiz}>Quiz {QuizBtnCount}</button>
) )
setQuizBtnCount(QuizBtnCount+1) setQuizBtnCount(QuizBtnCount + 1)
} }
return ( return (
<> <>
<div className="container-fluid"> <div className="container-fluid">
<div className="row justify-content-md-center mt-5 "> <div className="row justify-content-md-center mt-5">
<div className="col-2 text-center border"> <div className="col-2 text-center border py-5">
<div className="my-5"> <div className="mb-5">
<h4>관리자페이지</h4> <h4>관리자페이지</h4>
</div> </div>
<div> <div>
...@@ -45,16 +45,8 @@ function Admin() { ...@@ -45,16 +45,8 @@ function Admin() {
</div> </div>
</div> </div>
<div className="col-8"> <div className="col-8 ">
<div className="tab-content" id="v-pills-tabContent">
<div className="tab-pane fade show active" id="setting" role="tabpanel" >
<div className="row d-flex justify-content-center">
</div>
</div>
{result} {result}
</div>
</div> </div>
</div> </div>
</div> </div>
......
import React, { useState, useEffect } from 'react'; import React, { useState } from 'react';
// import Admin from './Admin' import AdminQuiz from './AdminQuiz'
import AdminSetting from './AdminSetting'
let list = [] let QuizBtn=[]
let QnAadmins = [] function Admin() {
let QnAadmin = {}
let savechoose = {}
function AdminQuiz(props) { const [result, setresult] = useState('')
const [QuizBtnCount, setQuizBtnCount] = useState(4)
const [question, setQuestion] = useState('') function handleClickSetting() {
const [choose, setChoose] = useState('') setresult(<AdminSetting />)
const [answer, setAnswer] = useState('')
const [selectOption, setselectOption] = useState(1)
const [q, setq] = useState('')
const [c, setc] = useState([])
const [a, seta] = useState('')
useEffect(()=>{
setQuestion('')
if(props.data[props.QuizNum-1]){
setq(props.data[props.QuizNum-1].Q)
setc(props.data[props.QuizNum-1].Choose)
seta(props.data[props.QuizNum-1].A)
}
else {
setq('보기를 입력하세요')
setc(['보기를 입력하세요','보기를 입력하세요','보기를 입력하세요','보기를 입력하세요'])
seta('보기를 입력하세요')
} }
},[props.QuizNum])
const handleChangeQuestion = (event) => { function handleClickQuiz(e) {
QnAadmin['Q'] = event.target.value setresult(<AdminQuiz QuizNum={e.target.id} data={JSON.parse(localStorage.getItem('QnA'))} />)
setQuestion(event.target.value)
}
const handleChangeChoose = (event) => {
savechoose[event.target.id] = event.target.value
setChoose(event.target.value)
}
const handleChangeanswer = (event) => {
QnAadmin['A'] = event.target.value
setAnswer(event.target.value)
} }
function addSelectOption() { function handleClickAddQuiz() {
list.push( QuizBtn.push(
<div className="input-group"> <button type='button' className='btn btn-outline-primary' id={QuizBtnCount} onClick={handleClickQuiz}>Quiz {QuizBtnCount}</button>
<div className="input-group-prepend">
<div className="input-group-text">
<input type="radio" checked={false} name="answer" />
</div>
</div>
<input type="text" class="form-control" id={String(selectOption + 1)} placeholder={c[1]} onChange={handleChangeChoose} />
</div>
) )
setselectOption(selectOption + 1) setQuizBtnCount(QuizBtnCount + 1)
}
function handleClick() {
if (!question) {
alert('문제가 입력되지 않았습니다.')
}
else if (!choose) {
alert('보기가 입력되지 않았습니다.')
}
else if (!answer) {
alert('정답이 입력되지 않았습니다.')
}
else {
// console.log(QnAadmin)
QnAadmin['Choose'] = Object.values(savechoose)
QnAadmin['N'] = String(props.QuizNum)
QnAadmins.push(QnAadmin)
QnAadmin = {}
localStorage.setItem('QnA', JSON.stringify(QnAadmins))
console.log(QnAadmins)
// setselectOption(1)
alert('입력이 완료되었습니다.')
}
} }
return ( return (
<div className="" id="Quiz1"> <>
<h2 className="p-3 border text-center">{String(props.QuizNum)} 문제만들기</h2> <div className="container-fluid">
<div className="p-3 borber"> <div className="row justify-content-md-center mt-5">
<div className="p-3 "> <div className="col-2 text-center border py-5">
<span className="font-weight-bold mr-2 h3">1. 문제 입력하기</span> <div className="mb-5">
<input type="text" id="inputQuiz" className="form-control" value={question} onChange={handleChangeQuestion} placeholder={q} /> <h4>관리자페이지</h4>
</div>
<div className="p-3 ">
<span className="font-weight-bold mr-2 h3">2. 보기 입력하기</span>
<div className="p-3 ">
<div className="input-group">
<div className="input-group-prepend">
<div className="input-group-text">
<input type="radio" checked={false} name="answer" />
</div> </div>
<div>
<button type="button" className="btn btn-outline-info mb-5" onClick={handleClickSetting}>Setting</button>
</div> </div>
<input type="text" className="form-control" id='1' value={choose} placeholder={c[0]} onChange={handleChangeChoose} /> <div class="btn-group-vertical">
</div> <button type="button" className="btn btn-outline-primary" id="1" onClick={handleClickQuiz}>Quiz 1</button>
{list.map((element) => element)} <button type="button" className="btn btn-outline-primary" id="2" onClick={handleClickQuiz}>Quiz 2</button>
<button className="btn btn-outline-secondary btn-sm" onClick={addSelectOption}>+</button> <button type="button" className="btn btn-outline-primary" id="3" onClick={handleClickQuiz}>Quiz 3</button>
{QuizBtn.map((element) => element)}
<button type="button" className="btn btn-outline-primary" onClick={handleClickAddQuiz}>+</button>
</div> </div>
</div> </div>
<div className="p-3 "> <div className="col-8 ">
<span className="font-weight-bold mr-2 h3">정답:</span> {result}
<input type="text" value={answer} onChange={handleChangeanswer} placeholder={a} />
</div> </div>
<label for="inputLogin" className="d-flex justify-content-center">
<button className="mt-4 btn btn-dark" onClick={handleClick}>작성완료</button>
</label>
</div> </div>
</div> </div>
</>
) )
} }
export default AdminQuiz export default Admin
\ No newline at end of file
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