45 lines
1.9 KiB
TypeScript
45 lines
1.9 KiB
TypeScript
// components/RackDetails.tsx
|
|
import React from 'react';
|
|
import {StockRack} from '@/types';
|
|
|
|
interface RackDetailsProps {
|
|
rack: StockRack | null;
|
|
}
|
|
|
|
export default function RackModalDetails({ rack }: RackDetailsProps) {
|
|
return (
|
|
<div className="overflow-auto p-4">
|
|
<div className="flex flex-col space-y-4">
|
|
{rack.shelves?.map((shelf) => (
|
|
<div key={shelf.shelf_symbol} className="flex items-start space-x-4">
|
|
{/* Shelf label */}
|
|
<div className="font-bold">Shelf {shelf.shelf_symbol}</div>
|
|
|
|
{/* Positions container */}
|
|
<div className="flex space-x-4">
|
|
{shelf.positions.map((position) => (
|
|
<div key={position.position_symbol} className="border rounded-lg p-3">
|
|
{/* Position label */}
|
|
<div className="font-semibold mb-2">Pos {position.position_symbol}</div>
|
|
|
|
{/* Sections grid */}
|
|
<div className="grid grid-cols-3 gap-2">
|
|
{position.sections.map((section) => (
|
|
<div
|
|
key={section.section_symbol}
|
|
className="border rounded p-1 text-sm text-center"
|
|
>
|
|
{section.section_symbol}
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|