You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

80 lines
2.4 KiB

import React,{useState} from 'react';
import Stepper from '../../components/Stepper';
import AddGradeGroup from './views/AddGradeGroup';
import AddExamDescription from './views/AddDescription';
import AddQuestions from './views/addQuestions';
const AddExam = () => {
const [activeStep, setActiveStep] = useState([true, false, false, false, false]);
const [step, setStep] = useState(0);
const steps = [
{
title: 'انتخاب گروه و پایه تحصیلی',
active: activeStep[0]
},
{
title: 'تنظیمات آزمون',
active: activeStep[1]
},
{
title: ' ورود سوالات ',
active: activeStep[2]
},
{
title: 'پیش نمایش',
active: activeStep[3]
},
{
title: 'ثبت نهایی',
active: activeStep[4]
},
]
console.log(activeStep)
const backStep = () => {
const backStepArray = () => {
const fakeArray = [];
[0,1,2,3,4].map((item, index) => index < step ? fakeArray.push(true) : fakeArray.push(false))
return fakeArray;
}
step > 0 && setStep(step - 1); setActiveStep(backStepArray);
}
const content = [
<AddGradeGroup
stepClick={() => {setStep(1); setActiveStep([true, true, false, false, false, false])}}
backStep={() => backStep()}
/>,
<AddExamDescription
stepClick={() => {setStep(2); setActiveStep([true, true, true, false, false, false])}}
backStep={() => backStep()}
/>,
<AddQuestions
stepClick={() => {setStep(3); setActiveStep([true, true, true, true, false, false])}}
backStep={() => backStep()}
/>,
'',
]
return(
<div className='flex flex-col w-[96%] py-[6%] bg-grayFD rtl'>
<div className='flex w-full items-center py-4 pb-8 px-10 border-b border-gray-300'>
<h1 className="text-blue3A text-lg font-bold w-1/5 text-right px-4 border-r-4 border-blue65">
ساخت آزمون جدید
</h1>
<div className='w-full '>
<Stepper steps={steps} count={5} direction="horizontal"/>
</div>
</div>
{
content[step]
}
</div>
)
}
export default AddExam;