Picking DAFTARCHES Allowd

main
Pedram Keshavarzi 3 years ago
parent 9ef8944ab6
commit dd6d6966b8
  1. 3
      src/components/Checkbox/index.js
  2. 108
      src/view/addExam/views/addQuestions.js

@ -3,6 +3,7 @@ import './index.css';
export default function Checkbox(props) { export default function Checkbox(props) {
// console.log(props) // console.log(props)
// document.getElementById('ch'+props.name).checked === true && props.checkedFunction();
return ( return (
<div> <div>
<svg className="checkbox-symbol"> <svg className="checkbox-symbol">
@ -17,7 +18,7 @@ export default function Checkbox(props) {
</svg> </svg>
<div className="checkbox-container"> <div className="checkbox-container">
<input className="checkbox-input" name={props.name} id={"ch"+props.name} type="checkbox" checked={props.checked} onClick={props.onclick} onChange={props.onChange}/> <input className="checkbox-input" name={props.name} id={"ch"+props.name} type="checkbox" onClick={props.onclick} onChange={props.onChange}/>
<label className="checkbox" htmlFor={"ch"+props.name}> <label className="checkbox" htmlFor={"ch"+props.name}>
<span> <span>
<svg width="12px" height="10px"> <svg width="12px" height="10px">

@ -12,6 +12,8 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
const [description, setDescription] = useState(null); const [description, setDescription] = useState(null);
const [questionarePopUp, setQuestionairePopUp] = useState(false); const [questionarePopUp, setQuestionairePopUp] = useState(false);
const [showCoursesInList, setShowCoursesInList] = useState([]); const [showCoursesInList, setShowCoursesInList] = useState([]);
const [choosedQuestionaries, seChoosedQuestionaries] = useState([]);
console.log(choosedQuestionaries)
useEffect(() => { useEffect(() => {
questoinaresLists.map(item => showCoursesInList.push(false)); questoinaresLists.map(item => showCoursesInList.push(false));
@ -27,7 +29,7 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
numberOfQuestions: 60, numberOfQuestions: 60,
courses: [ courses: [
{ {
sortId: 1, sortId: 1,
title: 'ادبیات فارسی', title: 'ادبیات فارسی',
coefficient: 3, coefficient: 3,
questionStart: 1, questionStart: 1,
@ -35,7 +37,7 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
}, },
{ {
sortId: 2, sortId: 2,
title: 'عربی', title: 'عربی',
coefficient: 3, coefficient: 3,
questionStart: 21, questionStart: 21,
@ -43,7 +45,7 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
}, },
{ {
sortId: 3, sortId: 3,
title: 'دینی', title: 'دینی',
coefficient: 2, coefficient: 2,
questionStart: 36, questionStart: 36,
@ -51,7 +53,7 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
}, },
{ {
sortId: 4, sortId: 4,
title: 'زبان خارجه', title: 'زبان خارجه',
coefficient: 1, coefficient: 1,
questionStart: 47, questionStart: 47,
@ -61,12 +63,12 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
] ]
}, },
{ {
id: 1, id: 2,
title: 'دفترچه عمومی', title: 'دفترچه عمومی',
numberOfQuestions: 60, numberOfQuestions: 60,
courses: [ courses: [
{ {
sortId: 1, sortId: 1,
title: 'ادبیات فارسی', title: 'ادبیات فارسی',
coefficient: 3, coefficient: 3,
questionStart: 1, questionStart: 1,
@ -74,7 +76,7 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
}, },
{ {
sortId: 2, sortId: 2,
title: 'عربی', title: 'عربی',
coefficient: 3, coefficient: 3,
questionStart: 21, questionStart: 21,
@ -82,7 +84,7 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
}, },
{ {
sortId: 3, sortId: 3,
title: 'دینی', title: 'دینی',
coefficient: 2, coefficient: 2,
questionStart: 36, questionStart: 36,
@ -90,7 +92,7 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
}, },
{ {
sortId: 4, sortId: 4,
title: 'زبان خارجه', title: 'زبان خارجه',
coefficient: 1, coefficient: 1,
questionStart: 47, questionStart: 47,
@ -119,48 +121,60 @@ const AddQuestions = ({ grades, addExamState, dispatch, stepClick, backStep }) =
</div> </div>
</div> </div>
<div className="w-full flex items-center flex-col overflow-x-hidden mt-6 px-2 overflow-scroll" style={{height: '400px'}}> <div className="w-full flex items-center flex-col overflow-x-hidden mt-6 px-2 overflow-scroll" style={{ height: '400px' }}>
{ {
questoinaresLists.map( questoinaresLists.map(
(item, index) => ( (item, index) => (
<> <>
<div className="w-full flex items-center py-2 justify-between border-b pl-8 border-gray-300"> <div className="w-full flex items-center py-2 justify-between border-b pl-8 border-gray-300">
<Checkbox name={`PICK_QUESTIONARE_${index}`} /> <Checkbox name={`PICK_QUESTIONARE_${index}`}
<h2 className="text-red26 font-bold">{item.title}</h2> onChange={(e) =>
<h4>تعداد سوالات: {item.numberOfQuestions}</h4> e.target.checked ?
<p>تعداد دروس: {item.courses.length}</p> seChoosedQuestionaries([...choosedQuestionaries, item])
<p className="cursor-pointer" onClick={() => { :
let newArray = [...showCoursesInList];
newArray[index] = !newArray[index]; seChoosedQuestionaries(choosedQuestionaries.filter(itm => itm.id !== item.id))
setShowCoursesInList(newArray) }
}}>نمایش دروس</p> />
<h2 className="text-red26 font-bold">{item.title}</h2>
</div> <h4>تعداد سوالات: {item.numberOfQuestions}</h4>
{ <p>تعداد دروس: {item.courses.length}</p>
showCoursesInList[index] && <div className="w-full flex flex-col"> <p className="cursor-pointer" onClick={() => {
{ let newArray = [...showCoursesInList];
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}`}> newArray[index] = !newArray[index];
<p className="w-1/3">
{course.title}
</p> setShowCoursesInList(newArray)
<p className="w-1/3">
ضریب : {course.coefficient} }}>نمایش دروس</p>
</p>
<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" className="w-1/3"
>از سوال {course.questionStart} تا سوال {course.questionEnd}</p> >از سوال {course.questionStart} تا سوال {course.questionEnd}</p>
</div> </div>
) ) ))
} }
</div> </div>
} }
</> </>
) )
) )
} }
</div> </div>

Loading…
Cancel
Save