@extends('layouts.admin')
@section('content')

<div class="card">
    <div class="card-header">{{ trans('cruds.orders.title') }}</div>
    <div class="card-body">
        <table class="table table-bordered table-hover ajaxTable datatable datatable-Make">
            <thead>
                <tr>
                    <th>
                        {{ trans('cruds.orders.fields.id') }}
                    </th>
                    <th>
                        {{ trans('cruds.orders.fields.product_name') }}
                    </th>
                    <th>
                        {{ trans('cruds.orders.fields.product_sku') }}
                    </th>
                    <th>
                        {{ trans('cruds.orders.fields.price') }}
                    </th>
                     <th>
                        {{ trans('cruds.orders.fields.quantity') }}
                    </th>
                    <th>
                        {{ trans('cruds.orders.fields.shipping_country') }}
                    </th>
                    <th>
                        {{ trans('cruds.orders.fields.shipping_duration_day') }}
                    </th>
                    <th>
                        {{ trans('cruds.orders.fields.shipping_fee') }}
                    </th>
                    <th>
                        {{ trans('cruds.orders.fields.shipping_address') }}
                    </th>
                    <th>
                        {{ trans('cruds.orders.fields.created_at') }}
                    </th>
                </tr>
            </thead>
        </table>
    </div>
</div>
@endsection

@section('scripts')

@parent
<script>
  $(function () {
    let dtButtons = $.extend(true, [], $.fn.dataTable.defaults.buttons)

    let dtOverrideGlobals = {
      buttons: dtButtons,
      processing: true,
      serverSide: true,
      retrieve: true,
      aaSorting: [],
      ajax: "{{ route('admin.transaction.order_details_show', request('id')) }}",
      columns: [
        { data: 'id', name: 'id' },
        { data: 'product_name', name: 'product_name' },
        { data: 'product_sku', name: 'product_sku' },
        { data: 'price', name: 'price' },
        { data: 'quantity', name: 'quantity' },
        { data: 'shipping_country', name: 'shipping_country' },
        { data: 'shipping_duration_day', name: 'shipping_duration_day' },
        { data: 'shipping_fee', name: 'shipping_fee' },
        { data: 'shipping_address', name: 'shipping_address' },
        { data: 'created_at', name: 'created_at' }
      ],
      orderCellsTop: true,
      order: [[ 1, 'desc' ]],
      pageLength: 10,
    };

    let table = $('.datatable-Make').DataTable(dtOverrideGlobals);
    $('a[data-toggle="tab"]').on('shown.bs.tab click', function(e){
      $($.fn.dataTable.tables(true)).DataTable().columns.adjust();
    });
  });
</script>

@endsection