refactor job posting routes and add dashboard job creation page
This commit is contained in:
Tiago Yamamoto
parent
77c8a86a0b
commit
8fbb54c977
14 changed files with 310 additions and 364 deletions
|
|
@ -24,7 +24,7 @@ Lista detalhada de tarefas para evitar retrabalho.
|
|||
- Frontend: profileApi.uploadAvatar
|
||||
|
||||
- [x] **Public Job Posting**
|
||||
- Frontend: `/post-job` page
|
||||
- Frontend: `/jobs/new` page
|
||||
- 3-step wizard (Company + Job + Confirm)
|
||||
|
||||
- [x] **Documentation**
|
||||
|
|
|
|||
|
|
@ -2,11 +2,12 @@
|
|||
|
||||
As principais rotas usadas para publicar vagas no projeto são:
|
||||
|
||||
1. `/publicar-vaga` — landing/formulário público de anúncio de vaga.
|
||||
2. `/post-job` — fluxo principal multi-etapas para publicação com dados da empresa e da vaga.
|
||||
3. `/register/job` — formulário público alternativo para criação de vaga.
|
||||
1. `/jobs/new` — fluxo público principal (multi-etapas) para publicação com dados da empresa e da vaga.
|
||||
2. `/publicar-vaga` — rota legada redirecionando para `/jobs/new`.
|
||||
3. `/dashboard/jobs/new` — fluxo interno no dashboard para cadastro rápido de vaga (design system do dashboard).
|
||||
4. `/register/job` — formulário público alternativo para criação de vaga.
|
||||
|
||||
## Pontos de entrada no sistema
|
||||
|
||||
- Link para `/publicar-vaga` na página **About** e no **Footer**.
|
||||
- Link para `/post-job` na página **Contact**.
|
||||
- Link para `/jobs/new` na página **About**, **Footer** e **Contact**.
|
||||
- Link para `/dashboard/jobs/new` nas páginas internas do dashboard (Jobs, My Jobs e sidebar da empresa).
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@ src/
|
|||
│ ├── page.tsx # Landing page
|
||||
│ ├── login/ # Autenticação
|
||||
│ ├── register/ # Registro (candidate, company)
|
||||
│ ├── post-job/ # **NEW** Wizard público
|
||||
│ ├── jobs/new/ # **NEW** Wizard público
|
||||
│ ├── jobs/ # Listagem e detalhes
|
||||
│ │ ├── page.tsx # Listagem
|
||||
│ │ ├── [id]/page.tsx # Detalhes
|
||||
|
|
@ -143,7 +143,7 @@ src/
|
|||
| `/login` | Login |
|
||||
| `/register/candidate` | Registro candidato |
|
||||
| `/register/company` | Registro empresa |
|
||||
| `/post-job` | **NEW** Wizard público (registro + vaga) |
|
||||
| `/jobs/new` | **NEW** Wizard público (registro + vaga) |
|
||||
| `/about` | Sobre |
|
||||
| `/contact` | Contato |
|
||||
| `/faq` | FAQ |
|
||||
|
|
|
|||
|
|
@ -243,7 +243,7 @@ export default function AboutPage() {
|
|||
{t('about.cta.findJobs')}
|
||||
</a>
|
||||
<a
|
||||
href="/publicar-vaga"
|
||||
href="/jobs/new"
|
||||
className="inline-block bg-transparent border-2 border-white text-white hover:bg-white/10 font-bold px-8 py-4 rounded-full text-lg transition-all"
|
||||
>
|
||||
{t('about.cta.postJob')}
|
||||
|
|
|
|||
|
|
@ -152,7 +152,7 @@ export default function ContactPage() {
|
|||
</div>
|
||||
</Link>
|
||||
|
||||
<Link href="/post-job" className="flex items-center gap-3 p-3 rounded-lg hover:bg-gray-50 transition-colors group">
|
||||
<Link href="/jobs/new" className="flex items-center gap-3 p-3 rounded-lg hover:bg-gray-50 transition-colors group">
|
||||
<div className="w-10 h-10 bg-primary/10 rounded-lg flex items-center justify-center group-hover:bg-primary/20 transition-colors">
|
||||
<FileText className="w-5 h-5 text-primary" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,293 @@
|
|||
import { redirect } from "next/navigation"
|
||||
"use client"
|
||||
|
||||
export default function DashboardNewJobRedirectPage() {
|
||||
redirect("/publicar-vaga")
|
||||
import { useEffect, useState } from "react"
|
||||
import { Loader2, PlusCircle } from "lucide-react"
|
||||
import { toast } from "sonner"
|
||||
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import { Textarea } from "@/components/ui/textarea"
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select"
|
||||
import { adminCompaniesApi, jobsApi, type AdminCompany, type CreateJobPayload } from "@/lib/api"
|
||||
|
||||
export default function DashboardNewJobPage() {
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [loadingCompanies, setLoadingCompanies] = useState(true)
|
||||
const [companies, setCompanies] = useState<AdminCompany[]>([])
|
||||
|
||||
const [formData, setFormData] = useState({
|
||||
title: "",
|
||||
description: "",
|
||||
location: "",
|
||||
salaryMin: "",
|
||||
salaryMax: "",
|
||||
salaryType: "monthly",
|
||||
currency: "BRL",
|
||||
employmentType: "",
|
||||
workingHours: "",
|
||||
companyId: "",
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
const loadCompanies = async () => {
|
||||
try {
|
||||
setLoadingCompanies(true)
|
||||
const data = await adminCompaniesApi.list(undefined, 1, 100)
|
||||
setCompanies(data.data ?? [])
|
||||
} catch (error) {
|
||||
console.error("Falha ao carregar empresas:", error)
|
||||
toast.error("Falha ao carregar empresas")
|
||||
} finally {
|
||||
setLoadingCompanies(false)
|
||||
}
|
||||
}
|
||||
|
||||
loadCompanies()
|
||||
}, [])
|
||||
|
||||
const canSubmit =
|
||||
formData.title.trim().length >= 5 &&
|
||||
formData.description.trim().length >= 20 &&
|
||||
formData.companyId !== ""
|
||||
|
||||
const handleInputChange = (field: string, value: string) => {
|
||||
setFormData((prev) => ({ ...prev, [field]: value }))
|
||||
}
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
|
||||
if (!canSubmit) {
|
||||
toast.error("Preencha os campos obrigatórios")
|
||||
return
|
||||
}
|
||||
|
||||
setLoading(true)
|
||||
try {
|
||||
const payload: CreateJobPayload = {
|
||||
companyId: formData.companyId,
|
||||
title: formData.title,
|
||||
description: formData.description,
|
||||
location: formData.location || undefined,
|
||||
employmentType:
|
||||
(formData.employmentType as CreateJobPayload["employmentType"]) || undefined,
|
||||
salaryMin: formData.salaryMin ? parseFloat(formData.salaryMin) : undefined,
|
||||
salaryMax: formData.salaryMax ? parseFloat(formData.salaryMax) : undefined,
|
||||
salaryType: (formData.salaryType as CreateJobPayload["salaryType"]) || undefined,
|
||||
currency: (formData.currency as CreateJobPayload["currency"]) || undefined,
|
||||
workingHours: formData.workingHours || undefined,
|
||||
status: "draft",
|
||||
}
|
||||
|
||||
await jobsApi.create(payload)
|
||||
toast.success("Vaga cadastrada no dashboard com sucesso")
|
||||
setFormData({
|
||||
title: "",
|
||||
description: "",
|
||||
location: "",
|
||||
salaryMin: "",
|
||||
salaryMax: "",
|
||||
salaryType: "monthly",
|
||||
currency: "BRL",
|
||||
employmentType: "",
|
||||
workingHours: "",
|
||||
companyId: "",
|
||||
})
|
||||
} catch (error: any) {
|
||||
console.error("Falha ao cadastrar vaga:", error)
|
||||
toast.error(error.message || "Falha ao cadastrar vaga")
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold text-foreground">Nova vaga</h1>
|
||||
<p className="text-muted-foreground mt-1">
|
||||
Cadastre vagas usando o padrão visual do dashboard.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<PlusCircle className="h-5 w-5" /> Dados da vaga
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
Informe os detalhes obrigatórios para criar a vaga em rascunho.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form onSubmit={handleSubmit} className="space-y-5">
|
||||
<div>
|
||||
<Label htmlFor="title">Título da vaga *</Label>
|
||||
<Input
|
||||
id="title"
|
||||
placeholder="Ex: Desenvolvedor(a) Full Stack Sênior"
|
||||
value={formData.title}
|
||||
onChange={(e) => handleInputChange("title", e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="description">Descrição da vaga *</Label>
|
||||
<Textarea
|
||||
id="description"
|
||||
rows={6}
|
||||
placeholder="Descreva responsabilidades, requisitos e diferenciais..."
|
||||
value={formData.description}
|
||||
onChange={(e) => handleInputChange("description", e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<Label htmlFor="location">Localização</Label>
|
||||
<Input
|
||||
id="location"
|
||||
placeholder="Ex: São Paulo/SP ou Remoto"
|
||||
value={formData.location}
|
||||
onChange={(e) => handleInputChange("location", e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>Tipo de contrato</Label>
|
||||
<Select
|
||||
value={formData.employmentType}
|
||||
onValueChange={(v) => handleInputChange("employmentType", v)}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Selecione" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="permanent">Permanente</SelectItem>
|
||||
<SelectItem value="full-time">Tempo integral</SelectItem>
|
||||
<SelectItem value="part-time">Meio período</SelectItem>
|
||||
<SelectItem value="contract">Contrato</SelectItem>
|
||||
<SelectItem value="temporary">Temporário</SelectItem>
|
||||
<SelectItem value="training">Estágio/Trainee</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<Label htmlFor="salaryMin">Salário mínimo</Label>
|
||||
<Input
|
||||
id="salaryMin"
|
||||
type="number"
|
||||
min="0"
|
||||
placeholder="Ex: 3000"
|
||||
value={formData.salaryMin}
|
||||
onChange={(e) => handleInputChange("salaryMin", e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="salaryMax">Salário máximo</Label>
|
||||
<Input
|
||||
id="salaryMax"
|
||||
type="number"
|
||||
min="0"
|
||||
placeholder="Ex: 6000"
|
||||
value={formData.salaryMax}
|
||||
onChange={(e) => handleInputChange("salaryMax", e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-4">
|
||||
<div>
|
||||
<Label>Moeda</Label>
|
||||
<Select value={formData.currency} onValueChange={(v) => handleInputChange("currency", v)}>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="BRL">BRL - R$</SelectItem>
|
||||
<SelectItem value="USD">USD - $</SelectItem>
|
||||
<SelectItem value="EUR">EUR - €</SelectItem>
|
||||
<SelectItem value="GBP">GBP - £</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>Período do salário</Label>
|
||||
<Select value={formData.salaryType} onValueChange={(v) => handleInputChange("salaryType", v)}>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="hourly">Por hora</SelectItem>
|
||||
<SelectItem value="daily">Por dia</SelectItem>
|
||||
<SelectItem value="weekly">Por semana</SelectItem>
|
||||
<SelectItem value="monthly">Por mês</SelectItem>
|
||||
<SelectItem value="yearly">Por ano</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="workingHours">Jornada de trabalho</Label>
|
||||
<Input
|
||||
id="workingHours"
|
||||
placeholder="Ex: 9h às 18h"
|
||||
value={formData.workingHours}
|
||||
onChange={(e) => handleInputChange("workingHours", e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label>Empresa *</Label>
|
||||
{loadingCompanies ? (
|
||||
<div className="h-10 px-3 flex items-center text-sm text-muted-foreground border rounded-md">
|
||||
<Loader2 className="h-4 w-4 mr-2 animate-spin" /> Carregando empresas...
|
||||
</div>
|
||||
) : (
|
||||
<Select value={formData.companyId} onValueChange={(v) => handleInputChange("companyId", v)}>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Selecione uma empresa" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{companies.length === 0 ? (
|
||||
<SelectItem value="__none" disabled>
|
||||
Nenhuma empresa disponível
|
||||
</SelectItem>
|
||||
) : (
|
||||
companies.map((company) => (
|
||||
<SelectItem key={company.id} value={company.id}>
|
||||
{company.name}
|
||||
</SelectItem>
|
||||
))
|
||||
)}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<Button type="submit" disabled={loading || !canSubmit}>
|
||||
{loading ? <Loader2 className="h-4 w-4 mr-2 animate-spin" /> : null}
|
||||
Criar vaga
|
||||
</Button>
|
||||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -191,7 +191,7 @@ export default function AdminJobsPage() {
|
|||
<h1 className="text-3xl font-bold text-foreground">{t('admin.jobs.title')}</h1>
|
||||
<p className="text-muted-foreground mt-1">{t('admin.jobs.subtitle')}</p>
|
||||
</div>
|
||||
<Link href="/publicar-vaga">
|
||||
<Link href="/dashboard/jobs/new">
|
||||
<Button className="gap-2">
|
||||
<Plus className="h-4 w-4" />
|
||||
{t('admin.jobs.newJob')}
|
||||
|
|
|
|||
|
|
@ -150,7 +150,7 @@ export default function MyJobsPage() {
|
|||
Manage your job postings for {user?.companyId ? "your company" : "..."}
|
||||
</p>
|
||||
</div>
|
||||
<Link href="/dashboard/company/jobs/new">
|
||||
<Link href="/dashboard/jobs/new">
|
||||
<Button size="lg" className="w-full sm:w-auto">
|
||||
<Plus className="h-5 w-5 mr-2" />
|
||||
Post New Job
|
||||
|
|
@ -238,7 +238,7 @@ export default function MyJobsPage() {
|
|||
<Briefcase className="h-12 w-12 mx-auto mb-4 opacity-50" />
|
||||
<h3 className="font-semibold text-lg mb-2">No jobs found</h3>
|
||||
<p>Start by posting your first job using the button above.</p>
|
||||
<Link href="/dashboard/company/jobs/new">
|
||||
<Link href="/dashboard/jobs/new">
|
||||
<Button className="mt-4">
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Post New Job
|
||||
|
|
|
|||
|
|
@ -1,348 +1,5 @@
|
|||
"use client"
|
||||
import { redirect } from "next/navigation"
|
||||
|
||||
import { useEffect, useState } from "react"
|
||||
import { Navbar } from "@/components/navbar"
|
||||
import { Footer } from "@/components/footer"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { Textarea } from "@/components/ui/textarea"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select"
|
||||
import { Check, Briefcase, Loader2, MapPin, DollarSign, Clock, Building2 } from "lucide-react"
|
||||
import Image from "next/image"
|
||||
import Link from "next/link"
|
||||
import { jobsApi, adminCompaniesApi, type CreateJobPayload, type AdminCompany } from "@/lib/api"
|
||||
import { toast } from "sonner"
|
||||
|
||||
export default function PublicarVagaPage() {
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [loadingCompanies, setLoadingCompanies] = useState(true)
|
||||
const [companies, setCompanies] = useState<AdminCompany[]>([])
|
||||
|
||||
const [formData, setFormData] = useState({
|
||||
title: "",
|
||||
description: "",
|
||||
location: "",
|
||||
salaryMin: "",
|
||||
salaryMax: "",
|
||||
salaryType: "monthly",
|
||||
currency: "BRL",
|
||||
employmentType: "",
|
||||
workingHours: "",
|
||||
companyId: "",
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
const loadCompanies = async () => {
|
||||
try {
|
||||
setLoadingCompanies(true)
|
||||
const data = await adminCompaniesApi.list(undefined, 1, 100)
|
||||
setCompanies(data.data ?? [])
|
||||
} catch (error) {
|
||||
console.error("Falha ao carregar empresas:", error)
|
||||
toast.error("Falha ao carregar empresas")
|
||||
} finally {
|
||||
setLoadingCompanies(false)
|
||||
}
|
||||
}
|
||||
|
||||
loadCompanies()
|
||||
}, [])
|
||||
|
||||
const canSubmit = () => {
|
||||
return (
|
||||
formData.title.length >= 5 &&
|
||||
formData.description.length >= 20 &&
|
||||
formData.companyId !== ""
|
||||
)
|
||||
}
|
||||
|
||||
const handleInputChange = (field: string, value: string) => {
|
||||
setFormData((prev) => ({ ...prev, [field]: value }))
|
||||
}
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
|
||||
if (!canSubmit()) {
|
||||
toast.error("Preencha os campos obrigatórios")
|
||||
return
|
||||
}
|
||||
|
||||
setLoading(true)
|
||||
try {
|
||||
const payload: CreateJobPayload = {
|
||||
companyId: formData.companyId,
|
||||
title: formData.title,
|
||||
description: formData.description,
|
||||
location: formData.location || undefined,
|
||||
employmentType: formData.employmentType as CreateJobPayload["employmentType"] || undefined,
|
||||
salaryMin: formData.salaryMin ? parseFloat(formData.salaryMin) : undefined,
|
||||
salaryMax: formData.salaryMax ? parseFloat(formData.salaryMax) : undefined,
|
||||
salaryType: formData.salaryType as CreateJobPayload["salaryType"] || undefined,
|
||||
currency: formData.currency as CreateJobPayload["currency"] || undefined,
|
||||
workingHours: formData.workingHours || undefined,
|
||||
status: "draft",
|
||||
}
|
||||
|
||||
await jobsApi.create(payload)
|
||||
toast.success("Vaga publicada com sucesso! Ela será revisada em breve.")
|
||||
setFormData({
|
||||
title: "",
|
||||
description: "",
|
||||
location: "",
|
||||
salaryMin: "",
|
||||
salaryMax: "",
|
||||
salaryType: "monthly",
|
||||
currency: "BRL",
|
||||
employmentType: "",
|
||||
workingHours: "",
|
||||
companyId: "",
|
||||
})
|
||||
} catch (error: any) {
|
||||
console.error("Falha ao publicar vaga:", error)
|
||||
toast.error(error.message || "Falha ao publicar vaga")
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen flex flex-col">
|
||||
<Navbar />
|
||||
|
||||
<main className="flex-1 flex">
|
||||
<div className="hidden lg:flex lg:w-2/5 bg-[#F0932B] relative overflow-hidden">
|
||||
<Image
|
||||
src="/6.png"
|
||||
alt="Background"
|
||||
fill
|
||||
className="object-cover"
|
||||
quality={100}
|
||||
priority
|
||||
/>
|
||||
<div className="absolute inset-0 opacity-10">
|
||||
<div className="absolute top-0 left-0 w-full h-full bg-[radial-gradient(circle_at_30%_50%,rgba(255,255,255,0.1)_0%,transparent_50%)]"></div>
|
||||
</div>
|
||||
|
||||
<div className="relative z-10 flex flex-col justify-between p-12 text-white">
|
||||
<div>
|
||||
<h2 className="text-4xl md:text-5xl font-bold mb-6 leading-tight">
|
||||
Anuncie vagas de emprego<br />
|
||||
de forma rápida e eficiente
|
||||
</h2>
|
||||
|
||||
<div className="space-y-4 mb-8">
|
||||
<div className="flex items-start gap-3"><Check className="w-5 h-5 mt-1" /><p className="font-semibold">Uma das maiores comunidades de profissionais do mercado</p></div>
|
||||
<div className="flex items-start gap-3"><Check className="w-5 h-5 mt-1" /><p className="font-semibold">Plataforma com alta visibilidade e acesso diário</p></div>
|
||||
<div className="flex items-start gap-3"><Check className="w-5 h-5 mt-1" /><p className="font-semibold">Grande movimentação de candidaturas todos os dias</p></div>
|
||||
<div className="flex items-start gap-3"><Check className="w-5 h-5 mt-1" /><p className="font-semibold">Novos talentos se cadastrando constantemente</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex-1 bg-gray-50 overflow-y-auto">
|
||||
<div className="max-w-3xl mx-auto py-12 px-6 md:px-12">
|
||||
<div className="text-center mb-8">
|
||||
<h1 className="text-3xl md:text-4xl font-bold text-gray-900 mb-3">
|
||||
Anuncie a sua vaga de emprego GRÁTIS!
|
||||
</h1>
|
||||
<p className="text-gray-600">
|
||||
Mais de <span className="font-semibold text-primary">50 mil currículos cadastrados</span>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<form onSubmit={handleSubmit} className="space-y-5">
|
||||
<div>
|
||||
<Label htmlFor="title" className="text-gray-700 mb-1.5 block text-sm">
|
||||
<Briefcase className="inline w-4 h-4 mr-1" /> Título da vaga *
|
||||
</Label>
|
||||
<Input
|
||||
id="title"
|
||||
placeholder="Ex: Desenvolvedor(a) Full Stack Sênior"
|
||||
value={formData.title}
|
||||
onChange={(e) => handleInputChange("title", e.target.value)}
|
||||
className="h-11 bg-white border-gray-300"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="description" className="text-gray-700 mb-1.5 block text-sm">Descrição da vaga *</Label>
|
||||
<Textarea
|
||||
id="description"
|
||||
placeholder="Descreva responsabilidades, requisitos e diferenciais..."
|
||||
rows={6}
|
||||
value={formData.description}
|
||||
onChange={(e) => handleInputChange("description", e.target.value)}
|
||||
className="bg-white border-gray-300"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<Label htmlFor="location" className="text-gray-700 mb-1.5 block text-sm">
|
||||
<MapPin className="inline w-4 h-4 mr-1" /> Localização
|
||||
</Label>
|
||||
<Input
|
||||
id="location"
|
||||
placeholder="Ex: São Paulo/SP ou Remoto"
|
||||
value={formData.location}
|
||||
onChange={(e) => handleInputChange("location", e.target.value)}
|
||||
className="h-11 bg-white border-gray-300"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label className="text-gray-700 mb-1.5 block text-sm">
|
||||
<Clock className="inline w-4 h-4 mr-1" /> Tipo de contrato
|
||||
</Label>
|
||||
<Select value={formData.employmentType} onValueChange={(v) => handleInputChange("employmentType", v)}>
|
||||
<SelectTrigger className="h-11 bg-white border-gray-300">
|
||||
<SelectValue placeholder="Selecione" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="permanent">Permanente</SelectItem>
|
||||
<SelectItem value="full-time">Tempo integral</SelectItem>
|
||||
<SelectItem value="part-time">Meio período</SelectItem>
|
||||
<SelectItem value="contract">Contrato</SelectItem>
|
||||
<SelectItem value="temporary">Temporário</SelectItem>
|
||||
<SelectItem value="training">Estágio/Trainee</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<Label htmlFor="salaryMin" className="text-gray-700 mb-1.5 block text-sm">
|
||||
<DollarSign className="inline w-4 h-4 mr-1" /> Salário mínimo
|
||||
</Label>
|
||||
<Input
|
||||
id="salaryMin"
|
||||
type="number"
|
||||
min="0"
|
||||
placeholder="Ex: 3000"
|
||||
value={formData.salaryMin}
|
||||
onChange={(e) => handleInputChange("salaryMin", e.target.value)}
|
||||
className="h-11 bg-white border-gray-300"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="salaryMax" className="text-gray-700 mb-1.5 block text-sm">Salário máximo</Label>
|
||||
<Input
|
||||
id="salaryMax"
|
||||
type="number"
|
||||
min="0"
|
||||
placeholder="Ex: 6000"
|
||||
value={formData.salaryMax}
|
||||
onChange={(e) => handleInputChange("salaryMax", e.target.value)}
|
||||
className="h-11 bg-white border-gray-300"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-4">
|
||||
<div>
|
||||
<Label className="text-gray-700 mb-1.5 block text-sm">Moeda</Label>
|
||||
<Select value={formData.currency} onValueChange={(v) => handleInputChange("currency", v)}>
|
||||
<SelectTrigger className="h-11 bg-white border-gray-300"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="BRL">BRL - R$</SelectItem>
|
||||
<SelectItem value="USD">USD - $</SelectItem>
|
||||
<SelectItem value="EUR">EUR - €</SelectItem>
|
||||
<SelectItem value="GBP">GBP - £</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label className="text-gray-700 mb-1.5 block text-sm">Período do salário</Label>
|
||||
<Select value={formData.salaryType} onValueChange={(v) => handleInputChange("salaryType", v)}>
|
||||
<SelectTrigger className="h-11 bg-white border-gray-300"><SelectValue /></SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="hourly">Por hora</SelectItem>
|
||||
<SelectItem value="daily">Por dia</SelectItem>
|
||||
<SelectItem value="weekly">Por semana</SelectItem>
|
||||
<SelectItem value="monthly">Por mês</SelectItem>
|
||||
<SelectItem value="yearly">Por ano</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="workingHours" className="text-gray-700 mb-1.5 block text-sm">Jornada de trabalho</Label>
|
||||
<Input
|
||||
id="workingHours"
|
||||
placeholder="Ex: 9h às 18h"
|
||||
value={formData.workingHours}
|
||||
onChange={(e) => handleInputChange("workingHours", e.target.value)}
|
||||
className="h-11 bg-white border-gray-300"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label className="text-gray-700 mb-1.5 block text-sm">
|
||||
<Building2 className="inline w-4 h-4 mr-1" /> Empresa *
|
||||
</Label>
|
||||
{loadingCompanies ? (
|
||||
<div className="h-11 px-3 flex items-center text-sm text-gray-500 bg-white border border-gray-300 rounded-md">
|
||||
<Loader2 className="h-4 w-4 mr-2 animate-spin" /> Carregando empresas...
|
||||
</div>
|
||||
) : (
|
||||
<Select value={formData.companyId} onValueChange={(v) => handleInputChange("companyId", v)}>
|
||||
<SelectTrigger className="h-11 bg-white border-gray-300">
|
||||
<SelectValue placeholder="Selecione uma empresa" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{companies.length === 0 ? (
|
||||
<SelectItem value="__none" disabled>Nenhuma empresa disponível</SelectItem>
|
||||
) : (
|
||||
companies.map((company) => (
|
||||
<SelectItem key={company.id} value={company.id}>{company.name}</SelectItem>
|
||||
))
|
||||
)}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="pt-4">
|
||||
<Button
|
||||
type="submit"
|
||||
disabled={loading || !canSubmit()}
|
||||
className="w-full bg-[#F0932B] hover:bg-[#d97d1a] text-white font-bold py-6 rounded-full text-lg transition-colors shadow-lg hover:shadow-xl"
|
||||
>
|
||||
{loading ? <><Loader2 className="w-4 h-4 mr-2 animate-spin" /> PUBLICANDO...</> : "ANUNCIAR VAGA GRÁTIS"}
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<div className="text-center pt-4">
|
||||
<p className="text-sm text-gray-600">
|
||||
Você é um candidato?{" "}
|
||||
<Link href="/register/user" className="text-primary hover:underline font-medium">
|
||||
Cadastre-se grátis aqui!
|
||||
</Link>
|
||||
</p>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div className="text-center mt-8 pt-6 border-t border-gray-200">
|
||||
<p className="text-xs text-gray-500">© GoHorse Jobs Brasil. Todos os direitos reservados.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
)
|
||||
export default function PublicarVagaRedirectPage() {
|
||||
redirect("/jobs/new")
|
||||
}
|
||||
|
|
|
|||
|
|
@ -93,7 +93,7 @@ export function CompanySidebar({ className }: CompanySidebarProps) {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<Link href="/dashboard/company/jobs/new">
|
||||
<Link href="/dashboard/jobs/new">
|
||||
<Button className="w-full mb-4" size="lg">
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
New job
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@ export function Footer() {
|
|||
<ul className="space-y-3">
|
||||
<li className="flex items-center gap-2">
|
||||
<span className="w-1.5 h-1.5 bg-gray-400 rounded-full inline-block"></span>
|
||||
<Link href="/publicar-vaga" className="text-sm text-gray-600 hover:text-primary transition-colors">
|
||||
<Link href="/jobs/new" className="text-sm text-gray-600 hover:text-primary transition-colors">
|
||||
{t("footerMain.companies.postJob")}
|
||||
</Link>
|
||||
</li>
|
||||
|
|
|
|||
Loading…
Reference in a new issue