@extends('layouts.vertical', ['title' => 'Dashboard'])

@section('content')
    <!-- Start Content-->
    <div class="container-fluid">

        <!-- start page title -->
        <div class="row">
            <div class="col-12">
                <div class="page-title-box">
                    <div class="page-title-right">
                        <ol class="breadcrumb m-0">
                            <li class="breadcrumb-item active">CRM</li>
                        </ol>
                    </div>
                    <h4 class="page-title">Dashboard</h4>
                </div>
            </div>
        </div>
        <!-- end page title -->

        @if(getPermission( Auth::user()->permissions , 'dashboard_stats'))
        <div class="row">
            <div class="col-lg-6 col-xl-3">
                <div class="card bg-pattern">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-6">
                                <div class="avatar-md bg-success rounded">
                                    <i class="fe-shield avatar-title font-22 text-white"></i>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="text-end">
                                    <h3 class="text-dark my-1"><span data-plugin="counterup">{{count($policies)}}</span></h3>
                                    <p class="text-muted mb-0 text-truncate">Polizas</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> <!-- end card-->
            </div> <!-- end col -->

            <div class="col-lg-6 col-xl-3">
                <div class="card bg-pattern">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-6">
                                <div class="avatar-md bg-success rounded">
                                    <i class="fe-users avatar-title font-22 text-white"></i>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="text-end">
                                    <h3 class="text-dark my-1"><span data-plugin="counterup">{{count($clients)}}</span></h3>
                                    <p class="text-muted mb-0 text-truncate">Clientes</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> <!-- end card-->
            </div> <!-- end col -->
            <div class="col-lg-6 col-xl-3">
                <div class="card bg-pattern">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-6">
                                <div class="avatar-md bg-success rounded">
                                    <i class="fe-folder-minus avatar-title font-22 text-white"></i>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="text-end">
                                    <h3 class="text-dark my-1"><span data-plugin="counterup">{{count($tickets->where('status', 1))}}</span></h3>
                                    <p class="text-muted mb-0 text-truncate">Gestiones</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> <!-- end card-->
            </div> <!-- end col -->
            <div class="col-lg-6 col-xl-3">
                <div class="card bg-pattern">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-6">
                                <div class="avatar-md bg-success rounded">
                                    <i class="fe-book-open avatar-title font-22 text-white"></i>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="text-end">
                                    <h3 class="text-dark my-1"><span data-plugin="counterup">{{count($claims)}}</span></h3>
                                    <p class="text-muted mb-0 text-truncate">Reclamos</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> <!-- end card-->
            </div> <!-- end col -->
        </div>
        <!-- end row-->
        @endif

        <div class="row">
            <div class="col-lg-8">
                <div class="card">
                    <div class="card-body pb-2">
                        <div class="float-end d-none d-md-inline-block">
                            <div class="btn-group mb-2">
                                <button type="button" class="btn btn-xs btn-light">Hoy</button>
                                <button type="button" class="btn btn-xs btn-light">Semanal</button>
                                <button type="button" class="btn btn-xs btn-secondary">Mensual</button>
                            </div>
                        </div>

                        <h4 class="header-title mb-3">Monitoreo de Productividad</h4>

                        <div dir="ltr">
                            <div id="performance-monitoring" class="mt-4" data-colors="#1abc9c,#4a81d4"></div>
                        </div>
                    </div>
                </div> <!-- end card -->
            </div> <!-- end col-->

            <div class="col-lg-4">
                <div class="card">
                    <div class="card-body">
                        <div class="dropdown float-end">
                            <a href="#" class="dropdown-toggle arrow-none card-drop" data-bs-toggle="dropdown" aria-expanded="false">
                                <i class="mdi mdi-dots-vertical"></i>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end">
                                <a href="{{ url('/policy/list') }}" class="dropdown-item">Ver todo</a>
                            </div>
                        </div>
                        <h4 class="header-title mb-3">Últimas Pólizas</h4>

                        <div class="table-responsive">
                            <table class="table table-striped table-sm table-nowrap table-centered mb-0">
                                <thead>
                                    <tr>
                                        <th>Estado</th>
                                        <th style="width: 80px;">Póliza</th>
                                        <th class="text-start">Total</th> <!-- Encabezado alineado a la izquierda -->
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($policies->take(10) as $policy)
                                        <tr>
                                            <!-- Estado -->
                                            <td>
                                                @php
                                                    $statusIcons = [
                                                        1 => ['icon' => 'bi-hourglass', 'class' => 'bg-warning', 'label' => 'Espera'], // ⏳ Reloj de arena
                                                        2 => ['icon' => 'bi-check', 'class' => 'bg-success', 'label' => 'Activo'], // ✅ Check
                                                        3 => ['icon' => 'bi-x-lg', 'class' => 'bg-danger', 'label' => 'Desactivado'], // ❌ X
                                                    ];

                                                    // Obtener el estado correspondiente o valor por defecto
                                                    $status = $statusIcons[$policy->status] ?? ['icon' => 'bi-question-circle', 'class' => 'bg-secondary', 'label' => 'Desconocido'];
                                                @endphp

                                                <span class="badge {{ $status['class'] }} rounded-pill fs-5">
                                                    <i class="bi {{ $status['icon'] }}"></i>
                                                </span>
                                            </td>
                                            <!-- Póliza -->
                                            <td style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 0.75rem;">
                                                <!-- Definir iconos por categoría -->
                                                @php
                                                    $categoryId = optional(optional($policy->getBranch)->getCategory)->id;
                                                    $icons = [
                                                        1 => '<i class="fas fa-user" style="color: #43bfe5;"></i> ', // Usuario (azul)
                                                        2 => '<i class="bi bi-car-front-fill" style="color: #6d9d3c;"></i> ', // Carro (verde)
                                                        3 => '<i class="fas fa-building" style="color: #323a46;"></i> ', // Edificio (gris)
                                                    ];
                                                    $icon = $icons[$categoryId] ?? ''; // Obtener icono o vacío si no hay coincidencia
                                                @endphp

                                                @if(getPermission(Auth::user()->permissions, 'policy_edit'))
                                                    <a href="{{ url('/policy/edit/' . $policy->id) }}" class="text-primary">
                                                        {!! $icon !!} {{ $policy->policy_id }}
                                                    </a>
                                                @else
                                                    {!! $icon !!} {{ $policy->policy_id }}
                                                @endif
                                            </td>

                                            <!-- Total -->
                                            <td class="text-start"> <!-- Reducir tamaño de fuente y alinear a la izquierda -->
                                                @if ($policy->status == 1)
                                                    --
                                                @else
                                                    <span class="text-muted">{{ $policy->currency ?? '' }}</span> <!-- Símbolo alineado a la izquierda -->
                                                    {{ number_format($policy->total, 2, '.', ',') }}
                                                @endif
                                            </td>
                                            <!-- Acciones -->
                                            <td class="table-action">
                                                <div class="dropdown">
                                                    <a href="#" class="dropdown-toggle arrow-none" data-bs-toggle="dropdown" aria-expanded="false">
                                                        <i class="mdi mdi-dots-vertical"></i>
                                                    </a>
                                                    <div class="dropdown-menu dropdown-menu-end">
                                                        @if(getPermission(Auth::user()->permissions, 'policy_activation') && $policy->status == 1)
                                                            <a href="{{ url('/policy/activate/' . $policy->id) }}" class="dropdown-item">
                                                                <i class="bi bi-play-fill"></i> Inicializar
                                                            </a>
                                                        @endif
                                                        @if(getPermission(Auth::user()->permissions, 'payment_cuotes') && $policy->status == 2)
                                                            <a href="{{ url('/payments/list?search=' . $policy->id) }}" class="dropdown-item">
                                                                <i class="bi bi-currency-dollar"></i> Pagos
                                                            </a>
                                                        @endif
                                                        @if(getPermission(Auth::user()->permissions, 'policy_renovation') && $policy->status == 2)
                                                            <a href="{{ url('/policy/renovation/list/' . $policy->id) }}" class="dropdown-item">
                                                                <i class="bi bi-boxes"></i> Renovaciones
                                                            </a>
                                                        @endif
                                                        @if(getPermission(Auth::user()->permissions, 'policy_insurers') && $policy->status == 2)
                                                            <a href="{{ url('/policy/insurers/' . $policy->id) }}" class="dropdown-item">
                                                                <i class="bi bi-list-check"></i> Asegurados
                                                            </a>
                                                        @endif
                                                        @if(getPermission(Auth::user()->permissions, 'policy_edit') && $policy->status == 2)
                                                            <a href="{{ url('/policy/edit/' . $policy->id) }}" class="dropdown-item">
                                                                <i class="bi bi-pencil-square"></i> Modificar
                                                            </a>
                                                        @endif
                                                        @if(getPermission(Auth::user()->permissions, 'policy_covers') && $policy->status == 2)
                                                            <a href="{{ url('/policy/covers/' . $policy->id) }}" class="dropdown-item">
                                                                <i class="bi bi-shield"></i> Coberturas
                                                            </a>
                                                        @endif
                                                        @if(getPermission(Auth::user()->permissions, 'policy_delete') && ($policy->status == 2 || $policy->status == 3))
                                                            @php
                                                                $newStatus = ($policy->status == 2) ? 3 : 2;
                                                                $url = url("/policy/change-status/{$policy->id}/$newStatus");
                                                                $actionText = ($policy->status == 2)
                                                                    ? '<i class="bi bi-dash-square"></i> Desactivar'
                                                                    : '<i class="bi bi-check"></i> Reactivar';
                                                            @endphp
                                                            <a href="{{ $url }}" class="dropdown-item">
                                                                {!! $actionText !!}
                                                            </a>
                                                        @endif
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div> <!-- end table-responsive-->
                    </div> <!-- end card-body-->
                </div> <!-- end card-->
            </div> <!-- end col-->


            <div class="col-lg-6">
                <div class="card">
                    <div class="card-body">
                        <div class="dropdown float-end">
                            <a href="#" class="dropdown-toggle arrow-none card-drop" data-bs-toggle="dropdown" aria-expanded="false">
                                <i class="mdi mdi-dots-vertical"></i>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end">
                                <a href="{{ url('/clients/list') }}" class="dropdown-item">Ver todo</a>
                            </div>
                        </div>
                        <h4 class="header-title mb-3">Últimos clientes</h4>

                        <div class="table-responsive">
                            <table class="table table-striped table-sm table-nowrap table-centered mb-0">
                                <thead>
                                    <tr>
                                        <th>Fotografía</th>
                                        <th>Nombre de Cliente / Empresa</th>
                                        <th>Tipo</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($clients->take(10) as $client)
                                        <tr> <!-- Reducir el tamaño de las filas -->
                                            <!-- Nombre del Cliente / Empresa -->
                                            <td>
                                            @if ($client->avatar)
                                                <img src="{{ getFileUrl($client->avatar) }}" style="width: 40px; height: 40px; object-fit: cover;">
                                            @else
                                                <img src="{{ url('static/img/src/' . ($client->type == 1 ? 'natural_client.png' : 'business_client.png')) }}" 
                                                    style="width: 30px; height: 30px; object-fit: cover;">
                                            @endif
                                            </td>
                                            <td>
                                                @if(getPermission(Auth::user()->permissions, 'clients_edit'))
                                                    <a href="{{ url('/clients/profile/' . $client->id) }}" class="text-primary">
                                                        {{ getClientName($client) }}
                                                    </a>
                                                @else
                                                    {{ getClientName($client) }}
                                                @endif
                                                @if ($client->type == 2)
                                                    <p class="m-0 text-muted">
                                                        <span class="badge bg-warning">
                                                            {{ $client->name }} {{ $client->name2 }} {{ $client->lastname }} {{ $client->lastname2 }}
                                                        </span>
                                                    </p>
                                                @endif
                                            </td>
                                            <!-- Tipo -->
                                            <td>
                                                @if($client->type == 1)
                                                    <span class="badge bg-primary">Natural</span>
                                                @elseif($client->type == 2)
                                                    <span class="badge bg-warning">Jurídico</span>
                                                @endif 
                                                @if($client->prospect == 1)
                                                    <span class="badge bg-info">Prospecto</span>
                                                @endif
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div> <!-- end table-responsive-->
                    </div> <!-- end card-body-->
                </div> <!-- end card-->
            </div> <!-- end col-->

            <div class="col-lg-6">
                <div class="card">
                    <div class="card-body">
                        <div class="dropdown float-end">
                            <a href="#" class="dropdown-toggle arrow-none card-drop" data-bs-toggle="dropdown" aria-expanded="false">
                                <i class="mdi mdi-dots-vertical"></i>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end">
                                <a href="{{ url('/tickets') }}" class="dropdown-item">Ver todo</a>
                            </div>
                        </div>
                        <h4 class="header-title mb-3">Últimas gestiones</h4>

                        <div class="table-responsive">
                            <table class="table table-striped table-sm table-nowrap table-centered mb-0">
                                <thead>
                                    <tr>
                                        <th>Gestión</th>
                                        <th>Estado</th>
                                        <th>Prioridad</th>
                                        <th>Creado</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($tickets->take(12) as $ticket)
                                        <tr> <!-- Reducir el tamaño de las filas -->
                                            <!-- Gestión -->
                                            <td>
                                                @if(getPermission(Auth::user()->permissions, 'ticket_edit'))
                                                    <a href="{{ url('/tickets/edit/' . $ticket->id) }}" class="text-primary">
                                                        {{ $ticket->id }}
                                                    </a>
                                                @else
                                                    {{ $ticket->id }}
                                                @endif
                                            </td>
                                            <!-- Estado -->
                                            <td>
                                                <span class='badge {{$ticket->ticket_status_class}}'>{{$ticket->ticket_status_name}}</span>
                                            </td>
                                            <!-- Prioridad -->
                                            <td>
                                                <span class='badge {{$ticket->ticket_priority_class}}'>{{$ticket->ticket_priority_name}}</span>
                                            </td>
                                            <!-- Creado -->
                                            <td>
                                                {{$ticket->created_at->format('d/m/Y')}}
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div> <!-- end table-responsive-->
                    </div> <!-- end card-body-->
                </div> <!-- end card-->
            </div> <!-- end col-->


        </div>
        <!-- end row-->
    </div> <!-- container 2.0.50 -->
@endsection

@section('script')
    @vite(['resources/js/pages/dashboard-1.init.js'])
@endsection