Files
qds/resources/views/auth/forgot-password.blade.php
dhanabalan 3f0d529640
All checks were successful
Scan for leaked secrets using Kingfisher / kingfisher-secrets-scan (push) Successful in 1m4s
Initial commit for new repo
2025-12-16 17:05:04 +05:30

447 lines
18 KiB
PHP

{{-- <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Forgot Password</title>
</head>
<body>
<h1>Forgot Password</h1>
@if (session('status'))
<div style="color: green;">
{{ session('status') }}
</div>
@endif
<form method="POST" action="{{ route('filament.admin.forgot-password.email') }}">
@csrf
<label>Email:</label>
<input type="email" name="email" required>
<button type="submit">Send Password Reset Link</button>
</form>
<a href="{{ \Filament\Facades\Filament::getPanel('admin')->getLoginUrl() }}">Back to login</a>
</body>
</html> --}}
{{-- <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Forgot Password</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-50 flex items-center justify-center h-screen">
<div class="w-full max-w-md bg-white p-8 rounded-2xl shadow-lg">
<div class="text-center mb-6">
<img src="{{ asset('/assets/crilogo1.png') }}" alt="Logo" class="mx-auto w-24 h-24">
<h1 class="mt-4 text-2xl font-bold text-gray-700">Forgot Password</h1>
<p class="text-gray-500 mt-1 text-sm">Enter your email to reset your password</p>
</div>
@if (session('status'))
<div class="mb-4 text-green-600 text-sm text-center">
{{ session('status') }}
</div>
@endif
@if ($errors->any())
<div class="mb-4 text-red-600 text-sm text-center">
{{ $errors->first() }}
</div>
@endif
<form method="POST" action="{{ route('filament.admin.forgot-password.email') }}">
@csrf
<div class="mb-4">
<label class="block text-gray-700 text-sm font-medium mb-2">Email</label>
<input type="email" name="email" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
</div>
<button type="submit"
class="w-full py-2 px-4 bg-amber-500 text-white font-semibold rounded-lg shadow-md hover:bg-amber-600 transition duration-200">
Generate OTP
</button>
</form>
<div class="mt-6 text-center">
<a href="{{ \Filament\Facades\Filament::getPanel('admin')->getLoginUrl() }}"
class="text-amber-500 hover:underline font-medium text-sm">
Back to login
</a>
</div>
</div>
</body>
</html> --}}
{{-- Imp --}}
{{-- <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Forgot Password</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
</head>
<body class="bg-gray-50 flex items-center justify-center h-screen">
<div class="w-full max-w-md bg-white p-8 rounded-2xl shadow-lg" x-data="{ otpSent: false, email: '', error: '' }">
<div class="text-center mb-6">
<img src="{{ asset('/assets/crilogo1.png') }}" alt="Logo" class="mx-auto w-24 h-24">
<h1 class="mt-4 text-2xl font-bold text-gray-700">Forgot Password</h1>
<p class="text-gray-500 mt-1 text-sm">Enter your email to reset your password</p>
</div>
<!-- Display session status -->
@if (session('status'))
<div class="mb-4 text-green-600 text-sm text-center">
{{ session('status') }}
</div>
@endif
<!-- Display backend validation errors -->
@if ($errors->any())
<div class="mb-4 text-red-600 text-sm text-center">
{{ $errors->first() }}
</div>
@endif
<!-- Front-end error -->
<div class="mb-4 text-red-600 text-sm text-center" x-show="error" x-text="error"></div>
<!-- Frontend success -->
<div class="mb-4 text-green-600 text-sm text-center" x-show="success" x-text="success"></div>
<form method="POST" action="{{ route('filament.admin.forgot-password.otp') }}">
@csrf
<!-- Email input -->
<div class="mb-4">
<label class="block text-gray-700 text-sm font-medium mb-2">Email</label>
<input type="email" name="email" x-model="email" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500"
x-bind:readonly="otpSent">
</div>
<!-- OTP input -->
<div class="mb-4" x-show="otpSent" x-transition>
<label class="block text-gray-700 text-sm font-medium mb-2">Enter OTP</label>
<input type="text" name="otp" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
</div>
<!-- New password -->
<div class="mb-4" x-show="otpSent" x-transition>
<label class="block text-gray-700 text-sm font-medium mb-2">New Password</label>
<input type="password" name="password" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
</div>
<!-- Confirm password -->
<div class="mb-4" x-show="otpSent" x-transition>
<label class="block text-gray-700 text-sm font-medium mb-2">Confirm Password</label>
<input type="password" name="password_confirmation" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
</div>
<!-- Submit / Generate OTP button -->
<button type="submit"
class="w-full py-2 px-4 bg-amber-500 text-white font-semibold rounded-lg shadow-md hover:bg-amber-600 transition duration-200"
x-on:click.prevent="
error = '';
if (!email) {
error = 'Please enter your email';
return;
}
otpSent = true;
">
<span x-text="otpSent ? 'Reset Password' : 'Generate OTP'"></span>
</button>
</form>
<div class="mt-6 text-center">
<a href="{{ \Filament\Facades\Filament::getPanel('admin')->getLoginUrl() }}"
class="text-amber-500 hover:underline font-medium text-sm">
Back to login
</a>
</div>
</div>
</body>
</html> --}}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Forgot Password</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
</head>
<body class="bg-gray-50 flex items-center justify-center h-screen">
<div class="w-full max-w-md bg-white p-8 rounded-2xl shadow-lg"
x-data="{
email: '',
showFields: false,
error: '',
success: ''
}">
<!-- Logo & Heading -->
<div class="text-center mb-6">
<img src="{{ asset('/assets/crilogo1.png') }}" alt="Logo" class="mx-auto w-24 h-24">
{{-- <img src="{{ Storage::url('app/private/uploads/CRI/crilogo1.png') }}" alt="Logo" class="mx-auto w-24 h-24"> --}}
<h1 class="mt-4 text-2xl font-bold text-gray-700">Forgot Password</h1>
<p class="text-gray-500 mt-1 text-sm">Enter your email to reset your password</p>
</div>
<!-- Frontend error / success -->
<div class="mb-4 text-red-600 text-sm text-center" x-show="error" x-text="error"></div>
<div class="mb-4 text-green-600 text-sm text-center" x-show="success" x-text="success"></div>
<!-- Email & Password Form -->
<form x-data="{
email: '',
old_password: '',
password: '',
password_confirmation: '',
showFields: false,
emailError: '',
passwordError: '',
oldPasswordError: '',
newPasswordError: '',
error: '',
success: ''
}"
x-on:submit.prevent="
oldPasswordError=''; newPasswordError=''; error=''; passwordError=''; success='';
fetch('{{ route('filament.admin.forgot-password.otp') }}', {
method:'POST',
headers:{
'Content-Type':'application/json',
'X-CSRF-TOKEN':'{{ csrf_token() }}'
},
body: JSON.stringify({
email: email,
old_password: old_password,
password: password,
password_confirmation: password_confirmation
})
})
.then(res=>res.json())
.then(data => {
if(data.success){
// Success
success = data.success;
old_password = '';
password = '';
password_confirmation = '';
} else {
oldPasswordError = data.oldPasswordError || '';
newPasswordError = data.newPasswordError || '';
passwordError = data.passwordError || '';
}
})
.catch(() => {
passwordError = 'Something Went Wrong.';
});
"
>
@csrf
<!-- Email -->
<div class="mb-4">
<label class="block text-gray-700 text-sm font-medium mb-2">Email</label>
<input type="email" x-model="email" :readonly="showFields"
@keydown.enter.prevent="$refs.continueBtn.click()"
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
<div class="text-red-600 text-sm mt-1" x-text="emailError" x-show="emailError"></div>
</div>
<!-- Continue button (Check email) -->
<button type="button" x-show="!showFields" x-ref="continueBtn"
class="w-full py-2 px-4 bg-amber-500 text-white font-semibold rounded-lg shadow-md hover:bg-amber-600 transition duration-200"
x-on:click="
emailError=''; success='';
if(!email){ emailError='Please enter your email'; return; }
// Simple email regex check
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
if(!emailPattern.test(email)){
emailError='Please enter a valid email';
return;
}
fetch('{{ route('admin.check-email') }}',{
method:'POST',
headers:{
'Content-Type':'application/json',
'X-CSRF-TOKEN':'{{ csrf_token() }}'
},
body:JSON.stringify({email: email})
})
.then(res=>res.json())
.then(data=>{
if(data.exists){
showFields=true;
} else {
emailError='No user found with this email.';
}
})
.catch(()=> emailError='Something went wrong.');
"
>Continue</button>
<!-- Old / New / Confirm Password -->
<div x-show="showFields" x-transition class="mt-4 space-y-4">
{{-- <div>
<label class="block text-gray-700 text-sm font-medium mb-2">Old Password</label>
<input type="password" x-model="old_password" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
<div class="text-red-600 text-sm mt-1" x-text="oldPasswordError" x-show="oldPasswordError"></div>
</div> --}}
<!-- Old Password -->
<div x-data="{ show: false }" class="relative">
<label class="block text-gray-700 text-sm font-medium mb-2">Old Password</label>
<input :type="show ? 'text' : 'password'" x-model="old_password"
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
<button type="button" @click="show = !show" class="absolute right-3 top-8 flex items-center text-gray-500">
<svg x-show="!show" xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.477 0 8.268 2.943 9.542 7-1.274 4.057-5.065 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />
</svg>
<svg x-show="show" xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.269-2.944-9.543-7a10.05 10.05 0 012.175-3.293M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 3l18 18" />
</svg>
</button>
<div class="text-red-600 text-sm mt-1" x-text="oldPasswordError" x-show="oldPasswordError"></div>
</div>
{{-- <div>
<label class="block text-gray-700 text-sm font-medium mb-2">New Password</label>
<input type="password" x-model="password" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
</div> --}}
<div x-data="{ show: false }" class="relative">
<label class="block text-gray-700 text-sm font-medium mb-2">New Password</label>
<input :type="show ? 'text' : 'password'" x-model="password" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
<button type="button" @click="show = !show"
class="absolute right-3 top-8 flex items-center text-gray-500">
<!-- Eye open -->
<svg x-show="!show" xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M2.458 12C3.732 7.943 7.523 5 12 5c4.477 0 8.268 2.943 9.542 7-1.274 4.057-5.065 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />
</svg>
<!-- Eye closed -->
<svg x-show="show" xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.269-2.944-9.543-7a10.05 10.05 0 012.175-3.293M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 3l18 18" />
</svg>
</button>
</div>
{{-- <div>
<label class="block text-gray-700 text-sm font-medium mb-2">Confirm Password</label>
<input type="password" x-model="password_confirmation" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
<div class="text-red-600 text-sm mt-1" x-text="newPasswordError" x-show="newPasswordError"></div>
</div> --}}
<div x-data="{ show: false }" class="relative">
<label class="block text-gray-700 text-sm font-medium mb-2">Confirm Password</label>
<input :type="show ? 'text' : 'password'" x-model="password_confirmation" required
class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-amber-500 focus:border-amber-500">
<button type="button" @click="show = !show"
class="absolute right-3 top-8 flex items-center text-gray-500">
<!-- Eye open -->
<svg x-show="!show" xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M2.458 12C3.732 7.943 7.523 5 12 5c4.477 0 8.268 2.943 9.542 7-1.274 4.057-5.065 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />
</svg>
<!-- Eye closed -->
<svg x-show="show" xmlns="http://www.w3.org/2000/svg" class="h-7 w-7" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.269-2.944-9.543-7a10.05 10.05 0 012.175-3.293M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 3l18 18" />
</svg>
</button>
<div class="text-red-600 text-sm mt-1" x-text="newPasswordError" x-show="newPasswordError"></div>
</div>
<button type="submit"
class="w-full py-2 px-4 bg-green-500 text-white font-semibold rounded-lg hover:bg-green-600 transition duration-200">
Update Password
</button>
<div class="text-green-600 text-sm mt-2" x-text="success" x-show="success"></div>
<!-- Old Password Error -->
</div>
</form>
<!-- Flash messages -->
@if(session('status'))
<div class="mt-2 text-green-600 text-sm text-center">
{{ session('status') }}
</div>
@endif
@if($errors->any())
<div class="mt-2 text-red-600 text-sm text-center">
{{ $errors->first() }}
</div>
@endif
<div class="mt-6 text-center">
<a href="{{ \Filament\Facades\Filament::getPanel('admin')->getLoginUrl() }}"
class="text-amber-500 hover:underline font-medium text-sm">
Back to login
</a>
</div>
</div>
</body>
</html>