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.
 
 
 

85 lines
3.3 KiB

import React, { useState } from "react";
import { connect } from "react-redux";
import Button from "../../../components/Button";
const AddGradeGroup = ({grades, addExamState, dispatch, stepClick}) => {
const [examGrade, setExamGrade] = useState(null);
const [group, setGroup] = useState(null);
console.log(addExamState)
const payload = {grade: examGrade, groupId: group};
return(
<>
<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="flex w-5/6 flex-wrap">
{
grades.map((item) =>(
<div className={`w-1/6 border ${examGrade == item.id ? 'border-red52 text-red52 bg-pinkF5' : ' border-gray-300 text-blue3A bg-white'} font-bold cursor-pointer py-10 m-4 rounded-xl`} key={`ADD_EXAM_GRADE__${item.id}`} onClick={() => setExamGrade(item.id)}>
پایه {item.title}
</div>
))
}
</div>
</div>
<div className="flex pt-10 items-start px-10 ">
<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="flex w-5/6 flex-wrap">
<div className={`w-1/6 border ${group == 1 ? 'border-red52 text-red52 bg-pinkF5' : ' border-gray-300 text-blue3A bg-white'} font-bold cursor-pointer py-10 m-4 rounded-xl`} onClick={() => setGroup(1)}>
ابر ذهن
</div>
<div className={`w-1/6 border ${group == 2 ? 'border-red52 text-red52 bg-pinkF5' : ' border-gray-300 text-blue3A bg-white'} font-bold cursor-pointer py-10 m-4 rounded-xl`} onClick={() => setGroup(2)}>
تیزهوشان
</div>
</div>
</div>
<div className="flex fixed bottom-10 left-0 w-full px-10 justify-end">
<Button
title='مرحله بعدی'
className='w-1/12'
onClick={() => {
dispatch({type: 'ADD_EXAM_GRADE_AND_GROUP',payload });
stepClick()
}}
/>
</div>
</>
)
}
const mapStateToProps = (state) => ({
grades: state.publicApi.grades,
addExamState: state.addExamReduser
})
export default connect(mapStateToProps)(AddGradeGroup);