@extends('layouts.landing')

@section('title', 'Acta de Calificaciones')

@section('head')
<style>
    @media print {
        .no-print { display: none !important; }
        body { font-size: 12px; }
        .card { border: none !important; box-shadow: none !important; }
        .card-header { background: none !important; border-bottom: 2px solid #333 !important; }
        table { font-size: 11px; }
    }
    .calificacion-cell { min-width: 70px; text-align: center; }
    .promedio-cell { min-width: 80px; text-align: center; font-weight: bold; }
    th.rotate { height: 130px; white-space: nowrap; vertical-align: bottom; }
    th.rotate > div { transform: rotate(-60deg); transform-origin: bottom left; width: 30px; padding-bottom: 5px; }
</style>
@endsection

@section('content')
<div class="container-fluid">
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <div class="d-sm-flex align-items-center justify-content-between">
                <div>
                    <h6 class="m-0 font-weight-bold text-primary">
                        Acta de Calificaciones
                    </h6>
                    <small class="text-muted">
                        {{ $material->name }} &middot; Grupo: {{ $grupo->clave }}
                    </small>
                </div>
                <div class="no-print">
                    <a href="{{ route('grupo.material.tareas', [$grupo, $material]) }}"
                       class="btn btn-sm btn-secondary shadow-sm mr-2">
                        <i class="fas fa-arrow-left fa-sm"></i> Regresar
                    </a>
                    <button onclick="window.print()" class="btn btn-sm btn-primary shadow-sm">
                        <i class="fas fa-print fa-sm"></i> Imprimir
                    </button>
                </div>
            </div>
        </div>

        <div class="card-body">

            {{-- Resumen --}}
            <div class="row mb-4">
                <div class="col-md-3 col-sm-6 mb-3">
                    <div class="card border-left-primary shadow-sm h-100 py-2">
                        <div class="card-body">
                            <div class="text-xs font-weight-bold text-primary text-uppercase mb-1">
                                Total de Tareas
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $tareas->count() }}</div>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6 mb-3">
                    <div class="card border-left-success shadow-sm h-100 py-2">
                        <div class="card-body">
                            <div class="text-xs font-weight-bold text-success text-uppercase mb-1">
                                Total de Alumnos
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $alumnos->count() }}</div>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6 mb-3">
                    <div class="card border-left-info shadow-sm h-100 py-2">
                        <div class="card-body">
                            <div class="text-xs font-weight-bold text-info text-uppercase mb-1">
                                Materia
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">{{ $material->name }}</div>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6 mb-3">
                    <div class="card border-left-warning shadow-sm h-100 py-2">
                        <div class="card-body">
                            <div class="text-xs font-weight-bold text-warning text-uppercase mb-1">
                                Generado
                            </div>
                            <div class="h5 mb-0 font-weight-bold text-gray-800">
                                {{ \Carbon\Carbon::now()->format('d/m/Y') }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            @if ($tareas->isEmpty())
                <div class="alert alert-info">No hay tareas registradas para esta materia.</div>
            @elseif ($alumnos->isEmpty())
                <div class="alert alert-info">No hay alumnos inscritos en este grupo.</div>
            @else
                <div class="table-responsive">
                    <table class="table table-bordered table-sm" style="width:100%">
                        <thead class="thead-dark">
                            <tr>
                                <th class="align-middle" style="min-width:40px">#</th>
                                <th class="align-middle" style="min-width:180px">Alumno</th>
                                @foreach ($tareas as $tarea)
                                    <th class="rotate calificacion-cell">
                                        <div title="{{ $tarea->titulo }}">
                                            {{ Str::limit($tarea->titulo, 25) }}
                                        </div>
                                    </th>
                                @endforeach
                                <th class="align-middle promedio-cell text-center"
                                    style="background:#1a3a5c; color:#fff;">
                                    Promedio Final
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            @php $fila = 1; @endphp
                            @foreach ($alumnos as $alumno)
                                @php
                                    $user            = $alumno->alumnos->first();
                                    $nombre          = $user?->name ?? 'Sin nombre';
                                    $calificaciones  = [];
                                    $sumaCal         = 0;
                                    $countCal        = 0;

                                    foreach ($tareas as $tarea) {
                                        $entrega = $entregas[$alumno->id][$tarea->id] ?? null;
                                        $cal     = ($entrega && $entrega->status === 'calificada')
                                                    ? $entrega->calificacion
                                                    : null;
                                        $calificaciones[$tarea->id] = [
                                            'valor'  => $cal,
                                            'status' => $entrega?->status ?? 'sin_subir',
                                        ];
                                        if ($cal !== null) {
                                            $sumaCal += $cal;
                                            $countCal++;
                                        }
                                    }

                                    $promedio = $countCal > 0 ? round($sumaCal / $countCal, 1) : null;
                                @endphp
                                <tr>
                                    <td class="text-center align-middle">{{ $fila++ }}</td>
                                    <td class="align-middle">{{ $nombre }}</td>
                                    @foreach ($tareas as $tarea)
                                        @php $data = $calificaciones[$tarea->id]; @endphp
                                        <td class="calificacion-cell align-middle">
                                            @if ($data['valor'] !== null)
                                                <span class="{{ $data['valor'] >= 6 ? 'text-success' : 'text-danger' }} font-weight-bold">
                                                    {{ number_format($data['valor'], 1) }}
                                                </span>
                                            @elseif ($data['status'] === 'pendiente')
                                                <span class="text-warning" title="Pendiente de calificar">
                                                    <i class="fas fa-clock"></i>
                                                </span>
                                            @elseif ($data['status'] === 'sin_subir')
                                                <span class="text-muted" title="Sin entregar">&mdash;</span>
                                            @endif
                                        </td>
                                    @endforeach
                                    <td class="promedio-cell align-middle" style="background:#f8f9fc;">
                                        @if ($promedio !== null)
                                            <span class="badge badge-pill {{ $promedio >= 6 ? 'badge-success' : 'badge-danger' }}"
                                                  style="font-size:.95rem; padding:.4em .7em;">
                                                {{ number_format($promedio, 1) }}
                                            </span>
                                        @else
                                            <span class="text-muted">S/C</span>
                                        @endif
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <div class="mt-3 no-print">
                    <small class="text-muted">
                        <i class="fas fa-info-circle"></i>
                        El promedio final se calcula únicamente sobre las tareas ya calificadas.
                        <strong>&mdash;</strong> = sin entregar &nbsp;|&nbsp;
                        <i class="fas fa-clock text-warning"></i> = entregada, pendiente de calificación &nbsp;|&nbsp;
                        <strong>S/C</strong> = sin calificaciones registradas.
                    </small>
                </div>

                {{-- Firma para impresión --}}
                <div class="row mt-5 d-none d-print-flex">
                    <div class="col-4 text-center">
                        <div style="border-top:1px solid #333; padding-top:8px; margin-top:50px;">
                            Firma del Docente
                        </div>
                    </div>
                    <div class="col-4 text-center">
                        <div style="border-top:1px solid #333; padding-top:8px; margin-top:50px;">
                            Firma del Director
                        </div>
                    </div>
                    <div class="col-4 text-center">
                        <div style="border-top:1px solid #333; padding-top:8px; margin-top:50px;">
                            Sello de la Institución
                        </div>
                    </div>
                </div>
            @endif

        </div>
    </div>
</div>
@endsection