From c2360ef1ed0fe1798f9db85635bd84070da5b553 Mon Sep 17 00:00:00 2001
From: Yoga Pangestu <ypangestu976@gmail.com>
Date: Tue, 7 Jul 2026 23:23:28 +0700
Subject: [PATCH] refactor: update modal components to improve layout and
 scrolling behavior for better user experience

---
 resources/js/components/modal/RetailStockTransferModal.vue      | 2 +-
 .../pages/admin/finance/cash/form/CashTransactionFormModal.vue  | 2 +-
 .../finance/employee-advances/form/EmployeeAdvanceFormModal.vue | 2 +-
 .../js/pages/admin/finance/expenses/form/ExpenseFormModal.vue   | 2 +-
 .../pages/admin/finance/payroll/form/PayrollAdjustmentModal.vue | 2 +-
 .../pages/admin/hr/attendances/form/AttendanceWebcamModal.vue   | 2 +-
 .../pages/admin/manage/orders/form/CustomerQuickCreateModal.vue | 2 +-
 .../admin/manage/purchases/form/PurchasePosAddVariantDialog.vue | 2 +-
 .../js/pages/admin/master/customers/form/CustomerFormModal.vue  | 2 +-
 .../js/pages/admin/master/suppliers/form/SupplierFormModal.vue  | 2 +-
 10 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/resources/js/components/modal/RetailStockTransferModal.vue b/resources/js/components/modal/RetailStockTransferModal.vue
index c66b61a..d0dafcb 100644
--- a/resources/js/components/modal/RetailStockTransferModal.vue
+++ b/resources/js/components/modal/RetailStockTransferModal.vue
@@ -141,7 +141,7 @@ function formatNumber(value: number): string {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-md">
+        <DialogContent class="sm:max-w-md max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle class="flex items-center gap-2">
                     Perubahan Stok Ecer
diff --git a/resources/js/pages/admin/finance/cash/form/CashTransactionFormModal.vue b/resources/js/pages/admin/finance/cash/form/CashTransactionFormModal.vue
index 0cfa8d7..36589ae 100644
--- a/resources/js/pages/admin/finance/cash/form/CashTransactionFormModal.vue
+++ b/resources/js/pages/admin/finance/cash/form/CashTransactionFormModal.vue
@@ -140,7 +140,7 @@ const placeholder = computed(() =>
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-md">
+        <DialogContent class="sm:max-w-md max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>{{ dialogTitle }}</DialogTitle>
             </DialogHeader>
diff --git a/resources/js/pages/admin/finance/employee-advances/form/EmployeeAdvanceFormModal.vue b/resources/js/pages/admin/finance/employee-advances/form/EmployeeAdvanceFormModal.vue
index 0395c78..02091db 100644
--- a/resources/js/pages/admin/finance/employee-advances/form/EmployeeAdvanceFormModal.vue
+++ b/resources/js/pages/admin/finance/employee-advances/form/EmployeeAdvanceFormModal.vue
@@ -108,7 +108,7 @@ function submit() {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-md">
+        <DialogContent class="sm:max-w-md max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>{{ isEditing ? 'Ubah Pengajuan Kasbon' : 'Ajukan Kasbon' }}</DialogTitle>
             </DialogHeader>
diff --git a/resources/js/pages/admin/finance/expenses/form/ExpenseFormModal.vue b/resources/js/pages/admin/finance/expenses/form/ExpenseFormModal.vue
index adb3247..b75e3e6 100644
--- a/resources/js/pages/admin/finance/expenses/form/ExpenseFormModal.vue
+++ b/resources/js/pages/admin/finance/expenses/form/ExpenseFormModal.vue
@@ -115,7 +115,7 @@ function submit() {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-md">
+        <DialogContent class="sm:max-w-md max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>{{ isEditing ? 'Ubah Pengeluaran' : 'Tambah Pengeluaran' }}</DialogTitle>
             </DialogHeader>
diff --git a/resources/js/pages/admin/finance/payroll/form/PayrollAdjustmentModal.vue b/resources/js/pages/admin/finance/payroll/form/PayrollAdjustmentModal.vue
index 5d57d6f..3fb9a69 100644
--- a/resources/js/pages/admin/finance/payroll/form/PayrollAdjustmentModal.vue
+++ b/resources/js/pages/admin/finance/payroll/form/PayrollAdjustmentModal.vue
@@ -109,7 +109,7 @@ function submit() {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-2xl">
+        <DialogContent class="sm:max-w-2xl max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>Penyesuaian Gaji - {{ payroll?.employee_name }}</DialogTitle>
             </DialogHeader>
diff --git a/resources/js/pages/admin/hr/attendances/form/AttendanceWebcamModal.vue b/resources/js/pages/admin/hr/attendances/form/AttendanceWebcamModal.vue
index 7e1f227..2467904 100644
--- a/resources/js/pages/admin/hr/attendances/form/AttendanceWebcamModal.vue
+++ b/resources/js/pages/admin/hr/attendances/form/AttendanceWebcamModal.vue
@@ -151,7 +151,7 @@ onBeforeUnmount(() => {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-lg">
+        <DialogContent class="sm:max-w-lg max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>{{ title }}</DialogTitle>
             </DialogHeader>
diff --git a/resources/js/pages/admin/manage/orders/form/CustomerQuickCreateModal.vue b/resources/js/pages/admin/manage/orders/form/CustomerQuickCreateModal.vue
index 8a97081..595a2de 100644
--- a/resources/js/pages/admin/manage/orders/form/CustomerQuickCreateModal.vue
+++ b/resources/js/pages/admin/manage/orders/form/CustomerQuickCreateModal.vue
@@ -84,7 +84,7 @@ async function submit() {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-md">
+        <DialogContent class="sm:max-w-md max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>Tambah Pelanggan</DialogTitle>
             </DialogHeader>
diff --git a/resources/js/pages/admin/manage/purchases/form/PurchasePosAddVariantDialog.vue b/resources/js/pages/admin/manage/purchases/form/PurchasePosAddVariantDialog.vue
index c6d8efb..23d634b 100644
--- a/resources/js/pages/admin/manage/purchases/form/PurchasePosAddVariantDialog.vue
+++ b/resources/js/pages/admin/manage/purchases/form/PurchasePosAddVariantDialog.vue
@@ -128,7 +128,7 @@ async function submit() {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-lg min-w-0">
+        <DialogContent class="sm:max-w-lg min-w-0 max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>Tambah Varian Baru</DialogTitle>
             </DialogHeader>
diff --git a/resources/js/pages/admin/master/customers/form/CustomerFormModal.vue b/resources/js/pages/admin/master/customers/form/CustomerFormModal.vue
index aa2f0fe..474be64 100644
--- a/resources/js/pages/admin/master/customers/form/CustomerFormModal.vue
+++ b/resources/js/pages/admin/master/customers/form/CustomerFormModal.vue
@@ -90,7 +90,7 @@ function submit() {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-md">
+        <DialogContent class="sm:max-w-md max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>{{ isEditing ? 'Ubah Customer' : 'Tambah Customer' }}</DialogTitle>
             </DialogHeader>
diff --git a/resources/js/pages/admin/master/suppliers/form/SupplierFormModal.vue b/resources/js/pages/admin/master/suppliers/form/SupplierFormModal.vue
index 0dcc297..efe40a6 100644
--- a/resources/js/pages/admin/master/suppliers/form/SupplierFormModal.vue
+++ b/resources/js/pages/admin/master/suppliers/form/SupplierFormModal.vue
@@ -90,7 +90,7 @@ function submit() {
 
 <template>
     <Dialog v-model:open="open">
-        <DialogContent class="sm:max-w-md">
+        <DialogContent class="sm:max-w-md max-h-[90dvh] flex flex-col overflow-y-auto">
             <DialogHeader>
                 <DialogTitle>{{ isEditing ? 'Ubah Supplier' : 'Tambah Supplier' }}</DialogTitle>
             </DialogHeader>