166419134f
- Updated import paths for various components to align with new directory structure. - Changed imports from 'row-actions', 'confirm-dialog', 'image-preview-button', and 'file-upload' to their respective new locations in 'data-display', 'dialogs', and 'inputs'. - Adjusted imports in multiple pages including purchase, restock, transaction, category, customer, product, raw-material, supplier, roles, and settings. - Ensured all relevant components are imported from their new locations to maintain functionality.
151 lines
7.4 KiB
TypeScript
151 lines
7.4 KiB
TypeScript
import { Fragment } from 'react';
|
|
import { ImagePreviewButton } from '@/components/dialogs';
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from '@/components/ui/table';
|
|
import { formatNumber } from '@/lib/format';
|
|
import { formatCurrency } from '@/lib/utils';
|
|
import type { Restock } from './columns';
|
|
|
|
export function RestockItemSubRow({ restock }: { restock: Restock }) {
|
|
const items = restock.restock_items ?? [];
|
|
|
|
const groupedByProduct = items.reduce(
|
|
(acc, item) => {
|
|
const name = item.product_variant?.product?.name ?? 'Tanpa Produk';
|
|
|
|
if (!acc[name]) {
|
|
acc[name] = [];
|
|
}
|
|
|
|
acc[name].push(item);
|
|
|
|
return acc;
|
|
},
|
|
{} as Record<string, typeof items>,
|
|
);
|
|
|
|
let counter = 0;
|
|
|
|
return (
|
|
<div className="overflow-x-auto">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead className="w-[50px] text-center">
|
|
No
|
|
</TableHead>
|
|
<TableHead className="w-[60px]">Foto</TableHead>
|
|
<TableHead>Varian</TableHead>
|
|
<TableHead className="text-right">
|
|
Harga Modal
|
|
</TableHead>
|
|
<TableHead className="text-center">Qty</TableHead>
|
|
<TableHead className="text-right">Subtotal</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{items.length === 0 ? (
|
|
<TableRow>
|
|
<TableCell
|
|
colSpan={6}
|
|
className="text-center text-muted-foreground"
|
|
>
|
|
Tidak ada item.
|
|
</TableCell>
|
|
</TableRow>
|
|
) : (
|
|
Object.entries(groupedByProduct).map(
|
|
([productName, groupItems]) => {
|
|
const totalQty = groupItems.reduce(
|
|
(sum, item) => sum + (item.quantity ?? 0),
|
|
0,
|
|
);
|
|
const totalSubtotal = groupItems.reduce(
|
|
(sum, item) => sum + (item.subtotal ?? 0),
|
|
0,
|
|
);
|
|
|
|
return (
|
|
<Fragment key={productName}>
|
|
<TableRow>
|
|
<TableCell
|
|
colSpan={4}
|
|
className="font-medium text-muted-foreground bg-muted/20"
|
|
>
|
|
{productName}
|
|
</TableCell>
|
|
<TableCell className="text-center font-medium text-muted-foreground bg-muted/20">
|
|
{formatNumber(totalQty)}
|
|
</TableCell>
|
|
<TableCell className="text-right font-medium text-muted-foreground bg-muted/20">
|
|
{formatCurrency(totalSubtotal)}
|
|
</TableCell>
|
|
</TableRow>
|
|
{groupItems.map((item) => {
|
|
counter++;
|
|
|
|
return (
|
|
<TableRow key={item.id}>
|
|
<TableCell className="text-center">
|
|
{counter}
|
|
</TableCell>
|
|
<TableCell>
|
|
{item.product_variant
|
|
?.photo_url ? (
|
|
<ImagePreviewButton
|
|
srcs={[
|
|
item
|
|
.product_variant
|
|
.photo_url,
|
|
]}
|
|
title={
|
|
item
|
|
.product_variant
|
|
.name
|
|
}
|
|
/>
|
|
) : (
|
|
<div className="flex h-10 w-10 items-center justify-center rounded-md bg-muted text-xs text-muted-foreground">
|
|
N/A
|
|
</div>
|
|
)}
|
|
</TableCell>
|
|
<TableCell>
|
|
{item.product_variant
|
|
?.name ?? '-'}
|
|
</TableCell>
|
|
<TableCell className="text-right">
|
|
{formatCurrency(
|
|
item.unit_price,
|
|
)}
|
|
</TableCell>
|
|
<TableCell className="text-center">
|
|
{formatNumber(
|
|
item.quantity,
|
|
)}
|
|
</TableCell>
|
|
<TableCell className="text-right font-medium">
|
|
{formatCurrency(
|
|
item.subtotal,
|
|
)}
|
|
</TableCell>
|
|
</TableRow>
|
|
);
|
|
})}
|
|
</Fragment>
|
|
);
|
|
},
|
|
)
|
|
)}
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
);
|
|
}
|