@extends('layout.store_layout.master')
@section('custom_css')
@endsection
@section('content')
    <div class="card mb-7">
        <div class="card-header card-header-stretch">
            <h3 class="card-title">تفاصيل المنتج</h3>
            <div class="card-toolbar">
                <ul class="nav nav-tabs nav-line-tabs nav-stretch fs-6 border-0">
                    <li class="nav-item">
                        <a class="nav-link active" data-bs-toggle="tab" href="#overview_tab">@lang('general.overview')</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" data-bs-toggle="tab" href="#orders_tab">إدارة المخزون</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <div class="tab-content mb-7" id="myTabsContent">
        <div class="tab-pane fade show active" id="overview_tab" role="tabpanel">
            @include('pages.store_admin.products.sections.overview')
        </div>
        <div class="tab-pane fade " id="orders_tab" role="tabpanel">
            @include('pages.store_admin.products.sections.inventory_management')
        </div>
    </div>




@endsection

@section('custom_js')
{{--    <script src="{{ asset('assets/js/custom/apps/customers/view/adjust-balance.js') }}"></script>--}}
{{--    <script src="{{ asset('assets/js/custom/utilities/modals/new-card.js') }}"></script>--}}
    {{--<script src="{{ asset('assets/js/custom/apps/ecommerce/sales/listing.js') }}"></script>--}}

    <script>
        $(document).ready(function () {
            $('#product_variant_id').on('change',function(){
                $('#search_form').submit();
            });
            $('#operation_type').on('change',function(){
                $('#search_form').submit();
            });
            $(document).on('change','.status_change',function(e){
                var o = $(this);
                var link = $(this).attr('data-link');
                var reverselink = $(this).attr('data-reverselink');
                var id = '{{$item->id}}';
                console.log(id);
                $.ajax({
                    type: "POST",
                    url: link,
                    data: {id:id},
                    cache: false,
                    headers: {
                        'X-CSRF-TOKEN': "{{ csrf_token() }}"
                    },
                    success: function (data) {

                        if (data.done === 1) {
                            o.attr('data-link',reverselink);
                            o.attr('data-reverselink',link);
                            setTimeout(function () {
                                Swal.fire({
                                    text: "تمت العملية بنجاح!",
                                    icon: "success",
                                    buttonsStyling: false,
                                    confirmButtonText: "تم!",
                                    customClass: {
                                        confirmButton: "btn btn-primary"
                                    }
                                });
                            }, 2000);
                        }
                    },
                    error: function (data) {
                        // Enable submit button after loading
                        submitButton.setAttribute('data-kt-indicator', 'off');
                        submitButton.disabled = false;
                        Swal.fire({
                            icon: "error",
                            title: 'حدثت خلل أثناء العملية',
                            timer: 4000
                        });
                    }
                });
            });
        })
    </script>
<script>
    var rules = {
        @if(count($item->variants) > 1)
        'product_variant_id': {
            validators: {
                notEmpty: {
                    message: 'خيار المنتج مطلوب'
                },
            }
        },
        @endif
        'operation_type': {
            validators: {
                notEmpty: {
                    message: 'نوع الحركة حقل مطلوب'
                }

            },
        },
        'qty': {
            validators: {
                notEmpty: {
                    message: 'الكمية حقل مطلوب'
                },
            }
        } ,
        'price': {
            validators: {
                notEmpty: {
                    message: 'السعر حقل مطلوب'
                },
            }
        }
    };
    // Define variables
    let validator;

    // Get elements
    const form = document.getElementById('form');
    const submitButton = document.getElementById('save_transaction');

    // Init form validation rules. For more info check the FormValidation plugin's official documentation:https://formvalidation.io/
    validator = FormValidation.formValidation(
        form,
        {
            locale: 'ar_MA',
            localization: FormValidation.locales.en_US,
            fields: rules,
            plugins: {
                trigger: new FormValidation.plugins.Trigger(),
                bootstrap: new FormValidation.plugins.Bootstrap5({
                    rowSelector: '.fv-row',
                    eleInvalidClass: '',
                    eleValidClass: ''
                })
            }
        }
    );

    // Handle submit button
    submitButton.addEventListener('click', e => {
        e.preventDefault();

        // Validate form before submit
        if (validator) {
            validator.validate().then(function (status) {
                console.log('validated!');

                if (status == 'Valid') {
                    var form_data = new FormData($('#form')[0]);
                    console.log(form_data);

                    submitButton.setAttribute('data-kt-indicator', 'on');
                    // Disable submit button whilst loading
                    submitButton.disabled = true;
                    $.ajax({
                        type: "POST",
                        url: "{{route('admin.products.create-stock')}}",
                        data: form_data,
                        cache: false,
                        contentType: false,
                        processData: false,
                        headers: {
                            'X-CSRF-TOKEN': "{{ csrf_token() }}"
                        },
                        success: function (data) {

                            if (data.status === 0) {
                                // Enable submit button after loading
                                submitButton.setAttribute('data-kt-indicator', 'off');
                                submitButton.disabled = false;
                                if (data.errors && data.errors.length > 0) {
                                    var errors = data.errors;
                                    for (var error = 0; error < errors.length; error++) {
                                        var input_name = errors[error].input_name;
                                        var input_error = errors[error].errors;
                                        console.log(input_name, input_error);
                                        $('#' + input_name + '_error').html(input_error).show();

                                    }
                                }
                                // Swal.fire({
                                //     text: "عذرا! يجب معالجة بعض الأخطاء",
                                //     icon: "error",
                                //     buttonsStyling: false,
                                //     confirmButtonText: "تم!",
                                //     customClass: {
                                //         confirmButton: "btn btn-primary"
                                //     }
                                // });
                            } else {
                                setTimeout(function () {
                                    submitButton.removeAttribute('data-kt-indicator');

                                    Swal.fire({
                                        text: "تمت عملية الاضافة بنجاح!",
                                        icon: "success",
                                        buttonsStyling: false,
                                        confirmButtonText: "تم!",
                                        customClass: {
                                            confirmButton: "btn btn-primary"
                                        }
                                    }).then(function (result) {
                                        if (result.isConfirmed) {
                                            // Enable submit button after loading
                                            submitButton.setAttribute('data-kt-indicator', 'off');
                                            submitButton.disabled = false;

                                            // Redirect to customers list page
                                            window.location = data.route ? data.route : form.getAttribute("data-kt-redirect");
                                        }
                                    });
                                }, 2000);
                            }
                        },
                        error: function (data) {
                            // Enable submit button after loading
                            submitButton.setAttribute('data-kt-indicator', 'off');
                            submitButton.disabled = false;
                            Swal.fire({
                                icon: "error",
                                title: 'حدثت خلل أثناء العملية',
                                timer: 4000
                            });
                        }
                    });


                } else {
                    // Enable submit button after loading
                    submitButton.setAttribute('data-kt-indicator', 'off');
                    submitButton.disabled = false;
                    // Swal.fire({
                    //     text: "عذرا! يجب ملئ الحقول الفارغة",
                    //     icon: "error",
                    //     buttonsStyling: false,
                    //     confirmButtonText: "تم!",
                    //     customClass: {
                    //         confirmButton: "btn btn-primary"
                    //     }
                    // });
                }
            });
        }
    })
</script>
@endsection