lessonAdd,questionList api | 330

main
alireza khaji 2 years ago
parent bed10f4245
commit 578a025af5
  1. 1
      src/components/Stepper/index.js
  2. 231
      src/components/nav/minimalNav.js
  3. 72
      src/redux/actions/exam.js
  4. 1
      src/redux/actions/index.js
  5. 25
      src/redux/actions/question.js
  6. 2
      src/redux/reducers/index.js
  7. 9
      src/redux/reducers/lesson.js
  8. 31
      src/redux/reducers/question.js
  9. 77
      src/view/addExam/components/question.js
  10. 167
      src/view/addExam/views/AddQuestionsFromBank.js
  11. 80
      src/view/addExam/views/addQuestionnaireExam.js
  12. 4
      src/view/addExam/views/addQuestions.js

@ -21,6 +21,7 @@ function Stepper({
> >
{steps.map((item, index) => ( {steps.map((item, index) => (
<div <div
key={index}
className={`flex items-center w-full relative ${ className={`flex items-center w-full relative ${
direction === "horizontal" ? "flex-row justify-between" : "flex-col justify-start" direction === "horizontal" ? "flex-row justify-between" : "flex-col justify-start"
}`} }`}

@ -1,155 +1,140 @@
import React, {useState} from "react"; import React, { useState } from "react";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
// assets // assets
import avatar from "../../assets/img/avatar/pexels-jan-kopřiva-3525908.jpg"; import avatar from "../../assets/img/avatar/pexels-jan-kopřiva-3525908.jpg";
import dropDownIcon from '../../assets/img/arrow-down.svg' import dropDownIcon from "../../assets/img/arrow-down.svg";
import homeIcon from './home-2.svg' import homeIcon from "./home-2.svg";
import optionsIcon from './element-3.svg' import optionsIcon from "./element-3.svg";
import notificationIcon from './notification.svg'; import notificationIcon from "./notification.svg";
import walleteIcon from './empty-wallet.svg'; import walleteIcon from "./empty-wallet.svg";
import discountIcon from './discount-shape.svg'; import discountIcon from "./discount-shape.svg";
import userIcon from './profile.svg'; import userIcon from "./profile.svg";
import receiptIcon from './receipt-text.svg'; import receiptIcon from "./receipt-text.svg";
import settingIcon from './setting-2.svg'; import settingIcon from "./setting-2.svg";
import exitIcon from './vuesax-linear-logout.svg' import exitIcon from "./vuesax-linear-logout.svg";
const MinimalNav = ({ logOut }) => {
const MinimalNav = ({logOut}) => { let initai_navId = 1;
let initai_navId = 1;
const [navId, setNavId] = useState(initai_navId); const [navId, setNavId] = useState(initai_navId);
const chaneNav = (id) => { const chaneNav = (id) => {
setNavId(id); setNavId(id);
let top = 100 / 6 + (id - 1) * 100 / 6 * 3 / 4; let top = 100 / 6 + ((((id - 1) * 100) / 6) * 3) / 4;
console.log(top) console.log(top);
document.querySelector(".back-item-img").style.top = `${top}%`; document.querySelector(".back-item-img").style.top = `${top}%`;
}; };
const menuOptions = [ const menuOptions = [
{ {
icon: homeIcon, icon: homeIcon,
link: '/adminpanel', link: "/adminpanel",
id : 1 id: 1,
},
{
icon: optionsIcon,
link: '/adminpanel',
id : 2
}, },
{ {
icon: notificationIcon, icon: optionsIcon,
link: '/adminpanel', link: "/adminpanel",
id : 3 id: 2,
}, },
{ {
icon: walleteIcon, icon: notificationIcon,
link: '/adminpanel', link: "/adminpanel",
id : 4 id: 3,
}, },
{ {
icon: discountIcon, icon: walleteIcon,
link: '/adminpanel', link: "/adminpanel",
id : 5 id: 4,
}, },
{ {
icon: receiptIcon, icon: discountIcon,
link: '/adminpanel', link: "/adminpanel",
id : 6 id: 5,
}, },
{ {
icon: walleteIcon, icon: receiptIcon,
link: '/adminpanel', link: "/adminpanel",
id : 7 id: 6,
}, },
{ {
icon: userIcon, icon: walleteIcon,
link: '/adminpanel', link: "/adminpanel",
id : 8 id: 7,
}, },
{ {
icon: settingIcon, icon: userIcon,
link: '/adminpanel', link: "/adminpanel",
id : 9 id: 8,
}, },
{ {
icon: exitIcon, icon: settingIcon,
link: '/', link: "/adminpanel",
id: 10 id: 9,
}, },
] {
icon: exitIcon,
link: "/",
id: 10,
return( },
<div className="nav h-full w-[4.5%] fixed top-0 right-0 z-20 overflow-hidden bg-white border-l border-l-color1"> ];
<div className="h-[10%] mb-6 mt-4 flex flex-col justify-center items-center">
<img src={avatar} alt="user" className="logo w-12 h-12 rounded-full" /> return (
<img src={dropDownIcon} alt="choose User Icon" className="w-6" /> <div className="nav h-full w-[4.5%] fixed top-0 right-0 z-20 overflow-hidden bg-white border-l border-l-color1">
<div className="h-[10%] mb-6 mt-4 flex flex-col justify-center items-center">
</div> <img src={avatar} alt="user" className="logo w-12 h-12 rounded-full" />
<img src={dropDownIcon} alt="choose User Icon" className="w-6" />
</div>
{/* ------------ */}
<div className="flex flex-col items-center w-full h-full"> {/* ------------ */}
<div className="flex flex-col items-center w-full h-full">
{menuOptions.slice(0, 3).map((item, index) => (
{ <Link
menuOptions.slice(0,3).map( key={index}
(item, index) => ( to={item.link}
<Link to={item.link} className="w-full flex justify-center items-center h-[7%]" onClick={() => setNavId(item.id)}> className="w-full flex justify-center items-center h-[7%]"
<img src={item.icon} className="w-2/5"/> onClick={() => setNavId(item.id)}
<div >
className="back-item-img w-1 rounded-xl h-12 bg-red52 absolute right-0 z-20 transition-all duration-300" <img src={item.icon} className="w-2/5" />
style={ <div
navId != item.id ? {display: 'none'} : null className="back-item-img w-1 rounded-xl h-12 bg-red52 absolute right-0 z-20 transition-all duration-300"
} style={navId != item.id ? { display: "none" } : null}
></div> ></div>
</Link> </Link>
) ))}
) <div className="h-1 w-4/5 rounded-xl bg-red82OP my-4"></div>
} {menuOptions.slice(3, 7).map((item, index) => (
<div className="h-1 w-4/5 rounded-xl bg-red82OP my-4"></div> <Link
{ key={index}
menuOptions.slice(3,7).map( to={item.link}
(item, index) => ( className="w-full flex justify-center items-center h-[7%]"
<Link to={item.link} className="w-full flex justify-center items-center h-[7%]" onClick={() => setNavId(item.id)}> onClick={() => setNavId(item.id)}
<img src={item.icon} className="w-2/5"/> >
<div <img src={item.icon} className="w-2/5" />
className="back-item-img w-1 rounded-xl h-12 bg-red52 absolute right-0 z-20 transition-all duration-300" <div
style={ className="back-item-img w-1 rounded-xl h-12 bg-red52 absolute right-0 z-20 transition-all duration-300"
navId != item.id ? {display: 'none'} : null style={navId != item.id ? { display: "none" } : null}
} ></div>
></div> </Link>
</Link> ))}
) <div className="h-1 w-4/5 rounded-xl bg-red82OP my-4"></div>
) {menuOptions.slice(7, 12).map((item, index) => (
} <Link
<div className="h-1 w-4/5 rounded-xl bg-red82OP my-4"></div> key={index}
{ to={item.link}
menuOptions.slice(7,12).map( className="w-full flex justify-center items-center h-[7%]"
(item, index) => ( onClick={() => setNavId(item.id)}
<Link to={item.link} className="w-full flex justify-center items-center h-[7%]" onClick={() => setNavId(item.id)}> >
<img src={item.icon} className="w-2/5"/> <img src={item.icon} className="w-2/5" />
<div <div
className="back-item-img w-1 rounded-xl h-12 bg-red52 absolute right-0 z-20 transition-all duration-300" className="back-item-img w-1 rounded-xl h-12 bg-red52 absolute right-0 z-20 transition-all duration-300"
style={ style={navId != item.id ? { display: "none" } : null}
navId != item.id ? {display: 'none'} : null ></div>
} </Link>
></div> ))}
</Link> </div>
) </div>
) );
} };
</div>
</div>
)
}
export default MinimalNav; export default MinimalNav;

@ -9,22 +9,78 @@ const exam = {
(data = {}) => (data = {}) =>
async (dispatch) => async (dispatch) =>
await proxy.post("exam/parentAdd", data, { dispatch }), await proxy.post("exam/parentAdd", data, { dispatch }),
addExamDescription:(data = {}) =>{ addExamDescription: (data = {}) => {
return(dispatch)=>{ return (dispatch) => {
dispatch({ dispatch({
type: "ADD_EXAM_DESCRIPTION", type: "ADD_EXAM_DESCRIPTION",
payload:data payload: data,
}); });
} };
}, },
addExamGradeAndGroup:(data = {}) =>{ addExamGradeAndGroup: (data = {}) => {
return(dispatch)=>{ return (dispatch) => {
dispatch({ dispatch({
type: "ADD_EXAM_GRADE_AND_GROUP", type: "ADD_EXAM_GRADE_AND_GROUP",
payload: data, payload: data,
}); });
} };
} },
addExamCourse: (data = {}) => {
return (dispatch) => {
dispatch({
type: "ADD_EXAM_COURSE",
payload: data,
});
};
},
removeExamCourse: (data = {}) => {
return (dispatch) => {
dispatch({
type: "REMOVE_EXAM_COURSE",
payload: data,
});
};
},
addExamQuestion: (data = {}) => {
return (dispatch) => {
dispatch({
type: "ADD_EXAM_QUESTIONS",
payload: data,
});
};
},
removeQuestionFromBank: (data = {}) => {
return (dispatch) => {
dispatch({
type: "REMOVE_QUESTION_FROM_BANK",
payload: data,
});
};
},
removeExamQuestions: (data = {}) => {
return (dispatch) => {
dispatch({
type: "REMOVE_EXAM_QUESTIONS",
payload: data,
});
};
},
getQuestionBackToBank: (data = {}) => {
return (dispatch) => {
dispatch({
type: "GET_QUESTION_BACK_TO_BANK",
payload: data,
});
};
},
changeQuestionOrder: (data = {}) => {
return (dispatch) => {
dispatch({
type: "CHANGE_QUESTION_ORDER",
payload: data,
});
};
},
}; };
export default exam; export default exam;

@ -16,6 +16,7 @@ export { default as term } from "./term";
export { default as exam } from "./exam"; export { default as exam } from "./exam";
export { default as examGroup } from "./examGroup"; export { default as examGroup } from "./examGroup";
export { default as lesson } from "./lesson"; export { default as lesson } from "./lesson";
export { default as question } from "./question";

@ -0,0 +1,25 @@
import proxy from "../proxy";
const question = {
info:
(data = {}) =>
async (dispatch) =>
await proxy.get("question/info", data, { dispatch }),
list:
(data = {}) =>
async (dispatch) =>
await proxy.get("question/list", data, { dispatch }),
add:
(data = {}) =>
async (dispatch) =>
await proxy.post("question/add", data, { dispatch }),
delete:
(data = {}) =>
async (dispatch) =>
await proxy.delete("question/delete", data, { dispatch }),
};
export default question;

@ -16,4 +16,6 @@ export { default as term } from "./term";
export { default as exam2 } from "./exam2"; export { default as exam2 } from "./exam2";
export { default as examGroup } from "./examGroup"; export { default as examGroup } from "./examGroup";
export { default as lesson } from "./lesson"; export { default as lesson } from "./lesson";
export { default as question } from "./question";

@ -8,6 +8,7 @@ const initialState = {
error: null, error: null,
info: null, info: null,
list: null, list: null,
lastAdd:null
}; };
export default function lesson(state = initialState, action) { export default function lesson(state = initialState, action) {
let { type, data } = action; let { type, data } = action;
@ -15,9 +16,15 @@ export default function lesson(state = initialState, action) {
case "lesson/info": case "lesson/info":
return { ...state, loading: false, info: data, error: null }; return { ...state, loading: false, info: data, error: null };
case "lesson/add": case "lesson/add":
return { ...state, loading: false, error: null }; toast.success("درخواست با موفقیت انجام شد")
return { ...state, loading: false, error: null, lastAdd:data.id };
case "lesson/list": case "lesson/list":
return { ...state, loading: false, error: null, list: data }; return { ...state, loading: false, error: null, list: data };
case "lesson/loading":
return { ...state, loading: true };
case "lesson/error":
toast.error(data.message);
return { ...state, loading: false, error: data.message };
default: default:
return state; return state;
} }

@ -0,0 +1,31 @@
import { toast } from "react-toastify";
const initialState = {
loading: false,
error: null,
info: null,
list: null,
lastAdd: null,
};
export default function question(state = initialState, action) {
let { type, data } = action;
switch (type) {
case "question/info":
return { ...state, loading: false, info: data, error: null };
case "question/add":
toast.success("درخواست با موفقیت انجام شد");
return { ...state, loading: false, error: null, lastAdd: data.id };
case "question/list":
return { ...state, loading: false, error: null, list: data };
case "question/loading":
return { ...state, loading: true };
case "question/error":
toast.error(data.message);
return { ...state, loading: false, error: data.message };
default:
return state;
}
}

@ -1,10 +1,17 @@
import React from 'react'; import React, { useEffect } from 'react';
let optionsList = [];
const Question = ({data}) => { const Question = ({data}) => {
useEffect(()=>{
optionsList=[];
for (let i = 0; i < data.type; i++) {
optionsList.push(data[`option${i + 1}`]);
}
})
console.log("==|>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>")
console.log(optionsList);
const gozine = [ const gozine = [
'الف', 'الف',
'ب', 'ب',
@ -13,35 +20,47 @@ const Question = ({data}) => {
'ه', 'ه',
'ز', 'ز',
] ]
return( return (
<div className='w-full flex flex-col text-blue3A mt-4 mb-2 font-bold justify-between items-center'> <div className="w-full flex flex-col text-blue3A mt-4 mb-2 font-bold justify-between items-center">
<div className='w-11/12 flex flex-col bg-white rounded-xl border border-gray-300'> <div className="w-11/12 flex flex-col bg-white rounded-xl border border-gray-300">
<div className='w-full border-b border-gray-300 p-4 text-blue3A text-right'> <div className="w-full border-b border-gray-300 p-4 text-blue3A text-right">
{data.title} {data?.text}
</div> </div>
<div className='w-full p-3 px-4 flex justify-between items-center'> <div className="w-full p-3 px-4 flex justify-between items-center">
<div> <div>
<p className='text-xs'>نمره : {data.score}</p> <p className="text-xs">نمره : {data.score}</p>
</div>
<div className='text-gray-500 text-sm'>
درصد پاسخگویی: {data.answeredPercentage}
</div>
</div>
</div> </div>
<div className='w-full justify-center mt-4 flex flex-wrap'> <div className="text-gray-500 text-sm">
{ درصد پاسخگویی: {data.answerPercent}
data.options.map( </div>
(item) => ( </div>
<div className='w-2/5 mx-2 my-2 flex items-center justify-center'> </div>
<p className={` h-12 flex items-center justify-center w-16 rounded-lg rounded-l-none ${item.isAnswer ? 'text-white bg-green-400' : 'bg-gray-200 border border-gray-300'}`}>{gozine[item.id - 1]}</p> <div className="w-full justify-center mt-4 flex flex-wrap">
<p className={` h-12 flex items-center justify-center w-full rounded-lg rounded-r-none ${item.isAnswer ? 'bg-green-200' : 'bg-white border border-gray-300'}`}>{item.title}</p> {optionsList?.map((item,index) => (
</div> <div className="w-2/5 mx-2 my-2 flex items-center justify-center">
) <p
) className={` h-12 flex items-center justify-center w-16 rounded-lg rounded-l-none ${
} item.isAnswer
? "text-white bg-green-400"
: "bg-gray-200 border border-gray-300"
}`}
>
{gozine[index]}
</p>
<p
className={` h-12 flex items-center justify-center w-full rounded-lg rounded-r-none ${
item.isAnswer
? "bg-green-200"
: "bg-white border border-gray-300"
}`}
>
{item}
</p>
</div> </div>
))}
</div> </div>
) </div>
);
} }

@ -11,7 +11,9 @@ import filterIcon from "../../../assets/img/filter.svg";
import Question from "../components/question"; import Question from "../components/question";
import { numOfinitQs } from "../../../redux/reducers/exam"; import { numOfinitQs } from "../../../redux/reducers/exam";
import AddQuestionPopUp from "../components/addQuestion"; import AddQuestionPopUp from "../components/addQuestion";
import { lesson } from "../../../redux/actions"; import { exam, lesson, question } from "../../../redux/actions";
import { AiOutlineCloseCircle } from "react-icons/ai";
import loadingGiff from "../../../assets/img/Rolling-2s-223px.gif";
const AddQuestionsFromBank = ({ const AddQuestionsFromBank = ({
grades, grades,
@ -21,12 +23,22 @@ const AddQuestionsFromBank = ({
backStep, backStep,
lessonList, lessonList,
addLesson, addLesson,
addLessonLoading,
addExamCourse,
removeExamCourse,
getQuestion,
questionList,
addExamQuestion,
removeQuestionFromBank,
removeExamQuestions,
getQuestionBackToBank,
}) => { }) => {
const [name, setName] = useState(null); const [name, setName] = useState(null);
const [type, setType] = useState(null); const [type, setType] = useState(null);
const [description, setDescription] = useState(null); const [description, setDescription] = useState(null);
const [questionarePopUp, setQuestionairePopUp] = useState(false); const [questionarePopUp, setQuestionairePopUp] = useState(false);
const [addQuestionPopup, setAddQuestionPopuo] = useState(false); const [addQuestionPopup, setAddQuestionPopuo] = useState(false);
const [addLessonPart, setAddLessonPart] = useState(false);
const [newQuestionaire, setNewQuestionaire] = useState({ const [newQuestionaire, setNewQuestionaire] = useState({
id: addExamState.questionnaires.length + 1, id: addExamState.questionnaires.length + 1,
name: "", name: "",
@ -52,9 +64,6 @@ const AddQuestionsFromBank = ({
const [fakeState, setFakeState] = useState(2); const [fakeState, setFakeState] = useState(2);
const payload = { name: name, description: description, type: type }; const payload = { name: name, description: description, type: type };
const handleOnDragEnd = (result) => { const handleOnDragEnd = (result) => {
@ -62,17 +71,21 @@ const AddQuestionsFromBank = ({
if (source.droppableId !== destination?.droppableId) { if (source.droppableId !== destination?.droppableId) {
if (destination?.droppableId == "Choosed_Questions_Form_Bank") { if (destination?.droppableId == "Choosed_Questions_Form_Bank") {
dispatch({ type: "ADD_EXAM_QUESTIONS", payload: choosedQuestion }); // dispatch({ type: "ADD_EXAM_QUESTIONS", payload: choosedQuestion });
dispatch({ addExamQuestion(choosedQuestion);
type: "REMOVE_QUESTION_FROM_BANK", // dispatch({
payload: choosedQuestion, // type: "REMOVE_QUESTION_FROM_BANK",
}); // payload: choosedQuestion,
// });
removeQuestionFromBank(choosedQuestion);
} else { } else {
dispatch({ type: "REMOVE_EXAM_QUESTIONS", payload: choosedQuestion }); // dispatch({ type: "REMOVE_EXAM_QUESTIONS", payload: choosedQuestion });
dispatch({ removeExamQuestions(choosedQuestion);
type: "GET_QUESTION_BACK_TO_BANK", // dispatch({
payload: choosedQuestion, // type: "GET_QUESTION_BACK_TO_BANK",
}); // payload: choosedQuestion,
// });
getQuestionBackToBank(choosedQuestion);
} }
} else { } else {
if (source.droppableId == "Choosed_Questions_Form_Bank") { if (source.droppableId == "Choosed_Questions_Form_Bank") {
@ -104,6 +117,17 @@ const AddQuestionsFromBank = ({
addExamState.questionBank addExamState.questionBank
); );
const [activeCourse, setActiveCourse] = useState(null);
useEffect(() => {
if (activeCourse) {
getQuestion({
// lessonId: activeCourse,
// gradeId: addExamState.grade,
lessonId: 3,
gradeId: 7,
});
}
}, [activeCourse]);
useEffect(() => { useEffect(() => {
setSortedQuestionBank(addExamState.questionBank); setSortedQuestionBank(addExamState.questionBank);
}, [addExamState]); }, [addExamState]);
@ -137,6 +161,16 @@ const AddQuestionsFromBank = ({
addExamState.courses.filter((itm) => itm.id == selectedCourse.id)[0] addExamState.courses.filter((itm) => itm.id == selectedCourse.id)[0]
?.selectedQuestions ?.selectedQuestions
); );
const addLessonHandler = () => {
setAddLessonPart(true);
setQuestionairePopUp(false);
};
const addLessonPartBtnHandler = () => {
let name = document.querySelector("#addLessonPartInput").value;
addLesson({ name });
};
return ( return (
<div className="flex flex-col h-screen relative"> <div className="flex flex-col h-screen relative">
{questionarePopUp && ( {questionarePopUp && (
@ -186,51 +220,66 @@ const AddQuestionsFromBank = ({
</h1> </h1>
{lessonList?.map((item, index) => ( {lessonList?.map((item, index) => (
<> <React.Fragment key={index}>
<div className="w-full flex items-center py-2 justify-start border-b pl-8 border-gray-200"> <div className="w-full flex items-center py-2 justify-start border-b pl-8 border-gray-200">
<Checkbox <Checkbox
name={`PICK_QUESTIONARE_${index}`} name={`PICK_QUESTIONARE_${index}`}
onChange={(e) => onChange={(e) =>
e.target.checked e.target.checked
? dispatch({ type: "ADD_EXAM_COURSE", payload: item }) ? addExamCourse(item)
: dispatch({ : removeExamCourse(item)
type: "REMOVE_EXAM_COURSE",
payload: item,
})
} }
/> />
<h2 className="text-red26 font-bold mr-4">{item?.name}</h2> <h2 className="text-red26 font-bold mr-4">{item?.name}</h2>
</div> </div>
</> </React.Fragment>
))} ))}
<div className="w-full pt-4 flex justify-end px-5"> <div className="w-full pt-4 flex justify-end px-5">
<button <button
className="p-2 px-4 bg-red52 text-white rounded-md shadow-md" className="p-2 px-4 bg-red52 text-white rounded-md shadow-md"
onClick={addLessonHandler}
>
افزودن درس جدید
</button>
<button
className="p-2 px-4 bg-red52 text-white rounded-md shadow-md mr-2"
onClick={() => setQuestionairePopUp(false)} onClick={() => setQuestionairePopUp(false)}
> >
افزودن ثبت دروس
</button> </button>
</div> </div>
</div> </div>
</div> </div>
)} )}
{addQuestionPopup === "component" && ( {addLessonPart && (
// <AddQuestionPopUp <div className="w-full z-10 fixed h-screen backdrop-blur flex items-center top-0 justify-center ">
// closeOnClick={() => setAddQuestionPopuo(false)} <AiOutlineCloseCircle
// submitOnClick={data => { className="text-4xl text-red-600 cursor-pointer absolute top-6 left-20 z-20"
// dispatch({type: 'ADD_CUSTOM_QUESTION', payload: { onClick={() => setAddLessonPart(false)}
// ...data, />
// questionId:addExamState.questionBank.length + 1 , <input
// courseId: selectedCourse.id, type="text"
// }}) id="addLessonPartInput"
// console.log({ className="w-1/3 h-10 rounded px-2 border"
// ...data, placeholder="نام درس"
// questionId: addExamState.questionBank.length + 1, />
// courseId: selectedCourse.id, {!addLessonLoading && (
// }) <div
// }} className="h-10 w-20 px-2 flex items-center justify-center text-white bg-red52 rounded-md mr-2 cursor-pointer"
// /> onClick={addLessonPartBtnHandler}
<></> >
افزودن
</div>
)}
{addLessonLoading && (
<div
className="h-10 w-20 px-2 flex items-center justify-center text-white bg-red52 rounded-md mr-2"
onClick={addLessonPartBtnHandler}
>
<img src={loadingGiff} alt="loadingGiff" className="h-7" />
</div>
)}
</div>
)} )}
<div className="flex py-3 items-center px-10 border-b border-gray-200"> <div className="flex py-3 items-center px-10 border-b border-gray-200">
<div className="flex flex-col w-1/6"> <div className="flex flex-col w-1/6">
@ -277,7 +326,7 @@ const AddQuestionsFromBank = ({
{...provided.droppableProps} {...provided.droppableProps}
ref={provided.innerRef} ref={provided.innerRef}
> >
{addExamState.courses.length > 0 && {addExamState?.courses?.length > 0 &&
addExamState.courses.map((item, index) => ( addExamState.courses.map((item, index) => (
<Draggable <Draggable
draggableId={`COURSE_${item.id}`} draggableId={`COURSE_${item.id}`}
@ -294,14 +343,17 @@ const AddQuestionsFromBank = ({
? "bg-pinkF5 border border-red52 text-red52" ? "bg-pinkF5 border border-red52 text-red52"
: "bg-white border border-gray-300 text-blue3A" : "bg-white border border-gray-300 text-blue3A"
} items-center justify-between pt-4 w-36 h-32 mx-2 font-bold rounded-xl cursor-pointer`} } items-center justify-between pt-4 w-36 h-32 mx-2 font-bold rounded-xl cursor-pointer`}
onClick={() => setSelectedCourse(item)} onClick={() => {
setSelectedCourse(item);
setActiveCourse(item.id);
}}
> >
<div <div
className="w-full flex justify-between items-center " className="w-full flex justify-between items-center "
style={{ direction: "ltr" }} style={{ direction: "ltr" }}
> >
<div className=" rtl px-2 text-white bg-red52"> <div className=" rtl px-2 text-white bg-red52">
{item.selectedQuestions.length} سوال {item?.selectedQuestions?.length} سوال
</div> </div>
<p className=" text-left px-4"> <p className=" text-left px-4">
@ -640,20 +692,20 @@ const AddQuestionsFromBank = ({
{(provided) => ( {(provided) => (
<div <div
className="w-full py-1 flex flex-col items-center overflow-x-hidden overflow-scroll" className="w-full py-1 flex flex-col items-center overflow-x-hidden overflow-scroll"
style={{ height: "30vh" }} style={{ height: "50vh" }}
> >
<div <div
className="w-11/12" className="w-11/12"
{...provided.droppableProps} {...provided.droppableProps}
ref={provided.innerRef} ref={provided.innerRef}
> >
{sortedQuestionBank {/* sortedQuestionBan-------------- */}
?.filter((itm) => itm.courseId == selectedCourse.id) {questionList?.map((course, index) => (
?.map((course, index) => ( <React.Fragment key={index}>
<Draggable <Draggable
draggableId={`_${course.questionId}`} draggableId={`_${course.id}`}
index={course.questionId} index={course.id}
key={`CHOOSED_QUESTIONS_${course.questionId}`} key={`CHOOSED_QUESTIONS_${course.id}`}
> >
{(provided) => ( {(provided) => (
<div <div
@ -696,7 +748,8 @@ const AddQuestionsFromBank = ({
</div> </div>
)} )}
</Draggable> </Draggable>
))} </React.Fragment>
))}
</div> </div>
{/* <Question /> */} {/* <Question /> */}
@ -735,11 +788,21 @@ const AddQuestionsFromBank = ({
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
grades: state.publicApi.grades, grades: state.publicApi.grades,
addExamState: state.addExamReduser, addExamState: state.addExamReduser,
// lessonList: state.lesson.list addLessonLoading: state.lesson.loading,
questionList: state.question.list,
// lessonList: state.lesson.list
}); });
const mapDispatchToProps = { const mapDispatchToProps = {
// getLesson:lesson.list addLesson: lesson.add,
addExamCourse: exam.addExamCourse,
removeExamCourse: exam.removeExamCourse,
getQuestion: question.list,
addExamQuestion: exam.addExamQuestion,
removeQuestionFromBank: exam.removeQuestionFromBank,
removeExamQuestions: exam.removeExamQuestions,
getQuestionBackToBank: exam.getQuestionBackToBank,
changeQuestionOrder: exam.changeQuestionOrder,
}; };
export default connect( export default connect(

@ -284,33 +284,35 @@ const AddQuestionnaireExam = ({
ref={provided.innerRef} ref={provided.innerRef}
> >
{addExamState.questionnaires.map((item, index) => ( {addExamState.questionnaires.map((item, index) => (
<Draggable <React.Fragment key={index}>
draggableId={`QUESTIONNAIRE_${item.id}`} <Draggable
index={index} draggableId={`QUESTIONNAIRE_${item.id}`}
key={`CHOOSED_QUESTIONNAIRE_${item.id}`} index={index}
> key={`CHOOSED_QUESTIONNAIRE_${item.id}`}
{(provided) => ( >
<div {(provided) => (
{...provided.draggableProps} <div
{...provided.dragHandleProps} {...provided.draggableProps}
ref={provided.innerRef} {...provided.dragHandleProps}
className={`flex flex-col ${ ref={provided.innerRef}
selectedQuestionare.id === item.id className={`flex flex-col ${
? "bg-pinkF5 border border-red52 text-red52" selectedQuestionare.id === item.id
: "bg-white border border-gray-300 text-blue3A" ? "bg-pinkF5 border border-red52 text-red52"
} items-center justify-center w-36 h-32 mx-2 font-bold rounded-xl cursor-pointer`} : "bg-white border border-gray-300 text-blue3A"
onClick={() => } items-center justify-center w-36 h-32 mx-2 font-bold rounded-xl cursor-pointer`}
setSelectedQuestionare({ onClick={() =>
id: item.id, setSelectedQuestionare({
name: item.name, id: item.id,
courses: item.courses, name: item.name,
}) courses: item.courses,
} })
> }
<p className="text-red52">دفترچه {item.name}</p> >
</div> <p className="text-red52">دفترچه {item.name}</p>
)} </div>
</Draggable> )}
</Draggable>
</React.Fragment>
))} ))}
</div> </div>
@ -352,16 +354,20 @@ const AddQuestionnaireExam = ({
<div className="w-4/5 "> <div className="w-4/5 ">
{addExamState.questionnaires {addExamState.questionnaires
.find((itm) => itm.id == selectedQuestionare.id) .find((itm) => itm.id == selectedQuestionare.id)
?.courses.map((item) => ( ?.courses.map((item,index) => (
<SelectedCourse <React.Fragment key={index}>
title={item.name} <SelectedCourse
coefficient={item.coefficient} title={item.name}
questionQuantity={item.questionEnd - item.questionStart} coefficient={item.coefficient}
onClick={() => { questionQuantity={
setSelectedCourse(item); item.questionEnd - item.questionStart
console.log(selectedCourse); }
}} onClick={() => {
/> setSelectedCourse(item);
console.log(selectedCourse);
}}
/>
</React.Fragment>
))} ))}
</div> </div>
</div> </div>

@ -18,10 +18,11 @@ const AddQuestions = ({
getLesson, getLesson,
lessonList, lessonList,
addLesson, addLesson,
lastAdd,
}) => { }) => {
useEffect(() => { useEffect(() => {
getLesson(); getLesson();
}, []); }, [lastAdd]);
return addExamState.type == 2 ? ( return addExamState.type == 2 ? (
<AddQuestionnaireExam stepClick={stepClick} backStep={backStep} /> <AddQuestionnaireExam stepClick={stepClick} backStep={backStep} />
@ -39,6 +40,7 @@ const mapStateToProps = (state) => ({
grades: state.publicApi.grades, grades: state.publicApi.grades,
addExamState: state.addExamReduser, addExamState: state.addExamReduser,
lessonList: state.lesson.list, lessonList: state.lesson.list,
lastAdd: state.lesson.lastAdd,
}); });
const mapDispatchToProps = { const mapDispatchToProps = {

Loading…
Cancel
Save