feat: improving stok-opname form component interactions

This commit is contained in:
Yoga Pangestu 2026-06-29 10:41:06 +07:00
parent 69762c6539
commit 2c58c3da5e
3 changed files with 19 additions and 21 deletions

View File

@ -56,9 +56,6 @@ function submitForVerification() {
<div class="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
<div class="space-y-1">
<h2 class="text-2xl font-bold tracking-tight">Stok Opname</h2>
<p class="text-muted-foreground text-sm">
Hitung stok fisik gudang dan bandingkan dengan stok sistem
</p>
</div>
<div class="flex items-center gap-3">

View File

@ -18,18 +18,14 @@ const notes = defineModel<string>('notes', { required: true });
<CardTitle>Informasi Dasar</CardTitle>
</CardHeader>
<CardContent class="space-y-4">
<div class="grid gap-4 sm:grid-cols-2">
<div class="space-y-2">
<Label for="opname_date">Tanggal Opname</Label>
<DatePicker
id="opname_date"
v-model="opnameDate"
placeholder="Pilih tanggal opname"
/>
</div>
</div>
<div class="space-y-2">
<Label for="opname_date">Tanggal Opname</Label>
<DatePicker
id="opname_date"
v-model="opnameDate"
placeholder="Pilih tanggal opname"
/>
<Label for="notes">Catatan</Label>
<Textarea
id="notes"
@ -39,7 +35,10 @@ const notes = defineModel<string>('notes', { required: true });
/>
</div>
<div v-if="verificationNotes" class="rounded-lg border bg-muted/50 p-4">
<div
v-if="verificationNotes"
class="rounded-lg border bg-muted/50 p-4"
>
<Label class="text-sm font-medium">Catatan Verifikasi</Label>
<p class="mt-1 text-sm">{{ verificationNotes }}</p>
</div>

View File

@ -1,4 +1,5 @@
<script setup lang="ts">
import { NumberInput } from '@/components/form/number-input';
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Input } from '@/components/ui/input';
import { groupedTableRowNumber } from '@/lib/grouped-table';
@ -56,19 +57,20 @@ const emit = defineEmits<{
class="border-b transition-colors last:border-b-0 hover:bg-muted/30"
>
<td class="text-muted-foreground p-3 text-center">
{{ groupedTableRowNumber(group.startIndex, rIdx) }}
{{ groupedTableRowNumber(group.startIndex + 1, rIdx) }}
</td>
<td class="p-3">{{ row.variant_name }}</td>
<td class="p-3 text-right tabular-nums">
{{ row.system_stock_formatted ?? row.system_stock }}
</td>
<td class="p-3 text-right">
<Input
v-model.number="row.physical_stock"
type="number"
min="0"
<NumberInput
:model-value="row.physical_stock"
class="ml-auto w-24 text-right tabular-nums"
@input="emit('row-change')"
@update:model-value="val => {
row.physical_stock = val === '' ? 0 : Number(val);
emit('row-change');
}"
/>
</td>
<td class="p-3 text-right tabular-nums">