@extends('layouts.panel')

@section('content')
@php
  $statusLabels = [
    'todo' => 'Todo',
    'doing' => 'Doing',
    'blocked' => 'Blocked',
    'done' => 'Done',
  ];

  $statusCounts = [];
  foreach ($statusLabels as $k => $v) {
    $statusCounts[$k] = (int)($tasksByStatus[$k] ?? 0);
  }
@endphp

<div class="mx-auto max-w-7xl px-4 py-6">
  <div class="flex items-start justify-between gap-4">
    <div>
      <h1 class="text-2xl font-bold text-gray-900 dark:text-gray-100">Raporlar</h1>
      <p class="mt-1 text-sm text-gray-600 dark:text-gray-300">Veritabanındaki gerçek verilerden özet.</p>
    </div>
  </div>

  <div class="mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
    <div class="rounded-3xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-gray-900">
      <div class="text-sm text-gray-500 dark:text-gray-400">Projeler</div>
      <div class="mt-1 text-2xl font-semibold text-gray-900 dark:text-gray-100">{{ $projectsCount }}</div>
    </div>

    <div class="rounded-3xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-gray-900">
      <div class="text-sm text-gray-500 dark:text-gray-400">Görevler</div>
      <div class="mt-1 text-2xl font-semibold text-gray-900 dark:text-gray-100">{{ $tasksCount }}</div>
    </div>

    <div class="rounded-3xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-gray-900">
      <div class="text-sm text-gray-500 dark:text-gray-400">Açık (todo/doing/blocked)</div>
      <div class="mt-1 text-2xl font-semibold text-gray-900 dark:text-gray-100">
        {{ $statusCounts['todo'] + $statusCounts['doing'] + $statusCounts['blocked'] }}
      </div>
    </div>

    <div class="rounded-3xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-gray-900">
      <div class="text-sm text-gray-500 dark:text-gray-400">Tamamlanan</div>
      <div class="mt-1 text-2xl font-semibold text-gray-900 dark:text-gray-100">{{ $statusCounts['done'] }}</div>
    </div>
  </div>

  <div class="mt-6 grid gap-4 lg:grid-cols-3">
    <div class="rounded-3xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-gray-900 lg:col-span-1">
      <h2 class="text-base font-semibold text-gray-900 dark:text-gray-100">Durum Dağılımı</h2>
      <div class="mt-4 space-y-3">
        @foreach($statusLabels as $k => $label)
          @php
            $count = $statusCounts[$k] ?? 0;
            $pct = $tasksCount > 0 ? round(($count / $tasksCount) * 100) : 0;
          @endphp
          <div>
            <div class="flex items-center justify-between text-sm">
              <span class="text-gray-700 dark:text-gray-200">{{ $label }}</span>
              <span class="text-gray-500 dark:text-gray-400">{{ $count }} ({{ $pct }}%)</span>
            </div>
            <div class="mt-2 h-2 w-full overflow-hidden rounded-full bg-gray-100 dark:bg-gray-800">
              <div class="h-full rounded-full bg-gray-900 dark:bg-gray-100" style="width: {{ $pct }}%"></div>
            </div>
          </div>
        @endforeach
      </div>
    </div>

    <div class="rounded-3xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-gray-900 lg:col-span-2">
      <h2 class="text-base font-semibold text-gray-900 dark:text-gray-100">Yaklaşan Görevler</h2>

      @if($upcomingTasks->isEmpty())
        <div class="mt-4 rounded-2xl border border-dashed border-gray-200 p-6 text-sm text-gray-600 dark:border-gray-800 dark:text-gray-300">
          Yaklaşan görev yok.
        </div>
      @else
        <div class="mt-4 overflow-x-auto">
          <table class="min-w-full text-sm">
            <thead class="text-left text-gray-500 dark:text-gray-400">
              <tr>
                <th class="py-2 pr-4">Görev</th>
                <th class="py-2 pr-4">Durum</th>
                <th class="py-2 pr-4">Tarih</th>
                <th class="py-2">Aç</th>
              </tr>
            </thead>
            <tbody class="text-gray-800 dark:text-gray-200">
              @foreach($upcomingTasks as $t)
                <tr class="border-t border-gray-100 dark:border-gray-800">
                  <td class="py-3 pr-4">
                    <div class="font-medium">{{ $t->title }}</div>
                    @if(!empty($t->project?->name))
                      <div class="text-xs text-gray-500 dark:text-gray-400">{{ $t->project->name }}</div>
                    @endif
                  </td>
                  <td class="py-3 pr-4">{{ $statusLabels[$t->status] ?? $t->status }}</td>
                  <td class="py-3 pr-4">{{ \Carbon\Carbon::parse($t->due_date)->format('d.m.Y') }}</td>
                  <td class="py-3">
                    <a class="underline" href="{{ route('tasks.show', $t) }}">Detay</a>
                  </td>
                </tr>
              @endforeach
            </tbody>
          </table>
        </div>
      @endif

      <h2 class="mt-8 text-base font-semibold text-gray-900 dark:text-gray-100">Geciken Görevler</h2>

      @if($overdueTasks->isEmpty())
        <div class="mt-4 rounded-2xl border border-dashed border-gray-200 p-6 text-sm text-gray-600 dark:border-gray-800 dark:text-gray-300">
          Geciken görev yok.
        </div>
      @else
        <div class="mt-4 overflow-x-auto">
          <table class="min-w-full text-sm">
            <thead class="text-left text-gray-500 dark:text-gray-400">
              <tr>
                <th class="py-2 pr-4">Görev</th>
                <th class="py-2 pr-4">Durum</th>
                <th class="py-2 pr-4">Son Tarih</th>
                <th class="py-2">Aç</th>
              </tr>
            </thead>
            <tbody class="text-gray-800 dark:text-gray-200">
              @foreach($overdueTasks as $t)
                <tr class="border-t border-gray-100 dark:border-gray-800">
                  <td class="py-3 pr-4">
                    <div class="font-medium">{{ $t->title }}</div>
                    @if(!empty($t->project?->name))
                      <div class="text-xs text-gray-500 dark:text-gray-400">{{ $t->project->name }}</div>
                    @endif
                  </td>
                  <td class="py-3 pr-4">{{ $statusLabels[$t->status] ?? $t->status }}</td>
                  <td class="py-3 pr-4">{{ \Carbon\Carbon::parse($t->due_date)->format('d.m.Y') }}</td>
                  <td class="py-3">
                    <a class="underline" href="{{ route('tasks.show', $t) }}">Detay</a>
                  </td>
                </tr>
              @endforeach
            </tbody>
          </table>
        </div>
      @endif
    </div>
  </div>

  <div class="mt-6 rounded-3xl border border-gray-200 bg-white p-5 dark:border-gray-800 dark:bg-gray-900">
    <h2 class="text-base font-semibold text-gray-900 dark:text-gray-100">Son Projeler</h2>

    @if($recentProjects->isEmpty())
      <div class="mt-4 rounded-2xl border border-dashed border-gray-200 p-6 text-sm text-gray-600 dark:border-gray-800 dark:text-gray-300">
        Henüz proje yok.
      </div>
    @else
      <div class="mt-4 grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
        @foreach($recentProjects as $p)
          <a href="{{ route('projects.show', $p) }}"
             class="rounded-2xl border border-gray-100 p-4 hover:bg-gray-50 dark:border-gray-800 dark:hover:bg-gray-800/50">
            <div class="font-semibold text-gray-900 dark:text-gray-100">{{ $p->name }}</div>
            <div class="mt-1 text-xs text-gray-500 dark:text-gray-400">
              {{ optional($p->created_at)->format('d.m.Y') }}
            </div>
          </a>
        @endforeach
      </div>
    @endif
  </div>
</div>
@endsection