mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-08-26 18:42:49 +00:00
Merge pull request #1203 from Tria-plc/eims-integration
fix(freight): correct direct CAS lines and sync inventory on schedule…
This commit is contained in:
@@ -92,6 +92,7 @@ interface CarriageAcceptanceWagonRow {
|
|||||||
interface CarriageAcceptanceReceivedRow {
|
interface CarriageAcceptanceReceivedRow {
|
||||||
allocatedWeightTons: string | null;
|
allocatedWeightTons: string | null;
|
||||||
containerNumbers: string | null;
|
containerNumbers: string | null;
|
||||||
|
sealNumbers?: string | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
const URGENT_PRIORITY_THRESHOLD = 1000;
|
const URGENT_PRIORITY_THRESHOLD = 1000;
|
||||||
@@ -291,15 +292,19 @@ export class BookingsService {
|
|||||||
if (pendingWagons) {
|
if (pendingWagons) {
|
||||||
// Direct truck-to-train cargo never enters the warehouse, so there is no
|
// Direct truck-to-train cargo never enters the warehouse, so there is no
|
||||||
// GRN'd inventory to build the sheet from. Choosing direct handover is
|
// GRN'd inventory to build the sheet from. Choosing direct handover is
|
||||||
// itself the acceptance, so the sheet issues off the booking's own
|
// itself the acceptance, so the sheet issues off the containers the
|
||||||
// containers (or its VGM weight when the cargo is bulk).
|
// customer declared on the booking — freight.containers only gains rows at
|
||||||
|
// allocation, by which point the wagon query above already serves.
|
||||||
const receivedLines: CarriageAcceptanceReceivedRow[] = isDirectExport
|
const receivedLines: CarriageAcceptanceReceivedRow[] = isDirectExport
|
||||||
? await this.dataSource.query(
|
? await this.dataSource.query(
|
||||||
`SELECT NULL::numeric AS "allocatedWeightTons",
|
`SELECT NULL::numeric AS "allocatedWeightTons",
|
||||||
c.container_number AS "containerNumbers"
|
unit.container_number AS "containerNumbers",
|
||||||
FROM freight.containers c
|
unit.seal_number AS "sealNumbers"
|
||||||
WHERE c.booking_id = $1 AND c.deleted_at IS NULL
|
FROM freight.booking_container_units unit
|
||||||
ORDER BY c.container_number`,
|
JOIN freight.booking_container line
|
||||||
|
ON line.id = unit.booking_container_id AND line.deleted_at IS NULL
|
||||||
|
WHERE line.booking_id = $1 AND unit.deleted_at IS NULL
|
||||||
|
ORDER BY unit.container_number`,
|
||||||
[bookingId],
|
[bookingId],
|
||||||
)
|
)
|
||||||
: booking.tradeDirection === 'EXPORT'
|
: booking.tradeDirection === 'EXPORT'
|
||||||
@@ -319,11 +324,13 @@ export class BookingsService {
|
|||||||
)
|
)
|
||||||
: [];
|
: [];
|
||||||
// Bulk direct cargo has no containers — one line carrying the booking's
|
// Bulk direct cargo has no containers — one line carrying the booking's
|
||||||
// declared weight still makes a valid sheet.
|
// declared weight still makes a valid sheet. bulkTotalWeightTons only
|
||||||
|
// holds the real tonnage for PER_ITEM break-bulk; everywhere else (PER_TON
|
||||||
|
// bulk and every container booking) the VGM column is the weight.
|
||||||
if (isDirectExport && receivedLines.length === 0) {
|
if (isDirectExport && receivedLines.length === 0) {
|
||||||
|
const totalWeight = booking.bulkTotalWeightTons ?? booking.cargoTotalWeightVgm;
|
||||||
receivedLines.push({
|
receivedLines.push({
|
||||||
allocatedWeightTons:
|
allocatedWeightTons: totalWeight == null ? null : String(totalWeight),
|
||||||
booking.bulkTotalWeightTons == null ? null : String(booking.bulkTotalWeightTons),
|
|
||||||
containerNumbers: null,
|
containerNumbers: null,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -347,7 +354,7 @@ export class BookingsService {
|
|||||||
marshalledAt: null,
|
marshalledAt: null,
|
||||||
arrivalAt: null,
|
arrivalAt: null,
|
||||||
containerNumbers: row.containerNumbers,
|
containerNumbers: row.containerNumbers,
|
||||||
sealNumbers: null,
|
sealNumbers: row.sealNumbers ?? null,
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -95,6 +95,20 @@ export class BookingJourneyService {
|
|||||||
await manager
|
await manager
|
||||||
.getRepository(TrainScheduleBooking)
|
.getRepository(TrainScheduleBooking)
|
||||||
.update({ trainScheduleId: scheduleId, bookingId }, { loadingStatus: 'LOADED' });
|
.update({ trainScheduleId: scheduleId, bookingId }, { loadingStatus: 'LOADED' });
|
||||||
|
// Warehouse cargo may be loaded either from the warehouse Load-to-Train
|
||||||
|
// queue or from the schedule itself. Loading here must move its inventory
|
||||||
|
// too, otherwise the goods read as still sitting in the shed while the
|
||||||
|
// train leaves with them. No-ops for direct truck-to-train (no inventory).
|
||||||
|
// ponytail: no WarehouseLoading record on this path — those are only read
|
||||||
|
// back as per-inventory loading history, never billed. Create them here if
|
||||||
|
// that history ever has to be complete.
|
||||||
|
await manager.query(
|
||||||
|
`UPDATE freight.warehouse_inventory
|
||||||
|
SET status = 'LOADED', loaded_at = COALESCE(loaded_at, $2), updated_at = NOW()
|
||||||
|
WHERE booking_id = $1 AND deleted_at IS NULL
|
||||||
|
AND status NOT IN ('LOADED', 'DISPATCHED')`,
|
||||||
|
[bookingId, now],
|
||||||
|
);
|
||||||
// The facility handed the cargo over — raise its GRN. No-ops for yards
|
// The facility handed the cargo over — raise its GRN. No-ops for yards
|
||||||
// without a facility (import/export terminals), which keep their own flow.
|
// without a facility (import/export terminals), which keep their own flow.
|
||||||
await this.facilityHandling.recordHandling(manager, {
|
await this.facilityHandling.recordHandling(manager, {
|
||||||
|
|||||||
@@ -92,7 +92,6 @@ import TrainDetailPage from "./pages/trains/TrainDetailPage";
|
|||||||
import TrainBuilderDetailPage from "./pages/trainBuilder/TrainBuilderDetailPage";
|
import TrainBuilderDetailPage from "./pages/trainBuilder/TrainBuilderDetailPage";
|
||||||
import TrainBuilderListPage from "./pages/trainBuilder/TrainBuilderListPage";
|
import TrainBuilderListPage from "./pages/trainBuilder/TrainBuilderListPage";
|
||||||
import ArrivalQueuePage from "./pages/warehouses/ArrivalQueuePage";
|
import ArrivalQueuePage from "./pages/warehouses/ArrivalQueuePage";
|
||||||
import EDRLastMileReturnsPage from "./pages/warehouses/EDRLastMileReturnsPage";
|
|
||||||
import ContainerReturnsPage from "./pages/warehouses/ContainerReturnsPage";
|
import ContainerReturnsPage from "./pages/warehouses/ContainerReturnsPage";
|
||||||
import DispatchQueuePage from "./pages/warehouses/DispatchQueuePage";
|
import DispatchQueuePage from "./pages/warehouses/DispatchQueuePage";
|
||||||
import ExportDjiboutiUnloadingQueuePage from "./pages/warehouses/ExportDjiboutiUnloadingQueuePage";
|
import ExportDjiboutiUnloadingQueuePage from "./pages/warehouses/ExportDjiboutiUnloadingQueuePage";
|
||||||
@@ -506,7 +505,6 @@ const App = () => {
|
|||||||
<Route path="intercity" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><IntercityPage /></RequirePermission>} />
|
<Route path="intercity" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><IntercityPage /></RequirePermission>} />
|
||||||
<Route path="trucks-on-site" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><TrucksOnSitePage /></RequirePermission>} />
|
<Route path="trucks-on-site" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><TrucksOnSitePage /></RequirePermission>} />
|
||||||
<Route path="import-trucks" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><ImportTrucksPage /></RequirePermission>} />
|
<Route path="import-trucks" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><ImportTrucksPage /></RequirePermission>} />
|
||||||
<Route path="edr-last-mile-returns" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><EDRLastMileReturnsPage /></RequirePermission>} />
|
|
||||||
<Route path="container-returns" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><ContainerReturnsPage /></RequirePermission>} />
|
<Route path="container-returns" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><ContainerReturnsPage /></RequirePermission>} />
|
||||||
<Route path="loaded-inventory" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><LoadedInventoryPage /></RequirePermission>} />
|
<Route path="loaded-inventory" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><LoadedInventoryPage /></RequirePermission>} />
|
||||||
<Route path="dispatch-queue" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><DispatchQueuePage /></RequirePermission>} />
|
<Route path="dispatch-queue" element={<RequirePermission permission={FREIGHT_PERMS.warehouseInventory.view}><DispatchQueuePage /></RequirePermission>} />
|
||||||
|
|||||||
@@ -344,12 +344,6 @@ export const buildSidebarSections = (demoItems: SidebarItem[]): SidebarSection[]
|
|||||||
icon: <Truck />,
|
icon: <Truck />,
|
||||||
permission: FREIGHT_PERMS.warehouseInventory.view,
|
permission: FREIGHT_PERMS.warehouseInventory.view,
|
||||||
},
|
},
|
||||||
{
|
|
||||||
label: "EDR Last Mile Returns",
|
|
||||||
href: "/dashboard/edr-last-mile-returns",
|
|
||||||
icon: <Container />,
|
|
||||||
permission: FREIGHT_PERMS.warehouseInventory.view,
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "Container Returns",
|
label: "Container Returns",
|
||||||
href: "/dashboard/container-returns",
|
href: "/dashboard/container-returns",
|
||||||
|
|||||||
@@ -1,406 +0,0 @@
|
|||||||
import { Fragment, useMemo, useState } from "react";
|
|
||||||
import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
|
|
||||||
import {
|
|
||||||
ActionIcon,
|
|
||||||
Alert,
|
|
||||||
Badge,
|
|
||||||
Button,
|
|
||||||
Group,
|
|
||||||
Loader,
|
|
||||||
Modal,
|
|
||||||
Stack,
|
|
||||||
Table,
|
|
||||||
Text,
|
|
||||||
TextInput,
|
|
||||||
Textarea,
|
|
||||||
Select,
|
|
||||||
Checkbox,
|
|
||||||
} from "@mantine/core";
|
|
||||||
import { ChevronDown, ChevronRight } from "lucide-react";
|
|
||||||
|
|
||||||
import { PageContainer, PageHeader } from "@/components/page";
|
|
||||||
import RuleEngineListFooter from "@/components/ruleEngine/RuleEngineListFooter";
|
|
||||||
import { useListControls } from "@/hooks/useListControls";
|
|
||||||
import { useToast } from "@/hooks/use-toast";
|
|
||||||
import { api } from "@/services/api";
|
|
||||||
import { warehouseService } from "@/services/warehouse.service";
|
|
||||||
import { importOperationsService } from "@/services/importOperations.service";
|
|
||||||
|
|
||||||
interface ReturnContainer {
|
|
||||||
containerNumber: string;
|
|
||||||
size: string | null;
|
|
||||||
type: string | null;
|
|
||||||
selected: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
interface TruckReturn {
|
|
||||||
key: string;
|
|
||||||
plate: string;
|
|
||||||
companyName: string | null;
|
|
||||||
bookingRef: string;
|
|
||||||
bookingId: string;
|
|
||||||
customerId: string | null;
|
|
||||||
containers: ReturnContainer[];
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
export default function EDRLastMileReturnsPage() {
|
|
||||||
const { toast } = useToast();
|
|
||||||
const qc = useQueryClient();
|
|
||||||
const [expanded, setExpanded] = useState<string | null>(null);
|
|
||||||
const [returnModalOpen, setReturnModalOpen] = useState(false);
|
|
||||||
const [activeKey, setActiveKey] = useState<string | null>(null);
|
|
||||||
|
|
||||||
const { data: unloadedQueue = [], isLoading: queueLoading } = useQuery({
|
|
||||||
queryKey: ["import-unloaded-queue"],
|
|
||||||
queryFn: async () => {
|
|
||||||
const response = await api.warehouses.importUnloadedQueue.call();
|
|
||||||
return response ?? [];
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const bookingIds = unloadedQueue.map((item) => item.bookingId).filter(Boolean) as string[];
|
|
||||||
const truckReturnsQuery = useQuery({
|
|
||||||
queryKey: ["edr-last-mile-returns", bookingIds],
|
|
||||||
queryFn: async () => {
|
|
||||||
const grouped = new Map<string, TruckReturn>();
|
|
||||||
|
|
||||||
for (const item of unloadedQueue) {
|
|
||||||
if (!item.bookingId) continue;
|
|
||||||
|
|
||||||
const edrTrucks = await warehouseService.getLastMileTrucks(item.bookingId).catch(() => []);
|
|
||||||
for (const truck of edrTrucks) {
|
|
||||||
const inventory = await api.warehouses.listInventory.call({ filter: { bookingId: item.bookingId } }).catch(() => []);
|
|
||||||
|
|
||||||
const returnContainers = inventory
|
|
||||||
.filter((inv: any) => inv.isReturn)
|
|
||||||
.map((inv: any) => ({
|
|
||||||
containerNumber: inv.containerNumber || "—",
|
|
||||||
size: inv.containerSize || null,
|
|
||||||
type: inv.containerType || null,
|
|
||||||
selected: false,
|
|
||||||
}));
|
|
||||||
|
|
||||||
if (returnContainers.length > 0) {
|
|
||||||
const key = `${item.bookingId}-${truck.vehicleId}`;
|
|
||||||
grouped.set(key, {
|
|
||||||
key,
|
|
||||||
plate: [truck.truckPlateNumber, truck.trailerPlateNumber].filter(Boolean).join(" + ") || "—",
|
|
||||||
companyName: item.customerName ?? null,
|
|
||||||
bookingRef: item.bookingReference ?? item.bookingId,
|
|
||||||
bookingId: item.bookingId,
|
|
||||||
customerId: item.customerId || null,
|
|
||||||
containers: returnContainers,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return Array.from(grouped.values());
|
|
||||||
},
|
|
||||||
enabled: bookingIds.length > 0 && !queueLoading,
|
|
||||||
});
|
|
||||||
|
|
||||||
const trucksWithReturns = useMemo(() => truckReturnsQuery.data ?? [], [truckReturnsQuery.data]);
|
|
||||||
const controls = useListControls(trucksWithReturns, {
|
|
||||||
searchKeys: ["plate", "companyName", "bookingRef"],
|
|
||||||
});
|
|
||||||
|
|
||||||
const createReturnsMutation = useMutation({
|
|
||||||
mutationFn: async (payload: { trucks: Array<{ bookingId: string; customerId: string | null; containers: Array<{ containerNumber: string; returnDate: string; facility: string; yard?: string; zone?: string; condition?: string; handoverNote?: string }> }> }) => {
|
|
||||||
const results = [];
|
|
||||||
for (const truck of payload.trucks) {
|
|
||||||
for (const container of truck.containers) {
|
|
||||||
const result = await importOperationsService.createEmptyReturn({
|
|
||||||
containerNumber: container.containerNumber,
|
|
||||||
returnDate: new Date(container.returnDate).toISOString(),
|
|
||||||
bookingId: truck.bookingId,
|
|
||||||
customerId: truck.customerId ?? undefined,
|
|
||||||
facility: container.facility,
|
|
||||||
yard: container.yard,
|
|
||||||
zone: container.zone,
|
|
||||||
condition: container.condition,
|
|
||||||
handoverNote: container.handoverNote,
|
|
||||||
});
|
|
||||||
results.push(result);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return results;
|
|
||||||
},
|
|
||||||
onSuccess: () => {
|
|
||||||
toast({ title: "Empty container returns recorded" });
|
|
||||||
qc.invalidateQueries({ queryKey: ["edr-last-mile-returns", bookingIds] });
|
|
||||||
setReturnModalOpen(false);
|
|
||||||
setActiveKey(null);
|
|
||||||
},
|
|
||||||
onError: (error: any) => {
|
|
||||||
toast({
|
|
||||||
variant: "destructive",
|
|
||||||
title: "Failed to record returns",
|
|
||||||
description: error?.response?.data?.message || error?.message,
|
|
||||||
});
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const activeTruck = activeKey ? trucksWithReturns.find(t => t.key === activeKey) ?? null : null;
|
|
||||||
|
|
||||||
if (queueLoading || truckReturnsQuery.isLoading) {
|
|
||||||
return (
|
|
||||||
<PageContainer>
|
|
||||||
<Group justify="center" py="lg">
|
|
||||||
<Loader size="sm" />
|
|
||||||
</Group>
|
|
||||||
</PageContainer>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContainer>
|
|
||||||
<PageHeader
|
|
||||||
title="EDR Last Mile Returns"
|
|
||||||
subtitle="Empty containers returned by EDR-haulage trucks — single or bulk processing"
|
|
||||||
/>
|
|
||||||
|
|
||||||
{trucksWithReturns.length === 0 ? (
|
|
||||||
<Alert color="gray">No EDR trucks with return containers found.</Alert>
|
|
||||||
) : (
|
|
||||||
<>
|
|
||||||
<Table.ScrollContainer minWidth={1000}>
|
|
||||||
<Table highlightOnHover verticalSpacing="xs">
|
|
||||||
<Table.Thead>
|
|
||||||
<Table.Tr>
|
|
||||||
<Table.Th w={40} />
|
|
||||||
<Table.Th>Plate</Table.Th>
|
|
||||||
<Table.Th>Company</Table.Th>
|
|
||||||
<Table.Th>Booking Ref</Table.Th>
|
|
||||||
<Table.Th>Return Containers</Table.Th>
|
|
||||||
<Table.Th ta="right">Actions</Table.Th>
|
|
||||||
</Table.Tr>
|
|
||||||
</Table.Thead>
|
|
||||||
<Table.Tbody>
|
|
||||||
{controls.pagedRows.map((truck) => {
|
|
||||||
const isOpen = expanded === truck.key;
|
|
||||||
return (
|
|
||||||
<Fragment key={truck.key}>
|
|
||||||
<Table.Tr>
|
|
||||||
<Table.Td>
|
|
||||||
<ActionIcon
|
|
||||||
variant="subtle"
|
|
||||||
color="gray"
|
|
||||||
onClick={() => setExpanded(isOpen ? null : truck.key)}
|
|
||||||
>
|
|
||||||
{isOpen ? <ChevronDown size={14} /> : <ChevronRight size={14} />}
|
|
||||||
</ActionIcon>
|
|
||||||
</Table.Td>
|
|
||||||
<Table.Td>
|
|
||||||
<Text fw={600}>{truck.plate}</Text>
|
|
||||||
</Table.Td>
|
|
||||||
<Table.Td>{truck.companyName ?? "—"}</Table.Td>
|
|
||||||
<Table.Td>{truck.bookingRef}</Table.Td>
|
|
||||||
<Table.Td>
|
|
||||||
<Badge>{truck.containers.length} container{truck.containers.length !== 1 ? "s" : ""}</Badge>
|
|
||||||
</Table.Td>
|
|
||||||
<Table.Td ta="right">
|
|
||||||
<Button
|
|
||||||
size="xs"
|
|
||||||
variant="light"
|
|
||||||
onClick={() => {
|
|
||||||
setActiveKey(truck.key);
|
|
||||||
setReturnModalOpen(true);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Process Returns
|
|
||||||
</Button>
|
|
||||||
</Table.Td>
|
|
||||||
</Table.Tr>
|
|
||||||
{isOpen && (
|
|
||||||
<Table.Tr>
|
|
||||||
<Table.Td colSpan={6}>
|
|
||||||
<Table striped>
|
|
||||||
<Table.Thead>
|
|
||||||
<Table.Tr>
|
|
||||||
<Table.Th w={40}>
|
|
||||||
<Checkbox disabled />
|
|
||||||
</Table.Th>
|
|
||||||
<Table.Th>Container</Table.Th>
|
|
||||||
<Table.Th>Size</Table.Th>
|
|
||||||
<Table.Th>Type</Table.Th>
|
|
||||||
</Table.Tr>
|
|
||||||
</Table.Thead>
|
|
||||||
<Table.Tbody>
|
|
||||||
{truck.containers.map((container, idx) => (
|
|
||||||
<Table.Tr key={idx}>
|
|
||||||
<Table.Td>
|
|
||||||
<Checkbox checked={container.selected} />
|
|
||||||
</Table.Td>
|
|
||||||
<Table.Td>{container.containerNumber}</Table.Td>
|
|
||||||
<Table.Td>{container.size ?? "—"}</Table.Td>
|
|
||||||
<Table.Td>{container.type ?? "—"}</Table.Td>
|
|
||||||
</Table.Tr>
|
|
||||||
))}
|
|
||||||
</Table.Tbody>
|
|
||||||
</Table>
|
|
||||||
</Table.Td>
|
|
||||||
</Table.Tr>
|
|
||||||
)}
|
|
||||||
</Fragment>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</Table.Tbody>
|
|
||||||
</Table>
|
|
||||||
</Table.ScrollContainer>
|
|
||||||
<RuleEngineListFooter
|
|
||||||
pagination={controls.pagination}
|
|
||||||
pageCount={controls.pageCount}
|
|
||||||
totalCount={controls.totalCount}
|
|
||||||
itemLabel="trucks"
|
|
||||||
onPaginationChange={controls.setPagination}
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<EmptyContainerReturnModal
|
|
||||||
opened={returnModalOpen}
|
|
||||||
onClose={() => setReturnModalOpen(false)}
|
|
||||||
truck={activeTruck}
|
|
||||||
onSubmit={(payload) => createReturnsMutation.mutate(payload)}
|
|
||||||
loading={createReturnsMutation.isPending}
|
|
||||||
/>
|
|
||||||
</PageContainer>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
interface EmptyContainerReturnModalProps {
|
|
||||||
opened: boolean;
|
|
||||||
onClose: () => void;
|
|
||||||
truck: TruckReturn | null;
|
|
||||||
onSubmit: (payload: any) => void;
|
|
||||||
loading: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
function EmptyContainerReturnModal({ opened, onClose, truck, onSubmit, loading }: EmptyContainerReturnModalProps) {
|
|
||||||
const [selectedContainers, setSelectedContainers] = useState<string[]>([]);
|
|
||||||
const [returnDate, setReturnDate] = useState<string>(new Date().toISOString().split("T")[0]);
|
|
||||||
const [warehouse, setWarehouse] = useState<string | null>(null);
|
|
||||||
const [condition, setCondition] = useState<string>("");
|
|
||||||
const [handoverNote, setHandoverNote] = useState<string>("");
|
|
||||||
|
|
||||||
const { data: warehousesResponse } = useQuery({
|
|
||||||
queryKey: ["warehouses-list"],
|
|
||||||
queryFn: async () => {
|
|
||||||
return await warehouseService.list({});
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const warehouses = (warehousesResponse as any)?.data ?? warehousesResponse ?? [];
|
|
||||||
const warehouseOptions = Array.isArray(warehouses) ? warehouses.map((wh: any) => ({
|
|
||||||
value: wh.id,
|
|
||||||
label: `${wh.name} ${wh.code ? `(${wh.code})` : ""}`,
|
|
||||||
})) : [];
|
|
||||||
|
|
||||||
const selectedWarehouse = warehouse && Array.isArray(warehouses) ? warehouses.find((wh: any) => wh.id === warehouse) : null;
|
|
||||||
|
|
||||||
const handleSubmit = () => {
|
|
||||||
if (!truck || !selectedContainers.length || !warehouse) return;
|
|
||||||
|
|
||||||
const containers = truck.containers
|
|
||||||
.filter((c) => selectedContainers.includes(c.containerNumber))
|
|
||||||
.map((c) => ({
|
|
||||||
containerNumber: c.containerNumber,
|
|
||||||
returnDate,
|
|
||||||
facility: selectedWarehouse?.name || warehouse,
|
|
||||||
yard: selectedWarehouse?.code || undefined,
|
|
||||||
zone: undefined,
|
|
||||||
condition: condition || undefined,
|
|
||||||
handoverNote: handoverNote || undefined,
|
|
||||||
}));
|
|
||||||
|
|
||||||
onSubmit({
|
|
||||||
trucks: [{
|
|
||||||
bookingId: truck.bookingId,
|
|
||||||
customerId: truck.customerId,
|
|
||||||
containers,
|
|
||||||
}],
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Modal opened={opened} onClose={onClose} title="Process Empty Container Returns" size="lg">
|
|
||||||
{truck && (
|
|
||||||
<Stack gap="md">
|
|
||||||
<Group>
|
|
||||||
<Text fw={600}>{truck.plate}</Text>
|
|
||||||
<Text size="sm" c="dimmed">{truck.bookingRef}</Text>
|
|
||||||
</Group>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<Text size="sm" fw={600} mb="xs">Select containers to return:</Text>
|
|
||||||
<Stack gap="xs">
|
|
||||||
{truck.containers.map((container) => (
|
|
||||||
<Checkbox
|
|
||||||
key={container.containerNumber}
|
|
||||||
label={`${container.containerNumber} (${container.size || "bulk"})`}
|
|
||||||
checked={selectedContainers.includes(container.containerNumber)}
|
|
||||||
onChange={(e) => {
|
|
||||||
if (e.currentTarget.checked) {
|
|
||||||
setSelectedContainers([...selectedContainers, container.containerNumber]);
|
|
||||||
} else {
|
|
||||||
setSelectedContainers(selectedContainers.filter(c => c !== container.containerNumber));
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
</Stack>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<Select
|
|
||||||
label="Return Warehouse"
|
|
||||||
placeholder="Select warehouse for container return"
|
|
||||||
value={warehouse}
|
|
||||||
onChange={setWarehouse}
|
|
||||||
data={warehouseOptions}
|
|
||||||
required
|
|
||||||
searchable
|
|
||||||
/>
|
|
||||||
|
|
||||||
<TextInput
|
|
||||||
label="Return Date"
|
|
||||||
type="date"
|
|
||||||
value={returnDate}
|
|
||||||
onChange={(e) => setReturnDate(e.currentTarget.value)}
|
|
||||||
required
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Textarea
|
|
||||||
label="Condition"
|
|
||||||
placeholder="Damage, residue, or cleanliness notes"
|
|
||||||
value={condition}
|
|
||||||
onChange={(e) => setCondition(e.currentTarget.value)}
|
|
||||||
rows={3}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Textarea
|
|
||||||
label="Handover Note"
|
|
||||||
placeholder="Consignee, trucker, or authorization notes"
|
|
||||||
value={handoverNote}
|
|
||||||
onChange={(e) => setHandoverNote(e.currentTarget.value)}
|
|
||||||
rows={3}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Group justify="flex-end" gap="sm">
|
|
||||||
<Button variant="default" onClick={onClose} disabled={loading}>
|
|
||||||
Cancel
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
onClick={handleSubmit}
|
|
||||||
disabled={!selectedContainers.length || !warehouse}
|
|
||||||
loading={loading}
|
|
||||||
>
|
|
||||||
{selectedContainers.length > 1 ? "Bulk" : "Single"} Return ({selectedContainers.length})
|
|
||||||
</Button>
|
|
||||||
</Group>
|
|
||||||
</Stack>
|
|
||||||
)}
|
|
||||||
</Modal>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user