@extends('layouts.master')
@section('title', __('Dynamic Sponsor Levels'))

@push('styles')
    <style>
        .table-responsive .columns.columns-right.btn-group.float-right{
            right: 2px !important;
        }
        .search button{
            margin-left: 1px !important;
        }
    </style>
@endpush

    @section('content')
        <section class="main_section">
            <!-- Table Section -->
            <div class="scroll">
                @include('backend.level.create-form')
                <div class="card">
                    <div class="card-body">
                        <div class="table-responsive">
                            <!-- Search filter -->
                            <div id="custom_toolbar_user" class="select">
                                @can('dynamic-sponsor-level-create')
                                    <a data-toggle="tooltip" data-placement="top" title="Add New"
                                        class="btn btn-secondary text-white showArchive btnNewRecord" id="btnNewRecord"
                                        href="javascript:void(0);">{!! renderIconHtml('add') !!}{{ __('Add New') }}</a>
                                @endcan

                                <a data-toggle="tooltip" data-placement="top" title="Back"
                                    class="btn btn-secondary text-white showUsers d-none" onclick="switchCustomerRecords('index')"><i
                                        class="bi bi-arrow-counterclockwise"></i> {{ __('Back') }}</a>

                                @can('dynamic-sponsor-level-archive-show')
                                    <a data-toggle="tooltip" data-placement="top" title="Show Archived"
                                        class="btn btn-secondary text-white showArchive"
                                        onclick="switchCustomerRecords('archive')"><i class="bi bi-archive"></i>  {{ __('Archive') }}</a>
                                @endcan
                            </div>
                            <table class="table table-bordered" id="bstable" data-unique-id="counter" table-for="level"
                                data-toolbar="#custom_toolbar_user" data-toggle="bstable" data-show-export="false" data-show-button-text="true"
                                data-show-columns="true" data-show-toggle="false" data-show-columns-toggle-all="false"
                                data-ajax="getCustomers" data-side-pagination="server" data-pagination="true"
                                data-total-field="count" data-sortable="true" data-data-field="items" data-filter-control="true"
                                data-export-options='{"fileName": "{{ config('app.APP_NAME') . ' - Logs - ' . date('d/m/Y-H:m:s') }}"}'
                                data-icons="icons" data-icons-prefix="bi"
                                data-show-search-clear-button="true" data-loading-template="DataTaleLoadingTemplate" data-search-on-enter-key="true">
                                <thead>
                                    <tr>
                                        <th data-field="counter" data-switchable="true" class="id"
                                            data-width-unit="px">
                                            {{ __('Id') }}</th>
                                        <th data-field="level_name" data-filter-control="input" data-sortable="true" data-filter-control-placeholder="Level Name">
                                            {{ __('Level Name') }} </th>
                                        <th data-field="level_no" data-filter-control="input" data-sortable="true" data-filter-control-placeholder="Level No.">
                                            {{ __('Level No.') }} </th>
                                        <th data-field="color_code" data-filter-control="input" data-sortable="true" data-filter-control-placeholder="Color Code">
                                            {{ __('Color Code') }} </th>
                                        <th data-field="created_at" data-filter-control="input" class="created_at" data-width-unit="px"
                                            data-sortable="true" data-filter-control-placeholder="Created At">
                                            {{ __('Created At') }} </th>
                                        <th data-field="action" data-switchable="true">{{ __('Action') }}</th>
                                    </tr>
                                </thead>
                                <tbody></tbody>
                            </table>
                        </div>
                        <!-- End Table Section -->
                    </div>
                </div>

                <!-- END OF CONTENT AREA -->
            </div>
        </section>
        <input type="hidden" value="{{ route('admin.user-level.getCustomer') }}" id="getCustomer">
        <input type="hidden" value="{{ route('admin.user-level.store') }}" id="levelStore">
        <input type="hidden" value="{{ route('admin.user-level.index') }}" id="levelIndex">
    @endsection
    @push('scripts')
        <script src="{{ asset('backend/js/pages-js/level.js') }}"></script>
    @endpush