feat: update admin actions layout and add contact details dialog; modify user link path in UsersTable
This commit is contained in:
parent
300c9edfc4
commit
d18aee8a95
3 changed files with 139 additions and 144 deletions
|
|
@ -1,17 +1,27 @@
|
|||
import {
|
||||
ExternalLink,
|
||||
Eye,
|
||||
FileBadge,
|
||||
FileText,
|
||||
FolderKanban,
|
||||
Info,
|
||||
Mail,
|
||||
PackageCheck,
|
||||
Pointer,
|
||||
Printer,
|
||||
Trash2,
|
||||
Wrench,
|
||||
} from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import toast from "react-hot-toast";
|
||||
import {
|
||||
AlertDialog,
|
||||
AlertDialogCancel,
|
||||
AlertDialogContent,
|
||||
AlertDialogDescription,
|
||||
AlertDialogFooter,
|
||||
AlertDialogHeader,
|
||||
AlertDialogTitle,
|
||||
AlertDialogTrigger,
|
||||
} from "~/components/ui/alert-dialog";
|
||||
import { Button, type ButtonConfigs } from "~/components/ui/button";
|
||||
import {
|
||||
Tooltip,
|
||||
|
|
@ -49,75 +59,79 @@ export const AdminActions = () => {
|
|||
if (!isAdmin) return null;
|
||||
|
||||
return (
|
||||
<div className="flex w-full max-w-fit flex-wrap justify-start gap-3">
|
||||
{<AdminSendScheda />}
|
||||
{data.user_confirmed_at != null && <AdminLavoraConferma />}
|
||||
{data.accettato_conferma_at != null && (
|
||||
<>
|
||||
<AdminContratto />
|
||||
{data.gestionale_id && (
|
||||
<Link
|
||||
aria-label="Open Gestionale"
|
||||
href={`https://win-jk822fggr6b:480/id/${data.gestionale_id}`}
|
||||
target="_blank"
|
||||
>
|
||||
<Button size="sm">
|
||||
<FolderKanban /> Gestionale
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
<Link href={`/annuncio/${data.codice}`} target="_blank">
|
||||
<>
|
||||
<h3 className="ml-1 font-semibold">Azioni Admin:</h3>
|
||||
<div className="flex w-full max-w-fit flex-wrap justify-start gap-3">
|
||||
<AdminAnnuncioContatti />
|
||||
<AdminSendScheda />
|
||||
{data.user_confirmed_at != null && <AdminLavoraConferma />}
|
||||
{data.accettato_conferma_at != null && (
|
||||
<>
|
||||
<AdminContratto />
|
||||
{data.gestionale_id && (
|
||||
<Link
|
||||
aria-label="Open Gestionale"
|
||||
href={`https://win-jk822fggr6b:480/id/${data.gestionale_id}`}
|
||||
target="_blank"
|
||||
>
|
||||
<Button size="sm">
|
||||
<FolderKanban /> Gestionale
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
{/* <Link href={`/annuncio/${data.codice}`} target="_blank">
|
||||
<Button size="sm" type="button" variant="outline">
|
||||
<Eye /> pubblica
|
||||
</Button>
|
||||
</Link>
|
||||
<Link
|
||||
href={`/area-riservata/admin/edit-annuncio/${annuncioId}`}
|
||||
target="_blank"
|
||||
>
|
||||
<Button
|
||||
aria-label="Edit Annuncio"
|
||||
className="w-fit"
|
||||
size="sm"
|
||||
variant="secondary"
|
||||
</Link> */}
|
||||
<Link
|
||||
href={`/area-riservata/admin/edit-annuncio/${annuncioId}`}
|
||||
target="_blank"
|
||||
>
|
||||
<ExternalLink />
|
||||
<span>Modifica</span>
|
||||
</Button>
|
||||
</Link>
|
||||
<Button
|
||||
aria-label="Edit Annuncio"
|
||||
className="w-fit"
|
||||
size="sm"
|
||||
variant="secondary"
|
||||
>
|
||||
<Wrench />
|
||||
<span>Modifica Annuncio</span>
|
||||
</Button>
|
||||
</Link>
|
||||
|
||||
<Link
|
||||
href={`/area-riservata/scheda-annuncio-stampa/${data.id}`}
|
||||
target="_blank"
|
||||
>
|
||||
<Button size="sm" type="button" variant="outline">
|
||||
<Printer /> Scheda
|
||||
</Button>
|
||||
</Link>
|
||||
|
||||
<Confirm
|
||||
description="Sei sicuro di voler eliminare l'annuncio?"
|
||||
onConfirm={() => {
|
||||
mutate({
|
||||
annuncioId,
|
||||
servizioId,
|
||||
});
|
||||
}}
|
||||
title="Elimina annuncio"
|
||||
>
|
||||
<Button
|
||||
aria-label="Delete Annuncio"
|
||||
className="w-fit"
|
||||
size="sm"
|
||||
variant="destructive"
|
||||
<Link
|
||||
href={`/area-riservata/scheda-annuncio-stampa/${data.id}`}
|
||||
target="_blank"
|
||||
>
|
||||
<Trash2 />
|
||||
<span>Elimina</span>
|
||||
</Button>
|
||||
</Confirm>
|
||||
</div>
|
||||
<Button size="sm" type="button" variant="outline">
|
||||
<Printer /> Scheda
|
||||
</Button>
|
||||
</Link>
|
||||
|
||||
<Confirm
|
||||
description="Sei sicuro di voler eliminare l'annuncio?"
|
||||
onConfirm={() => {
|
||||
mutate({
|
||||
annuncioId,
|
||||
servizioId,
|
||||
});
|
||||
}}
|
||||
title="Elimina annuncio"
|
||||
>
|
||||
<Button
|
||||
aria-label="Delete Annuncio"
|
||||
className="w-fit"
|
||||
size="sm"
|
||||
variant="destructive"
|
||||
>
|
||||
<Trash2 />
|
||||
<span>Elimina</span>
|
||||
</Button>
|
||||
</Confirm>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
@ -156,7 +170,7 @@ const AdminSendScheda = () => {
|
|||
>
|
||||
<Button className="w-fit" size="sm" variant="outline">
|
||||
<Mail />
|
||||
<span>Invia email contatti</span>
|
||||
<span>Invia Scheda</span>
|
||||
</Button>
|
||||
</Confirm>
|
||||
);
|
||||
|
|
@ -243,6 +257,61 @@ export const UserActions = () => {
|
|||
</>
|
||||
);
|
||||
};
|
||||
const AdminAnnuncioContatti = () => {
|
||||
const { data } = useServizioAnnuncio();
|
||||
const { data: annuncio, isLoading } = api.annunci.getAnnuncioFull.useQuery({
|
||||
id: data.id,
|
||||
});
|
||||
return (
|
||||
<AlertDialog>
|
||||
<AlertDialogTrigger asChild>
|
||||
<Button size="sm" variant="outline">
|
||||
<Info />
|
||||
<span>Dati Contatto</span>
|
||||
</Button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Contatti Annuncio {data.codice}</AlertDialogTitle>
|
||||
<AlertDialogDescription className="sr-only">
|
||||
desc
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<div className="flex w-full flex-col gap-4">
|
||||
<div>
|
||||
<span className="font-semibold">Contatti Aperti il: </span>
|
||||
{data.open_contatti_at
|
||||
? new Date(data.open_contatti_at).toLocaleString("it-IT")
|
||||
: "Non ancora aperti"}
|
||||
</div>
|
||||
{isLoading ? (
|
||||
<div className="flex h-24 w-full items-center justify-center">
|
||||
Loading...
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div>
|
||||
<span className="font-semibold">Locatore/Incaricato: </span>
|
||||
{annuncio?.locatore || "N/A"}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-semibold">Email: </span>
|
||||
{annuncio?.email || "N/A"}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-semibold">Telefono: </span>
|
||||
{annuncio?.numero || "N/A"}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>Chiudi</AlertDialogCancel>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
);
|
||||
};
|
||||
|
||||
const PostConfermaSection = () => {
|
||||
const { servizio, servizioId } = useServizio();
|
||||
|
|
|
|||
|
|
@ -1,19 +1,9 @@
|
|||
import { Info, Toolbox } from "lucide-react";
|
||||
import { Toolbox } from "lucide-react";
|
||||
import Image from "next/image";
|
||||
import {
|
||||
AdminActions,
|
||||
UserActions,
|
||||
} from "~/components/servizio/annuncio_actions";
|
||||
import {
|
||||
AlertDialog,
|
||||
AlertDialogCancel,
|
||||
AlertDialogContent,
|
||||
AlertDialogDescription,
|
||||
AlertDialogFooter,
|
||||
AlertDialogHeader,
|
||||
AlertDialogTitle,
|
||||
AlertDialogTrigger,
|
||||
} from "~/components/ui/alert-dialog";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "~/components/ui/card";
|
||||
import { handleConsegna } from "~/lib/annuncio_details";
|
||||
import { getStorageUrl } from "~/lib/storage_utils";
|
||||
|
|
@ -21,7 +11,6 @@ import { cn, formatCurrency } from "~/lib/utils";
|
|||
import { useTranslation } from "~/providers/I18nProvider";
|
||||
import { useServizio, useServizioAnnuncio } from "~/providers/ServizioProvider";
|
||||
import type { AnnuncioRicerca } from "~/server/controllers/annunci.controller";
|
||||
import { api } from "~/utils/api";
|
||||
import { Button } from "../ui/button";
|
||||
import {
|
||||
Collapsible,
|
||||
|
|
@ -49,7 +38,7 @@ export const AnnuncioCard = ({ className }: { className?: string }) => {
|
|||
<div className="flex flex-col gap-2">
|
||||
<Collapsible className="space-y-2">
|
||||
<CollapsibleTrigger asChild>
|
||||
<Button variant="outline">
|
||||
<Button size="sm" variant="outline">
|
||||
<Toolbox />
|
||||
<span>Azioni Utente</span>
|
||||
</Button>
|
||||
|
|
@ -108,7 +97,6 @@ export const AnnuncioDisplay = ({
|
|||
data: AnnuncioRicerca;
|
||||
className?: string;
|
||||
}) => {
|
||||
const { isAdmin } = useServizio();
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
|
|
@ -158,71 +146,9 @@ export const AnnuncioDisplay = ({
|
|||
{formatCurrency(data.prezzo / 1e2)}
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className={cn(
|
||||
"col-span-2 grid w-full max-w-xl items-center gap-2 md:col-span-1 md:pr-8",
|
||||
isAdmin && "grid-cols-2",
|
||||
)}
|
||||
>
|
||||
<div className="col-span-2 w-full max-w-xl md:col-span-1 md:pr-8">
|
||||
<AnnuncioDettaglio data={data} />
|
||||
{isAdmin && <AdminAnnuncioContatti />}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const AdminAnnuncioContatti = () => {
|
||||
const { data } = useServizioAnnuncio();
|
||||
const { data: annuncio, isLoading } = api.annunci.getAnnuncioFull.useQuery({
|
||||
id: data.id,
|
||||
});
|
||||
return (
|
||||
<AlertDialog>
|
||||
<AlertDialogTrigger asChild>
|
||||
<Button className="" variant="outline">
|
||||
<Info />
|
||||
<span>Dati Contatto</span>
|
||||
</Button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Contatti Annuncio {data.codice}</AlertDialogTitle>
|
||||
<AlertDialogDescription className="sr-only">
|
||||
desc
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<div className="flex w-full flex-col gap-4">
|
||||
<div>
|
||||
<span className="font-semibold">Contatti Aperti il: </span>
|
||||
{data.open_contatti_at
|
||||
? new Date(data.open_contatti_at).toLocaleString("it-IT")
|
||||
: "Non ancora aperti"}
|
||||
</div>
|
||||
{isLoading ? (
|
||||
<div className="flex h-24 w-full items-center justify-center">
|
||||
Loading...
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div>
|
||||
<span className="font-semibold">Locatore/Incaricato: </span>
|
||||
{annuncio?.locatore || "N/A"}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-semibold">Email: </span>
|
||||
{annuncio?.email || "N/A"}
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-semibold">Telefono: </span>
|
||||
{annuncio?.numero || "N/A"}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>Chiudi</AlertDialogCancel>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -135,7 +135,7 @@ export const UsersTable = (props: { data: UserWChatInfo[] }) => {
|
|||
<Link
|
||||
aria-label="Visualizza Utente"
|
||||
className="flex items-center gap-2"
|
||||
href={`/area-riservata/admin/user-view/edit-user/${user.id}`}
|
||||
href={`/area-riservata/admin/user-view/ricerca/${user.id}`}
|
||||
>
|
||||
<UserAvatar
|
||||
className="size-8"
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue