Remove unfinished supplies placeholders

This commit is contained in:
Cauê Faleiros
2026-07-13 10:30:45 -03:00
parent fcb7eaf51d
commit 4d659d5eb6

View File

@@ -16,7 +16,6 @@ import {
Ruler,
Search,
Scissors,
ShoppingCart,
Truck,
Warehouse,
} from 'lucide-react';
@@ -25,7 +24,6 @@ type InventoryTab = 'dashboard' | 'balance' | 'receipts' | 'inventory' | 'moveme
const pageClassName = 'mx-auto flex w-full max-w-7xl flex-col gap-6';
const panelClassName = 'rounded-2xl border border-dark-border bg-dark-card shadow-sm';
const mutedPanelClassName = 'rounded-2xl border border-dark-border bg-dark-card/70 shadow-sm';
const buttonClassName = 'inline-flex h-10 items-center justify-center gap-2 rounded-lg border border-dark-border bg-dark-input px-3 text-sm font-bold text-dark-text transition-colors hover:border-brand-primary cursor-pointer';
const inputClassName = 'h-10 w-full rounded-lg border border-dark-border bg-dark-input px-3 text-sm font-semibold text-dark-text outline-none placeholder:text-dark-muted focus:border-brand-primary';
const emptyStateClassName = 'flex min-h-[190px] flex-col items-center justify-center gap-2 px-4 py-10 text-center';
@@ -74,44 +72,24 @@ const ModuleCard = ({
description,
icon: Icon,
to,
disabled,
}: {
title: string;
description: string;
icon: typeof Package;
to?: string;
disabled?: boolean;
to: string;
}) => {
const content = (
<>
return (
<RouterLink to={to} className={`${panelClassName} flex min-h-32 items-start gap-4 p-5 transition-colors hover:border-brand-primary`}>
<div className="flex h-11 w-11 items-center justify-center rounded-xl border border-dark-border bg-dark-input text-brand-primary">
<Icon className="h-5 w-5" />
</div>
<div className="min-w-0 flex-1">
<div className="flex items-start justify-between gap-3">
<h2 className="text-base font-bold text-dark-text">{title}</h2>
{disabled ? (
<span className="rounded-full bg-dark-input px-2 py-1 text-[11px] font-bold uppercase tracking-wide text-dark-muted">Em breve</span>
) : (
<ArrowRight className="mt-0.5 h-4 w-4 shrink-0 text-dark-muted" />
)}
<ArrowRight className="mt-0.5 h-4 w-4 shrink-0 text-dark-muted" />
</div>
<p className="mt-2 text-sm font-semibold text-dark-muted">{description}</p>
</div>
</>
);
if (disabled || !to) {
return (
<div className={`${panelClassName} flex min-h-32 items-start gap-4 p-5 opacity-70`}>
{content}
</div>
);
}
return (
<RouterLink to={to} className={`${panelClassName} flex min-h-32 items-start gap-4 p-5 transition-colors hover:border-brand-primary`}>
{content}
</RouterLink>
);
};
@@ -123,10 +101,7 @@ const SuppliesHub = () => (
<ModuleCard title="Planejamento de Corte" description="Ruptura por cor e tamanho, montagem do corte e prioridade por cobertura." icon={Scissors} to="/cutting" />
<ModuleCard title="Controle de Estoque" description="Saldo, lotes, recebimentos, inventário e movimentações." icon={Package} to="/supplies/inventory" />
<ModuleCard title="Planos / Ordem de Produção" description="Ordens geradas pelo corte e acompanhamento de produção." icon={ClipboardList} to="/production-orders" />
<ModuleCard title="Planejamento de Malha" description="Fila de compra/recebimento de matéria-prima para alimentar o corte." icon={Ruler} to="/supplies/fabric-planning" />
<ModuleCard title="Ordens de Compra" description="Compra, recebimento e vínculo financeiro de materiais." icon={ShoppingCart} disabled />
<ModuleCard title="Necessidade de Compra" description="Itens abaixo do mínimo e necessidade projetada para compra." icon={BarChart3} to="/supplies/purchase-needs" />
<ModuleCard title="Relatórios" description="Extratos operacionais de estoque, consumo e movimentações." icon={Download} disabled />
</div>
</div>
);
@@ -145,21 +120,12 @@ const StatGrid = () => (
const InventoryDashboard = () => (
<div className="space-y-4">
<StatGrid />
<div>
<h2 className="mb-3 text-base font-bold text-dark-text">Por categoria de material</h2>
<div className="grid grid-cols-1 gap-3 md:grid-cols-2">
{[
{ title: 'Malha / Tecido', icon: Ruler },
{ title: 'Botões / Acessórios', icon: Warehouse },
].map(item => (
<div key={item.title} className={`${mutedPanelClassName} p-5`}>
<item.icon className="h-6 w-6 text-brand-primary" />
<h3 className="mt-4 text-sm font-bold text-dark-text">{item.title}</h3>
<p className="mt-1 text-sm font-bold text-dark-muted">Em breve</p>
<p className="text-xs font-semibold text-dark-muted">Aguardando cadastro</p>
<span className="mt-3 inline-flex rounded-full bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted">Não configurado</span>
</div>
))}
<div className={`${panelClassName} p-5`}>
<h2 className="text-base font-bold text-dark-text">Por categoria de material</h2>
<div className={emptyStateClassName}>
<Warehouse className="h-8 w-8 text-brand-primary" />
<h3 className="text-base font-bold text-dark-text">Nenhuma categoria com saldo</h3>
<p className="text-sm font-semibold text-dark-muted">Registre entradas para agrupar o estoque por tipo de material.</p>
</div>
</div>
<div className={`${panelClassName} p-5`}>
@@ -309,13 +275,8 @@ const FabricPlanningScreen = () => (
<div className={pageClassName}>
<Header title="Planejamento de Malha" subtitle="Fila de matéria-prima para compra, recebimento e abastecimento do corte." backTo="/supplies" />
<div className={`${panelClassName} p-5`}>
<div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
<div>
<h2 className="text-base font-bold text-dark-text">Planos de malha</h2>
<p className="mt-1 text-sm font-semibold text-dark-muted">Entrada operacional preparada para a próxima etapa do módulo.</p>
</div>
<span className="w-fit rounded-full bg-dark-input px-3 py-1 text-xs font-bold uppercase tracking-wide text-dark-muted">Em preparação</span>
</div>
<h2 className="text-base font-bold text-dark-text">Planos de malha</h2>
<p className="mt-1 text-sm font-semibold text-dark-muted">Fila de matéria-prima para compra, recebimento e abastecimento do corte.</p>
<div className={emptyStateClassName}>
<Ruler className="h-8 w-8 text-brand-primary" />
<h3 className="text-base font-bold text-dark-text">Nenhum plano de malha cadastrado</h3>