From 578a025af58017e6ef2a7c51ac4c72edafda3c98 Mon Sep 17 00:00:00 2001 From: Alireza khaji Date: Sat, 2 Jul 2022 16:56:05 +0430 Subject: [PATCH] lessonAdd,questionList api | 330 --- src/components/Stepper/index.js | 1 + src/components/nav/minimalNav.js | 235 ++++++++---------- src/redux/actions/exam.js | 72 +++++- src/redux/actions/index.js | 1 + src/redux/actions/question.js | 25 ++ src/redux/reducers/index.js | 2 + src/redux/reducers/lesson.js | 9 +- src/redux/reducers/question.js | 31 +++ src/view/addExam/components/question.js | 77 +++--- .../addExam/views/AddQuestionsFromBank.js | 167 +++++++++---- .../addExam/views/addQuestionnaireExam.js | 80 +++--- src/view/addExam/views/addQuestions.js | 4 +- 12 files changed, 451 insertions(+), 253 deletions(-) create mode 100644 src/redux/actions/question.js create mode 100644 src/redux/reducers/question.js diff --git a/src/components/Stepper/index.js b/src/components/Stepper/index.js index cd68c3e..e5c65f8 100644 --- a/src/components/Stepper/index.js +++ b/src/components/Stepper/index.js @@ -21,6 +21,7 @@ function Stepper({ > {steps.map((item, index) => (
{ - let initai_navId = 1; +import dropDownIcon from "../../assets/img/arrow-down.svg"; +import homeIcon from "./home-2.svg"; +import optionsIcon from "./element-3.svg"; +import notificationIcon from "./notification.svg"; +import walleteIcon from "./empty-wallet.svg"; +import discountIcon from "./discount-shape.svg"; +import userIcon from "./profile.svg"; +import receiptIcon from "./receipt-text.svg"; +import settingIcon from "./setting-2.svg"; +import exitIcon from "./vuesax-linear-logout.svg"; + +const MinimalNav = ({ logOut }) => { + let initai_navId = 1; const [navId, setNavId] = useState(initai_navId); - const chaneNav = (id) => { setNavId(id); - let top = 100 / 6 + (id - 1) * 100 / 6 * 3 / 4; - console.log(top) + let top = 100 / 6 + ((((id - 1) * 100) / 6) * 3) / 4; + console.log(top); document.querySelector(".back-item-img").style.top = `${top}%`; }; - const menuOptions = [ - { - icon: homeIcon, - link: '/adminpanel', - id : 1 - }, - { - icon: optionsIcon, - link: '/adminpanel', - id : 2 + { + icon: homeIcon, + link: "/adminpanel", + id: 1, }, { - icon: notificationIcon, - link: '/adminpanel', - id : 3 - + icon: optionsIcon, + link: "/adminpanel", + id: 2, }, { - icon: walleteIcon, - link: '/adminpanel', - id : 4 + icon: notificationIcon, + link: "/adminpanel", + id: 3, }, { - icon: discountIcon, - link: '/adminpanel', - id : 5 + icon: walleteIcon, + link: "/adminpanel", + id: 4, }, { - icon: receiptIcon, - link: '/adminpanel', - id : 6 + icon: discountIcon, + link: "/adminpanel", + id: 5, }, { - icon: walleteIcon, - link: '/adminpanel', - id : 7 + icon: receiptIcon, + link: "/adminpanel", + id: 6, }, { - icon: userIcon, - link: '/adminpanel', - id : 8 + icon: walleteIcon, + link: "/adminpanel", + id: 7, }, { - icon: settingIcon, - link: '/adminpanel', - id : 9 + icon: userIcon, + link: "/adminpanel", + id: 8, }, { - icon: exitIcon, - link: '/', - id: 10 + icon: settingIcon, + link: "/adminpanel", + id: 9, }, - ] - - - - return( -
-
- user - choose User Icon - -
- - - {/* ------------ */} -
- - - { - menuOptions.slice(0,3).map( - (item, index) => ( - setNavId(item.id)}> - -
- - ) - ) - } -
- { - menuOptions.slice(3,7).map( - (item, index) => ( - setNavId(item.id)}> - -
- - ) - ) - } -
- { - menuOptions.slice(7,12).map( - (item, index) => ( - setNavId(item.id)}> - -
- - ) - ) - } - -
- -
- ) -} - -export default MinimalNav; \ No newline at end of file + { + icon: exitIcon, + link: "/", + id: 10, + }, + ]; + + return ( +
+
+ user + choose User Icon +
+ + {/* ------------ */} +
+ {menuOptions.slice(0, 3).map((item, index) => ( + setNavId(item.id)} + > + +
+ + ))} +
+ {menuOptions.slice(3, 7).map((item, index) => ( + setNavId(item.id)} + > + +
+ + ))} +
+ {menuOptions.slice(7, 12).map((item, index) => ( + setNavId(item.id)} + > + +
+ + ))} +
+
+ ); +}; + +export default MinimalNav; diff --git a/src/redux/actions/exam.js b/src/redux/actions/exam.js index 21e1cc3..fe35c3f 100644 --- a/src/redux/actions/exam.js +++ b/src/redux/actions/exam.js @@ -9,22 +9,78 @@ const exam = { (data = {}) => async (dispatch) => await proxy.post("exam/parentAdd", data, { dispatch }), - addExamDescription:(data = {}) =>{ - return(dispatch)=>{ + addExamDescription: (data = {}) => { + return (dispatch) => { dispatch({ type: "ADD_EXAM_DESCRIPTION", - payload:data + payload: data, }); - } + }; }, - addExamGradeAndGroup:(data = {}) =>{ - return(dispatch)=>{ + addExamGradeAndGroup: (data = {}) => { + return (dispatch) => { dispatch({ type: "ADD_EXAM_GRADE_AND_GROUP", 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; diff --git a/src/redux/actions/index.js b/src/redux/actions/index.js index ab0077d..03044ee 100644 --- a/src/redux/actions/index.js +++ b/src/redux/actions/index.js @@ -16,6 +16,7 @@ export { default as term } from "./term"; export { default as exam } from "./exam"; export { default as examGroup } from "./examGroup"; export { default as lesson } from "./lesson"; +export { default as question } from "./question"; diff --git a/src/redux/actions/question.js b/src/redux/actions/question.js new file mode 100644 index 0000000..885e7dc --- /dev/null +++ b/src/redux/actions/question.js @@ -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; \ No newline at end of file diff --git a/src/redux/reducers/index.js b/src/redux/reducers/index.js index 23f22fb..ccbaddf 100644 --- a/src/redux/reducers/index.js +++ b/src/redux/reducers/index.js @@ -16,4 +16,6 @@ export { default as term } from "./term"; export { default as exam2 } from "./exam2"; export { default as examGroup } from "./examGroup"; export { default as lesson } from "./lesson"; +export { default as question } from "./question"; + diff --git a/src/redux/reducers/lesson.js b/src/redux/reducers/lesson.js index b96e380..f43545b 100644 --- a/src/redux/reducers/lesson.js +++ b/src/redux/reducers/lesson.js @@ -8,6 +8,7 @@ const initialState = { error: null, info: null, list: null, + lastAdd:null }; export default function lesson(state = initialState, action) { let { type, data } = action; @@ -15,9 +16,15 @@ export default function lesson(state = initialState, action) { case "lesson/info": return { ...state, loading: false, info: data, error: null }; case "lesson/add": - return { ...state, loading: false, error: null }; + toast.success("درخواست با موفقیت انجام شد") + return { ...state, loading: false, error: null, lastAdd:data.id }; case "lesson/list": 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: return state; } diff --git a/src/redux/reducers/question.js b/src/redux/reducers/question.js new file mode 100644 index 0000000..ccd939e --- /dev/null +++ b/src/redux/reducers/question.js @@ -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; + } +} \ No newline at end of file diff --git a/src/view/addExam/components/question.js b/src/view/addExam/components/question.js index f005f86..8181304 100644 --- a/src/view/addExam/components/question.js +++ b/src/view/addExam/components/question.js @@ -1,10 +1,17 @@ -import React from 'react'; - +import React, { useEffect } from 'react'; +let optionsList = []; 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 = [ 'الف', 'ب', @@ -13,35 +20,47 @@ const Question = ({data}) => { 'ه', 'ز', ] - return( -
-
-
- {data.title} -
-
-
-

نمره : {data.score}

-
-
- درصد پاسخگویی: {data.answeredPercentage} -
-
+ return ( +
+
+
+ {data?.text} +
+
+
+

نمره : {data.score}

-
- { - data.options.map( - (item) => ( -
-

{gozine[item.id - 1]}

-

{item.title}

-
- ) - ) - } +
+ درصد پاسخگویی: {data.answerPercent} +
+
+
+
+ {optionsList?.map((item,index) => ( +
+

+ {gozine[index]} +

+

+ {item} +

+ ))}
- ) +
+ ); } diff --git a/src/view/addExam/views/AddQuestionsFromBank.js b/src/view/addExam/views/AddQuestionsFromBank.js index 86ec83b..5768e35 100644 --- a/src/view/addExam/views/AddQuestionsFromBank.js +++ b/src/view/addExam/views/AddQuestionsFromBank.js @@ -11,7 +11,9 @@ 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"; +import { exam, lesson, question } from "../../../redux/actions"; +import { AiOutlineCloseCircle } from "react-icons/ai"; +import loadingGiff from "../../../assets/img/Rolling-2s-223px.gif"; const AddQuestionsFromBank = ({ grades, @@ -21,12 +23,22 @@ const AddQuestionsFromBank = ({ backStep, lessonList, addLesson, + addLessonLoading, + addExamCourse, + removeExamCourse, + getQuestion, + questionList, + addExamQuestion, + removeQuestionFromBank, + removeExamQuestions, + getQuestionBackToBank, }) => { 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 [addLessonPart, setAddLessonPart] = useState(false); const [newQuestionaire, setNewQuestionaire] = useState({ id: addExamState.questionnaires.length + 1, name: "", @@ -52,9 +64,6 @@ const AddQuestionsFromBank = ({ const [fakeState, setFakeState] = useState(2); - - - const payload = { name: name, description: description, type: type }; const handleOnDragEnd = (result) => { @@ -62,17 +71,21 @@ const AddQuestionsFromBank = ({ 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, - }); + // dispatch({ type: "ADD_EXAM_QUESTIONS", payload: choosedQuestion }); + addExamQuestion(choosedQuestion); + // dispatch({ + // type: "REMOVE_QUESTION_FROM_BANK", + // payload: choosedQuestion, + // }); + removeQuestionFromBank(choosedQuestion); } else { - dispatch({ type: "REMOVE_EXAM_QUESTIONS", payload: choosedQuestion }); - dispatch({ - type: "GET_QUESTION_BACK_TO_BANK", - payload: choosedQuestion, - }); + // dispatch({ type: "REMOVE_EXAM_QUESTIONS", payload: choosedQuestion }); + removeExamQuestions(choosedQuestion); + // dispatch({ + // type: "GET_QUESTION_BACK_TO_BANK", + // payload: choosedQuestion, + // }); + getQuestionBackToBank(choosedQuestion); } } else { if (source.droppableId == "Choosed_Questions_Form_Bank") { @@ -104,6 +117,17 @@ const AddQuestionsFromBank = ({ addExamState.questionBank ); + const [activeCourse, setActiveCourse] = useState(null); + useEffect(() => { + if (activeCourse) { + getQuestion({ + // lessonId: activeCourse, + // gradeId: addExamState.grade, + lessonId: 3, + gradeId: 7, + }); + } + }, [activeCourse]); useEffect(() => { setSortedQuestionBank(addExamState.questionBank); }, [addExamState]); @@ -137,6 +161,16 @@ const AddQuestionsFromBank = ({ addExamState.courses.filter((itm) => itm.id == selectedCourse.id)[0] ?.selectedQuestions ); + + const addLessonHandler = () => { + setAddLessonPart(true); + setQuestionairePopUp(false); + }; + + const addLessonPartBtnHandler = () => { + let name = document.querySelector("#addLessonPartInput").value; + addLesson({ name }); + }; return (
{questionarePopUp && ( @@ -186,51 +220,66 @@ const AddQuestionsFromBank = ({ {lessonList?.map((item, index) => ( - <> +
e.target.checked - ? dispatch({ type: "ADD_EXAM_COURSE", payload: item }) - : dispatch({ - type: "REMOVE_EXAM_COURSE", - payload: item, - }) + ? addExamCourse(item) + : removeExamCourse(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, - // }) - // }} - // /> - <> + {addLessonPart && ( +
+ setAddLessonPart(false)} + /> + + {!addLessonLoading && ( +
+ افزودن +
+ )} + {addLessonLoading && ( +
+ loadingGiff +
+ )} +
)}
@@ -277,7 +326,7 @@ const AddQuestionsFromBank = ({ {...provided.droppableProps} ref={provided.innerRef} > - {addExamState.courses.length > 0 && + {addExamState?.courses?.length > 0 && addExamState.courses.map((item, index) => ( setSelectedCourse(item)} + onClick={() => { + setSelectedCourse(item); + setActiveCourse(item.id); + }} >
- {item.selectedQuestions.length} سوال + {item?.selectedQuestions?.length} سوال

@@ -640,20 +692,20 @@ const AddQuestionsFromBank = ({ {(provided) => (

- {sortedQuestionBank - ?.filter((itm) => itm.courseId == selectedCourse.id) - ?.map((course, index) => ( + {/* sortedQuestionBan-------------- */} + {questionList?.map((course, index) => ( + {(provided) => (
)} - ))} + + ))}
{/* */} @@ -735,11 +788,21 @@ const AddQuestionsFromBank = ({ const mapStateToProps = (state) => ({ grades: state.publicApi.grades, addExamState: state.addExamReduser, -// lessonList: state.lesson.list + addLessonLoading: state.lesson.loading, + questionList: state.question.list, + // lessonList: state.lesson.list }); 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( diff --git a/src/view/addExam/views/addQuestionnaireExam.js b/src/view/addExam/views/addQuestionnaireExam.js index 0700dd8..5eb7ad8 100644 --- a/src/view/addExam/views/addQuestionnaireExam.js +++ b/src/view/addExam/views/addQuestionnaireExam.js @@ -284,33 +284,35 @@ const AddQuestionnaireExam = ({ ref={provided.innerRef} > {addExamState.questionnaires.map((item, index) => ( - - {(provided) => ( -
- setSelectedQuestionare({ - id: item.id, - name: item.name, - courses: item.courses, - }) - } - > -

دفترچه {item.name}

-
- )} - + + + {(provided) => ( +
+ setSelectedQuestionare({ + id: item.id, + name: item.name, + courses: item.courses, + }) + } + > +

دفترچه {item.name}

+
+ )} + + ))}
@@ -352,16 +354,20 @@ const AddQuestionnaireExam = ({
{addExamState.questionnaires .find((itm) => itm.id == selectedQuestionare.id) - ?.courses.map((item) => ( - { - setSelectedCourse(item); - console.log(selectedCourse); - }} - /> + ?.courses.map((item,index) => ( + + { + setSelectedCourse(item); + console.log(selectedCourse); + }} + /> + ))}
diff --git a/src/view/addExam/views/addQuestions.js b/src/view/addExam/views/addQuestions.js index b2f0638..3fb1b58 100644 --- a/src/view/addExam/views/addQuestions.js +++ b/src/view/addExam/views/addQuestions.js @@ -18,10 +18,11 @@ const AddQuestions = ({ getLesson, lessonList, addLesson, + lastAdd, }) => { useEffect(() => { getLesson(); - }, []); + }, [lastAdd]); return addExamState.type == 2 ? ( @@ -39,6 +40,7 @@ const mapStateToProps = (state) => ({ grades: state.publicApi.grades, addExamState: state.addExamReduser, lessonList: state.lesson.list, + lastAdd: state.lesson.lastAdd, }); const mapDispatchToProps = {