@extends('admin.layout')
@section('content')
    <style>
        .xls-class {
            background-color: rgba(79, 84, 100, .5) !important;
        }

    </style>
    <div class="content-header">
        <div class="d-flex align-items-center">
            <div class="mr-auto">
                <h3 class="page-title"> {{ translate('Products') }}</h3>
                <div class="d-inline-block align-items-center">
                    <nav>
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}"><i
                                        class="mdi mdi-home-outline"></i></a></li>
                            <li class="breadcrumb-item" aria-current="page"> {{ translate('Products') }}</li>
                        </ol>
                    </nav>
                </div>
            </div>

        </div>
    </div>
    <section class="content">
        <div class="box">
            <div class="box-body">
                @if (Session::get('tenant_subscribtion_data')['products']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['products'] == 1)
                    <div class="table-responsive">
                        <table id="complex_header" class="table table-striped table table-lg table-separated"
                            style="width:100%">
                            <thead>
                                <tr role="row" class="bg-dark">
                                    <th class="text-center"></th>
                                    <th class="text-center"> {{ translate('Owner') }} </th>
                                    <th class="text-center"> {{ translate('sku') }}</th>
                                    <th class="text-center"> {{ translate('Title') }}</th>
                                    <th class="text-center">{{ translate('Photo') }}</th>
                                    <th class="text-center"> {{ translate('Published') }}</th>
                                    <th class="text-center"> {{ translate('Offers and discounts') }}</th>
                                    <th class="text-center"> {{ translate('Unit price') }}</th>
                                    <th class="text-center">{{ translate('For Improvements') }}</th>
                                    <th class="text-center"> {{ translate('Options') }}</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                @else
                    <div class="row">
                        <div class="col-8 mx-auto text-center">
                            <br>
                            <img style="width: 12em;margin-bottom: 1em;" src="{{ url('/images/upgrad_limit.png') }}"
                                alt="">
                            <h4>
                                {{ translate('You need to upgrade to use this feature.') }}
                            </h4>
                            <h4 style="color: chocolate">
                                {{ translate('Please Upgrade to use this feature.') }}
                            </h4>
                            <br>
                            <a class="btn btn-rounded btn-dark mb-5 padding-label-dashbord orang-bg"
                                href="#">{{ translate('Upgrade now') }}</a>
                        </div>
                    </div>
                @endif
            </div>
        </div>
        @if (Session::get('tenant_subscribtion_data')['products']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['products'] == 1)
            <div class="row">
                <div class="col-xl-4 col-lg-4 col-12">
                    <div class="box pull-up">
                        <div class="box-body product-option">
                            <img class="card-img-top" src="{{ url('images/product_icon/delete.svg') }}"
                                alt="{{ translate('Delete products') }}">
                            <div class="card-body">
                                <h4 class="card-title">{{ translate('Delete products') }}</h4>
                                <p class="card-text">
                                    {{ translate('Deleting products will erase them from your store forever') }}
                                </p>
                                <div class="footer-page">
                                    <a href="#"
                                        class=" brand_multy_delete empty-selected  waves-light btn btn-light-broken padding-label-dashbord">
                                        {{ translate('Delete') }}
                                    </a>
                                    <a href="#" id="prod_multy_delete" style="display: none"
                                        class="brand_multy_delete hove-selected  waves-light btn btn-dark padding-label-dashbord">
                                        {{ translate('Delete') }}

                                        <div class="hove-selected-counter">
                                            0
                                        </div>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-4 col-12">
                    <div class="box pull-up">
                        <div class="box-body product-option">
                            <div class="row">
                                <div class="col">
                                    <img class="card-img-top" src="{{ url('images/product_icon/add.svg') }}"
                                        alt="{{ translate('Add product') }}">
                                </div>
                                <div class="col" style="text-align: end">
                                    <a href="#" id="open_product_types"
                                        class="waves-effect waves-light btn  btn-dark mb-5 padding-label-dashbord">{{ translate('Add') }}
                                        <i class="fa fa-plus-circle"></i></a>
                                </div>
                            </div>
                            <div class="card-body">
                                <h4 class="card-title">{{ translate('Creat New product') }}
                                </h4>
                                <p class="card-text">
                                    {{ translate('When adding a new product, it is preferable to add the appropriate sections. Competitive prices. It is preferable to be sure of the stock') }}
                                </p>
                                <div class="footer-page">
                                    <a href="#" product_type="normal_product"
                                        mref="{{ route('Product.create', 'normal_product') }}"
                                        onclick="checkAddLimit(this)"
                                        class="waves-effect waves-light btn  btn-dark mb-5 padding-label-dashbord">{{ translate('Normal product') }}</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-4 col-lg-4 col-12">
                    <div class="box pull-up">
                        <div class="box-body product-option">
                            <img class="card-img-top" src="{{ url('images/product_icon/label.svg') }}"
                                alt="Card image cap">
                            <div class="card-body">
                                <h4 class="card-title">{{ translate('Mark your products with eye-catching labels') }}
                                </h4>
                                <p class="card-text">
                                    {{ translate('Install the Product Labels app to display') }}
                                </p>
                                <div class="footer-page">
                                    <a href="{{ asset('Product/index') }}"
                                        class="waves-effect waves-light btn  btn-dark mb-5 padding-label-dashbord">{{ translate('Install Product Labels') }}</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                @if (Session::get('tenant_subscribtion_data')['xls_products']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['xls_products'] == 1)
                    <div class="col-xl-4 col-lg-4 col-12">
                        <div class="box pull-up">
                            <div class="box-body product-option">
                                <img class="card-img-top" src="{{ url('images/product_icon/import.svg') }}"
                                    alt="Card image cap">
                                <div class="card-body">
                                    <h4 class="card-title">{{ translate('Import products') }}</h4>
                                    <p class="card-text" style="margin: 0;">
                                        {{ translate('After import finished you will go to products page and this products appear in the begining and its background like this instruction background color :).') }}
                                    </p>
                                    <p class="card-text">
                                        {{ translate('Download Demo product and start to fill sheet with your products') }}
                                    </p>
                                    <div class="footer-page">
                                        <button type="button"
                                            class="waves-effect waves-light btn  btn-outline mb-5 padding-label-dashbord"
                                            data-toggle="modal" data-target="#modal-fill">
                                            {{ translate('Import') }}
                                        </button>
                                        <a href="{{ asset('download/products.xlsx') }}" download
                                            class="waves-effect waves-light btn  btn-dark mb-5 padding-label-dashbord">{{ translate('Dawnload') }}</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-lg-4 col-12">
                        <div class="box pull-up">
                            <div class="box-body product-option">
                                <img class="card-img-top" src="{{ url('images/product_icon/export.svg') }}"
                                    alt="Card image cap">
                                <div class="card-body">
                                    <h4 class="card-title">{{ translate('Bulk Export') }}</h4>
                                    <p class="card-text">
                                        {{ translate('Demo product for learn you how to fill xls sheet to upload products.') }}
                                    </p>
                                    <div class="footer-page">
                                        <a href="{{ route('Product.bulkExport') }}"
                                            class="waves-effect waves-light btn  btn-dark mb-5 padding-label-dashbord">
                                            {{ translate('Bulk Export') }}
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                @endif
                <div class="col-xl-4 col-lg-4 col-12">
                    <div class="box pull-up">
                        <div class="box-body product-option">
                            <img class="card-img-top" src="{{ url('images/product_icon/plugin.svg') }}"
                                alt="Card image cap">
                            <div class="card-body">
                                <h4 class="card-title">{{ translate('dropshipping channels') }}
                                </h4>
                                <p class="card-text">
                                    {{ translate('Qanawat gives you the opportunity to start your own business or grow your existing company without risk. Easily start selling Turkish fashion products in your store today') }}
                                </p>
                                <div class="footer-page">
                                    <a href="{{ asset('admin/knawat_configration') }}"
                                        class="waves-effect waves-light btn  btn-dark mb-5 padding-label-dashbord">{{ translate('View App') }}</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        @endif
    </section>
@endsection
@section('modal')
    <div class="modal modal-fill fade" data-backdrop="false" id="modal-fill" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <form class="form-horizontal" action="{{ route('Product.bulkImport') }}" method="POST"
                    enctype="multipart/form-data">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">

                        @csrf
                        <div class="container">
                            <input type="hidden" name="seller_id" value="0">
                            <div class="custom-file">
                                <label class="custom-file-label">
                                    <input type="file" name="bulk_file" class="custom-file-input" required>
                                </label>
                            </div>
                            <br>
                            <br>
                            <button type="submit" class="btn btn-info form-control">{{ translate('Import') }}</button>
                        </div>



                    </div>

                </form>
            </div>
        </div>
    </div>
    <div class="modal modal-secondary fade" id="improve-modal-primary">
        <div class="modal-dialog">
            <div class="modal-content bg-secondary">
                <div class="modal-header">
                    <h4 class="modal-title">{{ translate('For Improvements') }}</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span></button>
                </div>
                <div class="modal-body">


                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
        id="normalProductModel" aria-hidden="true" style="display: none;">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="">{{ translate('Normal product') }}</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                </div>
                <div class="modal-body" style="margin: .2% !important;" id="normal_product_body">

                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <div id="productLables" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="productLablesLabel"
        aria-hidden="true">
        <div class="modal-dialog" style="margin-top: 15em;">
            <div class="modal-content">
                <div class="modal-body" style="padding: 1rem !important;margin: 2px !important;">
                    <h5 class="text-center">{{ translate('Choose product you need to add it') }}</h5>
                    <br>
                    <div class="row">
                        <div class="col">
                            <div class="product_type_button_cont" style="cursor: pointer" product_type="advanced_product"
                                mref="{{ route('Product.create', 'advanced_product') }}" onclick="checkAddLimit(this)">
                                <div class="product_type_button"
                                    style="padding: .5em;background-color: #fb753d;border-radius: 1em;">
                                    <img src="{{ url('images/product_types/advanced.png') }}" alt="">
                                </div>
                                <h5 class="text-center">{{ translate('Advanced') }}</h5>
                            </div>
                        </div>
                        <div class="col">
                            <div class="product_type_button_cont" style="cursor: pointer" product_type="restorants"
                                mref="{{ route('Product.create', 'restorants') }}" onclick="checkAddLimit(this)">
                                <div class="product_type_button"
                                    style="padding: .5em;background-color: #fb753d;border-radius: 1em;">
                                    <img src="{{ url('images/product_types/restaurant.png') }}" alt="">
                                </div>
                                <h5 class="text-center">{{ translate('Restorant') }}</h5>
                            </div>
                        </div>
                        <div class="col">
                            <div class="product_type_button_cont" style="cursor: pointer" product_type="digital_product"
                                mref="{{ route('Product.create', 'digital_product') }}" onclick="checkAddLimit(this)">
                                <div class="product_type_button"
                                    style="padding: .5em;background-color: #fb753d;border-radius: 1em;">
                                    <img src="{{ url('images/product_types/digital.png') }}" alt="">
                                </div>
                                <h5 class="text-center">{{ translate('Digital product') }}</h5>
                            </div>
                        </div>
                        <div class="col">
                            <div class="product_type_button_cont" style="cursor: pointer" product_type="digital_cards"
                                mref="{{ route('Product.create', 'digital_cards') }}" onclick="checkAddLimit(this)">
                                <div class="product_type_button"
                                    style="padding: .5em;background-color: #fb753d;border-radius: 1em;">
                                    <img src="{{ url('images/product_types/cards.png') }}" alt="">
                                </div>
                                <h5 class="text-center">{{ translate('Digital cards') }}</h5>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
@endsection

@section('script')
    @if (Session::get('tenant_subscribtion_data')['products']['belongs_to_subscribtion'] == true && Session::get('tenant_controle_modules')['products'] == 1)
        <script type="text/javascript">
            function checkAddLimit(e) {
                switch (e.getAttribute('product_type')) {
                    case 'normal_product':
                        if (("{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'limited' &&
                                {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} >
                                {{ $productCount }}) ||
                            "{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'unlimt') {
                            var url = `{{ route('Product.create', 'normal_product') }}`;
                            $.get(url, {}, function(data) {
                                $('#normal_product_body').html(data);
                                $('input[name="current_stock_unlimited"]').on('change', function() {
                                    if (!$('input[name="current_stock_unlimited"]').is(':checked')) {
                                        $('#current_stock_id').prop('disabled', false);
                                    } else {
                                        $('#current_stock_id').prop('disabled', true);
                                    }
                                });
                                $(".custom-file-input").change(function() {
                                    var img_src = jQuery(this).parents('.custom-file').parents(
                                        '.custom-file-container').find("img");
                                    var regex = /^([a-zA-Z0-9\s_\\.\-:])+(.jpg|.jpeg|.gif|.png|.bmp)$/;
                                    if (regex.test($(this).val().toLowerCase())) {
                                        if (typeof(FileReader) != "undefined") {
                                            var reader = new FileReader();
                                            reader.onload = function(e) {

                                                img_src.attr("src", e.target.result);
                                                $('.custem-css-templet img').attr('src', e.target.result);
                                            }
                                            reader.readAsDataURL($(this)[0].files[0]);
                                        } else {
                                            alert("This browser does not support FileReader.");
                                        }
                                    } else {
                                        alert("Please upload a valid image file.");
                                    }
                                });
                                $('.select2').select2({
                                    allowClear: true,
                                    placeholder: "{{ translate('Search') }}"
                                });
                                $('#normalProductModel').modal();
                            });

                            // window.location.replace(e.getAttribute('mref'));
                        } else {
                            $('#UpgradLimitModelH41').text(
                                "{{ translate('You have exceeded the maximum number of add-ons') }} " +
                                {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} +
                                " {{ translate('of products') }}");
                            $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to add more.') }}");
                            $('#UpgradLimitModel').modal();
                        }
                        break;
                    case 'advanced_product':
                        if ("{{ Session::get('tenant_subscribtion_data')['advanced_product']['belongs_to_subscribtion'] }}" ==
                            true) {
                            if (("{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'limited' &&
                                    {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} >
                                    {{ $productCount }}) ||
                                "{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'unlimt') {
                                window.location.replace(e.getAttribute('mref'));
                            } else {
                                $('#UpgradLimitModelH41').text(
                                    "{{ translate('You have exceeded the maximum number of add-ons') }} " +
                                    {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} +
                                    " {{ translate('of products') }}");
                                $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to add more.') }}");
                                $('#UpgradLimitModel').modal();
                            }
                        } else {
                            $('#UpgradLimitModelH41').text(" {{ translate('You need to upgrade to use this feature.') }}");
                            $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to use this feature.') }}");
                            $('#UpgradLimitModel').modal();
                        }
                        break;
                    case 'restorants':
                        if ("{{ Session::get('tenant_subscribtion_data')['restorants']['belongs_to_subscribtion'] }}" ==
                            true) {
                            if (("{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'limited' &&
                                    {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} >
                                    {{ $productCount }}) ||
                                "{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'unlimt') {
                                window.location.replace(e.getAttribute('mref'));
                            } else {
                                $('#UpgradLimitModelH41').text(
                                    "{{ translate('You have exceeded the maximum number of add-ons') }} " +
                                    {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} +
                                    " {{ translate('of products') }}");
                                $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to add more.') }}");
                                $('#UpgradLimitModel').modal();
                            }
                        } else {
                            $('#UpgradLimitModelH41').text(" {{ translate('You need to upgrade to use this feature.') }}");
                            $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to use this feature.') }}");
                            $('#UpgradLimitModel').modal();
                        }
                        break;
                    case 'digital_product':
                        if ("{{ Session::get('tenant_subscribtion_data')['digital_product']['belongs_to_subscribtion'] }}" ==
                            true) {
                            if (("{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'limited' &&
                                    {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} >
                                    {{ $productCount }}) ||
                                "{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'unlimt') {
                                window.location.replace(e.getAttribute('mref'));
                            } else {
                                $('#UpgradLimitModelH41').text(
                                    "{{ translate('You have exceeded the maximum number of add-ons') }} " +
                                    {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} +
                                    " {{ translate('of products') }}");
                                $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to add more.') }}");
                                $('#UpgradLimitModel').modal();
                            }
                        } else {
                            $('#UpgradLimitModelH41').text(" {{ translate('You need to upgrade to use this feature.') }}");
                            $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to use this feature.') }}");
                            $('#UpgradLimitModel').modal();
                        }
                        break;
                    case 'digital_cards':
                        if ("{{ Session::get('tenant_subscribtion_data')['digital_cards']['belongs_to_subscribtion'] }}" ==
                            true) {
                            if (("{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'limited' &&
                                    {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} >
                                    {{ $productCount }}) ||
                                "{{ Session::get('tenant_subscribtion_data')['products']['value'] }}" == 'unlimt') {
                                window.location.replace(e.getAttribute('mref'));
                            } else {
                                $('#UpgradLimitModelH41').text(
                                    "{{ translate('You have exceeded the maximum number of add-ons') }} " +
                                    {{ Session::get('tenant_subscribtion_data')['products']['quantity'] }} +
                                    " {{ translate('of products') }}");
                                $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to add more.') }}");
                                $('#UpgradLimitModel').modal();
                            }
                        } else {
                            $('#UpgradLimitModelH41').text(" {{ translate('You need to upgrade to use this feature.') }}");
                            $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to use this feature.') }}");
                            $('#UpgradLimitModel').modal();
                        }
                        break;

                    default:
                        break;
                }

            }
        </script>
    @else
        <script type="text/javascript">
            function checkAddLimit() {
                $('#UpgradLimitModelH41').text(" {{ translate('You need to upgrade to use this feature.') }}");
                $('#UpgradLimitModelH42').text("{{ translate('Please Upgrade to use this feature.') }}");
                $('#UpgradLimitModel').modal();
            }
        </script>
    @endif
    <script type="text/javascript">
        var productTable = $('#complex_header').DataTable({
            'createdRow': function(row, data, dataIndex) {
                $(row).addClass('bill-row-' + data.id);
            },
            columnDefs: [{
                targets: 0,
                render: function(data, type, row, meta) {

                    if (type === 'display') {
                        data =
                            '<div class="checkbox"><input type="checkbox" class="dt-checkboxes" mid="' +
                            data + '"><label></label></div>';
                    }
                    return data;
                },
                checkboxes: {
                    selectAllRender: '<div class="checkbox"><input type="checkbox" class="dt-checkboxes" id="all-check"><label></label></div>'
                }
            }],
            order: [
                [1, 'asc']
            ],
            processing: true,
            serverSide: true,
            ajax: {
                url: "{{ route('Product.index') }}",
            },
            columns: [{
                    data: 'id',
                    name: 'id'
                }, {
                    data: 'owner',
                    name: 'owner'
                }, {
                    data: 'sku',
                    name: 'sku'
                },
                {
                    data: 'trans',
                    name: 'trans',
                },

                {
                    data: 'photo',
                    name: 'photo',
                    render: function(data, type, full, meta) {
                        return "<a class='image-popup-vertical-fit' target='_blank' href={{ URL::to('/') }}/" +
                            data.toString() + "> <img id='logo'  src={{ URL::to('/') }}/" + data
                            .toString() +
                            " style='width:auto;height: 49px;' /> </a>";

                    },
                    orderable: false
                },
                {
                    data: 'published',
                    name: 'published',
                    render: function(data, type, full, meta) {
                        if (data == 1) {
                            return "<div class=form-group><div class=checkbox><input type=checkbox id=Checkbox_" +
                                full.id +
                                "  onchange=update_published(this) value=" +
                                full.id + " checked /> <label for=Checkbox_" + full.id +
                                "></label></div></div>";
                        } else {
                            return "<div class=form-group><div class=checkbox><input type=checkbox id=Checkbox_" +
                                full.id +
                                "  onchange=update_published(this) value=" +
                                full.id + " /> <label for=Checkbox_" + full.id + "></label></div></div>";
                        }
                    }
                },
                {
                    data: 'todays_deal',
                    name: 'todays_deal',
                    render: function(data, type, full, meta) {
                        if (data == 1) {
                            return "<div class=form-group><div class=checkbox><input type=checkbox id=Checkbox_deal" +
                                full.id +
                                "  onchange=update_todays_deal(this) value=" +
                                full.id + " checked /> <label for=Checkbox_deal" + full.id +
                                "></label></div></div>";
                        } else {
                            return "<div class=form-group><div class=checkbox><input type=checkbox id=Checkbox_deal" +
                                full.id +
                                "  onchange=update_todays_deal(this) value=" +
                                full.id + " /> <label for=Checkbox_deal" + full.id +
                                "></label></div></div>";
                        }
                    }
                },
                {
                    data: 'unit_price',
                    name: 'unit_price'
                }, {
                    data: 'improvements',
                    name: 'improvements',
                    render: function(data, type, full, meta) {
                        if (data == false) {
                            return "<i class='fa fa-times-circle' onclick='toImprove(" + full.id +
                                ")' style='font-size:22px;color:#2a3142;cursor:pointer'></i>";
                        } else {
                            return "<i class='fa fa-check-circle'  style='font-size:22px;color:#2a3142';></i>";
                        }

                    },
                    orderable: false
                },
                {
                    data: 'action',
                    name: 'action',
                    orderable: false
                }
            ],
            "oLanguage": {
                "sSearch": "{{ translate('Search') }}",
                "sLengthMenu": "{{ translate('Display') }} _MENU_ {{ translate('Entries') }}",
                "sZeroRecords": "{{ translate('No matching records found') }}",
                "sInfo": "{{ translate('Showing page') }} _PAGE_ {{ translate('of') }} _PAGES_",
                "sInfoEmpty": "{{ translate('No records available') }}",
                "sInfoFiltered": "({{ translate('filtered from') }} _MAX_ {{ translate('total records') }})",
                "sProcessing": "<i class=' fa fa-spinner fa-pulse font-size-30'></i>",
                'oPaginate': {
                    'sPrevious': '<span class="prev-icon">‹</span>',
                    'sNext': '<span class="next-icon"> ›</span>'
                }
            }
        });

        function toImprove(id) {
            var improveArr = $('#improve-modal-primary').find('.modal-body').html('');
            $.ajax({
                type: "POST",
                url: '{{ route('Product.toImprove') }}',
                data: {
                    _token: '{{ csrf_token() }}',
                    id: id
                },
                success: function(data) {

                    jQuery.each(data, function(ii, field) {
                        console.log(field);
                        improveArr.append(
                            "<div class='alert alert-ii alert-dismissable'><button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;</button>" +
                            field + "</div>"
                        );
                    })
                    $('#improve-modal-primary').modal();
                }
            });
        }

        function update_published(el) {
            if (el.checked) {
                var published = 1;
            } else {
                var published = 0;
            }
            $.post(`{{ route('Product.updatePublished') }}`, {
                _token: '{{ csrf_token() }}',
                id: el.value,
                published: published
            }, function(data) {

            });
        }

        function update_todays_deal(el) {
            if (el.checked) {
                var status = 1;
            } else {
                var status = 0;
            }
            $.post(`{{ route('Product.todays_deal') }}`, {
                _token: '{{ csrf_token() }}',
                id: el.value,
                status: status
            }, function(data) {

            });
        }

        function submit_delete_form(e) {
            var url = e.getAttribute('data-href');
            var title = e.getAttribute('data-title');
            var desc = e.getAttribute('data-desc');
            var yes = e.getAttribute('data-yes');
            var no = e.getAttribute('data-no');
            swal({
                title: title,
                text: desc,
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: yes,
                cancelButtonText: no,
                closeOnConfirm: false
            }, function() {
                $.ajax({
                    url: url,
                    method: "get",
                    success: function(data) {
                        swal.close();
                        $('#complex_header').DataTable().ajax.reload();
                    }
                });

            });
        }
        $('#prod_multy_delete').click(function() {
            var rowsel = productTable.column(0).checkboxes.selected().join(",");
            var rowselArr = productTable.column(0).checkboxes.selected().join(",").split(',');
            if (rowsel != '') {
                swal({
                    title: "{{ translate('Are you sure?') }}",
                    text: "{{ translate('You will not be able to recover this!') }}",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "{{ translate('Yes, delete it!') }}",
                    cancelButtonText: "{{ translate('Cancel') }}",
                    closeOnConfirm: false
                }, function() {
                    $.ajax({
                        url: "{{ route('productMassremove') }}",
                        method: "get",
                        data: {
                            id: rowselArr
                        },
                        success: function(data) {
                            swal.close()
                            $('#complex_header').DataTable().ajax.reload();
                        }
                    });
                });

            } else {
                swal(`{{ translate('please select one.') }}`);
            }
        });
        $(document).ready(function() {
            $('.dataTables_filter label input').attr({
                'id': 'search',
                'placeholder': '{{ translate('Search Products') }}'
            });
            $('.rtl .dt-checkboxes-select-all [type=checkbox]+label:before').css('border-color', 'red');

        });

        $(document).on('change', '#all-check', function() {
            if ($(this).is(":checked")) {
                $('.odd').addClass("bg-warning");
                $('.even').addClass("bg-warning");
            } else {
                $('.odd').removeClass("bg-warning");
                $('.even').removeClass("bg-warning");
            }
        });
        $(document).on('change', '.dt-checkboxes', function() {
            if ($(this).is(":checked")) {
                $('.bill-row-' + $(this).attr('mid')).addClass("bg-warning");
            } else {
                $('.bill-row-' + $(this).attr('mid')).removeClass("bg-warning");
            }
            var result = countChecked($('#complex_header'), '.dt-checkboxes');
            if (result.checked <= 0) {
                $('.hove-selected').hide();
                $('.empty-selected').show();
            } else {
                $('.empty-selected').hide();
                $('.hove-selected').show();
                var TotalNum = result.checked;
                if (TotalNum == result.total) {
                    TotalNum = TotalNum - 1;
                }
                $('.hove-selected-counter').html(TotalNum);
            }

        });
        var countChecked = function($table, checkboxClass) {
            if ($table) {
                // Find all elements with given class
                var chkAll = $table.find(checkboxClass);
                // Count checked checkboxes
                var checked = chkAll.filter(':checked').length;
                // Count total
                var total = chkAll.length;
                // Return an object with total and checked values
                return {
                    total: total,
                    checked: checked
                }
            }
        }

        $('#open_product_types').click(function() {
            $('#productLables').modal();
        })
    </script>
@endsection