Question Component Made

src/redux/reducers/exam.js

@@ -9,7 +9,7 @@ const initialState = {
     startTime: '19:0',
     endTime: '',
     description: '',
-    type: 1,
+    type: 'bank',
     
     questionnaires: [
         {
@@ -43,7 +43,52 @@ const initialState = {
 
     answers: [
         
+    ],
+
+    courseBank: [
+        {
+            id: 2,
+            title: 'ریاضی'
+        }
+    ],
+    questionBank: [
+        {
+            questionId: 1,
+            courseId: 2,
+            title:'asdaw dsfsdfiermc', 
+            answeredPercentage: '83%',
+            score: 1,
+            options: [
+                {
+                    id: 1,
+                    title:'asdasd',
+                    isAnswer: false
+                },
+                {
+                    id: 2,
+                    title:'asdasd2',
+                    isAnswer: false
+                },
+                {
+                    id: 3,
+                    title:'asdasd3',
+                    isAnswer: true
+                },
+                {
+                    id: 4,
+                    title:'asdasd4',
+                    isAnswer: false
+                },
+            ] 
+        }
+    ],
+    courses: [
+
+    ],
+    questions: [
+
     ]
+
 }
 
 export default function addExamReduser(state = initialState, { type, payload }) {

src/view/addExam/components/question.js

@@ -0,0 +1,78 @@
+import React from 'react';
+
+
+
+
+const Question = () => {
+
+    const data =  {
+        questionId: 1,
+        courseId: 2,
+        title:'آیا به نظر شما این کار کار درستی است؟', 
+        answeredPercentage: '13',
+        score: 1,
+        options: [
+            {
+                id: 1,
+                title:'بله',
+                isAnswer: false
+            },
+            {
+                id: 2,
+                title:'نظر خاصی ندارم',
+                isAnswer: false
+            },
+            {
+                id: 3,
+                title:'خیر',
+                isAnswer: true
+            },
+            {
+                id: 4,
+                title:'هویج و گوجه فرنگی؟',
+                isAnswer: false
+            },
+        ] 
+    };
+    const gozine = [
+        'الف',
+        'ب',
+        'ج',
+        'د',
+        'ه',
+        'ز',
+    ]
+    return(
+        <div className='w-full flex flex-col justify-between items-center'>
+            <div className='w-4/5 flex flex-col  bg-white rounded-xl border border-gray-300'>
+                <div className='w-full border-b border-gray-300 p-4 text-gray-800 text-right'>
+                    {data.title}
+                </div>
+                <div className='w-full p-3 px-4 flex justify-between items-center'>
+                    <div>
+                        <p className='text-xs'>نمره : {data.score}</p>
+                    </div>
+                    <div className='text-gray-500 text-sm'>
+                        درصد پاسخگویی: {data.answeredPercentage}
+                    </div>
+                </div>
+            </div>
+            <div className='w-4/5 justify-center mt-4 flex flex-wrap'>
+                {
+                    data.options.map(
+                        (item) => (
+                            <div className='w-2/5 mx-4 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[item.id - 1]}</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.title}</p>
+                            </div>
+                        )
+                    )
+                }
+            </div>
+        </div>
+    )
+
+
+}
+
+export default Question;

src/view/addExam/views/AddQuestionsFromBank.js

@@ -8,6 +8,7 @@ import Checkbox from "../../../components/Checkbox";
 import RangeDatePicker from "../../../components/RangeDatePicker";
 import SelectedCourse from "../../../components/selectedCourse";
 import AddQuestionnaireCourse from "../components/addQuestionnaireCourse";
+import Question from "../components/question";
 
 const AddQuestionsFromBank = ({ grades, addExamState, dispatch, stepClick, backStep }) => {
     const [name, setName] = useState(null);
@@ -242,8 +243,10 @@ const AddQuestionsFromBank = ({ grades, addExamState, dispatch, stepClick, backS
                 </div>
                 <div className="w-1/2 flex justify-center">
                     <div className="w-4/5 py-8">
-                    <AnswerSheet questionsQuantity={selectedCourse.questionsQuantity} optionsQuantity={4} selectedCourseId={selectedCourse.id}
+                    {/* <AnswerSheet questionsQuantity={selectedCourse.questionsQuantity} optionsQuantity={4} selectedCourseId={selectedCourse.id}
-                    passAnswers={data => {setAnswers(data); setFakeState(fakeState - 2)}}/>
+                    passAnswers={data => {setAnswers(data); setFakeState(fakeState - 2)}}/> */}
+
+                    <Question />
                     </div>
                 </div>