@extends('layouts.dashboard.app')

@section('content')

    <div class="content-wrapper">

        <section class="content-header">
            <section class="col-md-12">
                <div>
                    <h2>@lang('site.products') <small>[ {{ $products->total() }} ]</small></h2>
                </div>
                <ul class="breadcrumb mt-2">
                    <li class="breadcrumb-item"><a href="{{ route('dashboard.welcome') }}"><i
                                class="fa fa-dashboard"></i> @lang('site.home')</a></li>
                    <li class="breadcrumb-item active">@lang('site.products')</li>
                </ul>
            </section>
        </section>

        <div class="container">

            <section class="content">
                <div class="row">
                    <div class="col-md-12">

                        <div class="box box-primary">

                            <div class="box-header with-border">

                                <div class="col-md-6">
                                    <div class="form-group">
                                        <input type="text" id="data-table-search" class="form-control" autofocus
                                               placeholder="@lang('site.search')">
                                    </div>
                                </div>

                            </div><!-- end of box header -->

                            <div class="box-body table-responsive">
                                <table class="table datatable table-hover" id="products-table" style="width: 100%;">
                                    <thead>
                                    <tr>
                                        <th>@lang('site.prodCCode')</th>
                                        <th>@lang('site.product')</th>
                                        <th>@lang('site.stock')</th>
                                        <th>@lang('site.price')</th>
                                        @if(auth()->user()->isUserManager())
                                            <th>@lang('site.tPrice')</th>
                                            <th>@lang('site.exPrice')</th>
                                        @endif
                                        <th>@lang('site.image')</th>
                                        <th></th>

                                    </tr>
                                    </thead>
                                </table>

                            </div><!-- end of table responsive -->

                        </div><!-- end of box -->

                    </div>
                </div>
            </section><!-- end of content -->

        </div>
    </div><!-- end of content wrapper -->

@endsection

@push('scripts')

    <script>
        let productsTable = $('#products-table').DataTable({

            dom: "tiplr",
            serverSide: true,
            processing: true,
            "language": {
                "url": "{{ asset('dashboard_files/datatable-lang/' . app()->getLocale() . '.json') }}"
            },
            ajax: {
                url: '{{ route('dashboard.products.data') }}',
            },
            columns: [
                //{data: 'record_select', name: 'record_select', searchable: false, sortable: false, width: '1%'},
                {data: 'cCode', name: 'cCode'},
                {data: 'name', name: 'name'},
                {data: 'stock', name: 'stock'},
                {data: 'price', name: 'price'},
                @if(auth()->user()->isUserManager())
                    {data: 'tPrice', name: 'tPrice'},
                    {data: 'exPrice', name: 'exPrice'},
                @endif
                {data: 'image', name: 'image', searchable: false, sortable: false},
                {data: 'actions', name: 'actions', searchable: false, sortable: false, width: '20%'},
            ],
            order: [[3, 'desc']],
            drawCallback: function (settings) {
                //$('.record__select').prop('checked', false);
                //$('#record__select-all').prop('checked', false);
                //$('#record-ids').val();
                //$('#bulk-delete').attr('disabled', true);
            }
        });

        $('#data-table-search').keyup(function () {
            productsTable.search(this.value).draw();
        })

    </script>


@endpush