@extends($activeTemplate . 'layouts.master')
@section('content')
    <div class="transaction-section padding-top padding-bottom">
        <div class="container">
            <div class="row justify-content-center">
                {{-- <div class="col-md-6 col-lg-4">
                    <div class="dashboard-item">
                        <div class="dashboard-thumb">
                            <i class="fas fa-sitemap"></i>
                        </div>
                        <div class="dashboard-content">
                            <h5 class="title">@lang('Network Size')</h5>
                            <h4 class="amount">{{ $user->network_size ?? 0 }}</h4>
                                <h4 class="amount">{{ $general->cur_sym }}{{ showAmount($balance) }}</h4>
                        </div>
                    </div>
                </div> --}}
                {{-- <div class="col-md-6 col-lg-4">
                    <div class="dashboard-item">
                        <div class="dashboard-thumb">
                            <i class="fas fa-user-check"></i>
                        </div>
                        <div class="dashboard-content">
                            <h5 class="title">@lang('Active Member')</h5>
                            <h4 class="amount">{{ $user->active_network_size ?? 0 }}</h4>
                            <h4 class="amount">{{ $general->cur_sym }}{{ showAmount($balance) }}</h4>
                        </div>
                    </div>
                </div> --}}
                <div class="col-md-6 col-lg-4">
                    <div class="dashboard-item">
                        <div class="dashboard-thumb">
                            <i class="fas fa-user-times"></i>
                        </div>
                        <div class="dashboard-content">
                            <h5 class="title">@lang('Inactive Members')</h5>
                            <h4 class="amount">{{ $network->total() }}</h4>
                            {{-- <h4 class="amount">{{ $general->cur_sym }}{{ showAmount($balance) }}</h4> --}}
                        </div>
                    </div>
                </div>
            </div>
            <div class="show-filter mb-3 text-end">
                <button type="button" class="btn btn-outline--primary showFilterBtn btn-sm"><i class="las la-filter"></i>
                    @lang('Filter')</button>
            </div>
            <div class="card responsive-filter-card mb-4">
                <div class="card-body p-4"
                    style="background: -webkit-linear-gradient(-90deg, #124656 0%, #063a4a 45%, #063b46 100%); color: #ffffff">
                    <form action="">
                        <div class="d-flex flex-wrap gap-4">
                            <div class="flex-grow-1 contact-form-group">
                                <label>@lang('Username/Email/User ID')</label>
                                <input type="text" name="search" value="{{ request()->search }}" class="form-control"
                                    style="background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, 0.1); color: #ffffff">
                            </div>

                            <div class="flex-grow-1  contact-form-group">
                                <label>@lang('Level')</label>
                                <select class="select-bar" name="distance" style="">
                                    <option value="">@lang('Any')</option>
                                    @foreach (range(1, 7) as $distance)
                                        <option value="{{ $distance }}" @selected(request()->distance == $distance)>
                                            {{ __(keyToTitle($distance)) }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="flex-grow-1 align-self-end">
                                <div class="contact-form-group">
                                    <button class="btn btn--warning w-100 h-45" style="line-height: 2.3"><i
                                            class="fas fa-filter"></i> @lang('Filter')</button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

            <div class="d-flex justify-content-end mb-2">

                <div class="btn-group float-end" role="group" aria-label="Basic example">
                    <a href="{{ route('user.export.InactiveMember.pdf', ['search' => request()->search, 'distance' => request()->distance]) }}"
                        class="btn btn--primary btn-sm d-flex align-items-center"><i class="las la-file-pdf"></i>
                        @lang('Generate PDF')</a>
                    <a href="{{ route('user.export.inactiveMember', ['search' => request()->search, 'distance' => request()->distance]) }}"
                        class="btn btn--info btn-sm d-flex align-items-center"><i class="las la-file-excel"></i>
                        @lang('Generate Excel')</a>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="card primary-bg item-rounded">
                        @include($activeTemplate. 'partials.network-table', ['network' => $network])
                    </div>
                </div>
            </div>
            {{-- <div class="row mt-5">
                <div class="col-md-12">
                    <div class="card primary-bg text-white">
                        <div class="card-body">
                            <div class="treeview-container">
                                <ul class="treeview">
                                    <li class="items-expanded"> {{ $user->fullname }} ( {{ $user->username }} )
                                        @include($activeTemplate . 'partials.under_tree', [
                                            'user' => $user,
                                            'layer' => 0,
                                            'isFirst' => true,
                                        ])
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div> --}}
        </div>
    </div>
@endsection

@push('style')
    <link href="{{ asset('assets/global/css/jquery.treeView.css') }}" rel="stylesheet" type="text/css">
@endpush
@push('script')
    <script src="{{ asset('assets/global/js/jquery.treeView.js') }}"></script>
    <script>
        (function($) {
            "use strict"
            $('.treeview').treeView();
        })(jQuery);
    </script>
@endpush
