dstpabuaran.com/resources/js/pages/admin/manage/restock/restock-sub-row.tsx
Yoga Pangestu d91ec8869e refactor: replace tooltip buttons with row actions component in supplier and role columns
feat: implement delete confirmation dialog component for better UX

refactor: update supplier and role index pages to utilize new form dialog and delete confirm dialog components

feat: add reusable form dialog component for creating and editing entities

feat: introduce filter popover component for enhanced filtering options in data tables

feat: create image preview button component for displaying images with modal preview

feat: add page header component for consistent page layout

feat: implement row actions component for handling actions on table rows

feat: add status badge component for displaying entity statuses

feat: create toggle status component for easily toggling entity states

feat: implement draft save hook for auto-saving form data

feat: add server table hook for managing server-side pagination and filtering

feat: create utility functions for formatting dates and numbers

feat: add constants for month names and measurement units
2026-08-02 23:40:12 +07:00

88 lines
3.8 KiB
TypeScript

import { ImagePreviewButton } from '@/components/image-preview-button';
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 ?? [];
return (
<div className="space-y-4 overflow-x-auto">
<Table>
<TableHeader>
<TableRow>
<TableHead className="w-[50px] text-center">
No
</TableHead>
<TableHead className="w-[60px]">Foto</TableHead>
<TableHead>Produk</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={7}
className="text-center text-muted-foreground"
>
Tidak ada item.
</TableCell>
</TableRow>
) : (
items.map((item, index) => (
<TableRow key={item.id}>
<TableCell className="text-center">
{index + 1}
</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?.product?.name ?? '-'}
</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>
))
)}
</TableBody>
</Table>
</div>
);
}