From 65054a115d22af3d131f6b393f2046ba9d61488c Mon Sep 17 00:00:00 2001
From: Yoga Pangestu <ypangestu976@gmail.com>
Date: Mon, 29 Jun 2026 00:16:38 +0700
Subject: [PATCH] feat: add CuttingRejectDialog and CuttingVerifyDialog
 components for enhanced cutting status management and verification processes

---
 .../cuttings/table/CuttingRejectDialog.vue    |  92 ++++++
 .../cuttings/table/CuttingVerifyDialog.vue    | 257 +++++++++++++++
 .../cuttings/table/data-table-actions.vue     | 312 +-----------------
 .../manage/stocks/table/StockVerifyDialog.vue | 252 ++++++++++++++
 .../stocks/table/data-table-actions.vue       | 244 +-------------
 5 files changed, 612 insertions(+), 545 deletions(-)
 create mode 100644 resources/js/pages/admin/manage/cuttings/table/CuttingRejectDialog.vue
 create mode 100644 resources/js/pages/admin/manage/cuttings/table/CuttingVerifyDialog.vue
 create mode 100644 resources/js/pages/admin/manage/stocks/table/StockVerifyDialog.vue

diff --git a/resources/js/pages/admin/manage/cuttings/table/CuttingRejectDialog.vue b/resources/js/pages/admin/manage/cuttings/table/CuttingRejectDialog.vue
new file mode 100644
index 0000000..d9852f6
--- /dev/null
+++ b/resources/js/pages/admin/manage/cuttings/table/CuttingRejectDialog.vue
@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import { useForm } from '@inertiajs/vue3';
+import { watch } from 'vue';
+import { toast } from 'vue-sonner';
+import { Button } from '@/components/ui/button';
+import {
+    Dialog,
+    DialogContent,
+    DialogFooter,
+    DialogHeader,
+    DialogTitle,
+} from '@/components/ui/dialog';
+import {
+    Field,
+    FieldError,
+    FieldGroup,
+    FieldLabel,
+    FieldSet,
+} from '@/components/ui/field';
+import { Textarea } from '@/components/ui/textarea';
+import { CuttingStatus } from '@/constants/cutting-status';
+import { FIELD_LIMITS } from '@/lib/field-limits';
+import { transition_status } from '@/routes/admin/manage/cuttings';
+
+const props = defineProps<{
+    cuttingId: number;
+}>();
+
+const open = defineModel<boolean>('open', { required: true });
+
+const rejectForm = useForm({
+    status: CuttingStatus.REJECTED,
+    reason: '',
+});
+
+watch(open, (isOpen) => {
+    if (!isOpen) {
+        rejectForm.reset();
+        rejectForm.clearErrors();
+    }
+});
+
+function submitReject() {
+    rejectForm.post(transition_status.url(props.cuttingId), {
+        preserveScroll: true,
+        onSuccess: () => {
+            open.value = false;
+        },
+        onError: (errors: Record<string, string>) => {
+            if (errors.system) {
+                toast.error(errors.system);
+            }
+        },
+    });
+}
+</script>
+
+<template>
+    <Dialog v-model:open="open">
+        <DialogContent class="sm:max-w-md">
+            <DialogHeader>
+                <DialogTitle>Tolak Cutting</DialogTitle>
+            </DialogHeader>
+
+            <form @submit.prevent="submitReject">
+                <FieldGroup>
+                    <FieldSet class="grid gap-4">
+                        <Field>
+                            <FieldLabel for="cutting-reject-reason" required>Alasan Penolakan</FieldLabel>
+                            <Textarea id="cutting-reject-reason" v-model="rejectForm.reason"
+                                placeholder="Contoh: Jumlah barang yang diterima tidak sesuai" rows="3" autofocus
+                                :maxlength="FIELD_LIMITS.reason" />
+                            <FieldError :errors="rejectForm.errors.reason
+                                ? [rejectForm.errors.reason]
+                                : []
+                                " />
+                        </Field>
+                    </FieldSet>
+                </FieldGroup>
+
+                <DialogFooter class="mt-6">
+                    <Button type="button" variant="outline" :disabled="rejectForm.processing" @click="open = false">
+                        Batal
+                    </Button>
+                    <Button type="submit" variant="destructive" :disabled="rejectForm.processing">
+                        {{ rejectForm.processing ? 'Menyimpan...' : 'Tolak' }}
+                    </Button>
+                </DialogFooter>
+            </form>
+        </DialogContent>
+    </Dialog>
+</template>
diff --git a/resources/js/pages/admin/manage/cuttings/table/CuttingVerifyDialog.vue b/resources/js/pages/admin/manage/cuttings/table/CuttingVerifyDialog.vue
new file mode 100644
index 0000000..ae8818d
--- /dev/null
+++ b/resources/js/pages/admin/manage/cuttings/table/CuttingVerifyDialog.vue
@@ -0,0 +1,257 @@
+<script setup lang="ts">
+import { useForm } from '@inertiajs/vue3';
+import { ref, watch } from 'vue';
+import { toast } from 'vue-sonner';
+import { RupiahInput } from '@/components/form/rupiah-input';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+    Dialog,
+    DialogContent,
+    DialogFooter,
+    DialogHeader,
+    DialogTitle,
+} from '@/components/ui/dialog';
+import {
+    Field,
+    FieldError,
+    FieldLabel,
+} from '@/components/ui/field';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import { Switch } from '@/components/ui/switch';
+import { Textarea } from '@/components/ui/textarea';
+import { CuttingStatus } from '@/constants/cutting-status';
+import { parseRupiah } from '@/lib/rupiah';
+import { transition_status } from '@/routes/admin/manage/cuttings';
+import type { CuttingListItem } from '@/types/cutting';
+import {
+    PRICE_TYPES,
+    PRICE_TYPE_LABELS,
+} from '@/types/product';
+
+const props = defineProps<{
+    cutting: CuttingListItem;
+}>();
+
+const open = defineModel<boolean>('open', { required: true });
+
+const allMatches = ref(true);
+
+function buildEmptyPrices(): Record<string, string> {
+    return Object.fromEntries(PRICE_TYPES.map((type) => [type, '']));
+}
+
+const verifyForm = useForm({
+    status: CuttingStatus.VERIFIED,
+    verification_note: '',
+    results: props.cutting.results.map(res => ({
+        product_variant_id: res.product_variant?.id || 0,
+        name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
+        cutting_result: res.cutting_result,
+        sampel: res.sampel,
+        hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
+        original_sampel: res.sampel,
+        original_hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
+        prices: buildEmptyPrices(),
+    })),
+    result_prices: [] as Array<{
+        product_variant_id: number;
+        prices: Array<{ type: string; price: number }>;
+    }>,
+});
+
+watch(open, (isOpen) => {
+    if (isOpen) {
+        allMatches.value = true;
+        verifyForm.verification_note = '';
+        verifyForm.results = props.cutting.results.map(res => ({
+            product_variant_id: res.product_variant?.id || 0,
+            name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
+            cutting_result: res.cutting_result,
+            sampel: res.sampel,
+            hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
+            original_sampel: res.sampel,
+            original_hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
+            prices: buildEmptyPrices(),
+        }));
+        verifyForm.result_prices = [];
+        verifyForm.clearErrors();
+    }
+});
+
+watch(allMatches, (matches) => {
+    if (!matches) {
+        return;
+    }
+
+    verifyForm.results = verifyForm.results.map((result) => ({
+        ...result,
+        sampel: result.original_sampel,
+        hasil_cutting_diluar_sampel: result.original_hasil_cutting_diluar_sampel,
+    }));
+});
+
+function setAllMatches(value: boolean) {
+    allMatches.value = value;
+
+    if (value) {
+        verifyForm.results = verifyForm.results.map((result) => ({
+            ...result,
+            sampel: result.original_sampel,
+            hasil_cutting_diluar_sampel: result.original_hasil_cutting_diluar_sampel,
+        }));
+    }
+}
+
+function setResultPrice(resultIndex: number, type: string, value: string) {
+    const result = verifyForm.results[resultIndex];
+
+    if (!result) {
+        return;
+    }
+
+    result.prices = {
+        ...result.prices,
+        [type]: value,
+    };
+}
+
+function buildResultPricesPayload() {
+    return verifyForm.results.map((result) => ({
+        product_variant_id: result.product_variant_id,
+        prices: PRICE_TYPES.map((type) => ({
+            type,
+            price: Number.parseInt(parseRupiah(result.prices[type] ?? ''), 10) || 0,
+        })),
+    }));
+}
+
+function submitVerify() {
+    verifyForm
+        .transform((data) => ({
+            status: data.status,
+            verification_note: data.verification_note,
+            results: data.results.map(({ product_variant_id, sampel, hasil_cutting_diluar_sampel }) => ({
+                product_variant_id,
+                sampel,
+                hasil_cutting_diluar_sampel,
+            })),
+            result_prices: buildResultPricesPayload(),
+        }))
+        .post(transition_status.url(props.cutting.id), {
+            preserveScroll: true,
+            onSuccess: () => {
+                open.value = false;
+            },
+            onError: (errors: Record<string, string>) => {
+                if (errors.system) {
+                    toast.error(errors.system);
+                }
+            },
+        });
+}
+</script>
+
+<template>
+    <Dialog v-model:open="open">
+        <DialogContent class="sm:max-w-2xl">
+            <DialogHeader>
+                <DialogTitle>Verifikasi Hasil Cutting</DialogTitle>
+            </DialogHeader>
+
+            <form @submit.prevent="submitVerify">
+                <div class="space-y-4 max-h-[60vh] overflow-y-auto scrollbar-thin px-1 py-1">
+                    <p class="text-sm text-muted-foreground">
+                        Verifikasi jumlah produk yang diterima di toko dan tentukan harga jual per varian.
+                    </p>
+
+                    <div class="flex items-center justify-between rounded-lg border p-3">
+                        <Label for="all-matches" class="text-sm font-medium">
+                            Semua sesuai dengan data cutting
+                        </Label>
+                        <Switch id="all-matches" :model-value="allMatches" @update:model-value="setAllMatches" />
+                    </div>
+
+                    <div class="space-y-3">
+                        <div v-for="(result, index) in verifyForm.results" :key="result.product_variant_id"
+                            class="p-3 border rounded-lg space-y-3">
+                            <div class="font-medium text-sm">
+                                {{ result.name }}
+                            </div>
+                            <div class="grid grid-cols-3 gap-2 items-center text-xs">
+                                <div>
+                                    <span class="text-muted-foreground block">Hasil Potong:</span>
+                                    <span class="font-semibold">{{ result.cutting_result }} pcs</span>
+                                </div>
+                                <div>
+                                    <span class="text-muted-foreground block mb-0.5">Data cutting:</span>
+                                    <span class="font-medium tabular-nums">
+                                        {{ result.original_sampel }} sampel ·
+                                        {{ result.original_hasil_cutting_diluar_sampel }} diluar sampel
+                                    </span>
+                                </div>
+                                <div>
+                                    <span class="text-muted-foreground block">Diluar Sampel:</span>
+                                    <Badge variant="secondary" class="font-semibold">
+                                        {{ result.hasil_cutting_diluar_sampel }} pcs
+                                    </Badge>
+                                </div>
+                            </div>
+                            <div class="grid grid-cols-2 gap-2 items-end text-xs">
+                                <div>
+                                    <label :for="`sampel-${index}`" class="text-muted-foreground block mb-0.5">Sampel
+                                        (diterima):</label>
+                                    <Input :id="`sampel-${index}`" type="number" v-model.number="result.sampel" min="0"
+                                        :max="result.cutting_result" class="h-8 w-full px-2 text-xs"
+                                        :disabled="allMatches"
+                                        @input="result.hasil_cutting_diluar_sampel = result.cutting_result - result.sampel" />
+                                </div>
+                                <div>
+                                    <label :for="`diluar-sampel-${index}`"
+                                        class="text-muted-foreground block mb-0.5">Diluar
+                                        Sampel
+                                        (diterima):</label>
+                                    <Input :id="`diluar-sampel-${index}`" type="number"
+                                        v-model.number="result.hasil_cutting_diluar_sampel" min="0"
+                                        :max="result.cutting_result" class="h-8 w-full px-2 text-xs"
+                                        :disabled="allMatches"
+                                        @input="result.sampel = result.cutting_result - result.hasil_cutting_diluar_sampel" />
+                                </div>
+                            </div>
+
+                            <div class="grid gap-2 sm:grid-cols-2">
+                                <Field v-for="type in PRICE_TYPES" :key="`${result.product_variant_id}-${type}`">
+                                    <FieldLabel class="text-xs" :for="`price-${index}-${type}`" required>
+                                        {{ PRICE_TYPE_LABELS[type] }}
+                                    </FieldLabel>
+                                    <RupiahInput :id="`price-${index}-${type}`" :model-value="result.prices[type]"
+                                        @update:model-value="setResultPrice(index, type, $event)" />
+                                </Field>
+                            </div>
+                        </div>
+                    </div>
+
+                    <FieldError :errors="verifyForm.errors.result_prices ? [verifyForm.errors.result_prices] : []" />
+
+                    <Field>
+                        <FieldLabel for="verification-note">Catatan Verifikasi</FieldLabel>
+                        <Textarea id="verification-note" v-model="verifyForm.verification_note"
+                            placeholder="Contoh: Terdapat 1 barang cacat jahitan saat dihitung di toko" rows="3" />
+                        <FieldError
+                            :errors="verifyForm.errors.verification_note ? [verifyForm.errors.verification_note] : []" />
+                    </Field>
+                </div>
+
+                <DialogFooter class="mt-6">
+                    <Button type="button" variant="outline" :disabled="verifyForm.processing" @click="open = false">
+                        Batal
+                    </Button>
+                    <Button type="submit" :disabled="verifyForm.processing">
+                        {{ verifyForm.processing ? 'Menyimpan...' : 'Verifikasi' }}
+                    </Button>
+                </DialogFooter>
+            </form>
+        </DialogContent>
+    </Dialog>
+</template>
diff --git a/resources/js/pages/admin/manage/cuttings/table/data-table-actions.vue b/resources/js/pages/admin/manage/cuttings/table/data-table-actions.vue
index 31a2b5d..c7da2b2 100644
--- a/resources/js/pages/admin/manage/cuttings/table/data-table-actions.vue
+++ b/resources/js/pages/admin/manage/cuttings/table/data-table-actions.vue
@@ -1,45 +1,20 @@
 <script setup lang="ts">
-import { router, useForm } from '@inertiajs/vue3';
-import { computed, ref, watch } from 'vue';
+import { router } from '@inertiajs/vue3';
+import { computed, ref } from 'vue';
 import { toast } from 'vue-sonner';
 import { RowDeleteAction, RowEditAction, RowStatusAction } from '@/components/button';
 import ConfirmDialog from '@/components/ConfirmDialog.vue';
-import { RupiahInput } from '@/components/form/rupiah-input';
 import OwnerVerificationRowActions from '@/components/owner-verification/OwnerVerificationRowActions.vue';
-import { Badge } from '@/components/ui/badge';
-import { Button } from '@/components/ui/button';
-import {
-    Dialog,
-    DialogContent,
-    DialogFooter,
-    DialogHeader,
-    DialogTitle,
-} from '@/components/ui/dialog';
-import {
-    Field,
-    FieldError,
-    FieldGroup,
-    FieldLabel,
-    FieldSet,
-} from '@/components/ui/field';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import { Switch } from '@/components/ui/switch';
-import { Textarea } from '@/components/ui/textarea';
 import { useCan } from '@/composables/useCan';
 import {
     cuttingStatusActionIcon,
     CuttingStatus,
     cuttingStatusTransitionConfirmDescription,
 } from '@/constants/cutting-status';
-import { FIELD_LIMITS } from '@/lib/field-limits';
-import { parseRupiah } from '@/lib/rupiah';
 import { edit, destroy, transition_status } from '@/routes/admin/manage/cuttings';
 import type { CuttingListItem, CuttingStatusAction } from '@/types/cutting';
-import {
-    PRICE_TYPES,
-    PRICE_TYPE_LABELS,
-} from '@/types/product';
+import CuttingRejectDialog from './CuttingRejectDialog.vue';
+import CuttingVerifyDialog from './CuttingVerifyDialog.vue';
 
 const props = defineProps<{
     cutting: CuttingListItem;
@@ -51,102 +26,8 @@ const statusConfirmOpen = ref(false);
 const statusProcessing = ref(false);
 const rejectDialogOpen = ref(false);
 const verifyDialogOpen = ref(false);
-const allMatches = ref(true);
 const pendingAction = ref<CuttingStatusAction | null>(null);
 
-const rejectForm = useForm({
-    status: CuttingStatus.REJECTED,
-    reason: '',
-});
-
-function buildEmptyPrices(): Record<string, string> {
-    return Object.fromEntries(PRICE_TYPES.map((type) => [type, '']));
-}
-
-const verifyForm = useForm({
-    status: CuttingStatus.VERIFIED,
-    verification_note: '',
-    results: props.cutting.results.map(res => ({
-        product_variant_id: res.product_variant?.id || 0,
-        name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
-        cutting_result: res.cutting_result,
-        sampel: res.sampel,
-        hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
-        original_sampel: res.sampel,
-        original_hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
-        prices: buildEmptyPrices(),
-    })),
-    result_prices: [] as Array<{
-        product_variant_id: number;
-        prices: Array<{ type: string; price: number }>;
-    }>,
-});
-
-watch(verifyDialogOpen, (isOpen) => {
-    if (isOpen) {
-        allMatches.value = true;
-        verifyForm.verification_note = '';
-        verifyForm.results = props.cutting.results.map(res => ({
-            product_variant_id: res.product_variant?.id || 0,
-            name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
-            cutting_result: res.cutting_result,
-            sampel: res.sampel,
-            hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
-            original_sampel: res.sampel,
-            original_hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
-            prices: buildEmptyPrices(),
-        }));
-        verifyForm.result_prices = [];
-        verifyForm.clearErrors();
-    }
-});
-
-watch(allMatches, (matches) => {
-    if (!matches) {
-        return;
-    }
-
-    verifyForm.results = verifyForm.results.map((result) => ({
-        ...result,
-        sampel: result.original_sampel,
-        hasil_cutting_diluar_sampel: result.original_hasil_cutting_diluar_sampel,
-    }));
-});
-
-function setAllMatches(value: boolean) {
-    allMatches.value = value;
-
-    if (value) {
-        verifyForm.results = verifyForm.results.map((result) => ({
-            ...result,
-            sampel: result.original_sampel,
-            hasil_cutting_diluar_sampel: result.original_hasil_cutting_diluar_sampel,
-        }));
-    }
-}
-function setResultPrice(resultIndex: number, type: string, value: string) {
-    const result = verifyForm.results[resultIndex];
-
-    if (!result) {
-        return;
-    }
-
-    result.prices = {
-        ...result.prices,
-        [type]: value,
-    };
-}
-
-function buildResultPricesPayload() {
-    return verifyForm.results.map((result) => ({
-        product_variant_id: result.product_variant_id,
-        prices: PRICE_TYPES.map((type) => ({
-            type,
-            price: Number.parseInt(parseRupiah(result.prices[type] ?? ''), 10) || 0,
-        })),
-    }));
-}
-
 const availableActions = computed(() => props.cutting.available_actions ?? []);
 
 const canEdit = computed(
@@ -172,8 +53,6 @@ function openStatusConfirm(action: CuttingStatusAction) {
     }
 
     if (action.status === CuttingStatus.REJECTED) {
-        rejectForm.reset();
-        rejectForm.clearErrors();
         rejectDialogOpen.value = true;
 
         return;
@@ -183,31 +62,6 @@ function openStatusConfirm(action: CuttingStatusAction) {
     statusConfirmOpen.value = true;
 }
 
-function submitVerify() {
-    verifyForm
-        .transform((data) => ({
-            status: data.status,
-            verification_note: data.verification_note,
-            results: data.results.map(({ product_variant_id, sampel, hasil_cutting_diluar_sampel }) => ({
-                product_variant_id,
-                sampel,
-                hasil_cutting_diluar_sampel,
-            })),
-            result_prices: buildResultPricesPayload(),
-        }))
-        .post(transition_status.url(props.cutting.id), {
-            preserveScroll: true,
-            onSuccess: () => {
-                verifyDialogOpen.value = false;
-            },
-            onError: (errors: any) => {
-                if (errors.system) {
-                    toast.error(errors.system);
-                }
-            },
-        });
-}
-
 function transitionStatus() {
     if (!pendingAction.value) {
         return;
@@ -226,7 +80,7 @@ function transitionStatus() {
                 statusConfirmOpen.value = false;
                 pendingAction.value = null;
             },
-            onError: (errors: any) => {
+            onError: (errors: Record<string, string>) => {
                 if (errors.system) {
                     toast.error(errors.system);
                 }
@@ -238,27 +92,6 @@ function transitionStatus() {
     );
 }
 
-function submitReject() {
-    rejectForm.post(transition_status.url(props.cutting.id), {
-        preserveScroll: true,
-        onSuccess: () => {
-            rejectDialogOpen.value = false;
-        },
-        onError: (errors: any) => {
-            if (errors.system) {
-                toast.error(errors.system);
-            }
-        },
-    });
-}
-
-watch(rejectDialogOpen, (isOpen) => {
-    if (!isOpen) {
-        rejectForm.reset();
-        rejectForm.clearErrors();
-    }
-});
-
 </script>
 
 <template>
@@ -286,138 +119,7 @@ watch(rejectDialogOpen, (isOpen) => {
             " :confirm-label="pendingAction?.label ?? 'Konfirmasi'" cancel-label="Batal"
         :destructive="pendingAction?.destructive ?? false" :loading="statusProcessing" @confirm="transitionStatus" />
 
-    <Dialog v-model:open="rejectDialogOpen">
-        <DialogContent class="sm:max-w-md">
-            <DialogHeader>
-                <DialogTitle>Tolak Cutting</DialogTitle>
-            </DialogHeader>
+    <CuttingRejectDialog v-model:open="rejectDialogOpen" :cutting-id="cutting.id" />
 
-            <form @submit.prevent="submitReject">
-                <FieldGroup>
-                    <FieldSet class="grid gap-4">
-                        <Field>
-                            <FieldLabel for="cutting-reject-reason" required>Alasan Penolakan</FieldLabel>
-                            <Textarea id="cutting-reject-reason" v-model="rejectForm.reason"
-                                placeholder="Contoh: Jumlah barang yang diterima tidak sesuai" rows="3" autofocus
-                                :maxlength="FIELD_LIMITS.reason" />
-                            <FieldError :errors="rejectForm.errors.reason
-                                ? [rejectForm.errors.reason]
-                                : []
-                                " />
-                        </Field>
-                    </FieldSet>
-                </FieldGroup>
-
-                <DialogFooter class="mt-6">
-                    <Button type="button" variant="outline" :disabled="rejectForm.processing"
-                        @click="rejectDialogOpen = false">
-                        Batal
-                    </Button>
-                    <Button type="submit" variant="destructive" :disabled="rejectForm.processing">
-                        {{ rejectForm.processing ? 'Menyimpan...' : 'Tolak' }}
-                    </Button>
-                </DialogFooter>
-            </form>
-        </DialogContent>
-    </Dialog>
-
-    <Dialog v-model:open="verifyDialogOpen">
-        <DialogContent class="sm:max-w-2xl">
-            <DialogHeader>
-                <DialogTitle>Verifikasi Hasil Cutting</DialogTitle>
-            </DialogHeader>
-
-            <form @submit.prevent="submitVerify">
-                <div class="space-y-4 max-h-[60vh] overflow-y-auto scrollbar-thin px-1 py-1">
-                    <p class="text-sm text-muted-foreground">
-                        Verifikasi jumlah produk yang diterima di toko dan tentukan harga jual per varian.
-                    </p>
-
-                    <div class="flex items-center justify-between rounded-lg border p-3">
-                        <Label for="all-matches" class="text-sm font-medium">
-                            Semua sesuai dengan data cutting
-                        </Label>
-                        <Switch id="all-matches" :model-value="allMatches" @update:model-value="setAllMatches" />
-                    </div>
-
-                    <div class="space-y-3">
-                        <div v-for="(result, index) in verifyForm.results" :key="result.product_variant_id"
-                            class="p-3 border rounded-lg space-y-3">
-                            <div class="font-medium text-sm">
-                                {{ result.name }}
-                            </div>
-                            <div class="grid grid-cols-3 gap-2 items-center text-xs">
-                                <div>
-                                    <span class="text-muted-foreground block">Hasil Potong:</span>
-                                    <span class="font-semibold">{{ result.cutting_result }} pcs</span>
-                                </div>
-                                <div>
-                                    <span class="text-muted-foreground block mb-0.5">Data cutting:</span>
-                                    <span class="font-medium tabular-nums">
-                                        {{ result.original_sampel }} sampel ·
-                                        {{ result.original_hasil_cutting_diluar_sampel }} diluar sampel
-                                    </span>
-                                </div>
-                                <div>
-                                    <span class="text-muted-foreground block">Diluar Sampel:</span>
-                                    <Badge variant="secondary" class="font-semibold">
-                                        {{ result.hasil_cutting_diluar_sampel }} pcs
-                                    </Badge>
-                                </div>
-                            </div>
-                            <div class="grid grid-cols-2 gap-2 items-end text-xs">
-                                <div>
-                                    <label :for="`sampel-${index}`" class="text-muted-foreground block mb-0.5">Sampel
-                                        (diterima):</label>
-                                    <Input :id="`sampel-${index}`" type="number" v-model.number="result.sampel"
-                                        min="0" :max="result.cutting_result" class="h-8 w-full px-2 text-xs"
-                                        :disabled="allMatches"
-                                        @input="result.hasil_cutting_diluar_sampel = result.cutting_result - result.sampel" />
-                                </div>
-                                <div>
-                                    <label :for="`diluar-sampel-${index}`" class="text-muted-foreground block mb-0.5">Diluar
-                                        Sampel
-                                        (diterima):</label>
-                                    <Input :id="`diluar-sampel-${index}`" type="number" v-model.number="result.hasil_cutting_diluar_sampel"
-                                        min="0" :max="result.cutting_result" class="h-8 w-full px-2 text-xs"
-                                        :disabled="allMatches"
-                                        @input="result.sampel = result.cutting_result - result.hasil_cutting_diluar_sampel" />
-                                </div>
-                            </div>
-
-                            <div class="grid gap-2 sm:grid-cols-2">
-                                <Field v-for="type in PRICE_TYPES" :key="`${result.product_variant_id}-${type}`">
-                                    <FieldLabel class="text-xs" :for="`price-${index}-${type}`">
-                                        {{ PRICE_TYPE_LABELS[type] }}
-                                    </FieldLabel>
-                                    <RupiahInput :id="`price-${index}-${type}`" :model-value="result.prices[type]"
-                                        @update:model-value="setResultPrice(index, type, $event)" />
-                                </Field>
-                            </div>
-                        </div>
-                    </div>
-
-                    <FieldError :errors="verifyForm.errors.result_prices ? [verifyForm.errors.result_prices] : []" />
-
-                    <Field>
-                        <FieldLabel for="verification-note">Catatan Verifikasi</FieldLabel>
-                        <Textarea id="verification-note" v-model="verifyForm.verification_note"
-                            placeholder="Contoh: Terdapat 1 barang cacat jahitan saat dihitung di toko" rows="3" />
-                        <FieldError
-                            :errors="verifyForm.errors.verification_note ? [verifyForm.errors.verification_note] : []" />
-                    </Field>
-                </div>
-
-                <DialogFooter class="mt-6">
-                    <Button type="button" variant="outline" :disabled="verifyForm.processing"
-                        @click="verifyDialogOpen = false">
-                        Batal
-                    </Button>
-                    <Button type="submit" :disabled="verifyForm.processing">
-                        {{ verifyForm.processing ? 'Menyimpan...' : 'Verifikasi' }}
-                    </Button>
-                </DialogFooter>
-            </form>
-        </DialogContent>
-    </Dialog>
+    <CuttingVerifyDialog v-model:open="verifyDialogOpen" :cutting="cutting" />
 </template>
diff --git a/resources/js/pages/admin/manage/stocks/table/StockVerifyDialog.vue b/resources/js/pages/admin/manage/stocks/table/StockVerifyDialog.vue
new file mode 100644
index 0000000..485090e
--- /dev/null
+++ b/resources/js/pages/admin/manage/stocks/table/StockVerifyDialog.vue
@@ -0,0 +1,252 @@
+<script setup lang="ts">
+import { useForm } from '@inertiajs/vue3';
+import { computed, ref, watch } from 'vue';
+import { toast } from 'vue-sonner';
+import { RupiahInput } from '@/components/form/rupiah-input';
+import { Button } from '@/components/ui/button';
+import {
+    Dialog,
+    DialogContent,
+    DialogFooter,
+    DialogHeader,
+    DialogTitle,
+} from '@/components/ui/dialog';
+import {
+    Field,
+    FieldError,
+    FieldLabel,
+} from '@/components/ui/field';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import { Separator } from '@/components/ui/separator';
+import { Switch } from '@/components/ui/switch';
+import { Textarea } from '@/components/ui/textarea';
+import { parseRupiah } from '@/lib/rupiah';
+import { verify } from '@/routes/admin/manage/stocks';
+import type { CuttingListItem } from '@/types/cutting';
+import {
+    PRICE_TYPES,
+    PRICE_TYPE_LABELS,
+} from '@/types/product';
+
+const props = defineProps<{
+    cutting: CuttingListItem;
+}>();
+
+const open = defineModel<boolean>('open', { required: true });
+
+const allMatches = ref(true);
+
+function buildEmptyPrices(): Record<string, string> {
+    return Object.fromEntries(PRICE_TYPES.map((type) => [type, '']));
+}
+
+interface VariantPriceRow {
+    product_variant_id: number;
+    name: string;
+    prices: Record<string, string>;
+}
+
+const verifyForm = useForm({
+    verification_note: '',
+    results: props.cutting.results.map(res => ({
+        product_variant_id: res.product_variant?.id || 0,
+        name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
+        cutting_result: res.cutting_result,
+        sampel: res.sampel,
+        hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
+        original_sampel: res.sampel,
+        original_hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
+    })),
+    variant_prices: [] as VariantPriceRow[],
+    shared_prices: buildEmptyPrices(),
+});
+
+watch(open, (isOpen) => {
+    if (isOpen) {
+        allMatches.value = true;
+        verifyForm.verification_note = '';
+        verifyForm.results = props.cutting.results.map(res => ({
+            product_variant_id: res.product_variant?.id || 0,
+            name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
+            cutting_result: res.cutting_result,
+            sampel: res.sampel,
+            hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
+            original_sampel: res.sampel,
+            original_hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
+        }));
+        verifyForm.variant_prices = props.cutting.results.map(res => ({
+            product_variant_id: res.product_variant?.id || 0,
+            name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
+            prices: buildEmptyPrices(),
+        }));
+        verifyForm.shared_prices = buildEmptyPrices();
+        verifyForm.clearErrors();
+    }
+});
+
+watch(allMatches, (matches) => {
+    if (!matches) {
+        return;
+    }
+
+    verifyForm.results = verifyForm.results.map((result) => ({
+        ...result,
+        sampel: result.original_sampel,
+        hasil_cutting_diluar_sampel: result.original_hasil_cutting_diluar_sampel,
+    }));
+});
+
+function setAllMatches(value: boolean) {
+    allMatches.value = value;
+
+    if (value) {
+        verifyForm.results = verifyForm.results.map((result) => ({
+            ...result,
+            sampel: result.original_sampel,
+            hasil_cutting_diluar_sampel: result.original_hasil_cutting_diluar_sampel,
+        }));
+    }
+}
+
+function setSharedPrice(type: string, value: string) {
+    verifyForm.shared_prices[type] = value;
+    verifyForm.variant_prices = verifyForm.variant_prices.map((row) => ({
+        ...row,
+        prices: { ...row.prices, [type]: value },
+    }));
+}
+
+const resultPricesErrors = computed(() => {
+    const message = (verifyForm.errors as Record<string, string | undefined>).result_prices;
+
+    return message ? [message] : [];
+});
+
+function buildResultPricesPayload() {
+    return verifyForm.variant_prices.map((row) => ({
+        product_variant_id: row.product_variant_id,
+        prices: PRICE_TYPES.map((type) => ({
+            type,
+            price: Number.parseInt(parseRupiah(row.prices[type] ?? ''), 10) || 0,
+        })),
+    }));
+}
+
+function submitVerify() {
+    verifyForm
+        .transform((data) => ({
+            verification_note: data.verification_note,
+            results: data.results.map(({ product_variant_id, sampel, hasil_cutting_diluar_sampel }) => ({
+                product_variant_id,
+                sampel,
+                hasil_cutting_diluar_sampel,
+            })),
+            result_prices: buildResultPricesPayload(),
+        }))
+        .post(verify.url(props.cutting.id), {
+            preserveScroll: true,
+            onSuccess: () => {
+                open.value = false;
+            },
+            onError: (errors: Record<string, string>) => {
+                if (errors.system) {
+                    toast.error(errors.system);
+                }
+            },
+        });
+}
+</script>
+
+<template>
+    <Dialog v-model:open="open">
+        <DialogContent class="sm:max-w-lg">
+            <DialogHeader>
+                <DialogTitle>Verifikasi Hasil Cutting</DialogTitle>
+            </DialogHeader>
+
+            <form @submit.prevent="submitVerify">
+                <div class="space-y-4 max-h-[60vh] overflow-y-auto scrollbar-thin px-1 py-1">
+                    <p class="text-sm text-muted-foreground">
+                        Verifikasi jumlah produk yang diterima dan tentukan harga jual. Stok akan ditambahkan setelah
+                        verifikasi.
+                    </p>
+
+                    <div class="flex items-center justify-between rounded-lg border p-3">
+                        <Label for="stock-all-matches" class="text-sm font-medium">
+                            Semua sesuai dengan data cutting
+                        </Label>
+                        <Switch id="stock-all-matches" :model-value="allMatches" @update:model-value="setAllMatches" />
+                    </div>
+
+                    <div class="space-y-2">
+                        <div v-for="(result, index) in verifyForm.results" :key="result.product_variant_id"
+                            class="flex items-center gap-3 rounded-lg border p-3">
+                            <div class="flex-1 min-w-0">
+                                <p class="font-medium text-sm truncate">{{ result.name }}</p>
+                                <p class="text-xs text-muted-foreground">
+                                    {{ result.cutting_result }} pcs
+                                    <span class="text-[10px]">({{ result.original_sampel }} sampel, {{
+                                        result.original_hasil_cutting_diluar_sampel }} diluar sampel)</span>
+                                </p>
+                            </div>
+                            <div class="flex items-center gap-2 shrink-0">
+                                <div class="text-center">
+                                    <label :for="`stock-sampel-${index}`"
+                                        class="text-[10px] text-muted-foreground block">Sampel</label>
+                                    <Input :id="`stock-sampel-${index}`" type="number"
+                                        v-model.number="result.sampel" min="0" :max="result.cutting_result"
+                                        class="h-7 w-16 px-1.5 text-xs text-center" :disabled="allMatches"
+                                        @input="result.hasil_cutting_diluar_sampel = result.cutting_result - result.sampel" />
+                                </div>
+                                <div class="text-center">
+                                    <label :for="`stock-diluar-sampel-${index}`"
+                                        class="text-[10px] text-muted-foreground block">Diluar Sampel</label>
+                                    <Input :id="`stock-diluar-sampel-${index}`" type="number"
+                                        v-model.number="result.hasil_cutting_diluar_sampel" min="0" :max="result.cutting_result"
+                                        class="h-7 w-16 px-1.5 text-xs text-center" :disabled="allMatches"
+                                        @input="result.sampel = result.cutting_result - result.hasil_cutting_diluar_sampel" />
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <Separator />
+
+                    <div class="space-y-2">
+                        <p class="text-sm font-medium">Harga</p>
+                        <div class="grid gap-2 sm:grid-cols-2">
+                            <Field v-for="type in PRICE_TYPES" :key="`shared-${type}`">
+                                <FieldLabel class="text-xs" :for="`shared-price-${type}`" required>
+                                    {{ PRICE_TYPE_LABELS[type] }}
+                                </FieldLabel>
+                                <RupiahInput :id="`shared-price-${type}`" :model-value="verifyForm.shared_prices[type]"
+                                    @update:model-value="setSharedPrice(type, $event)" />
+                            </Field>
+                        </div>
+                    </div>
+
+                    <FieldError :errors="resultPricesErrors" />
+
+                    <Field>
+                        <FieldLabel for="stock-verification-note">Catatan Verifikasi</FieldLabel>
+                        <Textarea id="stock-verification-note" v-model="verifyForm.verification_note"
+                            placeholder="Contoh: Terdapat 1 barang cacat jahitan saat dihitung di toko" rows="3" />
+                        <FieldError
+                            :errors="verifyForm.errors.verification_note ? [verifyForm.errors.verification_note] : []" />
+                    </Field>
+                </div>
+
+                <DialogFooter class="mt-6">
+                    <Button type="button" variant="outline" :disabled="verifyForm.processing"
+                        @click="open = false">
+                        Batal
+                    </Button>
+                    <Button type="submit" :disabled="verifyForm.processing">
+                        {{ verifyForm.processing ? 'Menyimpan...' : 'Verifikasi & Tambah Stok' }}
+                    </Button>
+                </DialogFooter>
+            </form>
+        </DialogContent>
+    </Dialog>
+</template>
diff --git a/resources/js/pages/admin/manage/stocks/table/data-table-actions.vue b/resources/js/pages/admin/manage/stocks/table/data-table-actions.vue
index 7cd6df9..cdbde79 100644
--- a/resources/js/pages/admin/manage/stocks/table/data-table-actions.vue
+++ b/resources/js/pages/admin/manage/stocks/table/data-table-actions.vue
@@ -1,258 +1,22 @@
 <script setup lang="ts">
-import { useForm } from '@inertiajs/vue3';
-import { ref, watch, computed } from 'vue';
-import { toast } from 'vue-sonner';
+import { ref } from 'vue';
 import { RowApproveAction } from '@/components/button';
-import { RupiahInput } from '@/components/form/rupiah-input';
-import { Button } from '@/components/ui/button';
-import {
-    Dialog,
-    DialogContent,
-    DialogFooter,
-    DialogHeader,
-    DialogTitle,
-} from '@/components/ui/dialog';
-import {
-    Field,
-    FieldError,
-    FieldLabel,
-} from '@/components/ui/field';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import { Separator } from '@/components/ui/separator';
-import { Switch } from '@/components/ui/switch';
-import { Textarea } from '@/components/ui/textarea';
 import { useCan } from '@/composables/useCan';
-import { parseRupiah } from '@/lib/rupiah';
-import { verify } from '@/routes/admin/manage/stocks';
 import type { CuttingListItem } from '@/types/cutting';
-import {
-    PRICE_TYPES,
-    PRICE_TYPE_LABELS,
-} from '@/types/product';
+import StockVerifyDialog from './StockVerifyDialog.vue';
 
-const props = defineProps<{
+defineProps<{
     cutting: CuttingListItem;
 }>();
 
 const { can } = useCan();
 
 const verifyDialogOpen = ref(false);
-const allMatches = ref(true);
-
-function buildEmptyPrices(): Record<string, string> {
-    return Object.fromEntries(PRICE_TYPES.map((type) => [type, '']));
-}
-
-interface VariantPriceRow {
-    product_variant_id: number;
-    name: string;
-    prices: Record<string, string>;
-}
-
-const verifyForm = useForm({
-    verification_note: '',
-    results: props.cutting.results.map(res => ({
-        product_variant_id: res.product_variant?.id || 0,
-        name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
-        cutting_result: res.cutting_result,
-        sampel: res.sampel,
-        hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
-        original_sampel: res.sampel,
-        original_hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
-    })),
-    variant_prices: [] as VariantPriceRow[],
-    shared_prices: buildEmptyPrices(),
-});
-
-watch(verifyDialogOpen, (isOpen) => {
-    if (isOpen) {
-        allMatches.value = true;
-        verifyForm.verification_note = '';
-        verifyForm.results = props.cutting.results.map(res => ({
-            product_variant_id: res.product_variant?.id || 0,
-            name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
-            cutting_result: res.cutting_result,
-            sampel: res.sampel,
-            hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
-            original_sampel: res.sampel,
-            original_hasil_cutting_diluar_sampel: res.hasil_cutting_diluar_sampel,
-        }));
-        verifyForm.variant_prices = props.cutting.results.map(res => ({
-            product_variant_id: res.product_variant?.id || 0,
-            name: `${res.product_variant?.product?.name || ''} (${res.product_variant?.name || ''})`,
-            prices: buildEmptyPrices(),
-        }));
-        verifyForm.shared_prices = buildEmptyPrices();
-        verifyForm.clearErrors();
-    }
-});
-
-watch(allMatches, (matches) => {
-    if (!matches) {
-        return;
-    }
-
-    verifyForm.results = verifyForm.results.map((result) => ({
-        ...result,
-        sampel: result.original_sampel,
-        hasil_cutting_diluar_sampel: result.original_hasil_cutting_diluar_sampel,
-    }));
-});
-
-function setAllMatches(value: boolean) {
-    allMatches.value = value;
-
-    if (value) {
-        verifyForm.results = verifyForm.results.map((result) => ({
-            ...result,
-            sampel: result.original_sampel,
-            hasil_cutting_diluar_sampel: result.original_hasil_cutting_diluar_sampel,
-        }));
-    }
-}
-
-function setSharedPrice(type: string, value: string) {
-    verifyForm.shared_prices[type] = value;
-    verifyForm.variant_prices = verifyForm.variant_prices.map((row) => ({
-        ...row,
-        prices: { ...row.prices, [type]: value },
-    }));
-}
-
-const resultPricesErrors = computed(() => {
-    const message = (verifyForm.errors as Record<string, string | undefined>).result_prices;
-
-    return message ? [message] : [];
-});
-
-function buildResultPricesPayload() {
-    return verifyForm.variant_prices.map((row) => ({
-        product_variant_id: row.product_variant_id,
-        prices: PRICE_TYPES.map((type) => ({
-            type,
-            price: Number.parseInt(parseRupiah(row.prices[type] ?? ''), 10) || 0,
-        })),
-    }));
-}
-
-function submitVerify() {
-    verifyForm
-        .transform((data) => ({
-            verification_note: data.verification_note,
-            results: data.results.map(({ product_variant_id, sampel, hasil_cutting_diluar_sampel }) => ({
-                product_variant_id,
-                sampel,
-                hasil_cutting_diluar_sampel,
-            })),
-            result_prices: buildResultPricesPayload(),
-        }))
-        .post(verify.url(props.cutting.id), {
-            preserveScroll: true,
-            onSuccess: () => {
-                verifyDialogOpen.value = false;
-            },
-            onError: (errors: any) => {
-                if (errors.system) {
-                    toast.error(errors.system);
-                }
-            },
-        });
-}
 </script>
 
 <template>
     <RowApproveAction v-if="can('cuttings.verify')" size="sm" tooltip="Verifikasi & Tambah Stok"
         @click="verifyDialogOpen = true" />
 
-    <Dialog v-model:open="verifyDialogOpen">
-        <DialogContent class="sm:max-w-lg">
-            <DialogHeader>
-                <DialogTitle>Verifikasi Hasil Cutting</DialogTitle>
-            </DialogHeader>
-
-            <form @submit.prevent="submitVerify">
-                <div class="space-y-4 max-h-[60vh] overflow-y-auto scrollbar-thin px-1 py-1">
-                    <p class="text-sm text-muted-foreground">
-                        Verifikasi jumlah produk yang diterima dan tentukan harga jual. Stok akan ditambahkan setelah
-                        verifikasi.
-                    </p>
-
-                    <div class="flex items-center justify-between rounded-lg border p-3">
-                        <Label for="stock-all-matches" class="text-sm font-medium">
-                            Semua sesuai dengan data cutting
-                        </Label>
-                        <Switch id="stock-all-matches" :model-value="allMatches" @update:model-value="setAllMatches" />
-                    </div>
-
-                    <div class="space-y-2">
-                        <div v-for="(result, index) in verifyForm.results" :key="result.product_variant_id"
-                            class="flex items-center gap-3 rounded-lg border p-3">
-                            <div class="flex-1 min-w-0">
-                                <p class="font-medium text-sm truncate">{{ result.name }}</p>
-                                <p class="text-xs text-muted-foreground">
-                                    {{ result.cutting_result }} pcs
-                                    <span class="text-[10px]">({{ result.original_sampel }} sampel, {{
-                                        result.original_hasil_cutting_diluar_sampel }} diluar sampel)</span>
-                                </p>
-                            </div>
-                            <div class="flex items-center gap-2 shrink-0">
-                                <div class="text-center">
-                                    <label :for="`stock-sampel-${index}`"
-                                        class="text-[10px] text-muted-foreground block">Sampel</label>
-                                    <Input :id="`stock-sampel-${index}`" type="number"
-                                        v-model.number="result.sampel" min="0" :max="result.cutting_result"
-                                        class="h-7 w-16 px-1.5 text-xs text-center" :disabled="allMatches"
-                                        @input="result.hasil_cutting_diluar_sampel = result.cutting_result - result.sampel" />
-                                </div>
-                                <div class="text-center">
-                                    <label :for="`stock-diluar-sampel-${index}`"
-                                        class="text-[10px] text-muted-foreground block">Diluar Sampel</label>
-                                    <Input :id="`stock-diluar-sampel-${index}`" type="number"
-                                        v-model.number="result.hasil_cutting_diluar_sampel" min="0" :max="result.cutting_result"
-                                        class="h-7 w-16 px-1.5 text-xs text-center" :disabled="allMatches"
-                                        @input="result.sampel = result.cutting_result - result.hasil_cutting_diluar_sampel" />
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-
-                    <Separator />
-
-                    <div class="space-y-2">
-                        <p class="text-sm font-medium">Harga</p>
-                        <div class="grid gap-2 sm:grid-cols-2">
-                            <Field v-for="type in PRICE_TYPES" :key="`shared-${type}`">
-                                <FieldLabel class="text-xs" :for="`shared-price-${type}`">
-                                    {{ PRICE_TYPE_LABELS[type] }}
-                                </FieldLabel>
-                                <RupiahInput :id="`shared-price-${type}`" :model-value="verifyForm.shared_prices[type]"
-                                    @update:model-value="setSharedPrice(type, $event)" />
-                            </Field>
-                        </div>
-                    </div>
-
-                    <FieldError :errors="resultPricesErrors" />
-
-                    <Field>
-                        <FieldLabel for="stock-verification-note">Catatan Verifikasi</FieldLabel>
-                        <Textarea id="stock-verification-note" v-model="verifyForm.verification_note"
-                            placeholder="Contoh: Terdapat 1 barang cacat jahitan saat dihitung di toko" rows="3" />
-                        <FieldError
-                            :errors="verifyForm.errors.verification_note ? [verifyForm.errors.verification_note] : []" />
-                    </Field>
-                </div>
-
-                <DialogFooter class="mt-6">
-                    <Button type="button" variant="outline" :disabled="verifyForm.processing"
-                        @click="verifyDialogOpen = false">
-                        Batal
-                    </Button>
-                    <Button type="submit" :disabled="verifyForm.processing">
-                        {{ verifyForm.processing ? 'Menyimpan...' : 'Verifikasi & Tambah Stok' }}
-                    </Button>
-                </DialogFooter>
-            </form>
-        </DialogContent>
-    </Dialog>
+    <StockVerifyDialog v-model:open="verifyDialogOpen" :cutting="cutting" />
 </template>