<div class="my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
  <div class="py-2 align-middle inline-block min-w-full sm:px-6 lg:px-8">
      <div class="shadow overflow-hidden border-b border-gray-200 sm:rounded-lg">
          <table id="dataTable" class="min-w-full divide-y divide-gray-200">
              <thead class="bg-blue-50">
                  <tr>
                      <th scope="col"
                          class="">
                          ID
                      </th>
                      <th scope="col"
                          class="">
                          Date
                      </th>

                      <th scope="col"
                          class="">
                          Reseller Name
                      </th>
                      <th scope="col"
                          class="">
                          Amount
                      </th>

                      <th scope="col"
                          class="">
                          After Recharge Balance
                      </th>

                      <th scope="col"
                          class="">
                          Current Balance
                      </th>
                      <th scope="col"
                          class="">
                          Remarks
                      </th>
                      <th scope="col"
                          class="">
                          Recharge By
                      </th>
                      <th scope="col"
                          class="">

                      </th>
                  </tr>
              </thead>
              <tbody class="bg-white divide-y divide-gray-200">

                  @foreach ($list as $r)

                  <tr>
                      <td class="px-6 py-4 whitespace-nowrap">
                          {{ $r->id}}
                      </td>
                      <td class="px-6 py-4 whitespace-nowrap">
                        {{date('d-M-Y h:i:sa',strtotime($r->created_at))}}
                      </td>

                      <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                          {{$r->reseller->name ?? ''}}
                      </td>

                      <td class="px-6 py-4 whitespace-nowrap text-right">
                          {{$r->amount}}
                      </td>


                      <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 text-right">
                          {{ $r->after_recharge_balance}}
                      </td>
                      <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 text-right">

                        {{-- {{ $r->balance }} --}}
                          {{ $r->balance[0]['amount'] ?? '' }}

                      </td>
                      <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                          {{ $r->remarks}}
                      </td>
                      <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
                        {{ $r->user->name ?? '' }}
                      </td>

                      
                  </tr>

                  @endforeach

                  <!-- More items... -->
              </tbody>
          </table>

          <div class="p-5">
              {{-- {{ $list->links() }} --}}
          </div>
      </div>
  </div>
</div>