|
|
|
@ -1,20 +1,172 @@ |
|
|
|
|
|
|
|
|
|
import React, { useState } from "react"; |
|
|
|
|
import React, { useEffect, useState } from "react"; |
|
|
|
|
import { connect } from "react-redux"; |
|
|
|
|
import Button from "../../../components/Button"; |
|
|
|
|
import DatePicker from "../../../components/Calendar/CalendarComponents/DatePicker"; |
|
|
|
|
import Checkbox from "../../../components/Checkbox"; |
|
|
|
|
import RangeDatePicker from "../../../components/RangeDatePicker"; |
|
|
|
|
|
|
|
|
|
const AddQuestions = ({grades, addExamState, dispatch, stepClick, backStep}) => { |
|
|
|
|
const AddQuestions = ({ 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 [showCoursesInList, setShowCoursesInList] = useState([]); |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
questoinaresLists.map(item => showCoursesInList.push(false)); |
|
|
|
|
console.log(showCoursesInList) |
|
|
|
|
}, []) |
|
|
|
|
|
|
|
|
|
const payload = { name: name, description: description, type: type }; |
|
|
|
|
|
|
|
|
|
const questoinaresLists = [ |
|
|
|
|
{ |
|
|
|
|
id: 1, |
|
|
|
|
title: 'دفترچه عمومی', |
|
|
|
|
numberOfQuestions: 60, |
|
|
|
|
courses: [ |
|
|
|
|
{ |
|
|
|
|
sortId: 1,
|
|
|
|
|
title: 'ادبیات فارسی', |
|
|
|
|
coefficient: 3, |
|
|
|
|
questionStart: 1, |
|
|
|
|
questionEnd: 20, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
sortId: 2,
|
|
|
|
|
title: 'عربی', |
|
|
|
|
coefficient: 3, |
|
|
|
|
questionStart: 21, |
|
|
|
|
questionEnd: 35, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
sortId: 3,
|
|
|
|
|
title: 'دینی', |
|
|
|
|
coefficient: 2, |
|
|
|
|
questionStart: 36, |
|
|
|
|
questionEnd: 46, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
sortId: 4,
|
|
|
|
|
title: 'زبان خارجه', |
|
|
|
|
coefficient: 1, |
|
|
|
|
questionStart: 47, |
|
|
|
|
questionEnd: 60, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
] |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
id: 1, |
|
|
|
|
title: 'دفترچه عمومی', |
|
|
|
|
numberOfQuestions: 60, |
|
|
|
|
courses: [ |
|
|
|
|
{ |
|
|
|
|
sortId: 1,
|
|
|
|
|
title: 'ادبیات فارسی', |
|
|
|
|
coefficient: 3, |
|
|
|
|
questionStart: 1, |
|
|
|
|
questionEnd: 20, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
sortId: 2,
|
|
|
|
|
title: 'عربی', |
|
|
|
|
coefficient: 3, |
|
|
|
|
questionStart: 21, |
|
|
|
|
questionEnd: 35, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
sortId: 3,
|
|
|
|
|
title: 'دینی', |
|
|
|
|
coefficient: 2, |
|
|
|
|
questionStart: 36, |
|
|
|
|
questionEnd: 46, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
sortId: 4,
|
|
|
|
|
title: 'زبان خارجه', |
|
|
|
|
coefficient: 1, |
|
|
|
|
questionStart: 47, |
|
|
|
|
questionEnd: 60, |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
] |
|
|
|
|
} |
|
|
|
|
] |
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<> |
|
|
|
|
{ |
|
|
|
|
questionarePopUp && <div className="w-full z-10 fixed h-screen backdrop-blur flex items-center 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> |
|
|
|
|
|
|
|
|
|
const payload = {name: name, description: description, type: type}; |
|
|
|
|
|
|
|
|
|
return( |
|
|
|
|
<div className="w-full flex items-center flex-col overflow-x-hidden mt-6 px-2 overflow-scroll" style={{height: '400px'}}> |
|
|
|
|
{ |
|
|
|
|
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}`} />
|
|
|
|
|
<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> |
|
|
|
|
} |
|
|
|
|
<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"> |
|
|
|
@ -25,8 +177,8 @@ const AddQuestions = ({grades, addExamState, dispatch, stepClick, backStep}) => |
|
|
|
|
</div> |
|
|
|
|
<div className="w-5/6 flex flex-row"> |
|
|
|
|
|
|
|
|
|
<div className="flex flex-col bg-white items-center justify-center w-36 h-32 font-bold border border-gray-300 text-blue3A rounded-xl cursor-pointer"> |
|
|
|
|
<p className="" style={{fontSize: '40px'}}> |
|
|
|
|
<div className="flex flex-col bg-white items-center justify-center w-36 h-32 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=""> |
|
|
|
@ -49,7 +201,7 @@ const AddQuestions = ({grades, addExamState, dispatch, stepClick, backStep}) => |
|
|
|
|
title='ارسال پیام' |
|
|
|
|
className='w-1/12' |
|
|
|
|
onClick={() => { |
|
|
|
|
dispatch({type: 'ADD_EXAM_DESCRIPTION',payload }); |
|
|
|
|
dispatch({ type: 'ADD_EXAM_DESCRIPTION', payload }); |
|
|
|
|
stepClick() |
|
|
|
|
}} |
|
|
|
|
|
|
|
|
|