refactor: merge company and job form into single step
- Reduced form from 3 steps to 2 steps - Step 1 now contains both company and job data with visual separator - Step 2 is confirmation only - Updated progress indicators and card headers - Fixed navigation button references
This commit is contained in:
parent
249081554d
commit
afab4e89cd
1 changed files with 22 additions and 30 deletions
|
|
@ -58,7 +58,7 @@ const getSalaryPeriodLabel = (type: string): string => {
|
|||
|
||||
export default function PostJobPage() {
|
||||
const router = useRouter();
|
||||
const [step, setStep] = useState<1 | 2 | 3>(1);
|
||||
const [step, setStep] = useState<1 | 2>(1);
|
||||
const [loading, setLoading] = useState(false);
|
||||
|
||||
// Company/User data
|
||||
|
|
@ -217,7 +217,7 @@ export default function PostJobPage() {
|
|||
|
||||
{/* Progress Steps */}
|
||||
<div className="flex justify-center gap-4 mb-8">
|
||||
{[1, 2, 3].map((s) => (
|
||||
{[1, 2].map((s) => (
|
||||
<div
|
||||
key={s}
|
||||
className={`flex items-center gap-2 ${step >= s ? "text-primary" : "text-muted-foreground"}`}
|
||||
|
|
@ -226,7 +226,7 @@ export default function PostJobPage() {
|
|||
{s}
|
||||
</div>
|
||||
<span className="hidden sm:inline text-sm">
|
||||
{s === 1 ? "Empresa" : s === 2 ? "Vaga" : "Confirmar"}
|
||||
{s === 1 ? "Dados" : "Confirmar"}
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
|
|
@ -235,14 +235,12 @@ export default function PostJobPage() {
|
|||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>
|
||||
{step === 1 && "Dados da Empresa"}
|
||||
{step === 2 && "Detalhes da Vaga"}
|
||||
{step === 3 && "Confirmar e Publicar"}
|
||||
{step === 1 && "Empresa & Vaga"}
|
||||
{step === 2 && "Confirmar e Publicar"}
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
{step === 1 && "Informe os dados da sua empresa para criar a conta"}
|
||||
{step === 2 && "Descreva a vaga que você deseja publicar"}
|
||||
{step === 3 && "Revise as informações antes de publicar"}
|
||||
{step === 1 && "Informe os dados da empresa e da vaga"}
|
||||
{step === 2 && "Revise as informações antes de publicar"}
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
|
|
@ -414,15 +412,13 @@ export default function PostJobPage() {
|
|||
/>
|
||||
</div>
|
||||
|
||||
<Button onClick={() => setStep(2)} className="w-full">
|
||||
Próximo: Dados da Vaga
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
{/* Separator */}
|
||||
<div className="border-t pt-6 mt-6">
|
||||
<h3 className="font-semibold text-lg mb-4 flex items-center gap-2">
|
||||
<Briefcase className="h-5 w-5" /> Dados da Vaga
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
{/* Step 2: Job */}
|
||||
{step === 2 && (
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<Label>Título da Vaga *</Label>
|
||||
<div className="relative">
|
||||
|
|
@ -585,19 +581,15 @@ export default function PostJobPage() {
|
|||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex gap-3">
|
||||
<Button variant="outline" onClick={() => setStep(1)} className="flex-1">
|
||||
Voltar
|
||||
</Button>
|
||||
<Button onClick={() => setStep(3)} className="flex-1">
|
||||
Próximo: Confirmar
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<Button onClick={() => setStep(2)} className="w-full">
|
||||
Próximo: Confirmar
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Step 3: Confirm */}
|
||||
{step === 3 && (
|
||||
{/* Step 2: Confirm */}
|
||||
{step === 2 && (
|
||||
<div className="space-y-6">
|
||||
<div className="bg-muted/50 rounded-lg p-4">
|
||||
<h3 className="font-semibold mb-2 flex items-center gap-2">
|
||||
|
|
@ -623,7 +615,7 @@ export default function PostJobPage() {
|
|||
<p><strong>Tipo:</strong> {job.employmentType || "Qualquer"} / {job.workingHours === 'full-time' ? 'Integral' : job.workingHours === 'part-time' ? 'Meio Período' : 'Qualquer'} / {job.workMode}</p>
|
||||
</div>
|
||||
<div className="flex gap-3">
|
||||
<Button variant="outline" onClick={() => setStep(2)} className="flex-1">
|
||||
<Button variant="outline" onClick={() => setStep(1)} className="flex-1">
|
||||
Voltar
|
||||
</Button>
|
||||
<Button onClick={handleSubmit} disabled={loading} className="flex-1">
|
||||
|
|
@ -635,9 +627,9 @@ export default function PostJobPage() {
|
|||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</main>
|
||||
</main >
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
</div >
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue