cleanup
This commit is contained in:
@@ -7,6 +7,7 @@ import { useEffect, useState } from "react";
|
||||
import { Link, useParams } from "react-router-dom";
|
||||
|
||||
import { useAuth } from "../../auth/AuthProvider";
|
||||
import { ConfirmActionDialog } from "../../components/ConfirmActionDialog";
|
||||
import { FileAttachmentsPanel } from "../../components/FileAttachmentsPanel";
|
||||
import { api, ApiError } from "../../lib/api";
|
||||
import { emptyPurchaseReceiptInput, purchaseStatusOptions } from "./config";
|
||||
@@ -25,6 +26,20 @@ export function PurchaseDetailPage() {
|
||||
const [isUpdatingStatus, setIsUpdatingStatus] = useState(false);
|
||||
const [isOpeningPdf, setIsOpeningPdf] = useState(false);
|
||||
const [planningRollup, setPlanningRollup] = useState<DemandPlanningRollupDto | null>(null);
|
||||
const [pendingConfirmation, setPendingConfirmation] = useState<
|
||||
| {
|
||||
kind: "status" | "receipt";
|
||||
title: string;
|
||||
description: string;
|
||||
impact: string;
|
||||
recovery: string;
|
||||
confirmLabel: string;
|
||||
confirmationLabel?: string;
|
||||
confirmationValue?: string;
|
||||
nextStatus?: PurchaseOrderStatus;
|
||||
}
|
||||
| null
|
||||
>(null);
|
||||
|
||||
const canManage = user?.permissions.includes("purchasing.write") ?? false;
|
||||
const canReceive = canManage && (user?.permissions.includes(permissions.inventoryWrite) ?? false);
|
||||
@@ -107,7 +122,7 @@ export function PurchaseDetailPage() {
|
||||
}));
|
||||
}
|
||||
|
||||
async function handleStatusChange(nextStatus: PurchaseOrderStatus) {
|
||||
async function applyStatusChange(nextStatus: PurchaseOrderStatus) {
|
||||
if (!token) {
|
||||
return;
|
||||
}
|
||||
@@ -118,7 +133,7 @@ export function PurchaseDetailPage() {
|
||||
try {
|
||||
const nextDocument = await api.updatePurchaseOrderStatus(token, activeDocument.id, nextStatus);
|
||||
setDocument(nextDocument);
|
||||
setStatus("Purchase order status updated.");
|
||||
setStatus("Purchase order status updated. Confirm vendor communication and receiving expectations if this moved the order into a terminal state.");
|
||||
} catch (error: unknown) {
|
||||
const message = error instanceof ApiError ? error.message : "Unable to update purchase order status.";
|
||||
setStatus(message);
|
||||
@@ -127,8 +142,7 @@ export function PurchaseDetailPage() {
|
||||
}
|
||||
}
|
||||
|
||||
async function handleReceiptSubmit(event: React.FormEvent<HTMLFormElement>) {
|
||||
event.preventDefault();
|
||||
async function applyReceipt() {
|
||||
if (!token || !canReceive) {
|
||||
return;
|
||||
}
|
||||
@@ -155,7 +169,7 @@ export function PurchaseDetailPage() {
|
||||
receivedAt: new Date().toISOString(),
|
||||
notes: "",
|
||||
}));
|
||||
setReceiptStatus("Purchase receipt recorded.");
|
||||
setReceiptStatus("Purchase receipt recorded. Inventory has been increased; verify stock balances and post a correcting movement if quantities were overstated.");
|
||||
setStatus("Purchase order updated after receipt.");
|
||||
} catch (error: unknown) {
|
||||
const message = error instanceof ApiError ? error.message : "Unable to record purchase receipt.";
|
||||
@@ -165,6 +179,39 @@ export function PurchaseDetailPage() {
|
||||
}
|
||||
}
|
||||
|
||||
function handleStatusChange(nextStatus: PurchaseOrderStatus) {
|
||||
const label = purchaseStatusOptions.find((option) => option.value === nextStatus)?.label ?? nextStatus;
|
||||
setPendingConfirmation({
|
||||
kind: "status",
|
||||
title: `Set purchase order to ${label}`,
|
||||
description: `Update ${activeDocument.documentNumber} from ${activeDocument.status} to ${nextStatus}.`,
|
||||
impact:
|
||||
nextStatus === "CLOSED"
|
||||
? "This closes the order operationally and can change inbound supply expectations, shortage coverage, and vendor follow-up."
|
||||
: "This changes the purchasing state used by receiving, planning, and audit review.",
|
||||
recovery: "If the status is wrong, set the order back to the correct state and verify any downstream receiving or planning assumptions.",
|
||||
confirmLabel: `Set ${label}`,
|
||||
confirmationLabel: nextStatus === "CLOSED" ? "Type purchase order number to confirm:" : undefined,
|
||||
confirmationValue: nextStatus === "CLOSED" ? activeDocument.documentNumber : undefined,
|
||||
nextStatus,
|
||||
});
|
||||
}
|
||||
|
||||
function handleReceiptSubmit(event: React.FormEvent<HTMLFormElement>) {
|
||||
event.preventDefault();
|
||||
const totalReceiptQuantity = openLines.reduce((sum, line) => sum + Math.max(0, Math.floor(receiptQuantities[line.id] ?? 0)), 0);
|
||||
setPendingConfirmation({
|
||||
kind: "receipt",
|
||||
title: "Post purchase receipt",
|
||||
description: `Receive ${totalReceiptQuantity} total units into ${receiptForm.warehouseId && receiptForm.locationId ? "the selected stock location" : "inventory"} for ${activeDocument.documentNumber}.`,
|
||||
impact: "This increases inventory immediately and becomes part of the PO receipt history.",
|
||||
recovery: "If quantities are wrong, post the correcting inventory movement and review the remaining quantities on the purchase order.",
|
||||
confirmLabel: "Post receipt",
|
||||
confirmationLabel: totalReceiptQuantity > 0 ? "Type purchase order number to confirm:" : undefined,
|
||||
confirmationValue: totalReceiptQuantity > 0 ? activeDocument.documentNumber : undefined,
|
||||
});
|
||||
}
|
||||
|
||||
async function handleOpenPdf() {
|
||||
if (!token) {
|
||||
return;
|
||||
@@ -464,6 +511,41 @@ export function PurchaseDetailPage() {
|
||||
emptyMessage="No vendor supporting documents have been uploaded for this purchase order yet."
|
||||
/>
|
||||
<div className="rounded-2xl border border-line/70 bg-page/60 px-2 py-2 text-sm text-muted">{status}</div>
|
||||
<ConfirmActionDialog
|
||||
open={pendingConfirmation != null}
|
||||
title={pendingConfirmation?.title ?? "Confirm purchasing action"}
|
||||
description={pendingConfirmation?.description ?? ""}
|
||||
impact={pendingConfirmation?.impact}
|
||||
recovery={pendingConfirmation?.recovery}
|
||||
confirmLabel={pendingConfirmation?.confirmLabel ?? "Confirm"}
|
||||
confirmationLabel={pendingConfirmation?.confirmationLabel}
|
||||
confirmationValue={pendingConfirmation?.confirmationValue}
|
||||
isConfirming={
|
||||
(pendingConfirmation?.kind === "status" && isUpdatingStatus) ||
|
||||
(pendingConfirmation?.kind === "receipt" && isSavingReceipt)
|
||||
}
|
||||
onClose={() => {
|
||||
if (!isUpdatingStatus && !isSavingReceipt) {
|
||||
setPendingConfirmation(null);
|
||||
}
|
||||
}}
|
||||
onConfirm={async () => {
|
||||
if (!pendingConfirmation) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (pendingConfirmation.kind === "status" && pendingConfirmation.nextStatus) {
|
||||
await applyStatusChange(pendingConfirmation.nextStatus);
|
||||
setPendingConfirmation(null);
|
||||
return;
|
||||
}
|
||||
|
||||
if (pendingConfirmation.kind === "receipt") {
|
||||
await applyReceipt();
|
||||
setPendingConfirmation(null);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -6,6 +6,7 @@ import { Link, useNavigate, useParams } from "react-router-dom";
|
||||
|
||||
import { useAuth } from "../../auth/AuthProvider";
|
||||
import { api, ApiError } from "../../lib/api";
|
||||
import { ConfirmActionDialog } from "../../components/ConfirmActionDialog";
|
||||
import { salesConfigs, salesStatusOptions, type SalesDocumentEntity } from "./config";
|
||||
import { SalesStatusBadge } from "./SalesStatusBadge";
|
||||
import { ShipmentStatusBadge } from "../shipping/ShipmentStatusBadge";
|
||||
@@ -59,6 +60,20 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
const [isApproving, setIsApproving] = useState(false);
|
||||
const [shipments, setShipments] = useState<ShipmentSummaryDto[]>([]);
|
||||
const [planning, setPlanning] = useState<SalesOrderPlanningDto | null>(null);
|
||||
const [pendingConfirmation, setPendingConfirmation] = useState<
|
||||
| {
|
||||
kind: "status" | "approve" | "convert";
|
||||
title: string;
|
||||
description: string;
|
||||
impact: string;
|
||||
recovery: string;
|
||||
confirmLabel: string;
|
||||
confirmationLabel?: string;
|
||||
confirmationValue?: string;
|
||||
nextStatus?: SalesDocumentStatus;
|
||||
}
|
||||
| null
|
||||
>(null);
|
||||
|
||||
const canManage = user?.permissions.includes(permissions.salesWrite) ?? false;
|
||||
const canManageShipping = user?.permissions.includes(permissions.shippingWrite) ?? false;
|
||||
@@ -119,7 +134,7 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
return `/purchasing/orders/new?${params.toString()}`;
|
||||
}
|
||||
|
||||
async function handleStatusChange(nextStatus: SalesDocumentStatus) {
|
||||
async function applyStatusChange(nextStatus: SalesDocumentStatus) {
|
||||
if (!token) {
|
||||
return;
|
||||
}
|
||||
@@ -133,7 +148,7 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
? await api.updateQuoteStatus(token, activeDocument.id, nextStatus)
|
||||
: await api.updateSalesOrderStatus(token, activeDocument.id, nextStatus);
|
||||
setDocument(nextDocument);
|
||||
setStatus(`${config.singularLabel} status updated.`);
|
||||
setStatus(`${config.singularLabel} status updated. Review revisions and downstream workflows if the document moved into a terminal or customer-visible state.`);
|
||||
} catch (error: unknown) {
|
||||
const message = error instanceof ApiError ? error.message : `Unable to update ${config.singularLabel.toLowerCase()} status.`;
|
||||
setStatus(message);
|
||||
@@ -142,7 +157,7 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
}
|
||||
}
|
||||
|
||||
async function handleConvert() {
|
||||
async function applyConvert() {
|
||||
if (!token || entity !== "quote") {
|
||||
return;
|
||||
}
|
||||
@@ -185,7 +200,7 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
}
|
||||
}
|
||||
|
||||
async function handleApprove() {
|
||||
async function applyApprove() {
|
||||
if (!token) {
|
||||
return;
|
||||
}
|
||||
@@ -197,7 +212,7 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
const nextDocument =
|
||||
entity === "quote" ? await api.approveQuote(token, activeDocument.id) : await api.approveSalesOrder(token, activeDocument.id);
|
||||
setDocument(nextDocument);
|
||||
setStatus(`${config.singularLabel} approved.`);
|
||||
setStatus(`${config.singularLabel} approved. The approval stamp is now part of the document history and downstream teams can act on it immediately.`);
|
||||
} catch (error: unknown) {
|
||||
const message = error instanceof ApiError ? error.message : `Unable to approve ${config.singularLabel.toLowerCase()}.`;
|
||||
setStatus(message);
|
||||
@@ -206,6 +221,50 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
}
|
||||
}
|
||||
|
||||
function handleStatusChange(nextStatus: SalesDocumentStatus) {
|
||||
const label = salesStatusOptions.find((option) => option.value === nextStatus)?.label ?? nextStatus;
|
||||
setPendingConfirmation({
|
||||
kind: "status",
|
||||
title: `Set ${config.singularLabel.toLowerCase()} to ${label}`,
|
||||
description: `Update ${activeDocument.documentNumber} from ${activeDocument.status} to ${nextStatus}.`,
|
||||
impact:
|
||||
nextStatus === "CLOSED"
|
||||
? "This closes the document operationally and can change customer-facing execution assumptions and downstream follow-up expectations."
|
||||
: nextStatus === "APPROVED"
|
||||
? "This marks the document ready for downstream action and becomes part of the approval history."
|
||||
: "This changes the operational state used by downstream workflows and audit/revision history.",
|
||||
recovery: "If this status is set in error, return the document to the correct state and verify the latest revision history.",
|
||||
confirmLabel: `Set ${label}`,
|
||||
confirmationLabel: nextStatus === "CLOSED" ? "Type document number to confirm:" : undefined,
|
||||
confirmationValue: nextStatus === "CLOSED" ? activeDocument.documentNumber : undefined,
|
||||
nextStatus,
|
||||
});
|
||||
}
|
||||
|
||||
function handleApprove() {
|
||||
setPendingConfirmation({
|
||||
kind: "approve",
|
||||
title: `Approve ${config.singularLabel.toLowerCase()}`,
|
||||
description: `Approve ${activeDocument.documentNumber} for ${activeDocument.customerName}.`,
|
||||
impact: "Approval records the approver and timestamp and signals that downstream execution can proceed.",
|
||||
recovery: "If approval was granted by mistake, change the document status and review the revision trail for follow-up.",
|
||||
confirmLabel: "Approve document",
|
||||
});
|
||||
}
|
||||
|
||||
function handleConvert() {
|
||||
setPendingConfirmation({
|
||||
kind: "convert",
|
||||
title: "Convert quote to sales order",
|
||||
description: `Create a sales order from quote ${activeDocument.documentNumber}.`,
|
||||
impact: "This creates a new sales order record and can trigger planning, purchasing, manufacturing, and shipping follow-up work.",
|
||||
recovery: "Review the new order immediately after creation. If conversion was premature, move the resulting order to the correct status and coordinate with downstream teams.",
|
||||
confirmLabel: "Convert quote",
|
||||
confirmationLabel: "Type quote number to confirm:",
|
||||
confirmationValue: activeDocument.documentNumber,
|
||||
});
|
||||
}
|
||||
|
||||
return (
|
||||
<section className="space-y-4">
|
||||
<div className="rounded-[28px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
|
||||
@@ -570,6 +629,48 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
)}
|
||||
</section>
|
||||
) : null}
|
||||
<ConfirmActionDialog
|
||||
open={pendingConfirmation != null}
|
||||
title={pendingConfirmation?.title ?? "Confirm sales action"}
|
||||
description={pendingConfirmation?.description ?? ""}
|
||||
impact={pendingConfirmation?.impact}
|
||||
recovery={pendingConfirmation?.recovery}
|
||||
confirmLabel={pendingConfirmation?.confirmLabel ?? "Confirm"}
|
||||
confirmationLabel={pendingConfirmation?.confirmationLabel}
|
||||
confirmationValue={pendingConfirmation?.confirmationValue}
|
||||
isConfirming={
|
||||
(pendingConfirmation?.kind === "status" && isUpdatingStatus) ||
|
||||
(pendingConfirmation?.kind === "approve" && isApproving) ||
|
||||
(pendingConfirmation?.kind === "convert" && isConverting)
|
||||
}
|
||||
onClose={() => {
|
||||
if (!isUpdatingStatus && !isApproving && !isConverting) {
|
||||
setPendingConfirmation(null);
|
||||
}
|
||||
}}
|
||||
onConfirm={async () => {
|
||||
if (!pendingConfirmation) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (pendingConfirmation.kind === "status" && pendingConfirmation.nextStatus) {
|
||||
await applyStatusChange(pendingConfirmation.nextStatus);
|
||||
setPendingConfirmation(null);
|
||||
return;
|
||||
}
|
||||
|
||||
if (pendingConfirmation.kind === "approve") {
|
||||
await applyApprove();
|
||||
setPendingConfirmation(null);
|
||||
return;
|
||||
}
|
||||
|
||||
if (pendingConfirmation.kind === "convert") {
|
||||
await applyConvert();
|
||||
setPendingConfirmation(null);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -5,6 +5,7 @@ import { Link, useParams } from "react-router-dom";
|
||||
|
||||
import { useAuth } from "../../auth/AuthProvider";
|
||||
import { api, ApiError } from "../../lib/api";
|
||||
import { ConfirmActionDialog } from "../../components/ConfirmActionDialog";
|
||||
import { FileAttachmentsPanel } from "../../components/FileAttachmentsPanel";
|
||||
import { shipmentStatusOptions } from "./config";
|
||||
import { ShipmentStatusBadge } from "./ShipmentStatusBadge";
|
||||
@@ -17,6 +18,19 @@ export function ShipmentDetailPage() {
|
||||
const [status, setStatus] = useState("Loading shipment...");
|
||||
const [isUpdatingStatus, setIsUpdatingStatus] = useState(false);
|
||||
const [activeDocumentAction, setActiveDocumentAction] = useState<"packing-slip" | "label" | "bol" | null>(null);
|
||||
const [pendingConfirmation, setPendingConfirmation] = useState<
|
||||
| {
|
||||
title: string;
|
||||
description: string;
|
||||
impact: string;
|
||||
recovery: string;
|
||||
confirmLabel: string;
|
||||
confirmationLabel?: string;
|
||||
confirmationValue?: string;
|
||||
nextStatus: ShipmentStatus;
|
||||
}
|
||||
| null
|
||||
>(null);
|
||||
|
||||
const canManage = user?.permissions.includes(permissions.shippingWrite) ?? false;
|
||||
|
||||
@@ -38,7 +52,7 @@ export function ShipmentDetailPage() {
|
||||
});
|
||||
}, [shipmentId, token]);
|
||||
|
||||
async function handleStatusChange(nextStatus: ShipmentStatus) {
|
||||
async function applyStatusChange(nextStatus: ShipmentStatus) {
|
||||
if (!token || !shipment) {
|
||||
return;
|
||||
}
|
||||
@@ -48,7 +62,7 @@ export function ShipmentDetailPage() {
|
||||
try {
|
||||
const nextShipment = await api.updateShipmentStatus(token, shipment.id, nextStatus);
|
||||
setShipment(nextShipment);
|
||||
setStatus("Shipment status updated.");
|
||||
setStatus("Shipment status updated. Verify carrier paperwork and sales-order expectations if the shipment moved into a terminal state.");
|
||||
} catch (error: unknown) {
|
||||
const message = error instanceof ApiError ? error.message : "Unable to update shipment status.";
|
||||
setStatus(message);
|
||||
@@ -57,6 +71,29 @@ export function ShipmentDetailPage() {
|
||||
}
|
||||
}
|
||||
|
||||
function handleStatusChange(nextStatus: ShipmentStatus) {
|
||||
if (!shipment) {
|
||||
return;
|
||||
}
|
||||
|
||||
const label = shipmentStatusOptions.find((option) => option.value === nextStatus)?.label ?? nextStatus;
|
||||
setPendingConfirmation({
|
||||
title: `Set shipment to ${label}`,
|
||||
description: `Update shipment ${shipment.shipmentNumber} from ${shipment.status} to ${nextStatus}.`,
|
||||
impact:
|
||||
nextStatus === "DELIVERED"
|
||||
? "This marks delivery complete and can affect customer communication and project/shipping readiness views."
|
||||
: nextStatus === "SHIPPED"
|
||||
? "This marks the shipment as outbound and can trigger customer-facing tracking and downstream delivery expectations."
|
||||
: "This changes the logistics state used by related shipping and sales workflows.",
|
||||
recovery: "If the status is wrong, return the shipment to the correct state and confirm the linked sales order still reflects reality.",
|
||||
confirmLabel: `Set ${label}`,
|
||||
confirmationLabel: nextStatus === "DELIVERED" ? "Type shipment number to confirm:" : undefined,
|
||||
confirmationValue: nextStatus === "DELIVERED" ? shipment.shipmentNumber : undefined,
|
||||
nextStatus,
|
||||
});
|
||||
}
|
||||
|
||||
async function handleOpenDocument(kind: "packing-slip" | "label" | "bol") {
|
||||
if (!token || !shipment) {
|
||||
return;
|
||||
@@ -207,6 +244,30 @@ export function ShipmentDetailPage() {
|
||||
description="Store carrier paperwork, signed delivery records, bills of lading, and related logistics support files on the shipment record."
|
||||
emptyMessage="No logistics attachments have been uploaded for this shipment yet."
|
||||
/>
|
||||
<ConfirmActionDialog
|
||||
open={pendingConfirmation != null}
|
||||
title={pendingConfirmation?.title ?? "Confirm shipment action"}
|
||||
description={pendingConfirmation?.description ?? ""}
|
||||
impact={pendingConfirmation?.impact}
|
||||
recovery={pendingConfirmation?.recovery}
|
||||
confirmLabel={pendingConfirmation?.confirmLabel ?? "Confirm"}
|
||||
confirmationLabel={pendingConfirmation?.confirmationLabel}
|
||||
confirmationValue={pendingConfirmation?.confirmationValue}
|
||||
isConfirming={isUpdatingStatus}
|
||||
onClose={() => {
|
||||
if (!isUpdatingStatus) {
|
||||
setPendingConfirmation(null);
|
||||
}
|
||||
}}
|
||||
onConfirm={async () => {
|
||||
if (!pendingConfirmation) {
|
||||
return;
|
||||
}
|
||||
|
||||
await applyStatusChange(pendingConfirmation.nextStatus);
|
||||
setPendingConfirmation(null);
|
||||
}}
|
||||
/>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user