blyzer/graphs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix supplies navigation paths

Browse Source
This commit is contained in:
Cauê Faleiros
2026-07-13 10:21:48 -03:00
parent 3928717293
commit be1924bc94
4 changed files with 55 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/pages/Cutting.tsx
View File

@@ -1,6 +1,6 @@
import { useEffect, useMemo, useState } from 'react';
import { Link, useOutletContext } from 'react-router-dom';
import { AlertTriangle, ClipboardList, Download, Layers3, Package, Palette, RotateCcw, Ruler, Save as SaveIcon, Scissors, Search, Settings2, X } from 'lucide-react';
import { AlertTriangle, ArrowLeft, ClipboardList, Download, Layers3, Package, Palette, RotateCcw, Ruler, Save as SaveIcon, Scissors, Search, Settings2, X } from 'lucide-react';
import DateRangePicker from '../components/DateRangePicker';
import PaginationControls from '../components/PaginationControls';
import ProductColorBadge from '../components/ProductColorBadge';
@@ -399,6 +399,10 @@ const Cutting = () => {
<div className="space-y-6">
<div className="grid grid-cols-1 gap-4 2xl:grid-cols-[minmax(520px,1fr)_auto] 2xl:items-start">
<div>
<Link to="/supplies" className="mb-3 inline-flex items-center gap-2 text-sm font-bold text-zinc-500 transition-colors hover:text-zinc-900 dark:text-dark-muted dark:hover:text-dark-text">
<ArrowLeft className="h-4 w-4" />
Voltar para Suprimentos
</Link>
<h1 className="mb-2 text-2xl font-bold text-zinc-900 dark:text-dark-text">Plano de Corte</h1>
<p className="font-medium text-zinc-500 dark:text-dark-muted">
Necessidade por família, cor e tamanho calculada com vendas, estoque e cobertura alvo.

8
src/pages/ProductionOrders.tsx
View File

@@ -1,6 +1,6 @@
import { useCallback, useEffect, useMemo, useState } from 'react';
import { useOutletContext } from 'react-router-dom';
import { CalendarDays, CheckCircle2, ClipboardList, Clock3, Download, PackageCheck, Search } from 'lucide-react';
import { Link, useOutletContext } from 'react-router-dom';
import { ArrowLeft, CalendarDays, CheckCircle2, ClipboardList, Clock3, Download, PackageCheck, Search } from 'lucide-react';
import DateRangePicker from '../components/DateRangePicker';
import PaginationControls from '../components/PaginationControls';
import RefreshStatus from '../components/RefreshStatus';
@@ -198,6 +198,10 @@ const ProductionOrders = () => {
<div className="space-y-6">
<div className="flex flex-col gap-4 xl:flex-row xl:items-center xl:justify-between">
<div>
<Link to="/supplies" className="mb-3 inline-flex items-center gap-2 text-sm font-bold text-dark-muted transition-colors hover:text-dark-text">
<ArrowLeft className="h-4 w-4" />
Voltar para Suprimentos
</Link>
<h1 className="text-2xl font-bold text-dark-text">Ordens de Produção</h1>
<p className="mt-2 text-dark-muted font-medium">Acompanhe as ordens de produção sincronizadas do Tiny.</p>
</div>

6
src/pages/Replenishment.tsx
View File

@@ -1,6 +1,6 @@
import { useEffect, useMemo, useState } from 'react';
import { Link, useOutletContext, useSearchParams } from 'react-router-dom';
import { AlertTriangle, CheckCircle2, Download, Package, Search, TrendingUp } from 'lucide-react';
import { AlertTriangle, ArrowLeft, CheckCircle2, Download, Package, Search, TrendingUp } from 'lucide-react';
import DateRangePicker from '../components/DateRangePicker';
import PaginationControls from '../components/PaginationControls';
import RefreshStatus from '../components/RefreshStatus';
@@ -314,6 +314,10 @@ const Replenishment = () => {
<div className="space-y-6">
<div className="grid grid-cols-1 gap-4 2xl:grid-cols-[minmax(520px,1fr)_auto] 2xl:items-start">
<div>
<Link to="/supplies" className="mb-3 inline-flex items-center gap-2 text-sm font-bold text-zinc-500 transition-colors hover:text-zinc-900 dark:text-dark-muted dark:hover:text-dark-text">
<ArrowLeft className="h-4 w-4" />
Voltar para Suprimentos
</Link>
<h1 className="text-2xl font-bold mb-2 text-zinc-900 dark:text-dark-text">Necessidade de Reposição</h1>
<p className="text-zinc-500 dark:text-dark-muted font-medium">
O período selecionado define a base de vendas; a cobertura define quantos dias de estoque sugerir.

40
src/pages/Supplies.tsx
View File

@@ -125,7 +125,7 @@ const SuppliesHub = () => (
<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="/replenishment" />
<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>
@@ -325,12 +325,50 @@ const FabricPlanningScreen = () => (
</div>
);
const PurchaseNeedsScreen = () => (
<div className={pageClassName}>
<Header title="Necessidade de Compra" subtitle="Materiais abaixo do mínimo e necessidade projetada para compra." backTo="/supplies" />
<div className="grid grid-cols-1 gap-4 md:grid-cols-3">
{[
{ label: 'Itens críticos', value: '0' },
{ label: 'Compra sugerida', value: '0 kg' },
{ label: 'Fornecedores pendentes', value: '0' },
].map(stat => (
<div key={stat.label} className="rounded-2xl border border-dark-border bg-dark-card p-5 shadow-sm">
<p className="text-xs font-bold uppercase tracking-widest text-dark-muted">{stat.label}</p>
<p className="mt-2 text-3xl font-bold text-dark-text">{stat.value}</p>
</div>
))}
</div>
<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">Necessidade por material</h2>
<p className="mt-1 text-sm font-semibold text-dark-muted">Calculada com estoque atual, mínimo configurado e consumo dos planos.</p>
</div>
<button type="button" className={buttonClassName}><Download className="h-4 w-4" /> Exportar CSV</button>
</div>
<div className={emptyStateClassName}>
<BarChart3 className="h-8 w-8 text-brand-primary" />
<h3 className="text-base font-bold text-dark-text">Nenhuma necessidade de compra</h3>
<p className="text-sm font-semibold text-dark-muted">Configure mínimos e registre estoque para gerar sugestões.</p>
</div>
</div>
<div className={`${panelClassName} p-5`}>
<h2 className="text-base font-bold text-dark-text">Estoque mínimo por item</h2>
<p className="mt-2 text-sm font-semibold text-dark-muted">Defina o ponto de pedido de cada matéria-prima para aparecer aqui quando ficar abaixo do mínimo.</p>
<button type="button" className={`${buttonClassName} mt-4`}>Configurar estoques mínimos</button>
</div>
</div>
);
const Supplies = () => {
const { section } = useParams<{ section?: string }>();
if (!section) return <SuppliesHub />;
if (section === 'inventory') return <InventoryScreen />;
if (section === 'fabric-planning') return <FabricPlanningScreen />;
if (section === 'purchase-needs') return <PurchaseNeedsScreen />;
return <Navigate to="/supplies" replace />;
};