@extends("cms.layouts.app", ['page_id' => 'stores_index'])

@push("js")
<script type="text/javascript">
$(function () {

    const table = window.dataTablesHelper.init({
        serverSide: true,
        pageLength: 25,
        lengthMenu: [10, 25,  50, 100, 200, 300, 400, 500],
        ajax: {
            url: "{{ route('cms.stores.datatable') }}",
        },
        columns: [
            { data: 'id', name: 'id', },
            {
                data: 'status', name: 'status',
                render: function ( data, type, row, meta ) {
                    var displayName = '{{ __('cms.na') }}';
                    switch (data) {
                        case 1:
                            displayName = "{{ __('cms.shipper.status.1') }}";
                            break;
                        case 2:
                            displayName = "{{ __('cms.shipper.status.2') }}";
                            break;
                        default:
                            break;
                    }
                    return `<span class="badge badge-pill badge-status-${data}">${displayName}</span>`;
                }
            },
            { data: 'name', name: 'name'},
            { data: 'country', name: 'country',
              render:function(data,type,row,meta){
                let name = 'China';
                switch(data){
                  case '0':
                      name =  'China';
                      break;
                  case '1':
                      name =  'Hong Kong';
                      break;
                  case '2':
                      name =  'Japan';
                      break;
                  case '3':
                      name =  'Korea';
                      break;
                  case '4':
                      name =  'USA';
                      break;
                }
                  return `<span class="badge badge-pill">${name}</span>`;
              }
            },
            { data: 'DT_RowData.platform_name', name: 'platform'},
            { data: 'DT_RowData.shipper_name', name: 'shipper',render:function(data,type,row,meta){
              return data;
          }},
        ],
        order: [[ 1, 'desc' ]],
        buttons: {
            buttons: []
        },
        onClickRow: function(id) {
            if (!id) { return; }

            var url = '{{ route('cms.stores.show', '__id__') }}'.replace('__id__', id);
            window.location.href = url;
        },
    })
});
</script>
@endpush

@section("title")
{{ __('cms.sidemenu.stores') }}
@endsection

@section("top_right")
<div class="btn-group float-right">
    <a class="btn btn-secondary btn-icon" href="{{ route('cms.stores.create') }}" role="button" title="Add">
        <i class="las la-plus mr-2"></i> {{ __('cms.add') }}
    </a>
</div>
@endsection

@section("content")
<div class="card">
    <div class="card-body table-dataTable table-responsive">
        <table id="dataTable" class="table table-hover w-100">
            <thead>
                <tr>
                    <th>{{ __('cms.id')}}</th>
                    <th>{{ __('cms.status')}}</th>
                    <th>{{ __('cms.name')}}</th>
                    <th>{{ __('cms.country_name')}}</th>
                    <th>{{ __('cms.order.platform')}}</th>
                    <th>{{ __('cms.sidemenu.shipper')}}</th>
                </tr>
            </thead>
        </table>
    </div>
</div>
@endsection