@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center mb-4">
                <h1 class="h3 mb-0">
                    <i class="fas fa-calendar-check me-2"></i>Gestionare Prezență
                </h1>
                <div class="d-flex gap-2">
                    <a href="{{ route('attendance.statistics') }}" class="btn btn-outline-info">
                        <i class="fas fa-chart-bar me-1"></i>Statistici
                    </a>
                </div>
            </div>
        </div>
    </div>

    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="fas fa-check-circle me-2"></i>{{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="fas fa-exclamation-circle me-2"></i>{{ session('error') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    <!-- Week Navigation -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <div class="d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">
                            <i class="fas fa-calendar-week me-2"></i>Săptămâna {{ $weekdays[0]['date']->format('d.m') }} - {{ $weekdays[4]['date']->format('d.m.Y') }}
                        </h5>
                        <div class="btn-group">
                            <a href="{{ route('attendance.index', ['week' => 'prev', 'date' => $selectedDate]) }}" 
                               class="btn btn-outline-secondary btn-sm">
                                <i class="fas fa-chevron-left me-1"></i>Săptămâna anterioară
                            </a>
                            <a href="{{ route('attendance.index', ['date' => now()->format('Y-m-d')]) }}" 
                               class="btn btn-outline-primary btn-sm">
                                <i class="fas fa-calendar-day me-1"></i>Astăzi
                            </a>
                            <a href="{{ route('attendance.index', ['week' => 'next', 'date' => $selectedDate]) }}" 
                               class="btn btn-outline-secondary btn-sm">
                                Săptămâna următoare<i class="fas fa-chevron-right ms-1"></i>
                            </a>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    <div class="row">
                        @foreach($weekdays as $day)
                            <div class="col">
                                <a href="{{ route('attendance.index', ['date' => $day['formatted']]) }}" 
                                   class="btn btn-outline-primary w-100 {{ $day['is_selected'] ? 'active' : '' }} {{ $day['is_today'] ? 'border-warning' : '' }}">
                                    <div class="d-flex flex-column align-items-center">
                                        <small class="text-muted">{{ $day['day_name_ro'] }}</small>
                                        <strong>{{ $day['display'] }}</strong>
                                        @if($day['is_today'])
                                            <small class="text-warning">Astăzi</small>
                                        @endif
                                    </div>
                                </a>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Selected Date Info -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <h5 class="mb-1">
                                <i class="fas fa-calendar-day me-2"></i>{{ $weekdays[array_search($selectedDate, array_column($weekdays, 'formatted'))]['day_name_ro'] }}, {{ $date->format('d.m.Y') }}
                            </h5>
                            <p class="text-muted mb-0">Data selectată pentru gestionarea prezenței</p>
                        </div>
                        <div class="col-md-6 text-end">
                            <div class="d-flex justify-content-end gap-3">
                                <div class="text-center">
                                    <div class="h4 mb-0 text-primary">{{ $children->count() }}</div>
                                    <small class="text-muted">Copii înregistrați</small>
                                </div>
                                <div class="text-center">
                                    <div class="h4 mb-0 text-success">{{ $attendances->where('is_present', true)->count() }}</div>
                                    <small class="text-muted">Prezenți</small>
                                </div>
                                <div class="text-center">
                                    <div class="h4 mb-0 text-danger">{{ $attendances->where('is_present', false)->count() }}</div>
                                    <small class="text-muted">Absenți</small>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @if($children->count() > 0)
        <form method="POST" action="{{ route('attendance.store') }}">
            @csrf
            <input type="hidden" name="date" value="{{ $selectedDate }}">
            
            <div class="row">
                @foreach($children as $child)
                    @php
                        $attendance = $attendances->get($child->id);
                        $isPresent = $attendance ? $attendance->is_present : false;
                        $absenceReason = $attendance ? $attendance->absence_reason : '';
                        $includeInMeal = $attendance ? $attendance->include_in_meal : true;
                    @endphp
                    
                    <div class="col-md-6 col-lg-4 mb-4">
                        <div class="card h-100">
                            <div class="card-body">
                                <div class="d-flex justify-content-between align-items-start mb-3">
                                    <div>
                                        <h5 class="card-title mb-1">{{ $child->full_name }}</h5>
                                        <p class="text-muted small mb-0">
                                            <i class="fas fa-users me-1"></i>{{ $child->group->name ?? 'Fără grup' }}
                                        </p>
                                    </div>
                                    <div class="form-check form-switch">
                                        <input class="form-check-input" type="checkbox" 
                                               id="present_{{ $child->id }}" 
                                               name="attendance[{{ $child->id }}][is_present]" 
                                               value="1" {{ $isPresent ? 'checked' : '' }}>
                                        <input type="hidden" name="attendance[{{ $child->id }}][child_id]" value="{{ $child->id }}">
                                        <label class="form-check-label" for="present_{{ $child->id }}">
                                            Prezent
                                        </label>
                                    </div>
                                </div>

                                <div class="mb-3">
                                    <label for="absence_reason_{{ $child->id }}" class="form-label small">Motiv absență:</label>
                                    <input type="text" class="form-control form-control-sm" 
                                           id="absence_reason_{{ $child->id }}" 
                                           name="attendance[{{ $child->id }}][absence_reason]" 
                                           value="{{ $absenceReason }}"
                                           placeholder="Ex: bolnav, excursie...">
                                </div>

                                <div class="form-check mb-3">
                                    <input class="form-check-input" type="checkbox" 
                                           id="include_in_meal_{{ $child->id }}" 
                                           name="attendance[{{ $child->id }}][include_in_meal]" 
                                           value="1" {{ $includeInMeal ? 'checked' : '' }}
                                           {{ !$isPresent ? 'disabled' : '' }}>
                                    <label class="form-check-label small {{ !$isPresent ? 'text-muted' : '' }}" for="include_in_meal_{{ $child->id }}">
                                        Include în calculul mesei
                                        @if(!$isPresent)
                                            <small class="text-muted d-block">(Dezactivat automat pentru copii absenți)</small>
                                        @endif
                                    </label>
                                </div>

                                @if($child->allergies && count($child->allergies) > 0)
                                    <div class="alert alert-warning alert-sm mb-0">
                                        <i class="fas fa-exclamation-triangle me-1"></i>
                                        <small><strong>Alergii:</strong> {{ implode(', ', $child->allergies) }}</small>
                                    </div>
                                @endif
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>

            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="card-body text-center">
                            <button type="submit" class="btn btn-success btn-lg">
                                <i class="fas fa-save me-2"></i>Salvează Prezența
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    @else
        <div class="row">
            <div class="col-12">
                <div class="text-center py-5">
                    <i class="fas fa-users fa-3x text-muted mb-3"></i>
                    <h4 class="text-muted">Nu există copii înregistrați</h4>
                    <p class="text-muted">Nu aveți copii aprobați pentru a gestiona prezența.</p>
                </div>
            </div>
        </div>
    @endif

    <!-- Weekly Overview -->
    @if($children->count() > 0)
        <div class="row mt-5">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h5 class="mb-0">
                            <i class="fas fa-calendar-alt me-2"></i>Prezentă Săptămâna Curentă
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table table-hover">
                                <thead>
                                    <tr>
                                        <th>Copil</th>
                                        <th>Grupă</th>
                                        @foreach($weekdays as $day)
                                            <th class="text-center">
                                                <div class="d-flex flex-column">
                                                    <small class="text-muted">{{ $day['day_name_ro'] }}</small>
                                                    <strong>{{ $day['display'] }}</strong>
                                                </div>
                                            </th>
                                        @endforeach
                                        <th class="text-center">Total Prezențe</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($children as $child)
                                        <tr>
                                            <td>
                                                <div class="d-flex align-items-center">
                                                    <div class="avatar-sm bg-primary text-white rounded-circle d-flex align-items-center justify-content-center me-2">
                                                        {{ substr($child->first_name, 0, 1) }}{{ substr($child->last_name, 0, 1) }}
                                                    </div>
                                                    <div>
                                                        <strong>{{ $child->full_name }}</strong>
                                                        @if($child->allergies && count($child->allergies) > 0)
                                                            <br><small class="text-warning">
                                                                <i class="fas fa-exclamation-triangle me-1"></i>
                                                                Alergii: {{ implode(', ', $child->allergies) }}
                                                            </small>
                                                        @endif
                                                    </div>
                                                </div>
                                            </td>
                                            <td>
                                                <span class="badge bg-info">{{ $child->group->name ?? 'N/A' }}</span>
                                            </td>
                                            @php
                                                $totalPresent = 0;
                                            @endphp
                                            @foreach($weekdays as $day)
                                                @php
                                                    $dayAttendance = $weekAttendances->get($day['formatted'], collect())->where('child_id', $child->id)->first();
                                                    $isPresent = $dayAttendance ? $dayAttendance->is_present : null;
                                                    if ($isPresent === true) $totalPresent++;
                                                @endphp
                                                <td class="text-center">
                                                    @if($isPresent === true)
                                                        <span class="badge bg-success">
                                                            <i class="fas fa-check me-1"></i>Prezent
                                                        </span>
                                                    @elseif($isPresent === false)
                                                        <span class="badge bg-danger">
                                                            <i class="fas fa-times me-1"></i>Absent
                                                        </span>
                                                        @if($dayAttendance && $dayAttendance->absence_reason)
                                                            <br><small class="text-muted">{{ $dayAttendance->absence_reason }}</small>
                                                        @endif
                                                    @else
                                                        <span class="badge bg-secondary">
                                                            <i class="fas fa-minus me-1"></i>N/A
                                                        </span>
                                                    @endif
                                                </td>
                                            @endforeach
                                            <td class="text-center">
                                                <span class="badge bg-primary fs-6">{{ $totalPresent }}/5</span>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
</div>

<script>
// Auto-toggle absence reason field
document.addEventListener('DOMContentLoaded', function() {
    const checkboxes = document.querySelectorAll('input[type="checkbox"][id^="present_"]');
    
    checkboxes.forEach(checkbox => {
        const childId = checkbox.id.replace('present_', '');
        const absenceReasonField = document.getElementById('absence_reason_' + childId);
        const includeInMealField = document.getElementById('include_in_meal_' + childId);
        
        function toggleFields() {
            if (checkbox.checked) {
                // Child is present
                absenceReasonField.disabled = true;
                absenceReasonField.value = '';
                includeInMealField.disabled = false;
                includeInMealField.checked = true;
                includeInMealField.closest('.form-check').querySelector('label').classList.remove('text-muted');
            } else {
                // Child is absent
                absenceReasonField.disabled = false;
                includeInMealField.disabled = true;
                includeInMealField.checked = false;
                includeInMealField.closest('.form-check').querySelector('label').classList.add('text-muted');
            }
        }
        
        checkbox.addEventListener('change', toggleFields);
        toggleFields(); // Initial state
    });

    // Handle form submission to ensure correct values are sent
    const form = document.querySelector('form[action*="attendance"]');
    if (form) {
        form.addEventListener('submit', function(e) {
            // Process all attendance checkboxes
            checkboxes.forEach(checkbox => {
                const childId = checkbox.id.replace('present_', '');
                const includeInMealField = document.getElementById('include_in_meal_' + childId);
                
                // If checkbox is not checked, add a hidden input with value 0
                if (!checkbox.checked) {
                    // Remove any existing hidden input for this field
                    const existingHidden = form.querySelector(`input[type="hidden"][name="attendance[${childId}][is_present]"]`);
                    if (existingHidden) {
                        existingHidden.remove();
                    }
                    
                    // Add hidden input with value 0
                    const hiddenInput = document.createElement('input');
                    hiddenInput.type = 'hidden';
                    hiddenInput.name = `attendance[${childId}][is_present]`;
                    hiddenInput.value = '0';
                    form.appendChild(hiddenInput);
                }
                
                // Handle include_in_meal field
                if (!includeInMealField.checked) {
                    // Remove any existing hidden input for this field
                    const existingHidden = form.querySelector(`input[type="hidden"][name="attendance[${childId}][include_in_meal]"]`);
                    if (existingHidden) {
                        existingHidden.remove();
                    }
                    
                    // Add hidden input with value 0
                    const hiddenInput = document.createElement('input');
                    hiddenInput.type = 'hidden';
                    hiddenInput.name = `attendance[${childId}][include_in_meal]`;
                    hiddenInput.value = '0';
                    form.appendChild(hiddenInput);
                }
            });
        });
    }
});
</script>
@endsection