|
|
|
|
|
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); |