@extends('layouts.app')
@section('title','Admin')
@section('content')
<div class="topbar"><h2>Painel Admin</h2></div>

<div class="grid grid-4">
  <div class="kpi"><div class="label">Usuários</div><div class="value">{{ $metrics['total_users'] }}</div></div>
  <div class="kpi"><div class="label">MRR</div><div class="value">R$ {{ number_format($metrics['mrr_brl'],2,',','.') }}</div></div>
  <div class="kpi"><div class="label">Receita paga</div><div class="value">R$ {{ number_format($metrics['revenue_paid_brl'],2,',','.') }}</div></div>
  <div class="kpi"><div class="label">Faturas pendentes</div><div class="value">{{ $metrics['invoices_pending'] }}</div></div>
</div>

<div class="card" style="margin-top:16px">
  <h3>Aparência (Branding)</h3>
  <form method="POST" action="{{ route('admin.branding') }}" enctype="multipart/form-data">@csrf
    <div class="grid grid-2">
      <div class="field"><label>Nome da marca</label><input name="brand_name" value="{{ $branding->brand_name }}" required></div>
      <div class="field"><label>Tagline</label><input name="tagline" value="{{ $branding->tagline }}"></div>
    </div>
    <div class="grid grid-2">
      <div class="field"><label>Logo (PNG/JPG)</label><input type="file" name="logo" accept="image/*">
        @if($branding->logo_url)<img src="{{ $branding->logo_url }}" style="max-height:40px;margin-top:8px">@endif
      </div>
      <div class="field"><label>Favicon</label><input type="file" name="favicon" accept="image/*,.ico">
        @if($branding->favicon_url)<img src="{{ $branding->favicon_url }}" style="max-height:32px;margin-top:8px">@endif
      </div>
    </div>
    <button class="btn btn-primary">Salvar aparência</button>
  </form>
</div>

<div class="card" style="margin-top:16px">
  <h3>Planos</h3>
  <table>
    <thead><tr><th>ID</th><th>Nome</th><th>Preço</th><th>Max clientes</th><th>Max cobranças/mês</th><th>Ativo</th><th></th></tr></thead>
    <tbody>
    @foreach($plans as $p)
      <tr>
        <form method="POST" action="{{ route('admin.plans.update',$p->id) }}">@csrf
        <td><strong>{{ $p->id }}</strong></td>
        <td><input name="name" value="{{ $p->name }}" style="width:150px"></td>
        <td><input type="number" step="0.01" name="price_brl" value="{{ $p->price_brl }}" style="width:100px"></td>
        <td><input type="number" name="max_clients" value="{{ $p->max_clients }}" placeholder="∞" style="width:80px"></td>
        <td><input type="number" name="max_charges_per_month" value="{{ $p->max_charges_per_month }}" placeholder="∞" style="width:80px"></td>
        <td><input type="checkbox" name="active" value="1" {{ $p->active?'checked':'' }}></td>
        <td><button class="btn btn-sm btn-primary">Salvar</button></td>
        </form>
      </tr>
    @endforeach
    </tbody>
  </table>
</div>

<div class="card" style="margin-top:16px">
  <h3>Usuários</h3>
  <table>
    <thead><tr><th>Email</th><th>Cadastrado</th><th>Plano</th><th>Status</th><th>Vence</th><th>Admin</th><th>Alterar plano</th></tr></thead>
    <tbody>
    @foreach($users as $u)
      <tr>
        <td>{{ $u->email }}{{ $u->is_admin?' 👑':'' }}</td>
        <td>{{ $u->created_at?->format('d/m/Y') }}</td>
        <td>{{ $u->plan_id ?? '-' }}</td>
        <td>{{ $u->sub_status ?? '-' }}</td>
        <td>{{ $u->current_period_end ? \Carbon\Carbon::parse($u->current_period_end)->format('d/m/Y') : '-' }}</td>
        <td>
          <form method="POST" action="{{ route('admin.users.admin',$u->id) }}">@csrf
            <button class="btn btn-sm btn-secondary">{{ $u->is_admin?'Remover':'Tornar' }}</button>
          </form>
        </td>
        <td>
          <form method="POST" action="{{ route('admin.users.plan',$u->id) }}" class="flex">@csrf
            <select name="plan_id" style="width:90px">@foreach($plans as $p)<option value="{{ $p->id }}" {{ $u->plan_id===$p->id?'selected':'' }}>{{ $p->id }}</option>@endforeach</select>
            <select name="status" style="width:90px"><option value="active">active</option><option value="trialing">trialing</option><option value="cancelled">cancelled</option></select>
            <input type="number" name="days" value="30" style="width:60px">
            <button class="btn btn-sm btn-primary">OK</button>
          </form>
        </td>
      </tr>
    @endforeach
    </tbody>
  </table>
</div>
@endsection