jason/mrp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cleanup

Browse Source
This commit is contained in:
jason
2026-03-18 22:44:01 -05:00
parent 1e408d5316
commit dc07bfc8e0
8 changed files with 148 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/modules/inventory/InventoryFormPage.tsx
+40 -38
View File
@@ -11,7 +11,7 @@ import type {
} from "@mrp/shared/dist/inventory/types.js";
import type { ManufacturingStationDto } from "@mrp/shared";
import { useEffect, useState } from "react";
import { Link, useNavigate, useParams } from "react-router-dom";
import { useNavigate, useParams } from "react-router-dom";
import { ConfirmActionDialog } from "../../components/ConfirmActionDialog";
import { useAuth } from "../../auth/AuthProvider";
@@ -444,41 +444,48 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
}
}
function openSkuMaster() {
navigate("/inventory/sku-master");
}
function closeEditor() {
navigate(mode === "create" ? "/inventory/items" : `/inventory/items/${itemId}`);
}
return (
<form className="space-y-6" onSubmit={handleSubmit}>
<section className="rounded-[20px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
<form className="page-stack" onSubmit={handleSubmit}>
<section className="surface-panel">
<div className="flex flex-col gap-3 lg:flex-row lg:items-start lg:justify-between">
<div>
<p className="text-xs font-semibold uppercase tracking-[0.24em] text-muted">Inventory Editor</p>
<h3 className="mt-2 text-xl font-bold text-text">{mode === "create" ? "New Item" : "Edit Item"}</h3>
<p className="mt-2 max-w-2xl text-sm text-muted">
Define item master data and the first revision of the bill of materials for assemblies and manufactured items.
</p>
<p className="section-kicker">INVENTORY EDITOR</p>
<h3 className="module-title">{mode === "create" ? "NEW ITEM" : "EDIT ITEM"}</h3>
</div>
<div className="flex flex-wrap gap-2">
<Link
to="/inventory/sku-master"
<button
type="button"
onClick={openSkuMaster}
className="inline-flex items-center justify-center rounded-2xl border border-line/70 px-2 py-2 text-sm font-semibold text-text"
>
SKU master
</Link>
<Link
to={mode === "create" ? "/inventory/items" : `/inventory/items/${itemId}`}
</button>
<button
type="button"
onClick={closeEditor}
className="inline-flex items-center justify-center rounded-2xl border border-line/70 px-2 py-2 text-sm font-semibold text-text"
>
Cancel
</Link>
</button>
</div>
</div>
</section>
<section className="space-y-4 rounded-[20px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
<section className="surface-panel space-y-3">
<div className="grid gap-3 xl:grid-cols-2 2xl:grid-cols-4">
<div className="block 2xl:col-span-2">
<div className="mb-2 flex items-center justify-between gap-2">
<span className="block text-sm font-semibold text-text">SKU builder</span>
<Link to="/inventory/sku-master" className="text-xs font-semibold text-brand">
<span className="text-xs font-semibold uppercase tracking-[0.18em] text-muted">SKU BUILDER</span>
<button type="button" onClick={openSkuMaster} className="text-xs font-semibold text-brand">
Manage SKU tree
</Link>
</button>
</div>
<div className="space-y-3 rounded-[18px] border border-line/70 bg-page/70 p-3">
<label className="block">
@@ -593,7 +600,7 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
</div>
</div>
<div className="rounded-[18px] border border-line/70 bg-page/60 p-3">
<div className="text-sm font-semibold text-text">Thumbnail attachment</div>
<div className="text-xs font-semibold uppercase tracking-[0.18em] text-muted">Thumbnail attachment</div>
<div className="mt-2 text-sm text-muted">
{pendingThumbnailFile
? `${pendingThumbnailFile.name} will upload when you save this item.`
@@ -603,9 +610,6 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
? `${thumbnailAttachment.originalName} is attached as the current item thumbnail.`
: "Attach a product image, render, or reference photo for this item."}
</div>
<div className="mt-3 text-xs text-muted">
Supported by the existing file-attachment system. The thumbnail is stored separately from general item documents so the item editor can treat it as the primary visual.
</div>
</div>
</div>
<div className="grid gap-3 xl:grid-cols-4">
@@ -654,7 +658,7 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
<div className="grid gap-3 sm:grid-cols-2">
<label className="flex items-center gap-3 rounded-2xl border border-line/70 bg-page px-2 py-2">
<input type="checkbox" checked={form.isSellable} onChange={(event) => updateField("isSellable", event.target.checked)} />
<span className="text-sm font-semibold text-text">Sellable</span>
<span className="text-sm font-semibold uppercase tracking-[0.08em] text-text">Sellable</span>
</label>
<label className="flex items-center gap-3 rounded-2xl border border-line/70 bg-page px-2 py-2">
<input
@@ -662,7 +666,7 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
checked={form.isPurchasable}
onChange={(event) => updateField("isPurchasable", event.target.checked)}
/>
<span className="text-sm font-semibold text-text">Purchasable</span>
<span className="text-sm font-semibold uppercase tracking-[0.08em] text-text">Purchasable</span>
</label>
</div>
</div>
@@ -733,7 +737,7 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
) : null}
</div>
<div className="mt-2 text-xs text-muted">
{form.preferredVendorId ? getSelectedVendorName(form.preferredVendorId) : "Demand planning uses this vendor when creating buy recommendations."}
{form.preferredVendorId ? getSelectedVendorName(form.preferredVendorId) : "Used as the default buy source."}
</div>
</label>
<label className="block">
@@ -756,23 +760,22 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
</label>
</section>
{form.type === "ASSEMBLY" || form.type === "MANUFACTURED" ? (
<section className="rounded-[20px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
<section className="surface-panel">
<div className="flex flex-col gap-3 lg:flex-row lg:items-start lg:justify-between">
<div>
<p className="text-xs font-semibold uppercase tracking-[0.24em] text-muted">Manufacturing Routing</p>
<h4 className="mt-2 text-lg font-bold text-text">Station and time template</h4>
<p className="mt-2 text-sm text-muted">These operations are copied automatically into work orders and feed the planning workbench without manual planner task entry.</p>
<p className="section-kicker">MANUFACTURING ROUTING</p>
<h4 className="text-lg font-bold text-text">STATION AND TIME TEMPLATE</h4>
</div>
<button type="button" onClick={addOperation} className="inline-flex items-center justify-center rounded-2xl border border-line/70 px-2 py-2 text-sm font-semibold text-text">
Add operation
</button>
</div>
{form.operations.length === 0 ? (
<div className="mt-5 rounded-[18px] border border-dashed border-line/70 bg-page/60 px-4 py-8 text-center text-sm text-muted">
<div className="mt-3 rounded-[18px] border border-dashed border-line/70 bg-page/60 px-3 py-5 text-center text-sm text-muted">
Add at least one station operation for this buildable item.
</div>
) : (
<div className="mt-5 space-y-4">
<div className="mt-3 space-y-3">
{form.operations.map((operation, index) => (
<div key={`${operation.stationId}-${operation.position}-${index}`} className="rounded-[18px] border border-line/70 bg-page/60 p-3">
<div className="grid gap-3 xl:grid-cols-[1.2fr_0.55fr_0.7fr_0.55fr_0.55fr_auto]">
@@ -823,12 +826,11 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
)}
</section>
) : null}
<section className="rounded-[20px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
<section className="surface-panel">
<div className="flex flex-col gap-3 lg:flex-row lg:items-start lg:justify-between">
<div>
<p className="text-xs font-semibold uppercase tracking-[0.24em] text-muted">Bill Of Materials</p>
<h4 className="mt-2 text-lg font-bold text-text">Component lines</h4>
<p className="mt-2 text-sm text-muted">Add BOM components for manufactured or assembly items. Purchased and service items can be saved without BOM lines.</p>
<p className="section-kicker">BILL OF MATERIALS</p>
<h4 className="text-lg font-bold text-text">COMPONENT LINES</h4>
</div>
<button
type="button"
@@ -839,11 +841,11 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
</button>
</div>
{form.bomLines.length === 0 ? (
<div className="mt-5 rounded-[18px] border border-dashed border-line/70 bg-page/60 px-4 py-8 text-center text-sm text-muted">
<div className="mt-3 rounded-[18px] border border-dashed border-line/70 bg-page/60 px-3 py-5 text-center text-sm text-muted">
No BOM lines added yet.
</div>
) : (
<div className="mt-5 space-y-4">
<div className="mt-3 space-y-3">
{form.bomLines.map((line, index) => (
<div key={`${line.componentItemId}-${line.position}-${index}`} className="rounded-[18px] border border-line/70 bg-page/60 p-3">
<div className="grid gap-3 xl:grid-cols-[1.4fr_0.7fr_0.7fr_0.7fr_auto]">
@@ -974,7 +976,7 @@ export function InventoryFormPage({ mode }: InventoryFormPageProps) {
))}
</div>
)}
<div className="mt-6 flex flex-col gap-3 rounded-2xl border border-line/70 bg-page/70 px-2 py-2 sm:flex-row sm:items-center sm:justify-between">
<div className="mt-4 flex flex-col gap-2 rounded-2xl border border-line/70 bg-page/70 px-2 py-2 sm:flex-row sm:items-center sm:justify-between">
<span className="min-w-0 text-sm text-muted">{status}</span>
<button
type="submit"