andrea/magricambi
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

correzione pagina movimenti con colonne distanziate
All checks were successful
Deploy to VPS / build (push) Successful in 37s
Details
Deploy to VPS / deploy (push) Successful in 27s
Details

Browse source
This commit is contained in:
AV77web 2026-05-28 23:55:28 +02:00
parent 88d6de0453
commit 3e3f05136c
1 changed files with 99 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

169
src/app/(management)/movimenti/page.tsx
View file

@ -42,7 +42,7 @@ export default function MovimentiPage() {
return ( return (
<div className="min-h-screen bg-black"> <div className="min-h-screen bg-black">
<div className="max-w-6xl mx-auto px-4 py-6"> <div className="max-w-7xl mx-auto px-4 py-6">
{/* Header */} {/* Header */}
<div className="mb-6"> <div className="mb-6">
<h1 className="text-2xl font-bold text-white">Movimenti</h1> <h1 className="text-2xl font-bold text-white">Movimenti</h1>
@ -94,81 +94,110 @@ export default function MovimentiPage() {
<p className="text-zinc-500">I movimenti appariranno qui quando effettuerai carichi o scarichi</p> <p className="text-zinc-500">I movimenti appariranno qui quando effettuerai carichi o scarichi</p>
</div> </div>
) : ( ) : (
<div className="space-y-2"> <div className="rounded-xl border border-zinc-800 overflow-hidden">
{movimenti.map((movimento) => ( {/* Header tabella */}
<div <div className="grid grid-cols-12 gap-4 px-4 py-3 bg-zinc-800/50 text-xs font-medium text-zinc-400 uppercase tracking-wider">
key={movimento.id} <div className="col-span-1">Tipo</div>
className={` <div className="col-span-3">Articolo</div>
flex items-center gap-4 p-4 rounded-lg border bg-zinc-900 <div className="col-span-1 text-center">Carico</div>
${movimento.tipo_movimento === 1 ? "border-green-500/30" : "border-red-500/30"} <div className="col-span-1 text-center">Scarico</div>
`} <div className="col-span-2">Magazzino</div>
> <div className="col-span-2">Data / Utente</div>
{/* Icona tipo */} <div className="col-span-2">Causale</div>
<div className={` </div>
p-2 rounded-lg flex-shrink-0
${movimento.tipo_movimento === 1 ? "bg-green-500/10 text-green-400" : "bg-red-500/10 text-red-400"}
`}>
{movimento.tipo_movimento === 1 ? (
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 4v16m8-8H4" />
</svg>
) : (
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M20 12H4" />
</svg>
)}
</div>
{/* Info articolo */} {/* Righe */}
<div className="flex-1 min-w-0"> <div className="divide-y divide-zinc-800">
<p className="font-medium text-white truncate"> {movimenti.map((movimento) => {
{movimento.articolo_descrizione} const isCarico = movimento.tipo_movimento === 1;
</p>
<p className="text-xs text-zinc-500 font-mono"> return (
{movimento.articolo_codice} <div
</p> key={movimento.id}
</div> className="grid grid-cols-12 gap-4 px-4 py-3 bg-zinc-900 hover:bg-zinc-800/50 transition-colors items-center"
>
{/* Tipo */}
<div className="col-span-1">
<div className={`
inline-flex items-center justify-center w-8 h-8 rounded-lg
${isCarico ? "bg-green-500/10 text-green-400" : "bg-red-500/10 text-red-400"}
`}>
{isCarico ? (
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 4v16m8-8H4" />
</svg>
) : (
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M20 12H4" />
</svg>
)}
</div>
</div>
{/* Quantità */} {/* Articolo */}
<div className={` <div className="col-span-3 min-w-0">
text-lg font-bold flex-shrink-0 <p className="font-medium text-white truncate text-sm">
${movimento.tipo_movimento === 1 ? "text-green-400" : "text-red-400"} {movimento.articolo_descrizione}
`}> </p>
{movimento.tipo_movimento === 1 ? "+" : "-"}{movimento.quantita} <p className="text-xs text-zinc-500 font-mono">
</div> {movimento.articolo_codice}
</p>
</div>
{/* Magazzino */} {/* Quantità Carico */}
<div className="text-right flex-shrink-0 min-w-[120px]"> <div className="col-span-1 text-center">
<p className="text-xs text-zinc-500"> {isCarico ? (
{movimento.tipo_movimento === 1 ? "Destinazione" : "Origine"} <span className="text-lg font-bold text-green-400">
</p> +{movimento.quantita}
<p className="text-sm text-white"> </span>
{movimento.tipo_movimento === 1 ) : (
? movimento.magazzino_destinazione <span className="text-zinc-700">-</span>
: movimento.magazzino_origine} )}
</p> </div>
</div>
{/* Data e utente */} {/* Quantità Scarico */}
<div className="text-right flex-shrink-0 min-w-[140px]"> <div className="col-span-1 text-center">
<p className="text-xs text-white"> {!isCarico ? (
{formatDate(movimento.data_movimento)} <span className="text-lg font-bold text-red-400">
</p> -{movimento.quantita}
<p className="text-xs text-zinc-500"> </span>
{movimento.utente} ) : (
</p> <span className="text-zinc-700">-</span>
</div> )}
</div>
{/* Causale */} {/* Magazzino */}
{movimento.causale && ( <div className="col-span-2">
<div className="flex-shrink-0 max-w-[150px]"> <p className="text-xs text-zinc-500 mb-0.5">
<p className="text-xs text-zinc-400 truncate" title={movimento.causale}> {isCarico ? "Destinazione" : "Origine"}
{movimento.causale} </p>
</p> <p className="text-sm text-white">
{isCarico
? movimento.magazzino_destinazione || "-"
: movimento.magazzino_origine || "-"}
</p>
</div>
{/* Data / Utente */}
<div className="col-span-2">
<p className="text-sm text-white">
{formatDate(movimento.data_movimento)}
</p>
<p className="text-xs text-zinc-500">
{movimento.utente || "-"}
</p>
</div>
{/* Causale */}
<div className="col-span-2">
<p className="text-sm text-zinc-400 truncate" title={movimento.causale || ""}>
{movimento.causale || "-"}
</p>
</div>
</div> </div>
)} );
</div> })}
))} </div>
</div> </div>
)} )}
</div> </div>