88 lines
2.4 KiB
JavaScript
88 lines
2.4 KiB
JavaScript
import React, { useState, useEffect } from 'react'
|
|
import StepOneJoblisting from './StepOneJoblisting';
|
|
import StepTwoJoblisting from './StepTwoJoblisting';
|
|
import StepThreeJoblisting from './StepThreeJoblisting';
|
|
import StepFourJoblisting from './StepFourJoblisting'
|
|
const AddJobListing = () => {
|
|
const [currentStep, setCurrentStep] = useState(1)
|
|
const [formData, setFormData] = useState({
|
|
'postingOption': 'Opcja 2',
|
|
'requireSalary': true
|
|
})
|
|
const nextStep = () => {
|
|
setCurrentStep(currentStep + 1);
|
|
};
|
|
|
|
const prevStep = () => {
|
|
setCurrentStep(currentStep - 1);
|
|
};
|
|
const removeFields = (fieldNames) => {
|
|
// Utwórz nowy obiekt, który początkowo jest kopią formData
|
|
let newFormData = { ...formData };
|
|
|
|
// Iteruj przez każde pole do usunięcia
|
|
fieldNames.forEach(fieldName => {
|
|
// Usuń pole z nowego obiektu danych
|
|
delete newFormData[fieldName];
|
|
});
|
|
|
|
// Aktualizuj stan z nowym obiektem
|
|
setFormData(newFormData);
|
|
};
|
|
|
|
const handleChange = input => value => {
|
|
// Sprawdzenie, czy 'value' jest obiektem zdarzenia
|
|
const isEvent = value && value.target;
|
|
let newValue;
|
|
|
|
if (isEvent) {
|
|
// Jeśli 'value' jest obiektem zdarzenia, użyj jego właściwości 'value'
|
|
newValue = value.target.value;
|
|
} else {
|
|
// W przeciwnym razie użyj 'value' bezpośrednio
|
|
newValue = value;
|
|
}
|
|
|
|
setFormData({ ...formData, [input]: newValue });
|
|
console.log('Aktualny stan formularza:', formData);
|
|
};
|
|
|
|
const handleSubmit = () => {
|
|
|
|
}
|
|
useEffect(() => {
|
|
console.log('Aktualny stan formularza:', formData);
|
|
}, [formData]);
|
|
|
|
switch (currentStep) {
|
|
case 1:
|
|
return <StepOneJoblisting
|
|
nextStep={nextStep}
|
|
handleChange={handleChange}
|
|
formData={formData} />;
|
|
case 2:
|
|
return <StepFourJoblisting
|
|
nextStep={nextStep}
|
|
formData={formData}
|
|
handleChange={handleChange} />;
|
|
case 3:
|
|
return <StepTwoJoblisting
|
|
nextStep={nextStep}
|
|
prevStep={prevStep}
|
|
removeFields={removeFields}
|
|
setFormData={setFormData}
|
|
handleChange={handleChange}
|
|
formData={formData} />;
|
|
case 4:
|
|
return <StepThreeJoblisting
|
|
prevStep={prevStep}
|
|
handleSubmit={handleSubmit}
|
|
formData={formData} />;
|
|
default:
|
|
return <div>Unknown step</div>;
|
|
}
|
|
};
|
|
|
|
|
|
export default AddJobListing;
|