import React, { useEffect, useState } from "react"; import { connect } from "react-redux"; import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd"; 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 filterIcon from "../../../assets/img/filter.svg"; import Question from "../components/question"; import { numOfinitQs } from "../../../redux/reducers/exam"; import AddQuestionPopUp from "../components/addQuestion"; import { lesson } from "../../../redux/actions"; const AddQuestionsFromBank = ({ grades, addExamState, dispatch, stepClick, backStep, lessonList, addLesson, }) => { const [name, setName] = useState(null); const [type, setType] = useState(null); const [description, setDescription] = useState(null); const [questionarePopUp, setQuestionairePopUp] = useState(false); const [addQuestionPopup, setAddQuestionPopuo] = useState(false); const [newQuestionaire, setNewQuestionaire] = useState({ id: addExamState.questionnaires.length + 1, name: "", fileUrl: "", }); const [showCoursesInList, setShowCoursesInList] = useState([]); const [choosedQuestion, seChoosedQuestion] = useState(null); const [selectedCourse, setSelectedCourse] = useState({ id: null, title: "", selectedQuestions: [], }); // console.log(choosedQuestionaries) // console.log(newQuestionaire) // console.log(addExamState.questionnaires) // console.log(newCourse) // console.log(addExamState.questionairesCourses) console.log(selectedCourse); // console.log(answers) console.log(choosedQuestion); console.log(selectedCourse.selectedQuestions); const [fakeState, setFakeState] = useState(2); const payload = { name: name, description: description, type: type }; const handleOnDragEnd = (result) => { const { source, destination } = result; if (source.droppableId !== destination?.droppableId) { if (destination?.droppableId == "Choosed_Questions_Form_Bank") { dispatch({ type: "ADD_EXAM_QUESTIONS", payload: choosedQuestion }); dispatch({ type: "REMOVE_QUESTION_FROM_BANK", payload: choosedQuestion, }); } else { dispatch({ type: "REMOVE_EXAM_QUESTIONS", payload: choosedQuestion }); dispatch({ type: "GET_QUESTION_BACK_TO_BANK", payload: choosedQuestion, }); } } else { if (source.droppableId == "Choosed_Questions_Form_Bank") { // const data = { // startIndex: choosedQuestion, // endIndex: destination.index // } // dispatch({type:'CHANGE_QUESTION_ORDER', payload : data}) // console.log(data) const aaa = [ ...addExamState.courses.filter( (itm) => itm.id == selectedCourse.id )[0]?.selectedQuestions, ]; const [removed] = aaa.splice(source.index, 1); aaa.splice(destination.index, 0, removed); dispatch({ type: "CHANGE_QUESTION_ORDER", payload: aaa }); console.log(result); console.log(source.index); console.log(destination.index); console.log(aaa); } } }; const [sortedQuestionBank, setSortedQuestionBank] = useState( addExamState.questionBank ); useEffect(() => { setSortedQuestionBank(addExamState.questionBank); }, [addExamState]); const [numberOfOptions, setNumberOfOptions] = useState(null); const [options, setOptions] = useState([]); const [question, setQuestion] = useState({ title: "", options: [], }); useEffect(() => { const arr = []; for (var i = 1; i <= numberOfOptions; i++) { arr.push({ id: i, title: "", isAnswer: false, }); } setOptions(arr); setQuestion({ ...question, options: arr, courseId: selectedCourse.id, questionId: numOfinitQs + addExamState.questionBank.length + fakeState, }); }, [numberOfOptions]); console.log(question); console.log( addExamState.courses.filter((itm) => itm.id == selectedCourse.id)[0] ?.selectedQuestions ); return (
{questionarePopUp && (
setQuestionairePopUp(false)} >

افزودن درس

{lessonList?.map((item, index) => ( <>
e.target.checked ? dispatch({ type: "ADD_EXAM_COURSE", payload: item }) : dispatch({ type: "REMOVE_EXAM_COURSE", payload: item, }) } />

{item?.name}

))}
)} {addQuestionPopup === "component" && ( // setAddQuestionPopuo(false)} // submitOnClick={data => { // dispatch({type: 'ADD_CUSTOM_QUESTION', payload: { // ...data, // questionId:addExamState.questionBank.length + 1 , // courseId: selectedCourse.id, // }}) // console.log({ // ...data, // questionId: addExamState.questionBank.length + 1, // courseId: selectedCourse.id, // }) // }} // /> <> )}
تنظیمات آزمون

لطفا مشخضات آزمون را تکمیل کنید

{ const { source, destination } = result; if (source.droppableId == "Choosed_Courses_Form_Bank") { // const data = { // startIndex: choosedQuestion, // endIndex: destination.index // } // dispatch({type:'CHANGE_QUESTION_ORDER', payload : data}) // console.log(data) const aaa = [...addExamState.courses]; const [removed] = aaa.splice(source.index, 1); aaa.splice(destination.index, 0, removed); dispatch({ type: "CHANGE_COURSE_ORDER", payload: aaa }); console.log(result); console.log(source.index); console.log(destination.index); console.log(aaa); } }} > {(provided) => (
{provided.placeholder}
{addExamState.courses.length > 0 && addExamState.courses.map((item, index) => ( {(provided) => (
setSelectedCourse(item)} >
{item.selectedQuestions.length} سوال

{ dispatch({ type: "REMOVE_EXAM_COURSE", payload: item, }); setSelectedCourse(null); setFakeState(fakeState + 24); }} > {" "} x{" "}

{item.title}

{" "} ضریب {item.coefficient}

{item.numberOfOptions} گزینه

)}
))}
)}
setQuestionairePopUp(true)} >

+

افزودن درس

{/* Picking Question Container */} handleOnDragEnd(result)} onDragStart={(result) => { console.log(result); if (result.source.droppableId == "Choosed_Questions_Form_Bank") { seChoosedQuestion( addExamState.courses.filter( (itm) => itm.id == selectedCourse.id )[0]?.selectedQuestions[result.source.index] ); } else { seChoosedQuestion( addExamState.questionBank.find( (itm) => itm.questionId == result.source.index ) ); } }} >
{/* Picked Qeustions From Bank */} {(provided) => (
{selectedCourse.id !== null && ( <> {/* Picked Questions Top Bar */}

سوالات {selectedCourse.title}

ضریب

console.log(e.target.value)} className="w-5 h-5 placeholder:text-blue3A flex text-center items-center pt-1 rounded border border-red5B text-sm text-gray-600 mr-2" />

تعداد گزینه

{ setSelectedCourse({ ...selectedCourse, numberOfOptions: e.target.value, }); dispatch({ type: "CHANGE_COURSE_NUM_OF_OPTIONS", payload: { courseId: selectedCourse.id, value: parseInt(e.target.value), }, }); }} className="w-5 h-5 flex text-center placeholder:text-blue3A items-center pt-1 rounded border border-red5B text-sm text-gray-600 mr-2" />

نمره منفی

{addQuestionPopup === "component" && ( setQuestion({ ...question, title: title, }) } options={question.options} setAsAnswer={(e) => { let thisOption = question.options.find( (itm) => itm.id == e ); thisOption.isAnswer = !thisOption.isAnswer; let otherOptions = question.options.filter( (itm) => itm.id !== e ); let newArr = []; otherOptions.map((item) => newArr.push({ ...item, isAnswer: false }) ); // console.log(newArr) let newOptions = [...newArr, thisOption]; // console.log(newOptions); let newNewOptions = newOptions.sort(function ( a, b ) { return a.id - b.id; }); // console.log(options == newOptions) setQuestion({ ...question, options: [...newNewOptions], }); }} scorePass={(score) => setQuestion({ ...question, score: parseInt(score), }) } passOptionTitle={(optionTitle, id) => { let thisOption = question.options.find( (itm) => itm.id == id ); thisOption.title = optionTitle; setQuestion({ ...question, options: [...options], }); }} submitOnClick={() => { setAddQuestionPopuo(false); dispatch({ type: "ADD_CUSTOM_QUESTION", payload: question, }); setNumberOfOptions(null); }} cancelOnClick={() => setAddQuestionPopuo(false)} /> )} {addExamState.courses ?.filter((itm) => itm.id == selectedCourse.id)[0] ?.selectedQuestions?.map((item, index) => ( {(provided) => (
)}
))} {provided.placeholder}
)} {selectedCourse.id !== null && (
{addQuestionPopup == false && (

پایان سوالات

)}
)}
)}
{selectedCourse.id !== null ? ( <>

انتخاب همه

{}} className="w-full h-10 flex px-4 items-center pt-1 outline-none rounded-md border border-gray-300 text-sm text-gray-600 mr-2" />
{(provided) => (
{sortedQuestionBank ?.filter((itm) => itm.courseId == selectedCourse.id) ?.map((course, index) => ( {(provided) => (
)}
))}
{/* */} {provided.placeholder}
)}
) : (
)}
); }; const mapStateToProps = (state) => ({ grades: state.publicApi.grades, addExamState: state.addExamReduser, // lessonList: state.lesson.list }); const mapDispatchToProps = { // getLesson:lesson.list }; export default connect( mapStateToProps, mapDispatchToProps )(AddQuestionsFromBank);