antv/thankcard-system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: forgot password

Browse Source 
config: msg
This commit is contained in:
AnhAnNek
2026-07-30 22:42:38 +07:00
parent 781a0f8aa7
commit 36eec0a664
11 changed files with 284 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/login.blade.php
+59 -1
View File
@@ -89,7 +89,12 @@
<!-- Password Field -->
<div class="space-y-1.5">
<label for="password" class="block text-[13px] font-bold text-gray-700">Mật khẩu</label>
<div class="flex items-center justify-between">
<label for="password" class="block text-[13px] font-bold text-gray-700">Mật khẩu</label>
<button type="button" onclick="openModal('modal-forgot-password')" class="text-[12px] font-semibold text-[#2563eb] hover:text-[#1d4ed8] hover:underline focus:outline-none transition-colors">
Quên mật khẩu?
</button>
</div>
<div class="relative">
<span class="absolute left-3.5 top-1/2 -translate-y-1/2 text-gray-400">
<svg class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0V10.5m-2.812 10.5h14.625c.621 0 1.125-.504 1.125-1.125V11.25c0-.621-.504-1.125-1.125-1.125H3.75c-.621 0-1.125.504-1.125 1.125v7.875c0 .621.504 1.125 1.125 1.125z" /></svg>
@@ -179,6 +184,45 @@
</div>
</div>
<!-- Modal Quên Mật Khẩu -->
<div id="modal-forgot-password" class="fixed inset-0 bg-slate-900/60 backdrop-blur-sm z-50 hidden items-center justify-center p-4 transition-opacity duration-300 opacity-0">
<div class="modal-panel bg-white rounded-2xl max-w-md w-full p-6 sm:p-8 shadow-2xl transform transition-all duration-300 scale-95 translate-y-4 relative">
<button type="button" onclick="closeModal('modal-forgot-password')" class="absolute top-4 right-4 text-gray-400 hover:text-gray-600 focus:outline-none p-1 rounded-lg">
<svg class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg>
</button>
<div class="text-center mb-6">
<div class="w-12 h-12 bg-blue-50 text-[#2563eb] rounded-full flex items-center justify-center mx-auto mb-3">
<svg class="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M15 7a2 2 0 012 2m4 0a6 6 0 01-7.743 5.743L11 17H9v2H7v2H4a1 1 0 01-1-1v-2.586a1 1 0 01.293-.707l5.964-5.964A6 6 0 1121 9z" /></svg>
</div>
<h3 class="text-xl font-bold text-gray-900">Quên mật khẩu?</h3>
<p class="text-xs text-gray-500 mt-1">Nhập địa chỉ email đăng ký tài khoản của bạn để nhận mật khẩu mới.</p>
</div>
<form action="{{ route('forgot_password') }}" method="POST" class="space-y-4">
@csrf
<div>
<label for="forgot-mail" class="block text-[13px] font-bold text-gray-700 mb-1">Email đăng ký</label>
<div class="relative">
<span class="absolute left-3.5 top-1/2 -translate-y-1/2 text-gray-400">
<svg class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75" /></svg>
</span>
<input type="email" name="mail" id="forgot-mail" placeholder="nhanvien@gmo.runsystem.vn" required value="{{ old('mail') }}" class="w-full h-[46px] pl-[42px] pr-4 bg-white border border-gray-200 rounded-lg text-sm text-gray-800 focus:border-[#2563eb] focus:ring-1 focus:ring-[#2563eb] outline-none transition-all shadow-sm" />
</div>
</div>
<div class="pt-2 flex gap-3">
<button type="button" onclick="closeModal('modal-forgot-password')" class="w-1/2 h-[42px] bg-gray-100 hover:bg-gray-200 text-gray-700 font-bold rounded-lg transition-all text-[13px]">
Hủy
</button>
<button type="submit" class="w-1/2 h-[42px] bg-[#1d4ed8] hover:bg-[#1e40af] text-white font-bold rounded-lg shadow-sm transition-all text-[13px]">
Gửi mật khẩu
</button>
</div>
</form>
</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 ý" />
@@ -196,6 +240,14 @@
<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
@if(session('dialog_forgot_error'))
<x-error-dialog id="modal-forgot-error" title="Gửi yêu cầu thất bại" message="{{ session('dialog_forgot_error') }}" buttonText="Đóng" />
@endif
@if(session('dialog_forgot_success'))
<x-success-dialog id="modal-forgot-success" title="Thành công" message="{{ session('dialog_forgot_success') }}" buttonText="Đồng ý" />
@endif
<script>
window.openModal = function(id) {
const modal = document.getElementById(id);
@@ -263,6 +315,12 @@
@if(session('dialog_error_brute_force'))
openModal('modal-error-brute-force');
@endif
@if(session('dialog_forgot_error'))
openModal('modal-forgot-error');
@endif
@if(session('dialog_forgot_success'))
openModal('modal-forgot-success');
@endif
});
</script>
</body>