@extends('layout.wrapper_login')

@section('contents')
    <form id="verify_form">
        <div class="container">
            <div class="row" style="position: relative; z-index: 5;">
                <div class="col-lg-12" style="position: relative; z-index: 5;">
                    <div class="section-heading">
                        <h1 class="text-center">Lupa Password</h1>
                    </div>
                </div>
                <div class="col-lg-12">
                    <fieldset>
                        <label>Email :</label>
                        <input type="text" name="email" id="email" autocomplete="off"
                               placeholder="Masukan Email" autocomplete="on" required>
                    </fieldset>
                </div>
                <div class="col-lg-12">
                    <fieldset>
                        <button type="submit" id="btn_verify" class="main-gradient-button">
                            <!--begin::Indicator label-->
                            <span id="indicator-label">Kirim</span>
                            <!--end::Indicator label-->
                            <!--begin::Indicator progress-->
                            <span id="indicator-progress" class="d-none">Please wait...
                                                <span class="spinner-border spinner-border-sm align-middle ms-2"></span>
                                            </span>
                            <!--end::Indicator progress-->
                        </button>
                    </fieldset>
                </div>
            </div>
        </div>
    </form>
@endsection
@section('scripts')
    <script>
        $('#verify_form').on('submit', (event) => {
            event.preventDefault()
            btnLoader($('#btn_verify'))
            axios.post('{{ route('forgot-password.send') }}', $(event.currentTarget).serialize()).then(response => {
                if (response.data.success === true) {
                    Swal.fire({
                        icon: 'success',
                        title: response.data.message,
                        showConfirmButton: false
                    })
                    location.replace('{{ route('login') }}')
                } else {
                    btnLoader($('#btn_verify'))
                    Swal.fire({
                        icon: 'warning',
                        title: response.data.message
                    })
                }
            }).catch(error => {
                btnLoader($('#btn_verify'))
                Swal.fire({
                    icon: 'error',
                    title: 'System Error'
                })
            })
        })
    </script>
@endsection