import React, { useState } from 'react'; import { Head, Link, useForm } from '@inertiajs/react'; import EmployerLayout from '@/Layouts/EmployerLayout'; import { Plus, ArrowLeft, Briefcase, MapPin, DollarSign, LayoutGrid, Users, FileText, Sparkles, ShieldCheck, X } from 'lucide-react'; import { toast } from 'sonner'; export default function Create({ professions, availableSkills }) { const categoryList = professions || [ 'Housekeeper', 'Nanny', 'Maid', 'Electrician', 'Mason', 'Plumber', 'Cleaner', 'Driver', 'Caregiver', 'Cook' ]; const skillList = availableSkills || []; const { data, setData, post, processing, errors } = useForm({ title: '', main_profession: '', skills: [], workers_needed: 1, location: '', salary: '', job_type: 'Full Time', start_date: new Date().toISOString().split('T')[0], description: '', }); const [clientErrors, setClientErrors] = useState({}); const handleSubmit = (e) => { e.preventDefault(); // Client-side validation const newErrors = {}; if (!data.title.trim()) { newErrors.title = 'Job title is required.'; } if (!data.main_profession) { newErrors.main_profession = 'Main profession is required.'; } if (!data.skills || data.skills.length === 0) { newErrors.skills = 'At least one skill is required.'; } if (!data.workers_needed || data.workers_needed < 1) { newErrors.workers_needed = 'Workers needed must be at least 1.'; } if (!data.location.trim()) { newErrors.location = 'Job location is required.'; } if (!data.salary || data.salary < 0) { newErrors.salary = 'Monthly salary must be a positive number.'; } if (!data.start_date) { newErrors.start_date = 'Start date is required.'; } if (!data.description.trim()) { newErrors.description = 'Job description is required.'; } if (Object.keys(newErrors).length > 0) { setClientErrors(newErrors); toast.error('Validation failed. Please correct the fields in red.'); return; } setClientErrors({}); post('/employer/jobs/create', { onSuccess: () => { toast.success('Job posted successfully.'); }, onError: () => { toast.error('Failed to post job. Please check the inputs.'); } }); }; return (
Back to My Jobs

Post a New Job

Fill in the details to find the perfect workers

Premium Listing Active
{/* Section 1: Basic Info */}

Basic Information

setData('title', e.target.value)} />
{(clientErrors.title || errors.title) && (

{clientErrors.title || errors.title}

)}
{(clientErrors.main_profession || errors.main_profession) && (

{clientErrors.main_profession || errors.main_profession}

)}
setData('workers_needed', e.target.value)} />
{(clientErrors.workers_needed || errors.workers_needed) && (

{clientErrors.workers_needed || errors.workers_needed}

)}
setData('location', e.target.value)} />
{(clientErrors.location || errors.location) && (

{clientErrors.location || errors.location}

)}
setData('salary', e.target.value)} />
{(clientErrors.salary || errors.salary) && (

{clientErrors.salary || errors.salary}

)}
{['Full Time', 'Part Time'].map(type => ( ))}
{/* Section 2: Detailed Requirements */}

Detailed Requirements

{/* Selected skills pills */} {data.skills.length > 0 && (
{data.skills.map(skill => ( {skill} ))}
)}
{(clientErrors.skills || errors.skills) && (

{clientErrors.skills || errors.skills}

)}