@extends('layouts.app')
@section('content')
    @include('layouts.navbar')
    @include('layouts.sidebar')

    <main id="" class="side_user">
        <!-- Hero -->
        <div class="bg-body-light ">
            <div class="content content-full">
                <div class="d-flex flex-column flex-sm-row justify-content-sm-between align-items-sm-center">
                    <h1 class="flex-sm-fill h3 my-2">
                        Partners<small
                            class="d-block d-sm-inline-block mt-2 mt-sm-0 font-size-base font-w400 text-muted"></small>
                    </h1>
                </div>
            </div>
        </div>
        <!-- END Hero -->
        <div class="table-search-container mt-5">
            <label for="search">Search:</label>
            <input type="search" id="search" name="search">
        </div>

        <div class="table-controls">
            <label for="page-length">Show:</label>
            <select id="page-length">
                <option value="5">5</option>
                <option value="10">10</option>
                <option value="25">25</option>
                <option value="50">50</option>
            </select>
        </div>
        <!-- END Hero -->
        <div class="content px-4">

            <div class="block block-rounded">
                <div class="block-content ">
                    <div class="d-flex justify-content-end">

                        <a class="addbtn" id="addBtn" href="{{ route('subscribers.create') }}">Add</a>

                        <div class="loader" id="loader" style="display: none;">
                            <div class="external-shadow">
                                <div class="central">
                                    <div class="intern"></div>
                                </div>
                            </div>
                        </div>
                        {{-- <button class="btn btn-info btn-sm" data-toggle="modal" data-target="#addmodal">Add</button> --}}
                    </div>
                </div>


                <div class="block-content block-content-full mt-5">
                    <!-- DataTables init on table by adding .js-dataTable-full class, functionality is initialized in js/pages/be_tables_datatables.min.js which was auto compiled from _js/pages/be_tables_datatables.js -->

                    <div class="row">
                        <div class="col-sm-12">

                            <table class="table js-dataTable-full dataTable no-footer" id="DataTables_Table_0"
                                role="grid" aria-describedby="DataTables_Table_0_info">
                                <thead>
                                    <tr role="row">
                                        <th class="sorting" style="text-align: center;" tabindex="0"
                                            aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-label="Name: activate to sort column ascending">S.No</th>

                                        <th class="text-center sorting_asc" style="text-align: center; width: 20%"
                                            tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-sort="ascending" aria-label="ID: activate to sort column descending">Patner
                                            Name</th>
                                        <!-- <th class="sorting" style="text-align: center;" tabindex="0"
                                            aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-label="Name: activate to sort column ascending">Country Of Origin</th> -->
                                        <th class="d-none d-sm-table-cell sorting" style="text-align: center; width: 20%;"
                                            tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-label="Email: activate to sort column ascending">Industry</th>
                                        <th class="d-none d-sm-table-cell sorting" style="text-align: center; width: 20%;"
                                            tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-label="Email: activate to sort column ascending">Alloted Qr Qty</th>
                                        <!-- <th class="d-none d-sm-table-cell sorting" style="text-align: center; width: 30%;"
                                            tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-label="Email: activate to sort column ascending">Total Qr</th> -->
                                        <th class="d-none d-sm-table-cell sorting" style="text-align: center; width: 20%;"
                                            tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-label="Email: activate to sort column ascending">Qr Left</th>
                                        <th class="d-none d-sm-table-cell sorting" style="text-align: center; width: 20%;"
                                            tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-label="Email: activate to sort column ascending">Status</th>
                                        <th style="text-align: center; width: 25%;" class="sorting" tabindex="0"
                                            aria-controls="DataTables_Table_0" rowspan="1" colspan="1"
                                            aria-label="Registered: activate to sort column ascending">Option</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td class="text-center font-size-sm sorting_1" style="width: 5%;">
                                            {{ 1 }}</td>
                                        <td class="font-w600 font-size-sm" style="width: 15%;">
                                            {{ 'Charles' }}
                                        </td>
                                        <!-- <td class="font-w600 font-size-sm" style="width: 15%;">
                                            {{ 'India' }}
                                        </td> -->
                                        <td class="d-none d-sm-table-cell font-size-sm" style="width: 15%;">
                                            {{ 'salesh' }}
                                        </td>
                                        <td class="d-none d-sm-table-cell font-size-sm" style="width: 20%;">
                                            {{ '12' }}
                                        </td>
                                        <!-- <td class="d-none d-sm-table-cell font-size-sm" style="width: 20%;">
                                            {{ '12' }}
                                        </td> -->
                                        <td class="d-none d-sm-table-cell font-size-sm" style="width: 20%;">
                                            {{ '12' }}
                                        </td>
                                        <td class="d-none d-sm-table-cell" style="width: 15%;"><label class="switch">
                                                <input type="checkbox" checked>
                                                <span class="slider round"></span>
                                            </label></td>
                                        <td style="width: 10%;">
                                            <div class="btn-group">
                                                <div class="btn-group">
                                                    <a href="