convert actions
This commit is contained in:
@@ -391,6 +391,16 @@ export const api = {
|
||||
updateQuote(token: string, quoteId: string, payload: SalesDocumentInput) {
|
||||
return request<SalesDocumentDetailDto>(`/api/v1/sales/quotes/${quoteId}`, { method: "PUT", body: JSON.stringify(payload) }, token);
|
||||
},
|
||||
updateQuoteStatus(token: string, quoteId: string, status: SalesDocumentStatus) {
|
||||
return request<SalesDocumentDetailDto>(
|
||||
`/api/v1/sales/quotes/${quoteId}/status`,
|
||||
{ method: "PATCH", body: JSON.stringify({ status }) },
|
||||
token
|
||||
);
|
||||
},
|
||||
convertQuoteToSalesOrder(token: string, quoteId: string) {
|
||||
return request<SalesDocumentDetailDto>(`/api/v1/sales/quotes/${quoteId}/convert`, { method: "POST" }, token);
|
||||
},
|
||||
getSalesOrders(token: string, filters?: { q?: string; status?: SalesDocumentStatus }) {
|
||||
return request<SalesDocumentSummaryDto[]>(
|
||||
`/api/v1/sales/orders${buildQueryString({
|
||||
@@ -410,6 +420,13 @@ export const api = {
|
||||
updateSalesOrder(token: string, orderId: string, payload: SalesDocumentInput) {
|
||||
return request<SalesDocumentDetailDto>(`/api/v1/sales/orders/${orderId}`, { method: "PUT", body: JSON.stringify(payload) }, token);
|
||||
},
|
||||
updateSalesOrderStatus(token: string, orderId: string, status: SalesDocumentStatus) {
|
||||
return request<SalesDocumentDetailDto>(
|
||||
`/api/v1/sales/orders/${orderId}/status`,
|
||||
{ method: "PATCH", body: JSON.stringify({ status }) },
|
||||
token
|
||||
);
|
||||
},
|
||||
async getCompanyProfilePreviewPdf(token: string) {
|
||||
const response = await fetch("/api/v1/documents/company-profile-preview.pdf", {
|
||||
headers: {
|
||||
|
||||
@@ -1,20 +1,23 @@
|
||||
import { permissions } from "@mrp/shared";
|
||||
import type { SalesDocumentDetailDto } from "@mrp/shared/dist/sales/types.js";
|
||||
import type { SalesDocumentDetailDto, SalesDocumentStatus } from "@mrp/shared/dist/sales/types.js";
|
||||
import { useEffect, useState } from "react";
|
||||
import { Link, useParams } from "react-router-dom";
|
||||
import { Link, useNavigate, useParams } from "react-router-dom";
|
||||
|
||||
import { useAuth } from "../../auth/AuthProvider";
|
||||
import { api, ApiError } from "../../lib/api";
|
||||
import { salesConfigs, type SalesDocumentEntity } from "./config";
|
||||
import { salesConfigs, salesStatusOptions, type SalesDocumentEntity } from "./config";
|
||||
import { SalesStatusBadge } from "./SalesStatusBadge";
|
||||
|
||||
export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
const { token, user } = useAuth();
|
||||
const navigate = useNavigate();
|
||||
const { quoteId, orderId } = useParams();
|
||||
const config = salesConfigs[entity];
|
||||
const documentId = entity === "quote" ? quoteId : orderId;
|
||||
const [document, setDocument] = useState<SalesDocumentDetailDto | null>(null);
|
||||
const [status, setStatus] = useState(`Loading ${config.singularLabel.toLowerCase()}...`);
|
||||
const [isUpdatingStatus, setIsUpdatingStatus] = useState(false);
|
||||
const [isConverting, setIsConverting] = useState(false);
|
||||
|
||||
const canManage = user?.permissions.includes(permissions.salesWrite) ?? false;
|
||||
|
||||
@@ -39,16 +42,59 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
return <div className="rounded-[28px] border border-line/70 bg-surface/90 p-4 text-sm text-muted shadow-panel">{status}</div>;
|
||||
}
|
||||
|
||||
const activeDocument = document;
|
||||
|
||||
async function handleStatusChange(nextStatus: SalesDocumentStatus) {
|
||||
if (!token) {
|
||||
return;
|
||||
}
|
||||
|
||||
setIsUpdatingStatus(true);
|
||||
setStatus(`Updating ${config.singularLabel.toLowerCase()} status...`);
|
||||
|
||||
try {
|
||||
const nextDocument =
|
||||
entity === "quote"
|
||||
? await api.updateQuoteStatus(token, activeDocument.id, nextStatus)
|
||||
: await api.updateSalesOrderStatus(token, activeDocument.id, nextStatus);
|
||||
setDocument(nextDocument);
|
||||
setStatus(`${config.singularLabel} status updated.`);
|
||||
} catch (error: unknown) {
|
||||
const message = error instanceof ApiError ? error.message : `Unable to update ${config.singularLabel.toLowerCase()} status.`;
|
||||
setStatus(message);
|
||||
} finally {
|
||||
setIsUpdatingStatus(false);
|
||||
}
|
||||
}
|
||||
|
||||
async function handleConvert() {
|
||||
if (!token || entity !== "quote") {
|
||||
return;
|
||||
}
|
||||
|
||||
setIsConverting(true);
|
||||
setStatus("Converting quote to sales order...");
|
||||
|
||||
try {
|
||||
const order = await api.convertQuoteToSalesOrder(token, activeDocument.id);
|
||||
navigate(`/sales/orders/${order.id}`);
|
||||
} catch (error: unknown) {
|
||||
const message = error instanceof ApiError ? error.message : "Unable to convert quote to sales order.";
|
||||
setStatus(message);
|
||||
setIsConverting(false);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<section className="space-y-4">
|
||||
<div className="rounded-[28px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
|
||||
<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">{config.detailEyebrow}</p>
|
||||
<h3 className="mt-2 text-xl font-bold text-text">{document.documentNumber}</h3>
|
||||
<p className="mt-1 text-sm text-text">{document.customerName}</p>
|
||||
<h3 className="mt-2 text-xl font-bold text-text">{activeDocument.documentNumber}</h3>
|
||||
<p className="mt-1 text-sm text-text">{activeDocument.customerName}</p>
|
||||
<div className="mt-3 flex flex-wrap gap-2">
|
||||
<SalesStatusBadge status={document.status} />
|
||||
<SalesStatusBadge status={activeDocument.status} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-3">
|
||||
@@ -56,29 +102,64 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
Back to {config.collectionLabel.toLowerCase()}
|
||||
</Link>
|
||||
{canManage ? (
|
||||
<Link to={`${config.routeBase}/${document.id}/edit`} className="inline-flex items-center justify-center rounded-2xl bg-brand px-2 py-2 text-sm font-semibold text-white">
|
||||
Edit {config.singularLabel.toLowerCase()}
|
||||
</Link>
|
||||
<>
|
||||
<Link to={`${config.routeBase}/${activeDocument.id}/edit`} className="inline-flex items-center justify-center rounded-2xl bg-brand px-2 py-2 text-sm font-semibold text-white">
|
||||
Edit {config.singularLabel.toLowerCase()}
|
||||
</Link>
|
||||
{entity === "quote" ? (
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleConvert}
|
||||
disabled={isConverting}
|
||||
className="inline-flex items-center justify-center rounded-2xl border border-emerald-400/40 px-2 py-2 text-sm font-semibold text-emerald-700 disabled:cursor-not-allowed disabled:opacity-60 dark:text-emerald-300"
|
||||
>
|
||||
{isConverting ? "Converting..." : "Convert to sales order"}
|
||||
</button>
|
||||
) : null}
|
||||
</>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{canManage ? (
|
||||
<section className="rounded-[28px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
|
||||
<div className="flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between">
|
||||
<div>
|
||||
<p className="text-xs font-semibold uppercase tracking-[0.24em] text-muted">Quick Actions</p>
|
||||
<p className="mt-2 text-sm text-muted">Update document status without opening the full editor.</p>
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{salesStatusOptions.map((option) => (
|
||||
<button
|
||||
key={option.value}
|
||||
type="button"
|
||||
onClick={() => handleStatusChange(option.value)}
|
||||
disabled={isUpdatingStatus || activeDocument.status === option.value}
|
||||
className="rounded-2xl border border-line/70 px-2 py-2 text-sm font-semibold text-text disabled:cursor-not-allowed disabled:opacity-60"
|
||||
>
|
||||
{option.label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
) : null}
|
||||
<section className="grid gap-3 xl:grid-cols-4">
|
||||
<article className="rounded-[24px] border border-line/70 bg-surface/90 px-3 py-3 shadow-panel">
|
||||
<p className="text-xs font-semibold uppercase tracking-[0.18em] text-muted">Issue Date</p>
|
||||
<div className="mt-2 text-base font-bold text-text">{new Date(document.issueDate).toLocaleDateString()}</div>
|
||||
<div className="mt-2 text-base font-bold text-text">{new Date(activeDocument.issueDate).toLocaleDateString()}</div>
|
||||
</article>
|
||||
<article className="rounded-[24px] border border-line/70 bg-surface/90 px-3 py-3 shadow-panel">
|
||||
<p className="text-xs font-semibold uppercase tracking-[0.18em] text-muted">Expires</p>
|
||||
<div className="mt-2 text-base font-bold text-text">{document.expiresAt ? new Date(document.expiresAt).toLocaleDateString() : "N/A"}</div>
|
||||
<div className="mt-2 text-base font-bold text-text">{activeDocument.expiresAt ? new Date(activeDocument.expiresAt).toLocaleDateString() : "N/A"}</div>
|
||||
</article>
|
||||
<article className="rounded-[24px] border border-line/70 bg-surface/90 px-3 py-3 shadow-panel">
|
||||
<p className="text-xs font-semibold uppercase tracking-[0.18em] text-muted">Lines</p>
|
||||
<div className="mt-2 text-base font-bold text-text">{document.lineCount}</div>
|
||||
<div className="mt-2 text-base font-bold text-text">{activeDocument.lineCount}</div>
|
||||
</article>
|
||||
<article className="rounded-[24px] border border-line/70 bg-surface/90 px-3 py-3 shadow-panel">
|
||||
<p className="text-xs font-semibold uppercase tracking-[0.18em] text-muted">Subtotal</p>
|
||||
<div className="mt-2 text-base font-bold text-text">${document.subtotal.toFixed(2)}</div>
|
||||
<div className="mt-2 text-base font-bold text-text">${activeDocument.subtotal.toFixed(2)}</div>
|
||||
</article>
|
||||
</section>
|
||||
<div className="grid gap-3 xl:grid-cols-[minmax(0,1.05fr)_minmax(320px,0.95fr)]">
|
||||
@@ -87,22 +168,22 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
<dl className="mt-5 grid gap-3">
|
||||
<div>
|
||||
<dt className="text-xs font-semibold uppercase tracking-[0.18em] text-muted">Account</dt>
|
||||
<dd className="mt-1 text-sm text-text">{document.customerName}</dd>
|
||||
<dd className="mt-1 text-sm text-text">{activeDocument.customerName}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt className="text-xs font-semibold uppercase tracking-[0.18em] text-muted">Email</dt>
|
||||
<dd className="mt-1 text-sm text-text">{document.customerEmail}</dd>
|
||||
<dd className="mt-1 text-sm text-text">{activeDocument.customerEmail}</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</article>
|
||||
<article className="rounded-[28px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
|
||||
<p className="text-xs font-semibold uppercase tracking-[0.24em] text-muted">Notes</p>
|
||||
<p className="mt-3 whitespace-pre-line text-sm leading-6 text-text">{document.notes || "No notes recorded for this document."}</p>
|
||||
<p className="mt-3 whitespace-pre-line text-sm leading-6 text-text">{activeDocument.notes || "No notes recorded for this document."}</p>
|
||||
</article>
|
||||
</div>
|
||||
<section className="rounded-[28px] border border-line/70 bg-surface/90 p-4 shadow-panel 2xl:p-5">
|
||||
<p className="text-xs font-semibold uppercase tracking-[0.24em] text-muted">Line Items</p>
|
||||
{document.lines.length === 0 ? (
|
||||
{activeDocument.lines.length === 0 ? (
|
||||
<div className="mt-6 rounded-3xl border border-dashed border-line/70 bg-page/60 px-4 py-8 text-center text-sm text-muted">
|
||||
No line items have been added yet.
|
||||
</div>
|
||||
@@ -120,7 +201,7 @@ export function SalesDetailPage({ entity }: { entity: SalesDocumentEntity }) {
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-line/70 bg-surface">
|
||||
{document.lines.map((line: SalesDocumentDetailDto["lines"][number]) => (
|
||||
{activeDocument.lines.map((line: SalesDocumentDetailDto["lines"][number]) => (
|
||||
<tr key={line.id}>
|
||||
<td className="px-2 py-2">
|
||||
<div className="font-semibold text-text">{line.itemSku}</div>
|
||||
|
||||
@@ -7,10 +7,12 @@ import { fail, ok } from "../../lib/http.js";
|
||||
import { requirePermissions } from "../../lib/rbac.js";
|
||||
import { inventoryUnitsOfMeasure } from "@mrp/shared/dist/inventory/types.js";
|
||||
import {
|
||||
convertQuoteToSalesOrder,
|
||||
createSalesDocument,
|
||||
getSalesDocumentById,
|
||||
listSalesCustomerOptions,
|
||||
listSalesDocuments,
|
||||
updateSalesDocumentStatus,
|
||||
updateSalesDocument,
|
||||
} from "./service.js";
|
||||
|
||||
@@ -45,6 +47,10 @@ const salesListQuerySchema = z.object({
|
||||
status: z.enum(salesDocumentStatuses).optional(),
|
||||
});
|
||||
|
||||
const salesStatusUpdateSchema = z.object({
|
||||
status: z.enum(salesDocumentStatuses),
|
||||
});
|
||||
|
||||
function getRouteParam(value: unknown) {
|
||||
return typeof value === "string" ? value : null;
|
||||
}
|
||||
@@ -111,6 +117,39 @@ salesRouter.put("/quotes/:quoteId", requirePermissions([permissions.salesWrite])
|
||||
return ok(response, result.document);
|
||||
});
|
||||
|
||||
salesRouter.patch("/quotes/:quoteId/status", requirePermissions([permissions.salesWrite]), async (request, response) => {
|
||||
const quoteId = getRouteParam(request.params.quoteId);
|
||||
if (!quoteId) {
|
||||
return fail(response, 400, "INVALID_INPUT", "Quote id is invalid.");
|
||||
}
|
||||
|
||||
const parsed = salesStatusUpdateSchema.safeParse(request.body);
|
||||
if (!parsed.success) {
|
||||
return fail(response, 400, "INVALID_INPUT", "Quote status payload is invalid.");
|
||||
}
|
||||
|
||||
const result = await updateSalesDocumentStatus("QUOTE", quoteId, parsed.data.status);
|
||||
if (!result.ok) {
|
||||
return fail(response, 400, "INVALID_INPUT", result.reason);
|
||||
}
|
||||
|
||||
return ok(response, result.document);
|
||||
});
|
||||
|
||||
salesRouter.post("/quotes/:quoteId/convert", requirePermissions([permissions.salesWrite]), async (request, response) => {
|
||||
const quoteId = getRouteParam(request.params.quoteId);
|
||||
if (!quoteId) {
|
||||
return fail(response, 400, "INVALID_INPUT", "Quote id is invalid.");
|
||||
}
|
||||
|
||||
const result = await convertQuoteToSalesOrder(quoteId);
|
||||
if (!result.ok) {
|
||||
return fail(response, 400, "INVALID_INPUT", result.reason);
|
||||
}
|
||||
|
||||
return ok(response, result.document, 201);
|
||||
});
|
||||
|
||||
salesRouter.get("/orders", requirePermissions([permissions.salesRead]), async (request, response) => {
|
||||
const parsed = salesListQuerySchema.safeParse(request.query);
|
||||
if (!parsed.success) {
|
||||
@@ -172,3 +211,22 @@ salesRouter.put("/orders/:orderId", requirePermissions([permissions.salesWrite])
|
||||
|
||||
return ok(response, result.document);
|
||||
});
|
||||
|
||||
salesRouter.patch("/orders/:orderId/status", requirePermissions([permissions.salesWrite]), async (request, response) => {
|
||||
const orderId = getRouteParam(request.params.orderId);
|
||||
if (!orderId) {
|
||||
return fail(response, 400, "INVALID_INPUT", "Sales order id is invalid.");
|
||||
}
|
||||
|
||||
const parsed = salesStatusUpdateSchema.safeParse(request.body);
|
||||
if (!parsed.success) {
|
||||
return fail(response, 400, "INVALID_INPUT", "Sales order status payload is invalid.");
|
||||
}
|
||||
|
||||
const result = await updateSalesDocumentStatus("ORDER", orderId, parsed.data.status);
|
||||
if (!result.ok) {
|
||||
return fail(response, 400, "INVALID_INPUT", result.reason);
|
||||
}
|
||||
|
||||
return ok(response, result.document);
|
||||
});
|
||||
|
||||
@@ -329,3 +329,61 @@ export async function updateSalesDocument(type: SalesDocumentType, documentId: s
|
||||
const detail = await getSalesDocumentById(type, documentId);
|
||||
return detail ? { ok: true as const, document: detail } : { ok: false as const, reason: "Unable to load saved document." };
|
||||
}
|
||||
|
||||
export async function updateSalesDocumentStatus(type: SalesDocumentType, documentId: string, status: SalesDocumentStatus) {
|
||||
const existing = await documentConfig[type].findUnique({
|
||||
where: { id: documentId },
|
||||
select: { id: true },
|
||||
});
|
||||
|
||||
if (!existing) {
|
||||
return { ok: false as const, reason: "Sales document was not found." };
|
||||
}
|
||||
|
||||
await documentConfig[type].update({
|
||||
where: { id: documentId },
|
||||
data: { status },
|
||||
select: { id: true },
|
||||
});
|
||||
|
||||
const detail = await getSalesDocumentById(type, documentId);
|
||||
return detail ? { ok: true as const, document: detail } : { ok: false as const, reason: "Unable to load updated document." };
|
||||
}
|
||||
|
||||
export async function convertQuoteToSalesOrder(quoteId: string) {
|
||||
const quote = await documentConfig.QUOTE.findUnique({
|
||||
where: { id: quoteId },
|
||||
include: buildInclude("QUOTE"),
|
||||
});
|
||||
|
||||
if (!quote) {
|
||||
return { ok: false as const, reason: "Quote was not found." };
|
||||
}
|
||||
|
||||
const mappedQuote = mapDocument(quote as SalesDocumentRecord);
|
||||
const nextOrderNumber = await nextDocumentNumber("ORDER");
|
||||
|
||||
const created = await documentConfig.ORDER.create({
|
||||
data: {
|
||||
documentNumber: nextOrderNumber,
|
||||
customerId: mappedQuote.customerId,
|
||||
status: "DRAFT",
|
||||
issueDate: new Date(),
|
||||
notes: mappedQuote.notes ? `Converted from ${mappedQuote.documentNumber}\n\n${mappedQuote.notes}` : `Converted from ${mappedQuote.documentNumber}`,
|
||||
lines: {
|
||||
create: mappedQuote.lines.map((line) => ({
|
||||
itemId: line.itemId,
|
||||
description: line.description,
|
||||
quantity: line.quantity,
|
||||
unitOfMeasure: line.unitOfMeasure,
|
||||
unitPrice: line.unitPrice,
|
||||
position: line.position,
|
||||
})),
|
||||
},
|
||||
},
|
||||
select: { id: true },
|
||||
});
|
||||
|
||||
const order = await getSalesDocumentById("ORDER", created.id);
|
||||
return order ? { ok: true as const, document: order } : { ok: false as const, reason: "Unable to load converted sales order." };
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user