Initial commit: Proyecto portal-requisicion-vacantes
This commit is contained in:
Isaac_Aracena
@@ -0,0 +1,587 @@
|
||||
"use client"
|
||||
|
||||
import { useState } from "react"
|
||||
import { mockInterviews, mockCandidates, mockRequisitions, mockUsers } from "@/lib/mock-data"
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import { Badge } from "@/components/ui/badge"
|
||||
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
|
||||
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select"
|
||||
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from "@/components/ui/dialog"
|
||||
import { Label } from "@/components/ui/label"
|
||||
import { Input } from "@/components/ui/input"
|
||||
import { Textarea } from "@/components/ui/textarea"
|
||||
import { Calendar } from "@/components/ui/calendar"
|
||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
|
||||
import {
|
||||
ChevronLeft,
|
||||
ChevronRight,
|
||||
Plus,
|
||||
Video,
|
||||
MapPin,
|
||||
Clock,
|
||||
User,
|
||||
Calendar as CalendarIcon,
|
||||
Users,
|
||||
MoreVertical,
|
||||
Mail,
|
||||
Phone,
|
||||
FileText,
|
||||
CheckCircle2,
|
||||
XCircle,
|
||||
Edit,
|
||||
Trash2,
|
||||
ExternalLink
|
||||
} from "lucide-react"
|
||||
import { cn } from "@/lib/utils"
|
||||
|
||||
const weekDays = ["Dom", "Lun", "Mar", "Mie", "Jue", "Vie", "Sab"]
|
||||
const monthNames = ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"]
|
||||
|
||||
export function CalendarPage() {
|
||||
const [currentDate, setCurrentDate] = useState(new Date())
|
||||
const [selectedDate, setSelectedDate] = useState<Date | null>(null)
|
||||
const [viewMode, setViewMode] = useState<"month" | "week" | "day">("month")
|
||||
const [isNewInterviewOpen, setIsNewInterviewOpen] = useState(false)
|
||||
const [selectedInterview, setSelectedInterview] = useState<typeof mockInterviews[0] | null>(null)
|
||||
const [filterType, setFilterType] = useState<string>("all")
|
||||
|
||||
const interviews = mockInterviews
|
||||
|
||||
const getDaysInMonth = (date: Date) => {
|
||||
const year = date.getFullYear()
|
||||
const month = date.getMonth()
|
||||
const firstDay = new Date(year, month, 1)
|
||||
const lastDay = new Date(year, month + 1, 0)
|
||||
const daysInMonth = lastDay.getDate()
|
||||
const startingDay = firstDay.getDay()
|
||||
|
||||
const days: (Date | null)[] = []
|
||||
|
||||
for (let i = 0; i < startingDay; i++) {
|
||||
days.push(null)
|
||||
}
|
||||
|
||||
for (let i = 1; i <= daysInMonth; i++) {
|
||||
days.push(new Date(year, month, i))
|
||||
}
|
||||
|
||||
return days
|
||||
}
|
||||
|
||||
const getInterviewsForDate = (date: Date) => {
|
||||
return interviews.filter(interview => {
|
||||
const interviewDate = new Date(interview.scheduledDate)
|
||||
return (
|
||||
interviewDate.getDate() === date.getDate() &&
|
||||
interviewDate.getMonth() === date.getMonth() &&
|
||||
interviewDate.getFullYear() === date.getFullYear()
|
||||
)
|
||||
}).filter(interview => {
|
||||
if (filterType === "all") return true
|
||||
return interview.type === filterType
|
||||
})
|
||||
}
|
||||
|
||||
const navigateMonth = (direction: "prev" | "next") => {
|
||||
setCurrentDate(prev => {
|
||||
const newDate = new Date(prev)
|
||||
if (direction === "prev") {
|
||||
newDate.setMonth(newDate.getMonth() - 1)
|
||||
} else {
|
||||
newDate.setMonth(newDate.getMonth() + 1)
|
||||
}
|
||||
return newDate
|
||||
})
|
||||
}
|
||||
|
||||
const getInterviewTypeColor = (type: string) => {
|
||||
const colors: Record<string, string> = {
|
||||
rrhh: "bg-primary text-primary-foreground",
|
||||
technical: "bg-blue-500 text-white",
|
||||
manager: "bg-purple-500 text-white",
|
||||
final: "bg-accent text-accent-foreground"
|
||||
}
|
||||
return colors[type] || "bg-secondary text-secondary-foreground"
|
||||
}
|
||||
|
||||
const getInterviewTypeLabel = (type: string) => {
|
||||
const labels: Record<string, string> = {
|
||||
rrhh: "RR.HH.",
|
||||
technical: "Técnica",
|
||||
manager: "Gerente",
|
||||
final: "Final"
|
||||
}
|
||||
return labels[type] || type
|
||||
}
|
||||
|
||||
const getCandidateName = (candidateId: string) => {
|
||||
const candidate = mockCandidates.find(c => c.id === candidateId)
|
||||
return candidate?.name || "Candidato"
|
||||
}
|
||||
|
||||
const getRequisitionTitle = (requisitionId: string) => {
|
||||
const requisition = mockRequisitions.find(r => r.id === requisitionId)
|
||||
return requisition?.position || "Vacante"
|
||||
}
|
||||
|
||||
const formatTime = (dateString: string) => {
|
||||
const date = new Date(dateString)
|
||||
return date.toLocaleTimeString("es-MX", { hour: "2-digit", minute: "2-digit" })
|
||||
}
|
||||
|
||||
const days = getDaysInMonth(currentDate)
|
||||
|
||||
const upcomingInterviews = interviews
|
||||
.filter(i => new Date(i.scheduledDate) >= new Date())
|
||||
.sort((a, b) => new Date(a.scheduledDate).getTime() - new Date(b.scheduledDate).getTime())
|
||||
.slice(0, 5)
|
||||
|
||||
const todayInterviews = getInterviewsForDate(new Date())
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{/* Header */}
|
||||
<div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
|
||||
<div>
|
||||
<h1 className="text-3xl font-bold tracking-tight">Calendario de Entrevistas</h1>
|
||||
<p className="text-muted-foreground">
|
||||
Gestiona y agenda entrevistas con candidatos
|
||||
</p>
|
||||
</div>
|
||||
<Dialog open={isNewInterviewOpen} onOpenChange={setIsNewInterviewOpen}>
|
||||
<DialogTrigger asChild>
|
||||
<Button className="bg-accent hover:bg-accent/90 text-accent-foreground">
|
||||
<Plus className="mr-2 h-4 w-4" />
|
||||
Agendar Entrevista
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
<DialogContent className="max-w-lg">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Agendar Nueva Entrevista</DialogTitle>
|
||||
<DialogDescription>
|
||||
Programa una entrevista con un candidato
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<div className="grid gap-4 py-4">
|
||||
<div className="space-y-2">
|
||||
<Label>Candidato</Label>
|
||||
<Select>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Seleccionar candidato" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{mockCandidates.map(candidate => (
|
||||
<SelectItem key={candidate.id} value={candidate.id}>
|
||||
{candidate.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label>Tipo de Entrevista</Label>
|
||||
<Select>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Seleccionar tipo" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="rrhh">Entrevista RR.HH.</SelectItem>
|
||||
<SelectItem value="technical">Entrevista Técnica</SelectItem>
|
||||
<SelectItem value="manager">Entrevista Gerente</SelectItem>
|
||||
<SelectItem value="final">Entrevista Final</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="space-y-2">
|
||||
<Label>Fecha</Label>
|
||||
<Input type="date" />
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label>Hora</Label>
|
||||
<Input type="time" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label>Duracion (minutos)</Label>
|
||||
<Select defaultValue="60">
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="30">30 minutos</SelectItem>
|
||||
<SelectItem value="45">45 minutos</SelectItem>
|
||||
<SelectItem value="60">60 minutos</SelectItem>
|
||||
<SelectItem value="90">90 minutos</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label>Modalidad</Label>
|
||||
<Select>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Seleccionar modalidad" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="video">Videoconferencia</SelectItem>
|
||||
<SelectItem value="presencial">Presencial</SelectItem>
|
||||
<SelectItem value="phone">Telefonica</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label>Entrevistadores</Label>
|
||||
<Select>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Seleccionar entrevistadores" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{mockUsers.filter(u => u.role === "recruiter" || u.role === "hr_manager").map(user => (
|
||||
<SelectItem key={user.id} value={user.id}>
|
||||
{user.name}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label>Notas</Label>
|
||||
<Textarea placeholder="Notas adicionales para la entrevista..." />
|
||||
</div>
|
||||
</div>
|
||||
<DialogFooter>
|
||||
<Button variant="outline" onClick={() => setIsNewInterviewOpen(false)}>
|
||||
Cancelar
|
||||
</Button>
|
||||
<Button className="bg-accent hover:bg-accent/90" onClick={() => setIsNewInterviewOpen(false)}>
|
||||
Agendar
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 lg:grid-cols-4 gap-6">
|
||||
{/* Calendar */}
|
||||
<div className="lg:col-span-3">
|
||||
<Card>
|
||||
<CardHeader className="pb-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center gap-4">
|
||||
<Button variant="outline" size="icon" onClick={() => navigateMonth("prev")}>
|
||||
<ChevronLeft className="h-4 w-4" />
|
||||
</Button>
|
||||
<h2 className="text-xl font-semibold">
|
||||
{monthNames[currentDate.getMonth()]} {currentDate.getFullYear()}
|
||||
</h2>
|
||||
<Button variant="outline" size="icon" onClick={() => navigateMonth("next")}>
|
||||
<ChevronRight className="h-4 w-4" />
|
||||
</Button>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<Select value={filterType} onValueChange={setFilterType}>
|
||||
<SelectTrigger className="w-[180px]">
|
||||
<SelectValue placeholder="Filtrar por tipo" />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="all">Todos los tipos</SelectItem>
|
||||
<SelectItem value="rrhh">Entrevista RR.HH.</SelectItem>
|
||||
<SelectItem value="technical">Entrevista Técnica</SelectItem>
|
||||
<SelectItem value="manager">Entrevista Gerente</SelectItem>
|
||||
<SelectItem value="final">Entrevista Final</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => setCurrentDate(new Date())}
|
||||
>
|
||||
Hoy
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
{/* Week Headers */}
|
||||
<div className="grid grid-cols-7 gap-px mb-2">
|
||||
{weekDays.map(day => (
|
||||
<div key={day} className="text-center text-sm font-medium text-muted-foreground py-2">
|
||||
{day}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Calendar Grid */}
|
||||
<div className="grid grid-cols-7 gap-px bg-border rounded-lg overflow-hidden">
|
||||
{days.map((day, index) => {
|
||||
const dayInterviews = day ? getInterviewsForDate(day) : []
|
||||
const isToday = day &&
|
||||
day.getDate() === new Date().getDate() &&
|
||||
day.getMonth() === new Date().getMonth() &&
|
||||
day.getFullYear() === new Date().getFullYear()
|
||||
const isSelected = day && selectedDate &&
|
||||
day.getDate() === selectedDate.getDate() &&
|
||||
day.getMonth() === selectedDate.getMonth() &&
|
||||
day.getFullYear() === selectedDate.getFullYear()
|
||||
|
||||
return (
|
||||
<div
|
||||
key={index}
|
||||
className={cn(
|
||||
"min-h-[120px] bg-card p-2 cursor-pointer transition-colors hover:bg-muted/50",
|
||||
!day && "bg-muted/30",
|
||||
isSelected && "ring-2 ring-primary ring-inset"
|
||||
)}
|
||||
onClick={() => day && setSelectedDate(day)}
|
||||
>
|
||||
{day && (
|
||||
<>
|
||||
<div className={cn(
|
||||
"text-sm font-medium mb-1",
|
||||
isToday && "w-7 h-7 rounded-full bg-primary text-primary-foreground flex items-center justify-center"
|
||||
)}>
|
||||
{day.getDate()}
|
||||
</div>
|
||||
<div className="space-y-1">
|
||||
{dayInterviews.slice(0, 3).map(interview => (
|
||||
<div
|
||||
key={interview.id}
|
||||
className={cn(
|
||||
"text-xs p-1 rounded truncate cursor-pointer",
|
||||
getInterviewTypeColor(interview.type)
|
||||
)}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
setSelectedInterview(interview)
|
||||
}}
|
||||
>
|
||||
{formatTime(interview.scheduledDate)} - {getCandidateName(interview.candidateId)}
|
||||
</div>
|
||||
))}
|
||||
{dayInterviews.length > 3 && (
|
||||
<div className="text-xs text-muted-foreground text-center">
|
||||
+{dayInterviews.length - 3} mas
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
{/* Sidebar */}
|
||||
<div className="space-y-6">
|
||||
{/* Today's Interviews */}
|
||||
<Card>
|
||||
<CardHeader className="pb-3">
|
||||
<CardTitle className="text-base">Entrevistas de Hoy</CardTitle>
|
||||
<CardDescription>{todayInterviews.length} programadas</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3">
|
||||
{todayInterviews.length > 0 ? todayInterviews.map(interview => (
|
||||
<div
|
||||
key={interview.id}
|
||||
className="p-3 border rounded-lg cursor-pointer hover:bg-muted/50 transition-colors"
|
||||
onClick={() => setSelectedInterview(interview)}
|
||||
>
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<Badge className={getInterviewTypeColor(interview.type)}>
|
||||
{getInterviewTypeLabel(interview.type)}
|
||||
</Badge>
|
||||
<span className="text-sm font-medium">{formatTime(interview.scheduledDate)}</span>
|
||||
</div>
|
||||
<div className="text-sm font-medium">{getCandidateName(interview.candidateId)}</div>
|
||||
<div className="text-xs text-muted-foreground">{getRequisitionTitle(interview.requisitionId)}</div>
|
||||
</div>
|
||||
)) : (
|
||||
<div className="text-center py-4 text-muted-foreground text-sm">
|
||||
No hay entrevistas hoy
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Upcoming */}
|
||||
<Card>
|
||||
<CardHeader className="pb-3">
|
||||
<CardTitle className="text-base">Proximas Entrevistas</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3">
|
||||
{upcomingInterviews.map(interview => (
|
||||
<div
|
||||
key={interview.id}
|
||||
className="p-3 border rounded-lg cursor-pointer hover:bg-muted/50 transition-colors"
|
||||
onClick={() => setSelectedInterview(interview)}
|
||||
>
|
||||
<div className="flex items-center justify-between mb-1">
|
||||
<Badge variant="outline" className="text-xs">
|
||||
{getInterviewTypeLabel(interview.type)}
|
||||
</Badge>
|
||||
<span className="text-xs text-muted-foreground">
|
||||
{new Date(interview.scheduledDate).toLocaleDateString("es-MX", {
|
||||
day: "numeric",
|
||||
month: "short"
|
||||
})}
|
||||
</span>
|
||||
</div>
|
||||
<div className="text-sm font-medium">{getCandidateName(interview.candidateId)}</div>
|
||||
<div className="flex items-center gap-1 text-xs text-muted-foreground mt-1">
|
||||
<Clock className="h-3 w-3" />
|
||||
{formatTime(interview.scheduledDate)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Legend */}
|
||||
<Card>
|
||||
<CardHeader className="pb-3">
|
||||
<CardTitle className="text-base">Tipos de Entrevista</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-2">
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-3 h-3 rounded bg-primary" />
|
||||
<span className="text-sm">Entrevista RR.HH.</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-3 h-3 rounded bg-blue-500" />
|
||||
<span className="text-sm">Entrevista Técnica</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-3 h-3 rounded bg-purple-500" />
|
||||
<span className="text-sm">Entrevista Gerente</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-3 h-3 rounded bg-accent" />
|
||||
<span className="text-sm">Entrevista Final</span>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Interview Detail Dialog */}
|
||||
<Dialog open={!!selectedInterview} onOpenChange={() => setSelectedInterview(null)}>
|
||||
<DialogContent className="max-w-lg">
|
||||
{selectedInterview && (
|
||||
<>
|
||||
<DialogHeader>
|
||||
<div className="flex items-center justify-between">
|
||||
<Badge className={getInterviewTypeColor(selectedInterview.type)}>
|
||||
{getInterviewTypeLabel(selectedInterview.type)}
|
||||
</Badge>
|
||||
<Badge variant={
|
||||
selectedInterview.status === "scheduled" ? "secondary" :
|
||||
selectedInterview.status === "completed" ? "default" :
|
||||
"destructive"
|
||||
}>
|
||||
{selectedInterview.status === "scheduled" ? "Programada" :
|
||||
selectedInterview.status === "completed" ? "Completada" :
|
||||
"Cancelada"}
|
||||
</Badge>
|
||||
</div>
|
||||
<DialogTitle className="mt-2">
|
||||
Entrevista con {getCandidateName(selectedInterview.candidateId)}
|
||||
</DialogTitle>
|
||||
<DialogDescription>
|
||||
{getRequisitionTitle(selectedInterview.requisitionId)}
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
|
||||
<div className="space-y-4 py-4">
|
||||
<div className="flex items-center gap-3 p-3 bg-muted/50 rounded-lg">
|
||||
<CalendarIcon className="h-5 w-5 text-muted-foreground" />
|
||||
<div>
|
||||
<div className="font-medium">
|
||||
{new Date(selectedInterview.scheduledDate).toLocaleDateString("es-MX", {
|
||||
weekday: "long",
|
||||
day: "numeric",
|
||||
month: "long",
|
||||
year: "numeric"
|
||||
})}
|
||||
</div>
|
||||
<div className="text-sm text-muted-foreground">
|
||||
{formatTime(selectedInterview.scheduledDate)} - {selectedInterview.duration} minutos
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-3 p-3 bg-muted/50 rounded-lg">
|
||||
{selectedInterview.location === "video" ? (
|
||||
<Video className="h-5 w-5 text-muted-foreground" />
|
||||
) : (
|
||||
<MapPin className="h-5 w-5 text-muted-foreground" />
|
||||
)}
|
||||
<div>
|
||||
<div className="font-medium">
|
||||
{selectedInterview.location === "video" ? "Videoconferencia" : "Presencial"}
|
||||
</div>
|
||||
{selectedInterview.meetingLink && (
|
||||
<a
|
||||
href={selectedInterview.meetingLink}
|
||||
className="text-sm text-primary hover:underline flex items-center gap-1"
|
||||
>
|
||||
Unirse a la reunion <ExternalLink className="h-3 w-3" />
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label className="text-sm text-muted-foreground">Entrevistadores</Label>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{selectedInterview.interviewers.map(interviewerId => {
|
||||
const interviewer = mockUsers.find(u => u.id === interviewerId)
|
||||
return interviewer ? (
|
||||
<div key={interviewerId} className="flex items-center gap-2 px-3 py-1.5 bg-muted rounded-full">
|
||||
<Avatar className="h-6 w-6">
|
||||
<AvatarImage src={interviewer.avatar} />
|
||||
<AvatarFallback className="text-xs">
|
||||
{interviewer.name.split(" ").map(n => n[0]).join("")}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
<span className="text-sm">{interviewer.name}</span>
|
||||
</div>
|
||||
) : null
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{selectedInterview.notes && (
|
||||
<div className="space-y-2">
|
||||
<Label className="text-sm text-muted-foreground">Notas</Label>
|
||||
<p className="text-sm p-3 bg-muted/50 rounded-lg">{selectedInterview.notes}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<DialogFooter className="gap-2">
|
||||
<Button variant="outline" size="sm">
|
||||
<Edit className="mr-2 h-4 w-4" />
|
||||
Editar
|
||||
</Button>
|
||||
<Button variant="outline" size="sm" className="text-destructive">
|
||||
<Trash2 className="mr-2 h-4 w-4" />
|
||||
Cancelar
|
||||
</Button>
|
||||
{selectedInterview.status === "scheduled" && (
|
||||
<Button size="sm" className="bg-accent hover:bg-accent/90">
|
||||
<CheckCircle2 className="mr-2 h-4 w-4" />
|
||||
Completar
|
||||
</Button>
|
||||
)}
|
||||
</DialogFooter>
|
||||
</>
|
||||
)}
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user