

<?php $__env->startSection('title', $page_title); ?>

<?php $__env->startPush('styles'); ?>
    <link rel="stylesheet" href="css/jquery-ui.css" />
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
    <div class="d-flex flex-column-fluid">
        <div class="container-fluid">
            <!--begin::Notice-->
            <div class="card card-custom gutter-b">
                <div class="card-header flex-wrap py-5">
                    <div class="card-title">
                        <h3 class="card-label"><i class="<?php echo e($page_icon); ?> text-primary"></i> <?php echo e($sub_title); ?></h3>
                    </div>
                    <div class="card-toolbar">
                        <!--begin::Button-->
                        <a href="<?php echo e(route('product')); ?>" class="btn btn-warning btn-sm font-weight-bolder">
                            <i class="fas fa-arrow-left"></i> Back</a>
                        <!--end::Button-->
                    </div>
                </div>
            </div>
            <!--end::Notice-->
            <!--begin::Card-->
            <div class="card card-custom" style="padding-bottom: 100px !important;">
                <div class="card-body" style="padding-bottom: 100px !important;">
                    <!--begin: Datatable-->
                    <div id="kt_datatable_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer pb-5">

                        <form id="generate-barcode-form" method="POST">
                            <?php echo csrf_field(); ?>
                            <div class="row">
                                <input type="hidden" class="form-control" name="product_name" id="product_name">
                                <input type="hidden" class="form-control" name="product_category" id="product_category">
                                <input type="hidden" class="form-control" name="size_name" id="size_name">
                                <input type="hidden" class="form-control" name="product_code" id="product_code">
                                <input type="hidden" class="form-control" name="product_variant_name"
                                    id="product_variant_name">
                                <input type="hidden" class="form-control" name="product_price" id="product_price">
                                <input type="hidden" class="form-control" name="barcode_symbology" id="barcode_symbology">
                                <input type="hidden" class="form-control" name="tax_rate" id="tax_rate">
                                <input type="hidden" class="form-control" name="tax_method" id="tax_method">
                                <div class="form-group col-md-12">
                                    <label for="product_code_name">Select Product</label>
                                    <div class="input-group mb-3">
                                        <div class="input-group-prepend">
                                            <span class="input-group-text" id="basic-addon1"><i
                                                    class="fas fa-barcode"></i></span>
                                        </div>
                                        <input type="text" class="form-control" name="product_code_name"
                                            id="product_code_name" placeholder="Please type product code and select...">
                                    </div>
                                </div>
                                <?php if (isset($component)) { $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4 = $component; } ?>
<?php $component = $__env->getContainer()->make(Illuminate\View\AnonymousComponent::class, ['view' => 'components.form.textbox','data' => ['labelName' => 'No of Barcode','name' => 'barcode_qty','required' => 'required','col' => 'col-md-2','class' => 'text-center','value' => '1','placeholder' => 'Enter barcode print quantity']]); ?>
<?php $component->withName('form.textbox'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes(['labelName' => 'No of Barcode','name' => 'barcode_qty','required' => 'required','col' => 'col-md-2','class' => 'text-center','value' => '1','placeholder' => 'Enter barcode print quantity']); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4)): ?>
<?php $component = $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4; ?>
<?php unset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4); ?>
<?php endif; ?>
                                <?php if (isset($component)) { $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4 = $component; } ?>
<?php $component = $__env->getContainer()->make(Illuminate\View\AnonymousComponent::class, ['view' => 'components.form.textbox','data' => ['labelName' => 'Qunatity Each Row ','name' => 'row_qty','required' => 'required','col' => 'col-md-2','class' => 'text-center','value' => '1','placeholder' => 'Enter barcode print quantity']]); ?>
<?php $component->withName('form.textbox'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes(['labelName' => 'Qunatity Each Row ','name' => 'row_qty','required' => 'required','col' => 'col-md-2','class' => 'text-center','value' => '1','placeholder' => 'Enter barcode print quantity']); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4)): ?>
<?php $component = $__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4; ?>
<?php unset($__componentOriginalc254754b9d5db91d5165876f9d051922ca0066f4); ?>
<?php endif; ?>
                                <div class="form-group col-md-2 d-none">
                                    <label for="">Print With</label>
                                    <div class="div">
                                        <div class="custom-control custom-checkbox">
                                            <input type="checkbox" class="custom-control-input" id="pname"
                                                checked="">
                                            <label class="custom-control-label" for="pname">SKU</label>
                                        </div>
                                        <div class="custom-control custom-checkbox">
                                            <input type="checkbox" class="custom-control-input" id="price"
                                                checked="">
                                            <label class="custom-control-label" for="price">Price</label>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group col-md-2 d-none">
                                    <label for="">Print With Category</label>
                                    <div class="div" id="categories_list">


                                    </div>
                                </div>
                                <div class="form-group col-md-3" style="padding-top:28px;">
                                    <button type="button" class="btn btn-primary btn-sm" id="generate-barcode"><i
                                            class="fas fa-barcode"></i>Generate Barcode</button>
                                </div>
                            </div>
                        </form>

                        <div class="row" id="barcode-section">
                            
                        </div>
                    </div>
                    <!--end: Datatable-->
                </div>
            </div>
            <!--end::Card-->
        </div>
    </div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
    <script src="js/jquery-ui.js"></script>
    <script src="js/jquery.printarea.js"></script>
    <script>
        $(document).ready(function() {
            $('#product_code_name').autocomplete({
                // source: "<?php echo e(url('product-autocomplete-search')); ?>",
                source: function(request, response) {
                    // Fetch data
                    $.ajax({
                        url: "<?php echo e(url('barcode/product-autocomplete-search')); ?>",
                        type: 'post',
                        dataType: "json",
                        data: {
                            _token: _token,
                            search: request.term
                        },
                        success: function(data) {
                            response(data);
                        }
                    });
                },
                minLength: 3,
                response: function(event, ui) {
                    if (ui.content.length == 1) {
                        // var data = ui.content[0].code;
                        $('#product_category').val(ui.content[0].category);


                        let categories_list = ui.content[0].categories;
                        $('#categories_list').empty();

                        let cat_html = '';
                        $.each(categories_list, function(key, item) {
                            cat_html += `<div class="custom-control custom-checkbox" >
                    <input type="checkbox" class="custom-control-input" id="pname_${key}" name="category_checkbox[]" value="${item.name}" checked="">
                    <label class="custom-control-label" for="pname_${key}">${item.name}</label>
                </div>`;
                        });

                        $('#categories_list').append(cat_html);
                        $('#size_name').val(ui.content[0].size_name);
                        $('#product_code_name').val(ui.content[0].value)
                        $('#product_name').val(ui.content[0].name);
                        $('#product_code').val(ui.content[0].code);
                        $('#product_price').val(ui.content[0].price);
                        $('#product_variant_name').val(ui.content[0].variant_name);
                        $('#barcode_symbology').val(ui.content[0].barcode_symbology);
                        $('#tax_rate').val(ui.content[0].tax_rate);
                        $('#tax_method').val(ui.content[0].tax_method);
                        $(this).autocomplete("close");
                    };
                },
                select: function(event, ui) {
                    let categories_list = ui.item.categories;
                    $('#categories_list').empty();

                    let cat_html = '';
                    $.each(categories_list, function(key, item) {
                        cat_html += `<div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input" id="pname_${key}" name="category_checkbox[]" value="${item.name}">
                    <label class="custom-control-label" for="pname_${key}">${item.name}</label>
                </div>`;
                    });

                    $('#categories_list').append(cat_html);


                    $('#product_category').val(ui.item.category);
                    $('#size_name').val(ui.item.size_name);
                    $('#product_code_name').val(ui.item.value)
                    $('#product_name').val(ui.item.name);
                    $('#product_code').val(ui.item.code);
                    $('#product_price').val(ui.item.price);
                    $('#product_variant_name').val(ui.item.variant_name);
                    $('#barcode_symbology').val(ui.item.barcode_symbology);
                    $('#tax_rate').val(ui.item.tax_rate);
                    $('#tax_method').val(ui.item.tax_method);

                },
            }).data('ui-autocomplete')._renderItem = function(ul, item) {
                return $("<li class='ui-autocomplete-row'></li>")
                    .data("item.autocomplete", item)
                    .append(item.label)
                    .appendTo(ul);
            };

            $(document).on('click', '#generate-barcode', function() {

                console.log('dsfsdfsdfds');
                var product_category = $('#product_category').val();
                var size_name = $('#size_name').val();
                var product_code = $('#product_code').val();
                var variant_name = $('#product_variant_name').val();
                var barcode_symbology = $('#barcode_symbology').val();
                var tax_rate = $('#tax_rate').val();
                var tax_method = $('#tax_method').val();
                var product_name = $('#product_name').val();
                var product_price = '';
                var barcode_qty = $('#barcode_qty').val();
                var row_qty = $('#row_qty').val();
                console.log(product_category);



                var checkedCategoryItems = $('input[name="category_checkbox[]"]:checked').map(function() {
                    return $(this).val(); // Return the value of the checked checkbox
                }).get();

                // console.log(checkedCategoryItems,'checkedCategoryItems');


                if ($('#pname').prop("checked") == true) {
                    product_name = $('#product_name').val();
                }

                if ($('#price').prop("checked") == true) {
                    product_price = $('#product_price').val();
                }

                $.ajax({
                    url: "<?php echo e(route('generate.barcode')); ?>",
                    type: "POST",
                    data: {
                        category: product_category,
                        size_name: size_name,
                        product_code: product_code,
                        product_name: product_name,
                        product_price: product_price,
                        variant_name: variant_name,
                        barcode_symbology: barcode_symbology,
                        tax_rate: tax_rate,
                        tax_method: tax_method,
                        categories_name: checkedCategoryItems,
                        barcode_qty: barcode_qty,
                        row_qty: row_qty,
                        _token: _token
                    },

                    beforeSend: function() {
                        $('#generate-barcode').addClass('spinner spinner-white spinner-right');
                    },
                    complete: function() {
                        $('#generate-barcode').removeClass(
                            'spinner spinner-white spinner-right');
                    },
                    success: function(data) {
                        $('#generate-barcode-form').find('.is-invalid').removeClass(
                            'is-invalid');
                        $('#generate-barcode-form').find('.error').remove();
                        if (data.status == false) {
                            $.each(data.errors, function(key, value) {
                                var key = key.split('.').join('_');
                                $('#generate-barcode-form input#' + key).addClass('is-invalid');
                                $('#generate-barcode-form textarea#' + key).addClass('is-invalid');
                                $('#generate-barcode-form select#' + key).parent().addClass('is-invalid');
                                $('#generate-barcode-form #' + key).parent().append(
                                    '<small class="error text-danger">' + value + '</small>');
                            });
                        }
                        if (data) {
                            $('#barcode-section').empty();
                            $('#barcode-section').html(data);
                        }
                    },
                    error: function(xhr, ajaxOption, thrownError) {
                        console.log(thrownError + '\r\n' + xhr.statusText + '\r\n' + xhr.responseText);
                    }
                });
            });

            $(document).on('click', '#print-barcode', function() {
                var mode = 'iframe'; // popup
                var close = mode == "popup";
                var options = {
                    mode: mode,
                    popClose: close
                };
                $("#printableArea").printArea(options);
            });
        });
    </script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/iconshoppercom/iconshopper/Modules/Product/Resources/views/barcode/index.blade.php ENDPATH**/ ?>