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/purchasing/PurchaseFormPage.tsx
+15 -16
View File
@@ -1,6 +1,6 @@
import type { InventoryItemOptionDto, PurchaseLineInput, PurchaseOrderInput, PurchaseVendorOptionDto, SalesOrderPlanningDto, SalesOrderPlanningNodeDto } from "@mrp/shared";
import { useEffect, useState } from "react";
import { Link, useNavigate, useParams, useSearchParams } from "react-router-dom";
import { useNavigate, useParams, useSearchParams } from "react-router-dom";
import { ConfirmActionDialog } from "../../components/ConfirmActionDialog";
import { useAuth } from "../../auth/AuthProvider";
@@ -263,6 +263,10 @@ export function PurchaseFormPage({ mode }: { mode: "create" | "edit" }) {
return vendor.name.toLowerCase().includes(query) || vendor.email.toLowerCase().includes(query);
}).length;
function closeEditor() {
navigate(mode === "create" ? "/purchasing/orders" : `/purchasing/orders/${orderId}`);
}
return (
<form className="page-stack" onSubmit={handleSubmit}>
<section className="surface-panel">
@@ -271,9 +275,9 @@ export function PurchaseFormPage({ mode }: { mode: "create" | "edit" }) {
<p className="section-kicker">PURCHASING EDITOR</p>
<h3 className="module-title">{mode === "create" ? "New Purchase Order" : "Edit Purchase Order"}</h3>
</div>
<Link to={mode === "create" ? "/purchasing/orders" : `/purchasing/orders/${orderId}`} className="inline-flex items-center justify-center rounded-2xl border border-line/70 px-2 py-2 text-sm font-semibold text-text">
<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>
</section>
<section className="space-y-3 surface-panel">
@@ -352,18 +356,13 @@ export function PurchaseFormPage({ mode }: { mode: "create" | "edit" }) {
<input type="date" value={form.issueDate.slice(0, 10)} onChange={(event) => updateField("issueDate", new Date(event.target.value).toISOString())} className="w-full rounded-2xl border border-line/70 bg-page px-2 py-2 text-text outline-none transition focus:border-brand" />
</label>
</div>
<div className="rounded-[18px] border border-line/70 bg-page/60 px-3 py-3 text-sm">
<div className="rounded-[18px] border border-line/70 bg-page/60 px-2 py-2 text-sm">
<div className="text-xs font-semibold uppercase tracking-[0.16em] text-muted">Linked Project</div>
<div className="mt-2 font-semibold text-text">
{mode === "edit"
? (form.projectId ? "Project context saved on this purchase order." : "No project linked.")
: (seededProjectId ? `${seededProjectNumber || "Project"}${seededProjectName ? ` - ${seededProjectName}` : ""}` : "Will auto-link from sales-order demand when possible.")}
</div>
<div className="mt-1 text-xs text-muted">
{mode === "edit"
? "This header link is used for downstream project cockpit and finance rollups."
: "Generated purchasing from a project-linked sales order will carry project context automatically."}
</div>
</div>
<label className="block">
<span className="mb-2 block text-sm font-semibold text-text">Notes</span>
@@ -391,18 +390,18 @@ export function PurchaseFormPage({ mode }: { mode: "create" | "edit" }) {
</label>
</div>
</section>
<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">Line Items</p>
<h4 className="mt-2 text-lg font-bold text-text">Procurement lines</h4>
<p className="section-kicker">LINE ITEMS</p>
<h4 className="text-lg font-bold text-text">PROCUREMENT LINES</h4>
</div>
<button type="button" onClick={addLine} className="inline-flex items-center justify-center rounded-2xl border border-line/70 px-2 py-2 text-sm font-semibold text-text">Add line</button>
</div>
{form.lines.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">No line items added yet.</div>
<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 line items added yet.</div>
) : (
<div className="mt-5 space-y-4">
<div className="mt-3 space-y-3">
{form.lines.map((line: PurchaseLineInput, index: number) => (
<div key={index} className="rounded-[18px] border border-line/70 bg-page/60 p-3">
<div className="grid gap-3 xl:grid-cols-[1.15fr_1.25fr_0.5fr_0.55fr_0.7fr_0.75fr_auto]">
@@ -478,13 +477,13 @@ export function PurchaseFormPage({ mode }: { mode: "create" | "edit" }) {
))}
</div>
)}
<div className="mt-5 grid gap-3 md:grid-cols-3 xl:grid-cols-4">
<div className="mt-4 grid gap-2 md:grid-cols-3 xl:grid-cols-4">
<div className="rounded-2xl border border-line/70 bg-page/60 px-2 py-2 text-sm"><div className="text-xs font-semibold uppercase tracking-[0.16em] text-muted">Subtotal</div><div className="mt-1 font-semibold text-text">${subtotal.toFixed(2)}</div></div>
<div className="rounded-2xl border border-line/70 bg-page/60 px-2 py-2 text-sm"><div className="text-xs font-semibold uppercase tracking-[0.16em] text-muted">Tax</div><div className="mt-1 font-semibold text-text">${taxAmount.toFixed(2)}</div></div>
<div className="rounded-2xl border border-line/70 bg-page/60 px-2 py-2 text-sm"><div className="text-xs font-semibold uppercase tracking-[0.16em] text-muted">Freight</div><div className="mt-1 font-semibold text-text">${form.freightAmount.toFixed(2)}</div></div>
<div className="rounded-2xl border border-line/70 bg-page/60 px-2 py-2 text-sm"><div className="text-xs font-semibold uppercase tracking-[0.16em] text-muted">Total</div><div className="mt-1 font-semibold text-text">${total.toFixed(2)}</div></div>
</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" disabled={isSaving} className="rounded-2xl bg-brand px-2 py-2 text-sm font-semibold text-white disabled:cursor-not-allowed disabled:opacity-60">
{isSaving ? "Saving..." : mode === "create" ? "Create purchase order" : "Save changes"}