Also Fixed AnswerSheets For Now, Big Bugs!main
parent
27a695e676
commit
5a537d577a
7 changed files with 690 additions and 333 deletions
@ -0,0 +1,54 @@ |
|||||||
|
import React from "react"; |
||||||
|
|
||||||
|
const AddQuestionnaireCourse = ({submitOnClick, nameOnChange, questionQuantityOnChange, coefficientOnChange, closeOnClick}) => { |
||||||
|
return( |
||||||
|
<div className="w-full z-10 fixed h-screen backdrop-blur flex items-center -mt-10 justify-center"> |
||||||
|
<div className="w-1/2 bg-white rounded-xl flex flex-col shadow-lg p-6"> |
||||||
|
<div className="w-full"> |
||||||
|
<div className="w-8 h-8 text-white text-sm rounded-full cursor-pointer flex justify-center items-center bg-red52" onClick={closeOnClick}> |
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 15.044 15.044"> |
||||||
|
<g id="vuesax_linear_card-remove" data-name="vuesax/linear/card-remove" transform="translate(-252.46 -511.461)"> |
||||||
|
<g id="card-remove" transform="translate(253.309 512.31)"> |
||||||
|
<path id="Vector" d="M0,13.347,13.347,0" fill="none" stroke="#fff" strokeLinecap="round" strokeWidth="2" /> |
||||||
|
<path id="Vector-2" data-name="Vector" d="M13.347,13.347,0,0" fill="none" stroke="#fff" strokeLinecap="round" strokeWidth="2" /> |
||||||
|
</g> |
||||||
|
</g> |
||||||
|
</svg> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<h1 className="w-full text-right text-lg text-red52 font-bold pt-4"> |
||||||
|
افزودن درس |
||||||
|
</h1> |
||||||
|
<div className="w-full flex items-center flex-col mt-6 px-2 "> |
||||||
|
<div className="flex justify-between w-full"> |
||||||
|
<input type='text' placeholder="نام درس..." className="w-4/5 p-4 ml-2 rounded border border-red52 h-12 text-red26 outline-none"
|
||||||
|
onChange={nameOnChange}
|
||||||
|
/> |
||||||
|
<input type='number' placeholder="تعداد سوال..." className="w-4/5 p-4 ml-2 rounded border border-red52 h-12 text-red26 outline-none"
|
||||||
|
onChange={questionQuantityOnChange}
|
||||||
|
/> |
||||||
|
<input type='number' placeholder="ضریب ..." className="w-4/5 p-4 ml-2 rounded border border-red52 h-12 text-red26 outline-none"
|
||||||
|
onChange={coefficientOnChange}
|
||||||
|
/> |
||||||
|
<input type='number' placeholder="تعداد گزینه" className="w-4/5 p-4 ml-2 rounded border border-red52 h-12 text-red26 outline-none"
|
||||||
|
// onChange={}
|
||||||
|
/> |
||||||
|
|
||||||
|
</div> |
||||||
|
<div className="flex w-full justify-end pt-4"> |
||||||
|
<button className="px-6 py-2 rounded-md bg-red52 text-white font-bold" |
||||||
|
onClick={submitOnClick} |
||||||
|
> |
||||||
|
تایید |
||||||
|
</button> |
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
) |
||||||
|
} |
||||||
|
|
||||||
|
export default AddQuestionnaireCourse; |
||||||
@ -0,0 +1,277 @@ |
|||||||
|
|
||||||
|
import React, { useEffect, useState } from "react"; |
||||||
|
import { connect } from "react-redux"; |
||||||
|
import AnswerSheet from "../../../components/AnswerSheet"; |
||||||
|
import Button from "../../../components/Button"; |
||||||
|
import DatePicker from "../../../components/Calendar/CalendarComponents/DatePicker"; |
||||||
|
import Checkbox from "../../../components/Checkbox"; |
||||||
|
import RangeDatePicker from "../../../components/RangeDatePicker"; |
||||||
|
import SelectedCourse from "../../../components/selectedCourse"; |
||||||
|
import AddQuestionnaireCourse from "../components/addQuestionnaireCourse"; |
||||||
|
|
||||||
|
const AddQuestionsFromBank = ({ grades, addExamState, dispatch, stepClick, backStep }) => { |
||||||
|
const [name, setName] = useState(null); |
||||||
|
const [type, setType] = useState(null); |
||||||
|
const [description, setDescription] = useState(null); |
||||||
|
const [questionarePopUp, setQuestionairePopUp] = useState(false); |
||||||
|
const [addCoursePopup, setAddCoursePopup] = useState(false); |
||||||
|
const [newQuestionaire, setNewQuestionaire] = useState({ |
||||||
|
id: addExamState.questionnaires.length + 1, |
||||||
|
name: '', |
||||||
|
fileUrl: '', |
||||||
|
}); |
||||||
|
const [showCoursesInList, setShowCoursesInList] = useState([]); |
||||||
|
const [choosedQuestionaries, seChoosedQuestionaries] = useState([]); |
||||||
|
const [selectedQuestionare, setSelectedQuestionare] = useState({ |
||||||
|
id: null,
|
||||||
|
courses: [] |
||||||
|
}); |
||||||
|
const [answers, setAnswers] = useState(null); |
||||||
|
const [newCourse, setNewCourse] = useState({ |
||||||
|
id: addExamState.questionairesCourses.length + 1, |
||||||
|
questionnaireId: selectedQuestionare.id, |
||||||
|
questionsQuantity:20, |
||||||
|
name: '', |
||||||
|
coefficient: 4 |
||||||
|
}) |
||||||
|
const [selectedCourse, setSelectedCourse] = useState({ |
||||||
|
sortId: 1, |
||||||
|
title: 'ادبیات فارسی', |
||||||
|
coefficient: 3, |
||||||
|
questionStart: 1, |
||||||
|
questionEnd: 0, |
||||||
|
|
||||||
|
}) |
||||||
|
// console.log(choosedQuestionaries)
|
||||||
|
// console.log(newQuestionaire)
|
||||||
|
// console.log(addExamState.questionnaires)
|
||||||
|
console.log(newCourse) |
||||||
|
console.log(addExamState.questionairesCourses) |
||||||
|
console.log(selectedCourse) |
||||||
|
console.log(answers) |
||||||
|
|
||||||
|
const [fakeState, setFakeState] = useState(2); |
||||||
|
|
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
// questoinaresLists.map(item => showCoursesInList.push(false));
|
||||||
|
if(answers !== null && answers !== []) { |
||||||
|
answers.map(item => dispatch({type: 'ADD_ANSWERS', payload : item})) |
||||||
|
} |
||||||
|
|
||||||
|
}, [answers]) |
||||||
|
|
||||||
|
const payload = { name: name, description: description, type: type }; |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
return ( |
||||||
|
<> |
||||||
|
{ |
||||||
|
questionarePopUp && <div className="w-full z-10 fixed h-screen backdrop-blur flex items-center -mt-10 justify-center"> |
||||||
|
<div className="w-1/2 bg-white rounded-xl flex flex-col shadow-lg p-6"> |
||||||
|
<div className="w-full"> |
||||||
|
<div className="w-8 h-8 text-white text-sm rounded-full cursor-pointer flex justify-center items-center bg-red52" onClick={() => setQuestionairePopUp(false)}> |
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 15.044 15.044"> |
||||||
|
<g id="vuesax_linear_card-remove" data-name="vuesax/linear/card-remove" transform="translate(-252.46 -511.461)"> |
||||||
|
<g id="card-remove" transform="translate(253.309 512.31)"> |
||||||
|
<path id="Vector" d="M0,13.347,13.347,0" fill="none" stroke="#fff" strokeLinecap="round" strokeWidth="2" /> |
||||||
|
<path id="Vector-2" data-name="Vector" d="M13.347,13.347,0,0" fill="none" stroke="#fff" strokeLinecap="round" strokeWidth="2" /> |
||||||
|
</g> |
||||||
|
</g> |
||||||
|
</svg> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<h1 className="w-full text-right text-lg text-red52 font-bold pt-4"> |
||||||
|
افزودن دفترچه |
||||||
|
</h1> |
||||||
|
<div className="w-full flex items-center flex-col mt-6 px-2 "> |
||||||
|
<div className="flex justify-between w-full"> |
||||||
|
<input type='text' placeholder="نام دفترچه..." className="w-4/5 p-4 ml-2 rounded border border-red52 h-12 text-red26 outline-none"
|
||||||
|
onChange={e => setNewQuestionaire({...newQuestionaire, name: e.target.value})} /> |
||||||
|
<input type="file" placeholder="آپلود فایل دفترچه" className="bg-white items-center flex h-12 text-red26 outline-none" |
||||||
|
/> |
||||||
|
</div> |
||||||
|
<div className="flex w-full justify-end pt-2"> |
||||||
|
<button className="px-6 py-2 rounded-md bg-red52 text-white font-bold" |
||||||
|
onClick={() => {dispatch({type: 'ADD_EXAM_QUESTIONAIRES', payload: newQuestionaire}); setQuestionairePopUp(false) }} |
||||||
|
> |
||||||
|
تایید |
||||||
|
</button> |
||||||
|
</div> |
||||||
|
|
||||||
|
{/* { |
||||||
|
questoinaresLists.map( |
||||||
|
(item, index) => ( |
||||||
|
<> |
||||||
|
<div className="w-full flex items-center py-2 justify-between border-b pl-8 border-gray-300"> |
||||||
|
<Checkbox name={`PICK_QUESTIONARE_${index}`} |
||||||
|
onChange={(e) =>
|
||||||
|
e.target.checked ?
|
||||||
|
seChoosedQuestionaries([...choosedQuestionaries, item]) |
||||||
|
:
|
||||||
|
|
||||||
|
|
||||||
|
seChoosedQuestionaries(choosedQuestionaries.filter(itm => itm.id !== item.id)) |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
/> |
||||||
|
<h2 className="text-red26 font-bold">{item.title}</h2> |
||||||
|
<h4>تعداد سوالات: {item.numberOfQuestions}</h4> |
||||||
|
<p>تعداد دروس: {item.courses.length}</p> |
||||||
|
<p className="cursor-pointer" onClick={() => { |
||||||
|
let newArray = [...showCoursesInList]; |
||||||
|
|
||||||
|
newArray[index] = !newArray[index]; |
||||||
|
|
||||||
|
|
||||||
|
setShowCoursesInList(newArray) |
||||||
|
|
||||||
|
}}>نمایش دروس</p> |
||||||
|
|
||||||
|
</div> |
||||||
|
{ |
||||||
|
showCoursesInList[index] && <div className="w-full flex flex-col"> |
||||||
|
{ |
||||||
|
item.courses.map((course) => ( |
||||||
|
<div className="w-full flex items-center text-right px-8 py-1 border-b border-gray-100" key={`COURSE_IN_LIST__${course.sortId}`}> |
||||||
|
<p className="w-1/3"> |
||||||
|
{course.title} |
||||||
|
</p> |
||||||
|
<p className="w-1/3"> |
||||||
|
ضریب : {course.coefficient} |
||||||
|
</p> |
||||||
|
<p |
||||||
|
className="w-1/3" |
||||||
|
>از سوال {course.questionStart} تا سوال {course.questionEnd}</p> |
||||||
|
</div> |
||||||
|
)) |
||||||
|
} |
||||||
|
</div> |
||||||
|
} |
||||||
|
</> |
||||||
|
) |
||||||
|
) |
||||||
|
} */} |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
} |
||||||
|
{ |
||||||
|
addCoursePopup &&
|
||||||
|
<AddQuestionnaireCourse |
||||||
|
closeOnClick={() => setAddCoursePopup(false)} |
||||||
|
nameOnChange={e => setNewCourse({...newCourse, name: e.target.value})} |
||||||
|
coefficientOnChange={e => setNewCourse({...newCourse, coefficient: e.target.vlaue})} |
||||||
|
questionQuantityOnChange={e => setNewCourse({...newCourse, questionsQuantity: e.target.value, questionnaireId: selectedQuestionare.id})} |
||||||
|
submitOnClick={() => {dispatch({type: 'ADD_QUESTIONNAIRE_COURSES', payload : newCourse}); setAddCoursePopup(false); setFakeState(fakeState + 356)} } |
||||||
|
/> |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
<div className="flex py-10 items-start px-10 border-b border-gray-300"> |
||||||
|
<div className="flex flex-col w-1/6"> |
||||||
|
<div className="text-blue3A text-lg font-bold text-right px-4 border-r-4 border-blue65"> |
||||||
|
تنظیمات آزمون |
||||||
|
|
||||||
|
</div> |
||||||
|
<p className="text-sm text-right font-bold pt-4 text-gray-500">لطفا مشخضات آزمون را تکمیل کنید</p> |
||||||
|
</div> |
||||||
|
<div className="w-5/6 flex flex-row"> |
||||||
|
|
||||||
|
{ |
||||||
|
addExamState.questionnaires.map( |
||||||
|
(item => ( |
||||||
|
<div className={`flex flex-col ${selectedQuestionare.id === item.id ? 'bg-pinkF5 border border-red52 text-red52' : 'bg-white border border-gray-300 text-blue3A'} items-center justify-center w-36 h-32 mx-2 font-bold rounded-xl cursor-pointer`} |
||||||
|
onClick={() => setSelectedQuestionare({id : item.id,name: item.name, courses: addExamState.questionairesCourses.filter(itm => itm.questionnaireId == item.id)})} |
||||||
|
> |
||||||
|
|
||||||
|
<p className="text-red52"> |
||||||
|
دفترچه {item.name} |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
)) |
||||||
|
) |
||||||
|
} |
||||||
|
|
||||||
|
<div className="flex flex-col bg-white items-center justify-center w-36 h-32 mx-2 font-bold border border-gray-300 text-blue3A rounded-xl cursor-pointer" onClick={() => addExamState.type == 'bank' ? console.log('bank') : setQuestionairePopUp(true)}> |
||||||
|
<p className="" style={{ fontSize: '40px' }}> |
||||||
|
+ |
||||||
|
</p> |
||||||
|
<p className=""> |
||||||
|
{addExamState.type == 'bank' ? 'افزودن درس' : 'افزودن دفترچه'} |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
<div className="w-full flex px-10"> |
||||||
|
|
||||||
|
<div className="w-1/2 border-l flex flex-col border-gray-300 py-10"> |
||||||
|
{ |
||||||
|
selectedQuestionare.id !== null && (<> |
||||||
|
<h1 className="text-blue3A w-full font-bold text-lg text-right"> |
||||||
|
دفترچه {selectedQuestionare.name} |
||||||
|
</h1> |
||||||
|
<div className="flex flex-col items-center overflow-x-hidden overflow-scroll" style={{height: '500px'}}> |
||||||
|
<div className="w-4/5 "> |
||||||
|
|
||||||
|
{ |
||||||
|
addExamState.questionairesCourses.filter(itm => itm.questionnaireId == selectedQuestionare.id).map( |
||||||
|
(item) => ( |
||||||
|
<SelectedCourse title={item.name} coefficient={item.coefficient} questionQuantity={item.questionsQuantity}
|
||||||
|
onClick={() => {setSelectedCourse(item); console.log(selectedCourse)}}/> |
||||||
|
) |
||||||
|
) |
||||||
|
} |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</>) |
||||||
|
} |
||||||
|
{selectedQuestionare.id !== null && |
||||||
|
<div className="w-full flex justify-center mt-10"> |
||||||
|
<button className=" bg-gray-300 text-xl text-gray-500 border-gray-500 w-1/3 h-12 rounded-xl border" onClick={() => setAddCoursePopup(true)}> |
||||||
|
افزودن درس |
||||||
|
</button> |
||||||
|
</div>} |
||||||
|
</div> |
||||||
|
<div className="w-1/2 flex justify-center"> |
||||||
|
<div className="w-4/5 py-8"> |
||||||
|
<AnswerSheet questionsQuantity={selectedCourse.questionsQuantity} optionsQuantity={4} selectedCourseId={selectedCourse.id} |
||||||
|
passAnswers={data => {setAnswers(data); setFakeState(fakeState - 2)}}/> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
<div className="flex w-full px-10 items-center justify-end"> |
||||||
|
<button className=' mx-6 h-12 mt-4 text-red52 font-bold flex items-center justify-center' onClick={() => backStep()}> بازگشت به مرحله قبل </button> |
||||||
|
<Button |
||||||
|
title='ارسال پیام' |
||||||
|
className='w-1/12' |
||||||
|
onClick={() => { |
||||||
|
dispatch({ type: 'ADD_EXAM_DESCRIPTION', payload }); |
||||||
|
stepClick() |
||||||
|
}} |
||||||
|
|
||||||
|
/> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
</> |
||||||
|
) |
||||||
|
} |
||||||
|
|
||||||
|
const mapStateToProps = (state) => ({ |
||||||
|
grades: state.publicApi.grades, |
||||||
|
addExamState: state.addExamReduser |
||||||
|
}) |
||||||
|
|
||||||
|
export default connect(mapStateToProps)(AddQuestionsFromBank); |
||||||
@ -0,0 +1,277 @@ |
|||||||
|
|
||||||
|
import React, { useEffect, useState } from "react"; |
||||||
|
import { connect } from "react-redux"; |
||||||
|
import AnswerSheet from "../../../components/AnswerSheet"; |
||||||
|
import Button from "../../../components/Button"; |
||||||
|
import DatePicker from "../../../components/Calendar/CalendarComponents/DatePicker"; |
||||||
|
import Checkbox from "../../../components/Checkbox"; |
||||||
|
import RangeDatePicker from "../../../components/RangeDatePicker"; |
||||||
|
import SelectedCourse from "../../../components/selectedCourse"; |
||||||
|
import AddQuestionnaireCourse from "../components/addQuestionnaireCourse"; |
||||||
|
|
||||||
|
const AddQuestionnaireExam = ({ grades, addExamState, dispatch, stepClick, backStep }) => { |
||||||
|
const [name, setName] = useState(null); |
||||||
|
const [type, setType] = useState(null); |
||||||
|
const [description, setDescription] = useState(null); |
||||||
|
const [questionarePopUp, setQuestionairePopUp] = useState(false); |
||||||
|
const [addCoursePopup, setAddCoursePopup] = useState(false); |
||||||
|
const [newQuestionaire, setNewQuestionaire] = useState({ |
||||||
|
id: addExamState.questionnaires.length + 1, |
||||||
|
name: '', |
||||||
|
fileUrl: '', |
||||||
|
}); |
||||||
|
const [showCoursesInList, setShowCoursesInList] = useState([]); |
||||||
|
const [choosedQuestionaries, seChoosedQuestionaries] = useState([]); |
||||||
|
const [selectedQuestionare, setSelectedQuestionare] = useState({ |
||||||
|
id: null,
|
||||||
|
courses: [] |
||||||
|
}); |
||||||
|
const [answers, setAnswers] = useState(null); |
||||||
|
const [newCourse, setNewCourse] = useState({ |
||||||
|
id: addExamState.questionairesCourses.length + 1, |
||||||
|
questionnaireId: selectedQuestionare.id, |
||||||
|
questionsQuantity:20, |
||||||
|
name: '', |
||||||
|
coefficient: 4 |
||||||
|
}) |
||||||
|
const [selectedCourse, setSelectedCourse] = useState({ |
||||||
|
sortId: 1, |
||||||
|
title: 'ادبیات فارسی', |
||||||
|
coefficient: 3, |
||||||
|
questionStart: 1, |
||||||
|
questionEnd: 0, |
||||||
|
|
||||||
|
}) |
||||||
|
// console.log(choosedQuestionaries)
|
||||||
|
// console.log(newQuestionaire)
|
||||||
|
// console.log(addExamState.questionnaires)
|
||||||
|
console.log(newCourse) |
||||||
|
console.log(addExamState.questionairesCourses) |
||||||
|
console.log(selectedCourse) |
||||||
|
console.log(answers) |
||||||
|
|
||||||
|
const [fakeState, setFakeState] = useState(2); |
||||||
|
|
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
// questoinaresLists.map(item => showCoursesInList.push(false));
|
||||||
|
if(answers !== null && answers !== []) { |
||||||
|
answers.map(item => dispatch({type: 'ADD_ANSWERS', payload : item})) |
||||||
|
} |
||||||
|
|
||||||
|
}, [answers]) |
||||||
|
|
||||||
|
const payload = { name: name, description: description, type: type }; |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
return ( |
||||||
|
<> |
||||||
|
{ |
||||||
|
questionarePopUp && <div className="w-full z-10 fixed h-screen backdrop-blur flex items-center -mt-10 justify-center"> |
||||||
|
<div className="w-1/2 bg-white rounded-xl flex flex-col shadow-lg p-6"> |
||||||
|
<div className="w-full"> |
||||||
|
<div className="w-8 h-8 text-white text-sm rounded-full cursor-pointer flex justify-center items-center bg-red52" onClick={() => setQuestionairePopUp(false)}> |
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 15.044 15.044"> |
||||||
|
<g id="vuesax_linear_card-remove" data-name="vuesax/linear/card-remove" transform="translate(-252.46 -511.461)"> |
||||||
|
<g id="card-remove" transform="translate(253.309 512.31)"> |
||||||
|
<path id="Vector" d="M0,13.347,13.347,0" fill="none" stroke="#fff" strokeLinecap="round" strokeWidth="2" /> |
||||||
|
<path id="Vector-2" data-name="Vector" d="M13.347,13.347,0,0" fill="none" stroke="#fff" strokeLinecap="round" strokeWidth="2" /> |
||||||
|
</g> |
||||||
|
</g> |
||||||
|
</svg> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<h1 className="w-full text-right text-lg text-red52 font-bold pt-4"> |
||||||
|
افزودن دفترچه |
||||||
|
</h1> |
||||||
|
<div className="w-full flex items-center flex-col mt-6 px-2 "> |
||||||
|
<div className="flex justify-between w-full"> |
||||||
|
<input type='text' placeholder="نام دفترچه..." className="w-4/5 p-4 ml-2 rounded border border-red52 h-12 text-red26 outline-none"
|
||||||
|
onChange={e => setNewQuestionaire({...newQuestionaire, name: e.target.value})} /> |
||||||
|
<input type="file" placeholder="آپلود فایل دفترچه" className="bg-white items-center flex h-12 text-red26 outline-none" |
||||||
|
/> |
||||||
|
</div> |
||||||
|
<div className="flex w-full justify-end pt-2"> |
||||||
|
<button className="px-6 py-2 rounded-md bg-red52 text-white font-bold" |
||||||
|
onClick={() => {dispatch({type: 'ADD_EXAM_QUESTIONAIRES', payload: newQuestionaire}); setQuestionairePopUp(false) }} |
||||||
|
> |
||||||
|
تایید |
||||||
|
</button> |
||||||
|
</div> |
||||||
|
|
||||||
|
{/* { |
||||||
|
questoinaresLists.map( |
||||||
|
(item, index) => ( |
||||||
|
<> |
||||||
|
<div className="w-full flex items-center py-2 justify-between border-b pl-8 border-gray-300"> |
||||||
|
<Checkbox name={`PICK_QUESTIONARE_${index}`} |
||||||
|
onChange={(e) =>
|
||||||
|
e.target.checked ?
|
||||||
|
seChoosedQuestionaries([...choosedQuestionaries, item]) |
||||||
|
:
|
||||||
|
|
||||||
|
|
||||||
|
seChoosedQuestionaries(choosedQuestionaries.filter(itm => itm.id !== item.id)) |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
/> |
||||||
|
<h2 className="text-red26 font-bold">{item.title}</h2> |
||||||
|
<h4>تعداد سوالات: {item.numberOfQuestions}</h4> |
||||||
|
<p>تعداد دروس: {item.courses.length}</p> |
||||||
|
<p className="cursor-pointer" onClick={() => { |
||||||
|
let newArray = [...showCoursesInList]; |
||||||
|
|
||||||
|
newArray[index] = !newArray[index]; |
||||||
|
|
||||||
|
|
||||||
|
setShowCoursesInList(newArray) |
||||||
|
|
||||||
|
}}>نمایش دروس</p> |
||||||
|
|
||||||
|
</div> |
||||||
|
{ |
||||||
|
showCoursesInList[index] && <div className="w-full flex flex-col"> |
||||||
|
{ |
||||||
|
item.courses.map((course) => ( |
||||||
|
<div className="w-full flex items-center text-right px-8 py-1 border-b border-gray-100" key={`COURSE_IN_LIST__${course.sortId}`}> |
||||||
|
<p className="w-1/3"> |
||||||
|
{course.title} |
||||||
|
</p> |
||||||
|
<p className="w-1/3"> |
||||||
|
ضریب : {course.coefficient} |
||||||
|
</p> |
||||||
|
<p |
||||||
|
className="w-1/3" |
||||||
|
>از سوال {course.questionStart} تا سوال {course.questionEnd}</p> |
||||||
|
</div> |
||||||
|
)) |
||||||
|
} |
||||||
|
</div> |
||||||
|
} |
||||||
|
</> |
||||||
|
) |
||||||
|
) |
||||||
|
} */} |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
} |
||||||
|
{ |
||||||
|
addCoursePopup &&
|
||||||
|
<AddQuestionnaireCourse |
||||||
|
closeOnClick={() => setAddCoursePopup(false)} |
||||||
|
nameOnChange={e => setNewCourse({...newCourse, name: e.target.value})} |
||||||
|
coefficientOnChange={e => setNewCourse({...newCourse, coefficient: e.target.vlaue})} |
||||||
|
questionQuantityOnChange={e => setNewCourse({...newCourse, questionsQuantity: e.target.value, questionnaireId: selectedQuestionare.id})} |
||||||
|
submitOnClick={() => {dispatch({type: 'ADD_QUESTIONNAIRE_COURSES', payload : newCourse}); setAddCoursePopup(false); setFakeState(fakeState + 356)} } |
||||||
|
/> |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
<div className="flex py-10 items-start px-10 border-b border-gray-300"> |
||||||
|
<div className="flex flex-col w-1/6"> |
||||||
|
<div className="text-blue3A text-lg font-bold text-right px-4 border-r-4 border-blue65"> |
||||||
|
تنظیمات آزمون |
||||||
|
|
||||||
|
</div> |
||||||
|
<p className="text-sm text-right font-bold pt-4 text-gray-500">لطفا مشخضات آزمون را تکمیل کنید</p> |
||||||
|
</div> |
||||||
|
<div className="w-5/6 flex flex-row"> |
||||||
|
|
||||||
|
{ |
||||||
|
addExamState.questionnaires.map( |
||||||
|
(item => ( |
||||||
|
<div className={`flex flex-col ${selectedQuestionare.id === item.id ? 'bg-pinkF5 border border-red52 text-red52' : 'bg-white border border-gray-300 text-blue3A'} items-center justify-center w-36 h-32 mx-2 font-bold rounded-xl cursor-pointer`} |
||||||
|
onClick={() => setSelectedQuestionare({id : item.id,name: item.name, courses: addExamState.questionairesCourses.filter(itm => itm.questionnaireId == item.id)})} |
||||||
|
> |
||||||
|
|
||||||
|
<p className="text-red52"> |
||||||
|
دفترچه {item.name} |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
)) |
||||||
|
) |
||||||
|
} |
||||||
|
|
||||||
|
<div className="flex flex-col bg-white items-center justify-center w-36 h-32 mx-2 font-bold border border-gray-300 text-blue3A rounded-xl cursor-pointer" onClick={() => addExamState.type == 'bank' ? console.log('bank') : setQuestionairePopUp(true)}> |
||||||
|
<p className="" style={{ fontSize: '40px' }}> |
||||||
|
+ |
||||||
|
</p> |
||||||
|
<p className=""> |
||||||
|
{addExamState.type == 'bank' ? 'افزودن درس' : 'افزودن دفترچه'} |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
<div className="w-full flex px-10"> |
||||||
|
|
||||||
|
<div className="w-1/2 border-l flex flex-col border-gray-300 py-10"> |
||||||
|
{ |
||||||
|
selectedQuestionare.id !== null && (<> |
||||||
|
<h1 className="text-blue3A w-full font-bold text-lg text-right"> |
||||||
|
دفترچه {selectedQuestionare.name} |
||||||
|
</h1> |
||||||
|
<div className="flex flex-col items-center overflow-x-hidden overflow-scroll" style={{height: '500px'}}> |
||||||
|
<div className="w-4/5 "> |
||||||
|
|
||||||
|
{ |
||||||
|
addExamState.questionairesCourses.filter(itm => itm.questionnaireId == selectedQuestionare.id).map( |
||||||
|
(item) => ( |
||||||
|
<SelectedCourse title={item.name} coefficient={item.coefficient} questionQuantity={item.questionsQuantity}
|
||||||
|
onClick={() => {setSelectedCourse(item); console.log(selectedCourse)}}/> |
||||||
|
) |
||||||
|
) |
||||||
|
} |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</>) |
||||||
|
} |
||||||
|
{selectedQuestionare.id !== null && |
||||||
|
<div className="w-full flex justify-center mt-10"> |
||||||
|
<button className=" bg-gray-300 text-xl text-gray-500 border-gray-500 w-1/3 h-12 rounded-xl border" onClick={() => setAddCoursePopup(true)}> |
||||||
|
افزودن درس |
||||||
|
</button> |
||||||
|
</div>} |
||||||
|
</div> |
||||||
|
<div className="w-1/2 flex justify-center"> |
||||||
|
<div className="w-4/5 py-8"> |
||||||
|
<AnswerSheet questionsQuantity={selectedCourse.questionsQuantity} optionsQuantity={4} selectedCourseId={selectedCourse.id} |
||||||
|
passAnswers={data => {setAnswers(data); setFakeState(fakeState - 2)}}/> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
<div className="flex w-full px-10 items-center justify-end"> |
||||||
|
<button className=' mx-6 h-12 mt-4 text-red52 font-bold flex items-center justify-center' onClick={() => backStep()}> بازگشت به مرحله قبل </button> |
||||||
|
<Button |
||||||
|
title='ارسال پیام' |
||||||
|
className='w-1/12' |
||||||
|
onClick={() => { |
||||||
|
dispatch({ type: 'ADD_EXAM_DESCRIPTION', payload }); |
||||||
|
stepClick() |
||||||
|
}} |
||||||
|
|
||||||
|
/> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
</> |
||||||
|
) |
||||||
|
} |
||||||
|
|
||||||
|
const mapStateToProps = (state) => ({ |
||||||
|
grades: state.publicApi.grades, |
||||||
|
addExamState: state.addExamReduser |
||||||
|
}) |
||||||
|
|
||||||
|
export default connect(mapStateToProps)(AddQuestionnaireExam); |
||||||
Loading…
Reference in new issue