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

Add purchase needs pointer affordances
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 48s
Details

Browse Source
This commit is contained in:
Cauê Faleiros
2026-08-04 13:27:08 -03:00
parent fa5c4bce39
commit 30cdcd9b0e
1 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/pages/Supplies.tsx
View File

@@ -2220,7 +2220,7 @@ const PurchaseMaterialQueue = ({ needs }: { needs: SupplyPurchaseNeed[] }) => (
<RouterLink <RouterLink
key={product.productId} key={product.productId}
to={`/products/${product.productId}`} to={`/products/${product.productId}`}
className="max-w-full truncate rounded-md border border-dark-border bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted transition-colors hover:border-brand-primary hover:text-brand-primary" className="max-w-full cursor-pointer truncate rounded-md border border-dark-border bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted transition-colors hover:border-brand-primary hover:text-brand-primary"
title={product.name} title={product.name}
> >
#{product.productId} · {product.name} #{product.productId} · {product.name}
@@ -2289,7 +2289,7 @@ const PurchaseServiceQueue = ({ needs }: { needs: SupplyPurchaseNeed[] }) => (
<div className="mt-3 flex flex-wrap items-center gap-2 border-t border-dark-border/70 pt-3"> <div className="mt-3 flex flex-wrap items-center gap-2 border-t border-dark-border/70 pt-3">
<span className="text-[10px] font-bold uppercase tracking-widest text-dark-muted">Produtos afetados</span> <span className="text-[10px] font-bold uppercase tracking-widest text-dark-muted">Produtos afetados</span>
{products.slice(0, 3).map(product => ( {products.slice(0, 3).map(product => (
<RouterLink key={product.productId} to={`/products/${product.productId}`} className="max-w-full truncate rounded-md border border-dark-border bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted transition-colors hover:border-brand-primary hover:text-brand-primary" title={product.name}> <RouterLink key={product.productId} to={`/products/${product.productId}`} className="max-w-full cursor-pointer truncate rounded-md border border-dark-border bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted transition-colors hover:border-brand-primary hover:text-brand-primary" title={product.name}>
#{product.productId} · {product.name} #{product.productId} · {product.name}
</RouterLink> </RouterLink>
))} ))}
@@ -2354,7 +2354,7 @@ const PurchaseMappingQueue = ({ needs }: { needs: SupplyPurchaseNeed[] }) => (
{referenceProduct ? ( {referenceProduct ? (
<RouterLink <RouterLink
to={buildConsumptionReferencePath({ sku: referenceProduct.productId, name: referenceProduct.name })} to={buildConsumptionReferencePath({ sku: referenceProduct.productId, name: referenceProduct.name })}
className="inline-flex h-10 items-center justify-center gap-2 rounded-lg border border-sky-400/30 bg-sky-400/10 px-3 text-xs font-bold text-sky-300 transition-colors hover:bg-sky-400/20" className="inline-flex h-10 cursor-pointer items-center justify-center gap-2 rounded-lg border border-sky-400/30 bg-sky-400/10 px-3 text-xs font-bold text-sky-300 transition-colors hover:bg-sky-400/20"
> >
<Pencil className="h-3.5 w-3.5" /> <Pencil className="h-3.5 w-3.5" />
Mapear consumo Mapear consumo
@@ -2467,7 +2467,7 @@ const PurchaseNeedsScreen = () => {
<button <button
type="button" type="button"
onClick={() => openQueue('materials', 'to_buy')} onClick={() => openQueue('materials', 'to_buy')}
className={`rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'materials' && materialFilter === 'to_buy' ? 'border-brand-primary/45 bg-brand-primary/[0.07]' : 'border-dark-border bg-dark-card hover:border-brand-primary/35'}`} className={`cursor-pointer rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'materials' && materialFilter === 'to_buy' ? 'border-brand-primary/45 bg-brand-primary/[0.07]' : 'border-dark-border bg-dark-card hover:border-brand-primary/35'}`}
> >
<p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Materiais para comprar</p> <p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Materiais para comprar</p>
<p className="mt-2 text-3xl font-bold text-dark-text">{purchaseItemCount}</p> <p className="mt-2 text-3xl font-bold text-dark-text">{purchaseItemCount}</p>
@@ -2481,7 +2481,7 @@ const PurchaseNeedsScreen = () => {
<button <button
type="button" type="button"
onClick={() => openQueue('materials', 'negative_balance')} onClick={() => openQueue('materials', 'negative_balance')}
className={`rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'materials' && materialFilter === 'negative_balance' ? 'border-red-400/45 bg-red-400/[0.07]' : 'border-dark-border bg-dark-card hover:border-red-400/35'}`} className={`cursor-pointer rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'materials' && materialFilter === 'negative_balance' ? 'border-red-400/45 bg-red-400/[0.07]' : 'border-dark-border bg-dark-card hover:border-red-400/35'}`}
> >
<p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Saldos a conferir</p> <p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Saldos a conferir</p>
<p className="mt-2 text-3xl font-bold text-red-300">{negativeBalanceNeeds.length}</p> <p className="mt-2 text-3xl font-bold text-red-300">{negativeBalanceNeeds.length}</p>
@@ -2490,7 +2490,7 @@ const PurchaseNeedsScreen = () => {
<button <button
type="button" type="button"
onClick={() => openQueue('mapping')} onClick={() => openQueue('mapping')}
className={`rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'mapping' ? 'border-sky-400/45 bg-sky-400/[0.07]' : 'border-dark-border bg-dark-card hover:border-sky-400/35'}`} className={`cursor-pointer rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'mapping' ? 'border-sky-400/45 bg-sky-400/[0.07]' : 'border-dark-border bg-dark-card hover:border-sky-400/35'}`}
> >
<p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Dados bloqueando o plano</p> <p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Dados bloqueando o plano</p>
<p className="mt-2 text-3xl font-bold text-sky-300">{impactedSkuCount || mappingNeeds.length}</p> <p className="mt-2 text-3xl font-bold text-sky-300">{impactedSkuCount || mappingNeeds.length}</p>
@@ -2559,7 +2559,7 @@ const PurchaseNeedsScreen = () => {
key={filter.id} key={filter.id}
type="button" type="button"
onClick={() => openQueue('materials', filter.id)} onClick={() => openQueue('materials', filter.id)}
className={`rounded-lg border px-3 py-2 text-left text-xs font-bold transition-colors ${materialFilter === filter.id ? 'border-brand-primary/40 bg-brand-primary/10 text-brand-primary' : 'border-dark-border bg-dark-input text-dark-muted hover:border-brand-primary/35 hover:text-dark-text'}`} className={`cursor-pointer rounded-lg border px-3 py-2 text-left text-xs font-bold transition-colors ${materialFilter === filter.id ? 'border-brand-primary/40 bg-brand-primary/10 text-brand-primary' : 'border-dark-border bg-dark-input text-dark-muted hover:border-brand-primary/35 hover:text-dark-text'}`}
title={filter.description} title={filter.description}
> >
{filter.label} <span className="ml-1 opacity-75">{filter.count}</span> {filter.label} <span className="ml-1 opacity-75">{filter.count}</span>