@extends('frontend.trade.auth.master')
@section('content')
    <div class="reg-body">
        @include('frontend.trade.auth.send-otp')
    </div>
    <p class="mb-0">
        <a href="{{ route('trade_license.login') }}" class="link-primary text-center"> I already have a account </a>
    </p>
@endsection
@push('script')
    <script>
        $(document).ready(function () {
            $('#phone-verify-form').on('submit', function (event) {
                event.preventDefault();
                let phone = $('#phone').val();
                $.ajax({
                    type: "POST",
                    url: "{{ route('trade_license.registration.sendOtp') }}",
                    data: {phone, '_token': '{{ csrf_token() }}'},
                    beforeSend: function () {
                        $(".submitBtn").attr('disabled', true);
                    },
                    success: function (res) {
                        if (res.status === true) {
                            toastr.success(res.message);
                            $('.reg-body').empty().html(res.html);
                        } else {
                            if(res.route) {
                                setTimeout(function () {
                                    window.location(res.route);
                                }, 1500);
                            }
                            toastr.error(res.message);
                        }
                    }
                });
            });
            $(document).on('click', '.resendOTP', function(e) {
                e.preventDefault();
                let url = $(this).data('url');
                // ... AJAX call using url ...
                $.ajax({
                    type: "POST",
                    url: url,
                    data: {'_token': '{{ csrf_token() }}'},
                    beforeSend: function () {
                        $(".resendOTP").attr('disabled', true);
                    },
                    success: function (res) {
                        if (res.status === true) {
                            toastr.success(res.message);
                            setTimeout(function () {
                                $(".resendOTP").attr('disabled', false);
                            }, 5 * 60 * 1000); // 5 minutes = 300000 ms
                        } else {
                            toastr.error(res.message);
                        }
                    }
                });
            });
            // Delegate submit event for dynamically added #otp-verify-form
            $(document).on('submit', '#otp-verify-form', function (event) {
                event.preventDefault();
                let otp = $('#otp').val();
                let url = $('#url').val();
                $.ajax({
                    type: "POST",
                    url: url,
                    data: { otp, '_token': '{{ csrf_token() }}' },
                    beforeSend: function () {
                        $(".submitBtn").attr('disabled', true);
                    },
                    success: function (res) {
                        if (res.status === true) {
                            toastr.success(res.message);
                            $('.reg-body').empty().html(res.html);
                        } else {
                            toastr.error(res.message);
                        }
                    },
                    error: function (xhr) {
                        toastr.error(xhr.responseJSON?.message || 'Something went wrong');
                    }
                });
            });
            $(document).on('submit', '#registration-form', function (event) {
                event.preventDefault();

                $.ajax({
                    type: "POST",
                    url: '{{ route('trade_license.registration.store') }}',
                    data: {
                        name: $('#name').val(),
                        phone: $('#phone').val(),
                        password: $('#password').val(),
                        password_confirmation: $('#confirmation_password').val(), // make sure the field matches
                        '_token': '{{ csrf_token() }}'
                    },
                    beforeSend: function () {
                        $(".submitBtn").attr('disabled', true);
                    },
                    success: function (res) {
                        $(".submitBtn").attr('disabled', false);
                        if (res.status === true) {
                            toastr.success(res.message);
                            window.location.href = res.route;
                        } else {
                            toastr.error(res.message);
                        }
                    },
                    error: function (xhr) {
                        $(".submitBtn").attr('disabled', false);
                        if (xhr.status === 422) {
                            let errors = xhr.responseJSON.errors;
                            $.each(errors, function (key, value) {
                                toastr.error(value[0]); // show the first message for each field
                            });
                        } else {
                            toastr.error('Something went wrong. Please try again.');
                        }
                    }
                });
            });
        });
    </script>
@endpush