added integration to save the employee data in employeelist page

This commit is contained in:
Suraj Birewar 2024-08-06 09:15:43 +05:30
parent c2c5ef0ff0
commit 0af402c018
3 changed files with 66 additions and 42 deletions

22
db.json
View File

@ -48,6 +48,28 @@
"firstname": "gajanan", "firstname": "gajanan",
"lastname": "bodke", "lastname": "bodke",
"email": "gajanan001@gmail.com" "email": "gajanan001@gmail.com"
},
{
"id": "4db0",
"firstname": "sachin",
"lastname": "patil",
"age": "22",
"gender": "",
"email": "sachin@gmail.com",
"mobile": "07559393995",
"address": {
"address_line_1": "",
"address_line_2": "",
"nearby_landmark": "",
"pincode": "",
"city_id": ""
},
"image": null,
"address.address_line_1": "Sarovar line 1 , Bavdhan, Pune",
"address.address_line_2": "LOCAL :,Bavdhan",
"address.pincode": "411021",
"address.nearby_landmark": "i",
"address.city_id": "1"
} }
], ],
"products": [ "products": [

View File

@ -94,11 +94,8 @@ const AddEmployee = () => {
}); });
try { try {
await axiosInstance.post('http://localhost:5000/employees', formData, { const data = await createEmployee(employeeData);
headers: { console.log('Employee added successfully:', data);
'Content-Type': 'multipart/form-data',
},
});
navigate('/employees'); navigate('/employees');
} catch (error) { } catch (error) {
console.error('Error adding employee:', error.response || error.message); console.error('Error adding employee:', error.response || error.message);
@ -182,79 +179,83 @@ const AddEmployee = () => {
className={CLASSES.formInput} className={CLASSES.formInput}
/> />
</div> </div>
<div>
<label className={CLASSES.formGroup}>gender:</label> <div className={CLASSES.formGroup}>
<select <label htmlFor="email">Email</label>
name="gender" <input
value={employeeData.gender} type="email"
id="email"
name="email"
className={CLASSES.formInput}
value={employeeData.email}
onChange={handleInputChange} onChange={handleInputChange}
className={CLASSES.formSelect} />
>
<option value="" disabled>select gender</option>
<option value="male">male</option>
<option value="female">female</option>
<option value="other">other</option>
</select>
</div> </div>
<div> <div className={CLASSES.formGroup}>
<label className={CLASSES.formGroup}>mobile:</label> <label htmlFor="mobile">Mobile Number</label>
<input <input
type="text" type="text"
id="mobile"
name="mobile" name="mobile"
className={CLASSES.formInput}
value={employeeData.mobile} value={employeeData.mobile}
onChange={handleInputChange} onChange={handleInputChange}
className={CLASSES.formInput}
/> />
</div> </div>
<div> <div className={CLASSES.formGroup}>
<label className={CLASSES.formGroup}>address line 1:</label> <label htmlFor="address_line_1">Address Line 1</label>
<input <input
type="text" type="text"
name="address_line_1" id="address_line_1"
name="address.address_line_1"
className={CLASSES.formInput}
value={employeeData.address.address_line_1} value={employeeData.address.address_line_1}
onChange={handleInputChange} onChange={handleInputChange}
className={CLASSES.formInput}
/> />
</div> </div>
<div> <div className={CLASSES.formGroup}>
<label className={CLASSES.formGroup}>address line 2:</label> <label htmlFor="address_line_2">Address Line 2</label>
<input <input
type="text" type="text"
name="address_line_2" id="address_line_2"
name="address.address_line_2"
className={CLASSES.formInput}
value={employeeData.address.address_line_2} value={employeeData.address.address_line_2}
onChange={handleInputChange} onChange={handleInputChange}
className={CLASSES.formInput}
/> />
</div> </div>
<div> <div className={CLASSES.formGroup}>
<label className={CLASSES.formGroup}>nearby landmark:</label> <label htmlFor="nearby_landmark">Nearby Landmark</label>
<input <input
type="text" type="text"
name="nearby_landmark" id="nearby_landmark"
name="address.nearby_landmark"
className={CLASSES.formInput}
value={employeeData.address.nearby_landmark} value={employeeData.address.nearby_landmark}
onChange={handleInputChange} onChange={handleInputChange}
className={CLASSES.formInput}
/> />
</div> </div>
<div> <div className={CLASSES.formGroup}>
<label className={CLASSES.formGroup}>pincode:</label> <label htmlFor="pincode">Pincode</label>
<input <input
type="text" type="text"
name="pincode" id="pincode"
name="address.pincode"
className={CLASSES.formInput}
value={employeeData.address.pincode} value={employeeData.address.pincode}
onChange={handleInputChange} onChange={handleInputChange}
className={CLASSES.formInput}
/> />
</div> </div>
<div> <div className={CLASSES.formGroup}>
<label className={CLASSES.formGroup}>city:</label> <label htmlFor="city_id">City</label>
<select <select
name="city_id" id="city_id"
name="address.city_id"
className={CLASSES.formSelect}
value={employeeData.address.city_id} value={employeeData.address.city_id}
onChange={handleInputChange} onChange={handleInputChange}
className={CLASSES.formSelect}
> >
<option value="" disabled>select city</option> <option value="">Select City</option>
{cities.map((city) => ( {cities.map((city) => (
<option key={city.id} value={city.id}> <option key={city.id} value={city.id}>
{city.name} {city.name}
@ -262,6 +263,7 @@ const AddEmployee = () => {
))} ))}
</select> </select>
</div> </div>
<button type="submit" className={CLASSES.submitButton}> <button type="submit" className={CLASSES.submitButton}>
add employee add employee
</button> </button>

View File

@ -61,7 +61,7 @@ const AdminSidebar = () => {
<Link to="/employees" className={classNames.iconLink}> <Link to="/employees" className={classNames.iconLink}>
<img src={EmployeeIcon} alt="Employee" className={classNames.icon} /> <img src={EmployeeIcon} alt="Employee" className={classNames.icon} />
</Link> </Link>
<Link to="/admin/measurements" className={classNames.iconLink}> <Link to="/setmeasurements" className={classNames.iconLink}>
<img src={MeasurmentsIcon} alt="Measurements" className={classNames.icon} /> <img src={MeasurmentsIcon} alt="Measurements" className={classNames.icon} />
</Link> </Link>
<Link to="/admin/profile" className={classNames.iconLink}> <Link to="/admin/profile" className={classNames.iconLink}>