feat: add Head component for dynamic title and enhance contact information display
This commit is contained in:
parent
ece58b7c3b
commit
06e156c314
1 changed files with 26 additions and 48 deletions
|
|
@ -1,5 +1,6 @@
|
|||
"use client";
|
||||
|
||||
import Head from "next/head";
|
||||
import { useRef } from "react";
|
||||
import { useReactToPrint } from "react-to-print";
|
||||
import { Button } from "~/components/ui/button";
|
||||
|
|
@ -11,9 +12,7 @@ import { replaceWithBr } from "~/lib/newlineToBr";
|
|||
import type { Annunci } from "~/schemas/public/Annunci";
|
||||
import { IconMatrix } from "./IconComponents";
|
||||
import { LogoSvg } from "./svgs";
|
||||
import { Separator } from "./ui/separator";
|
||||
|
||||
//todo finire
|
||||
export function SchedaAnnuncioStampabile({ data }: { data: Annunci }) {
|
||||
const contentRef = useRef<HTMLDivElement>(null);
|
||||
const reactToPrintFn = useReactToPrint({
|
||||
|
|
@ -22,20 +21,25 @@ export function SchedaAnnuncioStampabile({ data }: { data: Annunci }) {
|
|||
});
|
||||
|
||||
return (
|
||||
<div className="mx-auto max-w-4xl">
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<h1 className="text-2xl font-bold">Scheda Annuncio Stampabile</h1>
|
||||
<>
|
||||
<Head>
|
||||
<title>Scheda Annuncio {data.codice}</title>
|
||||
</Head>
|
||||
<div className="mx-auto max-w-4xl">
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<h1 className="text-2xl font-bold">Scheda Annuncio Stampabile</h1>
|
||||
|
||||
<Button className="print:hidden" onClick={() => reactToPrintFn()}>
|
||||
Stampa
|
||||
</Button>
|
||||
</div>
|
||||
<div ref={contentRef}>
|
||||
<SchedaAnnuncio data={data} />
|
||||
<Button className="print:hidden" onClick={() => reactToPrintFn()}>
|
||||
Stampa
|
||||
</Button>
|
||||
</div>
|
||||
<div ref={contentRef}>
|
||||
<SchedaAnnuncio data={data} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -197,7 +201,15 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
|||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-primary/5 p-4 rounded-lg">
|
||||
<h3 className="text-lg font-semibold text-primary mb-2">
|
||||
📞 Contatti
|
||||
</h3>
|
||||
<div className="text-sm space-y-1">
|
||||
<p>{data.locatore}</p>
|
||||
{data.numero && <p>Tel. {data.numero}</p>}
|
||||
</div>
|
||||
</div>
|
||||
{/* Description */}
|
||||
{data.desc_it && (
|
||||
<>
|
||||
|
|
@ -216,40 +228,6 @@ function SchedaAnnuncio({ data }: { data: Annunci }) {
|
|||
</>
|
||||
)}
|
||||
|
||||
{/* Energy Information */}
|
||||
{data.classe && (
|
||||
<>
|
||||
<Separator />
|
||||
<div className="space-y-3">
|
||||
<h3 className="text-lg font-semibold border-b pb-1">
|
||||
⚡ Prestazione Energetica
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm">
|
||||
{data.classe && (
|
||||
<p>
|
||||
<span className="font-medium">Classe Energetica:</span>{" "}
|
||||
{data.classe}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
{/* Contact Information */}
|
||||
<Separator />
|
||||
<div className="bg-primary/5 p-4 rounded-lg">
|
||||
<h3 className="text-lg font-semibold text-primary mb-2">
|
||||
📞 Contatti
|
||||
</h3>
|
||||
<div className="text-sm space-y-1">
|
||||
<p>{data.locatore}</p>
|
||||
{data.numero && <p>Tel. {data.numero}</p>}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Separator />
|
||||
|
||||
<div className="text-muted-foreground pt-2 text-center text-xs">
|
||||
<p>{footer}</p>
|
||||
<p className="mt-1">
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue