Tria/edr-platform
1
0
Fork 0
mirror of https://github.com/Tria-plc/edr-platform.git synced 2026-08-27 00:52:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add yard/zone fields and returned containers table

Browse Source 
Add Yard and Zone input fields to standalone return modal. Add table
showing all returned containers with: container number, booking ref,
returned date, facility, yard, condition, status. Table appears at top
of Container Returns page when returns exist.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
Hagernesh
2026-07-31 06:45:03 +00:00
parent 378b9b6b21
commit 74cf80106e
1 changed files with 61 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
apps/edr-freight-web/backoffice/src/pages/warehouses/ContainerReturnsPage.tsx
View File

@@ -69,6 +69,13 @@ export default function ContainerReturnsPage() {
},
});
const { data: returnedContainers = [] } = useQuery({
queryKey: ["empty-container-returns"],
queryFn: async () => {
return await importOperationsService.listEmptyReturns().catch(() => []);
},
});
const bookingIds = unloadedQueue.map((item) => item.bookingId).filter(Boolean) as string[];
const containerReturnsQuery = useQuery({
queryKey: ["container-returns", bookingIds],
@@ -249,6 +256,42 @@ export default function ContainerReturnsPage() {
</Button>
</Group>
{returnedContainers.length > 0 && (
<>
<Text fw={600} mb="xs">Returned Containers</Text>
<Table.ScrollContainer minWidth={1000} mb="lg">
<Table striped highlightOnHover verticalSpacing="xs">
<Table.Thead>
<Table.Tr>
<Table.Th>Container Number</Table.Th>
<Table.Th>Booking Ref</Table.Th>
<Table.Th>Returned Date</Table.Th>
<Table.Th>Facility</Table.Th>
<Table.Th>Yard</Table.Th>
<Table.Th>Condition</Table.Th>
<Table.Th>Status</Table.Th>
</Table.Tr>
</Table.Thead>
<Table.Tbody>
{returnedContainers.map((ret: any) => (
<Table.Tr key={ret.id}>
<Table.Td>{ret.containerNumber}</Table.Td>
<Table.Td>{ret.bookingId ? "Associated" : "—"}</Table.Td>
<Table.Td>{ret.returnDate ? new Date(ret.returnDate).toLocaleDateString() : "—"}</Table.Td>
<Table.Td>{ret.facility || "—"}</Table.Td>
<Table.Td>{ret.yard || "—"}</Table.Td>
<Table.Td>{ret.condition || "—"}</Table.Td>
<Table.Td>
<Badge size="sm">{ret.status}</Badge>
</Table.Td>
</Table.Tr>
))}
</Table.Tbody>
</Table>
</Table.ScrollContainer>
</>
)}
{filteredGroups.length === 0 ? (
<Alert color="gray">No {filterType !== "all" ? filterType : ""} container returns found.</Alert>
) : (
@@ -517,6 +560,8 @@ function StandaloneReturnModal({ opened, onClose, onSubmit, loading }: Standalon
const [containerNumber, setContainerNumber] = useState<string>("");
const [returnDate, setReturnDate] = useState<string>(new Date().toISOString().split("T")[0]);
const [warehouse, setWarehouse] = useState<string | null>(null);
const [yard, setYard] = useState<string>("");
const [zone, setZone] = useState<string>("");
const [condition, setCondition] = useState<string>("");
const [handoverNote, setHandoverNote] = useState<string>("");
@@ -562,6 +607,8 @@ function StandaloneReturnModal({ opened, onClose, onSubmit, loading }: Standalon
setContainerNumber("");
setReturnDate(new Date().toISOString().split("T")[0]);
setWarehouse(null);
setYard("");
setZone("");
setCondition("");
setHandoverNote("");
onClose();
@@ -592,6 +639,20 @@ function StandaloneReturnModal({ opened, onClose, onSubmit, loading }: Standalon
searchable
/>
<TextInput
label="Yard"
placeholder="e.g., Yard A, Main Yard"
value={yard}
onChange={(e) => setYard(e.currentTarget.value)}
/>
<TextInput
label="Zone"
placeholder="e.g., Zone 1, North Zone"
value={zone}
onChange={(e) => setZone(e.currentTarget.value)}
/>
<input
type="date"
value={returnDate}