@extends('layouts.front_end')
@section('title', 'Forget Password')
@section('content')
    {{-- <div class="wrapper-content">
        <div class="container">
            <div class="row">
                <form id="otpUpdate" class="col-sm-16" method="POST" action="{{ route('forget_password.update') }}">
                    @csrf
                    <div class="row">
                        <div class="offset-md-11 col-md-11">
                            <h3 class="mt-2 text-center">Forget Passsword</h3>
                            <hr class="my-2">

                        </div>

                        <div class="offset-md-11 col-md-11">
                            <div class="form-group">
                                <div class="col-lg-16 col-md-16">
                                    <label>Mobile:</label>
                                    <div class="input-group">
                                        <div class="input-group-prepend">
                                            <span class="input-group-text" id="basic-addon1">+88</span>
                                        </div>
                                        <input type="text" name="mobile" class="form-control" value="">
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-lg-16 col-md-16 verify_required">
                                    <center>
                                        <button type="button" class="btn btn-info send_verify_code">Send Verify
                                            Code</button>
                                    </center>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-lg-16 col-md-16">
                                    <label>OTP Code:</label>
                                    <input type="number" name="verify_code" class="form-control">

                                </div>

                            </div>
                            <div class="form-group">
                                <div class="col-lg-16 col-md-16 verify_required">
                                    <center>
                                        <button type="submit" class="btn btn-primary">Verify</button>
                                    </center>
                                </div>
                            </div>
                        </div>

                    </div>
            </div>
            </form>
        </div>
    </div>
 --}}



    <section class="my-account-area pattern-bg pt-100 pb-100"
    data-background="{{ URL::asset('venam/') }}/img/bg/pattern_bg.jpg"
    style="background-image: url(&quot;img/bg/pattern_bg.jpg&quot;);">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-xl-8 col-lg-10">
                <div class="login-page-title">
                    <h2 class="title"><span>Forget Passsword</h2>
                </div>

                @if (count($errors) > 0)
                <div class="alert alert-danger">
                    <ul>
                        @foreach ($errors->all() as $error)
                        <li> {{$error}}</li>
                        @endforeach
                    </ul>
                </div>
              @endif

                <div class="my-account-bg" data-background="{{ URL::asset('venam/') }}/img/bg/my_account_bg.png"
                    style="background-image: url(&quot;img/bg/my_account_bg.png&quot;);">
                    <div class="my-account-content">
                        <form class="login-form" id="otpUpdate" method="POST" action="{{ route('forget_password.update') }}">
                            @csrf
                            <div class="form-grp">
                                <label for="uea">Mobile:</label>
                                <input type="text" name="mobile" placeholder="Enter Your Mobile Number" class="form-control" value="">
                            </div>
                            <div class="form-grp-btn verify_required" >
                                <button class="btn btn-success send_verify_code" type="button">Send Verify
                                    Code</button>
                            </div>
                                <br>
                                <hr>
                            <div class="form-grp">
                                <label for="uea">OTP Code:</label>
                                <input type="number" name="verify_code" placeholder="Enter Otp Number" class="form-control" value="">
                            </div>
                            <div class="form-grp-btn verify_required" >
                                <button class="btn btn-success" type="submit">Verify</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

@endsection
@section('script')
    {{-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/4.3.0/jquery.form.min.js" integrity="sha384-qlmct0AOBiA2VPZkMY3+2WqkHtIQ9lSdAsAn5RUJD/3vA5MKDgSGcdmIv4ycVxyn" crossorigin="anonymous"></script> --}}
    {{-- <script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script> --}}
    {{-- <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> --}}
    {{-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/4.3.0/jquery.form.min.js" integrity="sha384-qlmct0AOBiA2VPZkMY3+2WqkHtIQ9lSdAsAn5RUJD/3vA5MKDgSGcdmIv4ycVxyn" crossorigin="anonymous"></script> --}}
    <script>
        $(document).ready(function() {
            $('.verify_required').show();
            $('.verified').hide();

            $('#otpUpdate').ajaxForm({
                beforeSend: formBeforeSend,
                beforeSubmit: formBeforeSubmit,
                error: formError,
                success: function(responseText, statusText, xhr, $form) {
                    swal({
                        title: responseText.message,
                        text: "You will redirect to Your Account",
                        type: "warning",
                        showCancelButton: false,
                        confirmButtonClass: "btn-success",
                        confirmButtonText: "Ok",
                        closeOnConfirm: false
                        // },
                        // function(){
                        //     window.location.href = "{{ route('my-account') }}";
                    }).then(function() {
                        window.location = "{{ route('forget_password.change') }}";
                    });
                    $('.verify_required').hide();
                    $('.verified').show();
                }
            });

            $(document).on('click', '.send_verify_code', function(event) {
                console.log(true);
                event.preventDefault();

                $(event).ajaxSubmit({
                    type: 'POST',
                    url: "{{ route('forget_password.update') }}",
                    data: {
                        mobile: $('input[name="mobile"]').val(),
                        resend: '#'
                    },
                    beforeSend: formBeforeSend,
                    beforeSubmit: formBeforeSubmit,
                    error: formError,
                    success: function(responseText, statusText, xhr, $form) {
                        console.log(responseText);
                        formSuccess(responseText, statusText, xhr, $form);
                    }
                });

            });
        });
    </script>
@endsection