feature: update message for login feature

resources/views/login.blade.php

@@ -65,7 +65,7 @@
 
             <!-- Form -->
             <div class="w-full max-w-[380px] mx-auto flex-1 relative z-10">
-                <form action="{{ route('login') }}" method="POST" class="space-y-5">
+                <form action="{{ route('login') }}" method="POST" class="space-y-5" novalidate>
                     @csrf
                     
                     <div class="min-h-[40px] flex items-center justify-center transition-all duration-300" aria-live="polite">
@@ -180,5 +180,91 @@
         </div>
     </div>
 
+    <!-- Dialogs -->
+    @if(session('dialog_error_permission'))
+        <x-error-dialog id="modal-error-permission" title="Truy cập bị từ chối" message="{{ session('dialog_error_permission') }}" buttonText="Đồng ý" />
+    @endif
+
+    @if(session('session_expired'))
+        <x-warning-dialog id="modal-session-expired" title="Phiên làm việc hết hạn" message="Phiên đăng nhập đã hết hạn. Vui lòng đăng nhập lại." buttonText="OK" onclick="handleSessionExpiredOk()" />
+    @endif
+
+    @if(session('dialog_first_login'))
+        <x-info-dialog id="modal-first-login" title="Yêu cầu đổi mật khẩu" message="Vui lòng đổi mật khẩu trước khi tiếp tục sử dụng hệ thống." buttonText="OK" onclick="handleFirstLoginOk()" />
+    @endif
+
+    @if(session('dialog_error_brute_force'))
+        <x-error-dialog id="modal-error-brute-force" title="Tài khoản bị khóa" message="{{ session('dialog_error_brute_force') }}" buttonText="Đồng ý" />
+    @endif
+
+    <script>
+        window.openModal = function(id) {
+            const modal = document.getElementById(id);
+            if (!modal) return;
+            document.body.style.overflow = 'hidden';
+            modal.classList.remove('hidden');
+            modal.classList.add('flex');
+            requestAnimationFrame(() => {
+                modal.classList.remove('opacity-0');
+                modal.classList.add('opacity-100');
+                const panel = modal.querySelector('.modal-panel');
+                if (panel) {
+                    panel.classList.remove('scale-95', 'translate-y-4');
+                    panel.classList.add('scale-100', 'translate-y-0');
+                }
+            });
+            modal.setAttribute('tabindex', '-1');
+            modal.focus();
+            const escHandler = function(e) {
+                if (e.key === 'Escape') {
+                    closeModal(id);
+                    modal.removeEventListener('keydown', escHandler);
+                }
+            };
+            modal.addEventListener('keydown', escHandler);
+        };
+
+        window.closeModal = function(id) {
+            const modal = document.getElementById(id);
+            if (!modal) return;
+            modal.classList.remove('opacity-100');
+            modal.classList.add('opacity-0');
+            const panel = modal.querySelector('.modal-panel');
+            if (panel) {
+                panel.classList.remove('scale-100', 'translate-y-0');
+                panel.classList.add('scale-95', 'translate-y-4');
+            }
+            setTimeout(() => {
+                modal.classList.add('hidden');
+                modal.classList.remove('flex');
+                document.body.style.overflow = '';
+            }, 300);
+        };
+
+        window.handleSessionExpiredOk = function() {
+            closeModal('modal-session-expired');
+            window.location.href = "{{ route('login') }}";
+        };
+
+        window.handleFirstLoginOk = function() {
+            closeModal('modal-first-login');
+            window.location.href = "{{ route('user.change_password') }}";
+        };
+
+        document.addEventListener('DOMContentLoaded', () => {
+            @if(session('dialog_error_permission'))
+                openModal('modal-error-permission');
+            @endif
+            @if(session('session_expired'))
+                openModal('modal-session-expired');
+            @endif
+            @if(session('dialog_first_login'))
+                openModal('modal-first-login');
+            @endif
+            @if(session('dialog_error_brute_force'))
+                openModal('modal-error-brute-force');
+            @endif
+        });
+    </script>
 </body>
 </html>