@extends('admin.layouts.app')
@section('panel')
    <div class="row">
        <div class="col-lg-12">
            <div class="card b-radius--10 ">
                <div class="card-body p-0">
                    <div class="table-responsive--md  table-responsive">
                        <table class="table table--light style--two">
                            <thead>
                                <tr>
                                    <th>@lang('Plan')</th>
                                    <th>@lang('Invested')</th>
                                    <th>@lang('Will Recieve Interest')</th>
                                    <th>@lang('Total')</th>
                                    <th>@lang('Get Return After')</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($invests as $invest)
                                    <tr>
                                        <td>
                                            <div>
                                                <span class="text--primary fw-bold">{{ __($invest->plan->name) }}</span><br>
                                                <a
                                                    href="{{ route('admin.users.detail', $invest->user->id) }}"><span>@</span>{{ $invest->user->username }}</a>
                                            </div>
                                        </td>
                                        <td>
                                            <div>
                                                <span
                                                    class="text--primary fw-bold">{{ showAmount($invest->amount) }}</span><br>
                                                @lang('For a') {{ $invest->time_name }}
                                            </div>
                                        </td>
                                        <td>
                                            {{ showAmount($invest->interest) }}
                                        </td>
                                        <td> {{ showAmount($invest->interest + $invest->amount) }}
                                        </td>

                                        <td scope="row" class="font-weight-bold">
                                            @if ($invest->status == Status::INVEST_RUNNING && Carbon\Carbon::parse($invest->next_time) < now())
                                                <span class="badge badge--warning">@lang('Payment Processing')</span>
                                            @elseif($invest->status == Status::INVEST_RUNNING)
                                                <p id="counter{{ $invest->id }}" class="demo countdown timess2 "></p>
                                                @php
                                                    if ($invest->last_time) {
                                                        $start = $invest->last_time;
                                                    } else {
                                                        $start = $invest->created_at;
                                                    }
                                                    $nextTime = Carbon\Carbon::parse($invest->next_time);
                                                    $now = Carbon\Carbon::now();
                                                    $diffInSeconds = $now->diffInSeconds($nextTime);
                                                @endphp
                                                <div class="progress @if (Carbon\Carbon::parse($invest->next_time) > now()) createCountDown @endif"
                                                    data-id="counter{{ $invest->id }}"
                                                    data-seconds="{{ $diffInSeconds }}">
                                                    <div class="progress-bar progress-bar-striped" role="progressbar"
                                                        style="width: {{ diffDatePercent($start, $invest->next_time) }}%"
                                                        aria-valuenow="{{ diffDatePercent($start, $invest->next_time) }}"
                                                        aria-valuemin="0" aria-valuemax="100">
                                                    </div>
                                                </div>
                                            @else
                                                <span class="badge badge--success">@lang('Completed')</span>
                                            @endif
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="100%" class="text-center">{{ __($emptyMessage) }}</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
                @if ($invests->hasPages())
                    <div class="card-footer py-4">
                        {{ paginateLinks($invests) }}
                    </div>
                @endif
            </div>
        </div>
    </div>
@endsection

@push('breadcrumb-plugins')
    <x-search-form placeholder="Username / Plan Name" />
@endpush

@push('script')
    <script>
        (function($) {
            "use strict";

            function createCountDown(elementId, sec) {
                var tms = sec;
                var x = setInterval(function() {
                    var distance = tms * 1000;
                    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
                    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
                    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
                    var seconds = Math.floor((distance % (1000 * 60)) / 1000);
                    document.getElementById(elementId).innerHTML = days + "d: " + hours + "h " + minutes +
                        "m " +
                        seconds + "s ";
                    if (distance < 0) {
                        clearInterval(x);
                        document.getElementById(elementId).innerHTML = "COMPLETE";
                    }
                    tms--;
                }, 1000);
            }

            $(document).ready(function() {
                var elements = $('.createCountDown');
                for (let i = 0; i < elements.length; i++) {
                    var element = $(elements[i]);
                    var data = element.data();
                    createCountDown(data.id, data.seconds)
                }
            });

        })(jQuery);
    </script>
@endpush