@extends('layouts.partials.header')

@section('content')
<!-- start page title -->
<div class="row">
    <div class="col-12">
        <div class="page-title-box">
            <div class="page-title-right">
                <ol class="breadcrumb m-0">
                    <li>
                        <a onclick="add_distributor()" href="#">
                            <button type="button" class="btn btn-primary waves-effect waves-light btn-sm">
                                Add Distributor                                           </button>
                        </a>
                        <!--                              <a href="#/user_reseller.php?mag">
                                                      <button type="button" class="btn btn-success waves-effect waves-light btn-sm">
                                                      Change M3U portal                                            </button>
                                                      </a>-->
                    </li>
                </ol>
            </div>
            <h4 class="page-title">Distributor management</h4>
        </div>
    </div>
</div>
<!-- end page title --> 
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-body" style="overflow-x:auto;">
              
                <div id="datatable-users_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">
                    <div class="row">
                        <div class="col-sm-12 col-md-6">
                            <div class="dataTables_length" id="datatable-users_length">
                                <label>
                                    Show 
                                    <select name="datatable-users_length" aria-controls="datatable-users" class="custom-select custom-select-sm form-control form-control-sm">
                                        <option value="10">10</option>
                                        <option value="25">25</option>
                                        <option value="50">50</option>
                                        <option value="100">100</option>
                                    </select>
                                    entries
                                </label>
                            </div>
                        </div>
                        <div class="col-sm-12 col-md-6">
                            <div id="datatable-users_filter" class="dataTables_filter"><label>Search:<input type="search" class="form-control form-control-sm" placeholder="" aria-controls="datatable-users"></label></div>
                        </div>
                    </div>
                    <div class="row">
                    @include('layouts.partials.messages')
                        <div class="col-sm-12">
                            <table id='table' class="table table-striped table-bordered" cellspacing="0" width="100%">
                                <thead>

                                    <tr>
                                        <th><input type="checkbox" id="check-all"></th>
                                        <th>ID</th>
                                        <th>Name</th>
                                        <th style="width:150px;">Action</th>
                                    </tr>
                                    </tr>
                                </thead>
                                <tbody>
                                @foreach ($distributors as $distributor)
                                    <tr>
                                        <td><input type="checkbox" id="check-all"></td>
                                        <td>{{ $distributor['id'] }}</td>
                                        <td>{{ $distributor['name'] }}</td>
                                        <td style="width:150px;">
                                            <a style="padding:3px !important;" class="btn btn-sm btn-primary" href="javascript:void()" value="{{ $distributor['id'] }}" title="Open Distributor" onclick="open_sub_distributor(this)"><i class="fa fa-users"></i></a>
                                            <a style="padding:3px !important;" class="btn btn-sm btn-primary" href="javascript:void()" value="{{ $distributor['id'] }}" title="Edit" onclick="edit_distributor(this)"><i class="fa fa-pencil"></i></a>
                                            <a style="padding:3px !important;" class="btn btn-sm btn-danger" href="javascript:void()" value="{{ $distributor['id'] }}" title="Delete" onclick="delete_distributor(this)"><i class="fa fa-trash"></i></a>
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <th><input type="checkbox" id="check-all"></th>
                                        <th>ID</th>
                                        <th>Name</th> 
                                        <th style="width:150px;">Action</th>
                                    </tr>
                                </tfoot>
                            </table>
                            <div id="datatable-users_processing" class="dataTables_processing card" style="display: none;">Processing...</div>
                        </div>
                    </div>

                </div>
            </div>
            <!-- end card body-->
        </div>
        <!-- end card -->
    </div>
    <!-- end col-->
</div>
<!-- end row-->


@endsection

@include('includes.distributors_popup')