@extends('layouts.admin_layout')

@section('content')

<main class="h-full overflow-y-auto">
  <div class="container grid px-6 mx-auto">
    <h2
      class="my-6 text-2xl font-semibold text-gray-700 dark:text-gray-200">
      <span class="text-blue-500">Your</span> Dashboard
    </h2>
    <!-- CTA -->
    <a
      class="flex items-center justify-between p-4 mb-8 text-sm bg-blue-600 font-semiboldshadow-md focus:outline-none focus:shadow-outline-red"
      href="{{ url('/') }}" style="color: #def7ec;">
      <div class="flex items-center">
        <svg
          class="w-5 h-5 mr-2"
          fill="currentColor"
          viewBox="0 0 20 20">
          <path
            d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"></path>
        </svg>
        <span>Go to main website</span>
      </div>
      <span>View &RightArrow;</span>
    </a>
    <!-- Cards -->
    <div class="grid gap-6 mb-8 md:grid-cols-2 xl:grid-cols-4">
      <!-- Card -->
      <a href="{{ route('admin.users.show') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Users
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($users) }}
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.users.show') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Unactivated Users
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($unactivatedUsers) }}
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.unconfirmed') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Unconfirmed Users
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($unconfirmedUsers) }}
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.kyc') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Kyc Requests
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($kyc) }}
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.vendor-requests') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Vendor Application Requests
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($vendorRequests) }}
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.agent-requests') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Send By Agent Requests
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($agentRequests) }}
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.pending-products') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Pending Product Requests
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($pendingProducts) }}
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <!-- Card -->
      <a href="{{ route('admin.agent-withdrawals') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                fill-rule="evenodd"
                d="M4 4a2 2 0 00-2 2v4a2 2 0 002 2V6h10a2 2 0 00-2-2H4zm2 6a2 2 0 012-2h8a2 2 0 012 2v4a2 2 0 01-2 2H8a2 2 0 01-2-2v-4zm6 4a2 2 0 100-4 2 2 0 000 4z"
                clip-rule="evenodd"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Agent Withdrawal Requests
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($agentWithdrawals) }}
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.requests') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-teal-500 bg-teal-100 rounded-full dark:text-teal-100 dark:bg-teal-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                fill-rule="evenodd"
                d="M4 4a2 2 0 00-2 2v4a2 2 0 002 2V6h10a2 2 0 00-2-2H4zm2 6a2 2 0 012-2h8a2 2 0 012 2v4a2 2 0 01-2 2H8a2 2 0 01-2-2v-4zm6 4a2 2 0 100-4 2 2 0 000 4z"
                clip-rule="evenodd"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Completed Deposits
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              @php
              $total = 0;
              foreach($deposits as $d){
              $total += $d->amount;
              }
              @endphp
              {{ count($deposits) }} (${{number_format($total, 2)}})
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.withdrawals') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                fill-rule="evenodd"
                d="M4 4a2 2 0 00-2 2v4a2 2 0 002 2V6h10a2 2 0 00-2-2H4zm2 6a2 2 0 012-2h8a2 2 0 012 2v4a2 2 0 01-2 2H8a2 2 0 01-2-2v-4zm6 4a2 2 0 100-4 2 2 0 000 4z"
                clip-rule="evenodd"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Withdrawal Requests
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              {{ count($withdrawals) }} Request(s)
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
      <a href="{{ route('admin.withdrawals') }}">
        <div
          class="flex items-center p-4 bg-white shadow-xs dark:bg-gray-800">
          <div
            class="p-3 mr-4 text-orange-500 bg-orange-100 rounded-full dark:text-orange-100 dark:bg-orange-500">
            <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
              <path
                fill-rule="evenodd"
                d="M4 4a2 2 0 00-2 2v4a2 2 0 002 2V6h10a2 2 0 00-2-2H4zm2 6a2 2 0 012-2h8a2 2 0 012 2v4a2 2 0 01-2 2H8a2 2 0 01-2-2v-4zm6 4a2 2 0 100-4 2 2 0 000 4z"
                clip-rule="evenodd"></path>
            </svg>
          </div>
          <div>
            <p
              class="mb-2 text-sm font-medium text-gray-600 dark:text-gray-400">
              Total Completed Withdrawals
            </p>
            <p
              class="text-lg font-semibold text-gray-700 dark:text-gray-200">
              @php
              $withdrawalTotal = 0;
              $completedWithdrawals = App\Models\Withdrawal::where('status', 2)->get();
              foreach($completedWithdrawals as $w){
              $withdrawalTotal += $w->amount;
              }
              @endphp
              {{ count($completedWithdrawals) }} (${{number_format($withdrawalTotal, 2)}})
            </p>
          </div>
        </div>
      </a>
      <!-- Card -->
    </div>

    <h2
      class="my-6 text-2xl font-semibold text-gray-700 dark:text-gray-200">

      Active AI Instances
    </h2>
    <!-- New Table -->
    <div class="w-full overflow-hidden rounded-lg shadow-xs">
      <div class="w-full overflow-x-auto">
        <table class="w-full whitespace-no-wrap">
          <thead>
            <tr
              class="text-xs font-semibold tracking-wide text-left text-gray-500 uppercase border-b dark:border-gray-700 bg-gray-50 dark:text-gray-400 dark:bg-gray-800">
              <th class="px-4 py-3">User</th>
              <th class="px-4 py-3">Model</th>
              <th class="px-4 py-3">Entry Capital</th>
              <th class="px-4 py-3">Current Capital</th>
              <th class="px-4 py-3">AT Profit</th>
              <th class="px-4 py-3">Status</th>
              <th class="px-4 py-3">Date Started</th>
              <th class="px-4 py-3">End Date</th>
            </tr>
          </thead>
          <tbody
            class="bg-white divide-y dark:divide-gray-700 dark:bg-gray-800">

            @forelse($investments as $investment)
            <tr class="text-gray-700 dark:text-gray-400">
              <td class="px-4 py-3">
                <div class="flex items-center text-sm">
                  <!-- Avatar with inset shadow -->
                  <div
                    class="relative hidden w-8 h-8 mr-3 rounded-full md:block">
                    <img
                      class="object-cover w-full h-full rounded-full"
                      @if($investment->user->avatar == null)
                    src="{{ asset('images/toy-avatar.png') }}"
                    @else
                    src="{{ asset('storage/images/'.$investment->user->avatar) }}"
                    @endif
                    alt=""
                    loading="lazy"
                    />
                    <div
                      class="absolute inset-0 rounded-full shadow-inner"
                      aria-hidden="true"></div>
                  </div>
                  <div><a href="{{ route('admin.investment.show', $investment->id) }}">
                      <p class="font-semibold">{{ $investment->user->first_name }} {{ $investment->user->last_name }}</p>
                      <p class="text-xs text-gray-600 dark:text-gray-400">
                        {{ $investment->user->email }} - [{{ $investment->user->username }}]
                      </p>
                  </div></a>
                </div>
              </td>
              <td class="px-3 py-3 text-sm">
                {{ $investment->plan->name }}
              </td>
              <td class="px-4 py-3 text-sm">
                USDT {{ number_format($investment->amount, 2) }}
              </td>
              <td class="px-4 py-3 text-sm">
                USDT {{ number_format($investment->balance + $investment->amount, 2) }}
              </td>
              <td class="px-4 py-3 text-sm">
                <p>
                  $ {{ number_format($investment->pfit, 2) }}
                </p>
                <p>
                  <i>$ {{ number_format($investment->f_pfit, 2) }}</i>
                </p>
              </td>
              <td class="px-4 py-3 text-xs">
                @if($investment->status == 1)
                <span
                  class="px-2 py-1 font-semibold leading-tight text-red-700 bg-red-100 rounded-full dark:bg-red-700 dark:text-red-100">
                  Pending
                </span>
                @elseif($investment->status == 2)
                <span
                  class="px-2 py-1 font-semibold leading-tight text-orange-700 bg-orange-100 rounded-full dark:bg-orange-100 dark:text-orange-500">
                  Ongoing
                </span>
                @elseif($investment->status == 3)
                <span
                  class="px-2 py-1 font-semibold leading-tight text-green-700 bg-green-100 rounded-full dark:bg-green-700 dark:text-green-100">
                  Completed
                </span>
                @endif
              </td>
              <td class="px-4 py-3 text-sm">
                {{ date('M j Y', strtotime($investment->buy_date)) }}
              </td>
              <td class="px-4 py-3 text-sm">
                {{ date('M j Y', strtotime($investment->end_date)) }}
              </td>
            </tr>
            @empty
            <div align="center" class="my-3">
              <p class="text-gray-700 lead dark:text-gray-200">No Active Trades.</p>
            </div>
            <br><br><br>
            @endforelse


          </tbody>
        </table>
      </div>
      <div
        class="grid px-4 py-3 text-xs font-semibold tracking-wide text-gray-500 uppercase border-t dark:border-gray-700 bg-gray-50 sm:grid-cols-9 dark:text-gray-400 dark:bg-gray-800">
      </div>
    </div>


  </div>
  </div>
  </div>
</main>

@endsection