@extends('layouts.auth')
@section('content')
<div class="d-flex flex-column-fluid flex-center">
    <!--begin::Signin-->
    <div class="login-form login-signin">
        <!--begin::Form-->
        <form class="form" novalidate="novalidate" action="{{route('post-reset-password',['token'=>$token])}}" id="login_form">
            {{csrf_field()}}
            <!--begin::Title-->
            <div class="pb-13 pt-lg-0 pt-5">
                <h3 class="font-weight-bolder text-dark font-size-h4 font-size-h1-lg">Reset Password</h3>
               
            </div>
            <!--begin::Title-->
            
            <!--begin::Form group-->
            <div class="form-group">
                <label class="font-size-h6 font-weight-bolder text-dark">Password</label>
                <input class="form-control form-control-solid h-auto py-6 px-6 rounded-lg" type="password" name="password" autocomplete="off" />
                <div class="invalid-feedback"></div>
            </div>
            <!--end::Form group-->
            <!--begin::Form group-->
            <div class="form-group">
                <label class="font-size-h6 font-weight-bolder text-dark">Confirm Password</label>
                <input class="form-control form-control-solid h-auto py-6 px-6 rounded-lg" type="password" name="confirm_password" autocomplete="off" />
                <div class="invalid-feedback"></div>
            </div>
            <!--end::Form group-->
            <!--begin::Action-->
            <div class="pb-lg-0 pb-5">
                <button type="submit" id="login_button" class="btn btn-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 mr-3 ">Reset Password</button>
                
            </div>
            <!--end::Action-->
        </form>
        <!--end::Form-->
    </div>
    <!--end::Signin-->
</div>
@endsection
@section('page_js')
    <script>
        $(document).ready(function(){
            $(document).on('submit', '#login_form', function(e){
                e.preventDefault();
                var _that=$(this);
                // var button1= $(this).find('button[type="submit"]');
                // console.log(button1)
                var button = KTUtil.getById("login_button");
                KTUtil.btnWait(button, "spinner spinner-right spinner-white pr-15", "Please wait");
                $(".invalid-feedback").html('');
                $(".is-invalid").removeClass('is-invalid')
                $.ajax({
                    url : $(this).attr('action'),
                    type : 'post',
                    dataType : "json",
                    data : $(this).serialize(),
                    success: function(response) {
                        if(response.status){
                            window.location.href= response.return_url
                        } else {
                            if(response.errors){
                                Object.keys(response.errors).forEach(element_name => {
                                    var errors = response.errors[element_name];
                                    var inp=$(_that).find('[name="'+element_name+'"]')
                                    $(inp).addClass('is-invalid')
                                    $(inp).closest('.form-group').find('.invalid-feedback').html(errors[0])
                                });
                            }
                        }
                        KTUtil.btnRelease(button);
                    },
                    error: function(response) {
                        KTUtil.btnRelease(button);
                    }
                });
            })
        })
    </script>
@endsection