added spinner on form create/edit

resources/views/backend/pages/forms/entertainment/edit.blade.php

@@ -26,7 +26,7 @@
         <div class="container-fluid">
             <div class="card card-primary card-outline">
                 <div class="card-body">
-					<form method="POST" action="{{ route('forms.entertainment.update', $form->id) }}" enctype="multipart/form-data">
+					<form id="expense-form" method="POST" action="{{ route('forms.entertainment.update', $form->id) }}" enctype="multipart/form-data">
                         @csrf
                         @method('PUT')
                         @include('backend.layouts.partials.messages')
@@ -77,6 +77,14 @@
                             <button type="submit" class="btn btn-primary ml-2">Update</button>
                         </div>
 					</form>
+
+                    <div id="loading-spinner-overlay" class="d-none">
+                        <div class="spinner-wrapper">
+                            <div class="spinner-border text-primary" role="status">
+                            </div>
+                            <p>Submitting, please wait...</p>
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>
@@ -90,5 +98,11 @@
             decimalPlaces: 0,         // Tidak ada angka desimal
             unformatOnSubmit: true    // Nilai asli tanpa format saat dikirimkan
         });
+
+        document.getElementById('expense-form').addEventListener('submit', function (e) {
+            const spinnerOverlay = document.getElementById('loading-spinner-overlay');
+            spinnerOverlay.classList.remove('d-none'); // Show overlay
+            spinnerOverlay.classList.add('d-flex'); // Use flexbox for centering
+        });
     </script>
 @endsection