@extends('layouts.admin')

@section('content')
<div class="content">

  <div class="card">
    <div class="card-header">
      @if(\Illuminate\Support\Facades\Session::has('success'))
        <div class="alert alert-success">
          <span class="text-success">{{ Session::get('success') }}</span>
        </div>
      @endif
        @if(\Illuminate\Support\Facades\Session::has('failed'))
          <div class="alert alert-danger">
            <span class="text-danger">{{ Session::get('failed') }}</span>
          </div>
        @endif
      <div class="row">
        <div class="col-sm-6">
          <h6 class="card-title">ការបញ្ជាទិញទាំងអស់</h6>
        </div>
      </div>
    </div>
    <div class="table-responsive  p-3">
      <table class="table text-nowrap" id="orders_table">
        <thead>
          <tr>
            <th>លេខសម្គាល់</th>
            <th>@lang('keyword.brand_name')</th>
            <th>វីធីបង់ប្រាក់</th>
            <th>អាសយដ្ឋាន</th>
            <th>សរុបតម្លៃ</th>
            <th>@lang('keyword.status')</th>
            <th>@lang('keyword.created_at')</th>
            <th class="text-center" style="width: 20px;">@lang('keyword.action')</th>
          </tr>
        </thead>
        <tbody>

        </tbody>
      </table>
    </div>
  </div>

<script type="text/javascript">
$(document).ready(function(){
   var table = $('#orders_table').DataTable({
    'dom': 'f<"bulkAction float-left row">ltip',
    'processing': true,
    'severSide': true,

    'ajax':{
      @if(isset($history))
      url: 'orders/history-data',
      @else
      url: 'orders/data',
      @endif
      dataSrc: 'data',
    },
    language: {
      "paginate": {
      "first":      "@lang('keyword.first')",
      "last":       "@lang('keyword.latest')",
      "next":       "@lang('keyword.next')",
      "previous":   "@lang('keyword.previous')"
    },
    "search": '@lang('keyword.search') : ',
    "zeroRecords":    "@lang('keyword.no-result')",
    "lengthMenu":     "បង្ហាញ  _MENU_  @lang('keyword.report')",
    "info":           "បង្ហាញ _START_ ទៅ _END_ នៃ _TOTAL_ @lang('keyword.report')",
    "infoEmpty":      "គ្មានទិន្នន័យ",
    },
    'columns': [
      {
        data: 'order_num',
        width: '20px'
      },
      {
        data: 'merchant',
        class: 'text-center',
        width: '20px'
      },
      {
        data: 'payment'
      },
      {
        data: 'address'
      },
      {
        data: 'total'
      },
      {
        data: 'status'
      },
      {
        data: 'created_at'
      },
      {
        class: 'text-center',
        data: 'action'
      }
    ],
    "aoColumnDefs": [ {
               "aTargets": [ 1,5,6 ],
               "mRender": function ( data, type, full ) {
                return $("<div/>").html(data).text();
                }
      } ]
    // 'order': [[1, 'desc']]
  });
})
</script>
<style media="screen">
  div.bulkAction{
    width: 15%;
    margin-left: 20px;
    display: none;
  }
</style>
@endsection