feat(companies): add view modal and fix createdAt field
- Added modal dialog to view company details when clicking eye icon - Fixed createdAt field name (was created_at, Go returns camelCase) - Expanded AdminCompany type to include all company fields - Modal shows: status badges, contact info, description, timestamps
This commit is contained in:
Tiago Yamamoto
parent
f396acfb72
commit
546e253a5f
2 changed files with 114 additions and 2 deletions
|
|
@ -305,7 +305,7 @@ export default function AdminCompaniesPage() {
|
||||||
</div>
|
</div>
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell>
|
<TableCell>
|
||||||
{company.created_at ? companyDateFormatter.format(new Date(company.created_at)) : "-"}
|
{company.createdAt ? companyDateFormatter.format(new Date(company.createdAt)) : "-"}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
<TableCell className="text-right">
|
<TableCell className="text-right">
|
||||||
<Button variant="ghost" size="icon" onClick={() => handleView(company)}>
|
<Button variant="ghost" size="icon" onClick={() => handleView(company)}>
|
||||||
|
|
@ -350,6 +350,108 @@ export default function AdminCompaniesPage() {
|
||||||
)}
|
)}
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
|
{/* View Company Modal */}
|
||||||
|
<Dialog open={isViewDialogOpen} onOpenChange={setIsViewDialogOpen}>
|
||||||
|
<DialogContent className="max-w-2xl">
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle className="flex items-center gap-2">
|
||||||
|
<Building2 className="h-5 w-5" />
|
||||||
|
{selectedCompany?.name}
|
||||||
|
</DialogTitle>
|
||||||
|
<DialogDescription>Company details and information</DialogDescription>
|
||||||
|
</DialogHeader>
|
||||||
|
{selectedCompany && (
|
||||||
|
<div className="space-y-6 py-4">
|
||||||
|
{/* Status Badges */}
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<Badge variant={selectedCompany.active ? "default" : "secondary"}>
|
||||||
|
{selectedCompany.active ? "Active" : "Inactive"}
|
||||||
|
</Badge>
|
||||||
|
<Badge variant={selectedCompany.verified ? "default" : "outline"}>
|
||||||
|
{selectedCompany.verified ? "Verified" : "Not Verified"}
|
||||||
|
</Badge>
|
||||||
|
{selectedCompany.type && (
|
||||||
|
<Badge variant="outline">{selectedCompany.type}</Badge>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Basic Info */}
|
||||||
|
<div className="grid grid-cols-2 gap-4">
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Slug</Label>
|
||||||
|
<p className="font-mono text-sm">{selectedCompany.slug}</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Email</Label>
|
||||||
|
<p className="text-sm">{selectedCompany.email || "-"}</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Phone</Label>
|
||||||
|
<p className="text-sm">{selectedCompany.phone || "-"}</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Website</Label>
|
||||||
|
<p className="text-sm">
|
||||||
|
{selectedCompany.website ? (
|
||||||
|
<a
|
||||||
|
href={selectedCompany.website}
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="text-primary hover:underline"
|
||||||
|
>
|
||||||
|
{selectedCompany.website}
|
||||||
|
</a>
|
||||||
|
) : (
|
||||||
|
"-"
|
||||||
|
)}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Document (CNPJ)</Label>
|
||||||
|
<p className="text-sm font-mono">{selectedCompany.document || "-"}</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Address</Label>
|
||||||
|
<p className="text-sm">{selectedCompany.address || "-"}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Description */}
|
||||||
|
{selectedCompany.description && (
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Description</Label>
|
||||||
|
<p className="text-sm mt-1">{selectedCompany.description}</p>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Timestamps */}
|
||||||
|
<div className="grid grid-cols-2 gap-4 pt-4 border-t">
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Created At</Label>
|
||||||
|
<p className="text-sm">
|
||||||
|
{selectedCompany.createdAt
|
||||||
|
? companyDateFormatter.format(new Date(selectedCompany.createdAt))
|
||||||
|
: "-"}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<Label className="text-muted-foreground text-xs">Updated At</Label>
|
||||||
|
<p className="text-sm">
|
||||||
|
{selectedCompany.updatedAt
|
||||||
|
? companyDateFormatter.format(new Date(selectedCompany.updatedAt))
|
||||||
|
: "-"}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
<DialogFooter>
|
||||||
|
<Button variant="outline" onClick={() => setIsViewDialogOpen(false)}>
|
||||||
|
Close
|
||||||
|
</Button>
|
||||||
|
</DialogFooter>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -81,9 +81,19 @@ export interface AdminCompany {
|
||||||
name: string;
|
name: string;
|
||||||
email?: string;
|
email?: string;
|
||||||
slug: string;
|
slug: string;
|
||||||
|
type?: string;
|
||||||
|
document?: string;
|
||||||
|
address?: string;
|
||||||
|
regionId?: number;
|
||||||
|
cityId?: number;
|
||||||
|
phone?: string;
|
||||||
|
website?: string;
|
||||||
|
logoUrl?: string;
|
||||||
|
description?: string;
|
||||||
active: boolean;
|
active: boolean;
|
||||||
verified: boolean;
|
verified: boolean;
|
||||||
created_at: string;
|
createdAt: string; // camelCase as returned by Go json tag
|
||||||
|
updatedAt?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface AdminJob {
|
export interface AdminJob {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue