44 lines
1.3 KiB
TypeScript
44 lines
1.3 KiB
TypeScript
import React, { useState } from "react";
|
||
import { Button, Box } from "@mui/material";
|
||
import JobRequestForm from "./JobRequestForm";
|
||
import { AddCircleOutlineOutlined } from "@mui/icons-material";
|
||
|
||
export default function JobRequestSection() {
|
||
const [jobs, setJobs] = useState([{ id: Date.now(), jobCategoryId: "", hasPlan: false, planStartDate: null, degree: "" }]);
|
||
|
||
const addJob = () => {
|
||
setJobs([...jobs, { id: Date.now(), jobCategoryId: "", hasPlan: false, planStartDate: null, degree: "" }]);
|
||
};
|
||
|
||
const updateJob = (id, updatedData) => {
|
||
setJobs(jobs.map(j => j.id === id ? { ...updatedData, id } : j));
|
||
};
|
||
|
||
const removeJob = (id) => {
|
||
if (jobs.length > 1) setJobs(jobs.filter(j => j.id !== id));
|
||
};
|
||
|
||
return (
|
||
<div className="space-y-10 ">
|
||
{jobs.map((job) => (
|
||
<JobRequestForm
|
||
key={job.id}
|
||
data={job}
|
||
onChange={(newData) => updateJob(job.id, newData)}
|
||
onRemove={() => removeJob(job.id)}
|
||
isDeletable={jobs.length > 1}
|
||
/>
|
||
))}
|
||
|
||
<Button
|
||
variant="outlined"
|
||
startIcon={<AddCircleOutlineOutlined />}
|
||
onClick={addJob}
|
||
sx={{ mt: 1, borderColor: '#4caf50', color: '#4caf50' }}
|
||
>
|
||
افزودن شغل درخواستی جدید
|
||
</Button>
|
||
</div>
|
||
);
|
||
}
|