@extends($theme.'frontend.layouts.master')
@section('title',__('Welcome In Home'))
@section('content')
<div class="dashboard-area pd-top-90 pd-bottom-120">
    <div class="container">
        <div class="mb-4">
            <div class="row">
                <div class="col-lg-12">
                    <div class="input-group mb-3">
                    <input type="text" class="form-control" id="myInputref"  value="{{url('/')}}/register/{{auth()->user()->referral_token}}">
                        <div class="input-group-append">
                            <button class="btn btn-secondary myrefButtonFunction" type="button" onclick="myrefButtonFunction()">{{__('Copy Referral Link')}}</button>
                        </div>
                      </div>
                </div>
            </div>
        </div>

        <div class="mb-4">
            <div class="row">
                @foreach ($rankings as $rank)
                    <div class="col-xl-2 col-md-4 col-6 text-center mt-xl-0 mt-4">
                        <div class="raking-item">
                            @php
                                $rankingIds = auth()->user()->rankings()->pluck('ranking_id')->toArray();
                            @endphp

                            @php
                                $rank = \App\Models\Ranking::find($rank->id);
                            @endphp
                            @if (in_array($rank->id, $rankingIds))
                                <img src="{{ asset('assets/images/ranking/' . $rank->image) }}" alt="">
                                <h5 class="color-base mt-4">{{ $rank->title }}</h5>
                                <p class="fs-15 text-muted">{{ $rank->bonus }} {{ $general->currency }}</p>

                                <p><i class="fa fa-check text-success"></i> {{ __('You are eligible for this level') }}</p>
                            @else
                                <img src="{{ asset('assets/images/ranking/' . $rank->image) }}" alt="">
                                <h5 class="color-base mt-4">{{ $rank->title }}</h5>
                                <p>{{ $rank->bonus }} {{ $general->currency }}</p>

                                <p class="fs-15 text-muted"><i class="fa fa-times text-danger"></i> {{ __('You are not eligible for this level') }}</p>
                            @endif
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
        <div class="mb-4">
            <div class="row">
                <div class="col-lg-4 col-md-6">
                    <div class="media bg-light-base image-hover-rotate border-radius-5 p-4 mb-4">
                        <div class="media-left align-self-center pe-4">
                            <img class="rotate-img ps-xl-2" src="assets/frontend/deepblack/img/icon/17.svg" alt="img">
                        </div>
                        <div class="media-body">
                            <h4 class="color-base mb-1">{{round(auth()->user()->balance,8)}} {{$general->currency}}</h4>
                            <h6 class="mb-0">{{__('Current Balance')}}</h6>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6">
                    <div class="media bg-light-base image-hover-rotate border-radius-5 p-4 mb-4">
                        <div class="media-left align-self-center pe-4">
                            <img class="rotate-img ps-xl-2" src="assets/frontend/deepblack/img/icon/14.svg" alt="img">
                        </div>
                        <div class="media-body">
                            <h4 class="color-base mb-1">{{round($total_earn,8)}} {{$general->currency}}</h4>
                            <h6 class="mb-0">{{__('Total Earning')}}</h6>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6">
                    <div class="media bg-light-base image-hover-rotate border-radius-5 p-4 mb-4">
                        <div class="media-left align-self-center pe-4">
                            <img class="rotate-img ps-xl-2" src="assets/frontend/deepblack/img/icon/10.svg" alt="img">
                        </div>
                        <div class="media-body">
                            <h4 class="color-base mb-1">{{round($total_withdraw,8)}} {{$general->currency}}</h4>
                            <h6 class="mb-0">{{__('Total Withdraw')}}</h6>
                        </div>
                    </div>
                </div>



                <div class="col-lg-4 col-md-6">
                    <div class="media bg-light-base image-hover-rotate border-radius-5 p-4 mb-4">
                        <div class="media-left align-self-center pe-4">
                            <img class="rotate-img ps-xl-2" src="assets/frontend/deepblack/img/icon/15.svg" alt="img">
                        </div>
                        <div class="media-body">
                            <h4 class="color-base mb-1">{{round($month_earn,8)}} {{$general->currency}}</h4>
                            <h6 class="mb-0">{{__('This Month Earn')}}</h6>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6">
                    <div class="media bg-light-base image-hover-rotate border-radius-5 p-4 mb-4">
                        <div class="media-left align-self-center pe-4">
                            <img class="rotate-img ps-xl-2" src="assets/frontend/deepblack/img/icon/16.svg" alt="img">
                        </div>
                        <div class="media-body">
                            <h4 class="color-base mb-1">{{round($month_deposit,8)}} {{$general->currency}}</h4>
                            <h6 class="mb-0">{{__('This Month Deposit')}}</h6>
                        </div>
                    </div>
                </div>
                
                <div class="col-lg-4 col-md-6">
                    <div class="media bg-light-base image-hover-rotate border-radius-5 p-4 mb-4">
                        <div class="media-left align-self-center pe-4">
                            <img class="rotate-img ps-xl-2" src="assets/frontend/deepblack/img/icon/11.svg" alt="img">
                        </div>
                        <div class="media-body">
                            <h4 class="color-base mb-1">{{round($month_withdraw,8)}} {{$general->currency}}</h4>
                            <h6 class="mb-0">{{__('This Month Withdraw')}}</h6>
                        </div>
                    </div>
                </div>

                <div class="col-lg-4 col-md-6">
                    <div class="single-feature-inner bg-light-base text-center image-hover-rotate border-radius-10">
                        <div class="thumb mb-4">
                            <img class="rotate-img" src="assets/frontend/deepblack/img/icon/7.svg" alt="img">
                        </div>
                        <div class="details">
                            <h5 class="color-base mb-1">{{round($total_PendingWithdraw,8)}} {{$general->currency}}</h5>
                            <h6 class="mb-0">{{__('Total Pending Withdraw')}}</h6>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6">
                    <div class="single-feature-inner bg-light-base text-center image-hover-rotate border-radius-10">
                        <div class="thumb mb-4">
                            <img class="rotate-img" src="assets/frontend/deepblack/img/icon/4.svg" alt="img">
                        </div>
                        <div class="details">
                            <h5 class="color-base mb-1">{{round($total_fundTransfer,8)}} {{$general->currency}}</h5>
                            <h6 class="mb-0">{{__('Total Fund Transfer')}}</h6>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6">
                    <div class="single-feature-inner bg-light-base text-center image-hover-rotate border-radius-10">
                        <div class="thumb mb-4">
                            <img class="rotate-img" src="assets/frontend/deepblack/img/icon/5.svg" alt="img">
                        </div>
                        <div class="details">
                            <h5 class="color-base mb-1">{{round($month_fundTransfer,8)}} {{$general->currency}}</h5>
                            <h6 class="mb-0">{{__('This Month Fund Transfer')}}</h6>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('script')
<script>
 (function($) {
    "use strict";
    $(document).ready(function () {
        $(document).on('click', '.myrefButtonFunction', function() {
            var copyText = document.getElementById("myInputref");
            copyText.select();
            copyText.setSelectionRange(0, 99999);
            document.execCommand("copy");
            alert("Copied referral link : " + copyText.value);
        })
    });
 })(jQuery);
</script>
@endsection