pedram
/
Andishmand
1
0
Fork 0
Code Issues 2 Pull Requests Projects Releases Wiki Activity

Add Question, Questionare PopUp Made

Browse Source
main
Pedram Keshavarzi 3 years ago
parent 4510b210c3
commit 9ef8944ab6
1 changed files with 180 additions and 28 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 208
      src/view/addExam/views/addQuestions.js

208
src/view/addExam/views/addQuestions.js
Unescape View File

@ -1,60 +1,212 @@
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([]);
const payload = {name: name, description: description, type: type};
return(
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>
<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">
تنظیمات آزمون
</div>
<p className="text-sm text-right font-bold pt-4 text-gray-500">لطفا مشخضات آزمون را تکمیل کنید</p>
</div>
<div className="w-5/6 flex flex-row">
<div className="text-blue3A text-lg font-bold text-right px-4 border-r-4 border-blue65">
تنظیمات آزمون
<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>
<p className="text-sm text-right font-bold pt-4 text-gray-500">لطفا مشخضات آزمون را تکمیل کنید</p>
</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" onClick={() => addExamState.type == 'bank' ? console.log('bank') : setQuestionairePopUp(true)}>
<p className="" style={{ fontSize: '40px' }}>
+
</p>
<p className="">
{addExamState.type == 'bank' ? 'افزودن درس' : 'افزودن دفترچه'}
</p>
</div>
</div>
</div>
</div>
</div>
<div>
{addExamState.type === 'bank' ? 'بانک سوالات' : 'دفترچه سوالات'}
{addExamState.type === 'bank' ? 'بانک سوالات' : 'دفترچه سوالات'}
</div>
<div className="flex w-full px-10 items-center justify-end">
<button className=' mx-6 h-12 mt-4 text-red52 font-bold flex items-center justify-center' onClick={() => backStep()}> بازگشت به مرحله قبل </button>
<Button
title='ارسال پیام'
className='w-1/12'
onClick={() => {
dispatch({type: 'ADD_EXAM_DESCRIPTION',payload });
stepClick()
}}
<button className=' mx-6 h-12 mt-4 text-red52 font-bold flex items-center justify-center' onClick={() => backStep()}> بازگشت به مرحله قبل </button>
<Button
title='ارسال پیام'
className='w-1/12'
onClick={() => {
dispatch({ type: 'ADD_EXAM_DESCRIPTION', payload });
stepClick()
}}
/>
</div>

Write Preview
Loading…
Cancel
Save