@extends('layouts.app')
@section('title','Registrar Asistencia')

@section('content')
<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6"><h1 class="m-0">Registrar Asistencia</h1><div class="highlight-bar"></div></div>
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                    <li class="breadcrumb-item"><a href="{{ route('rrhh.asistencias.index') }}">Asistencia</a></li>
                    <li class="breadcrumb-item active">Registrar</li>
                </ol>
            </div>
        </div>
    </div>
</div>

<section class="content">
<div class="container-fluid">
<form method="POST" action="{{ route('rrhh.asistencias.store') }}">
@csrf
<div class="card">
    <div class="card-header"><h3 class="card-title"><i class="fas fa-calendar-check mr-2"></i>Datos de Asistencia</h3></div>
    <div class="card-body">
        @if($errors->any())
        <div class="alert alert-danger">
            <ul class="mb-0">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
        </div>
        @endif

        <div class="row">
            <div class="col-md-4 form-group">
                <label>Empleado <span class="text-danger">*</span></label>
                <select name="empleado_id" class="form-control" required>
                    <option value="">-- Seleccionar --</option>
                    @foreach($empleados as $emp)
                    <option value="{{ $emp->id }}" {{ request('empleado_id') == $emp->id ? 'selected' : '' }}>
                        {{ $emp->nombre_completo }} — {{ $emp->area }}
                    </option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-3 form-group">
                <label>Fecha <span class="text-danger">*</span></label>
                <input type="date" name="fecha" class="form-control" value="{{ request('fecha', now()->toDateString()) }}" required>
            </div>
            <div class="col-md-2 form-group">
                <label>Fuente <span class="text-danger">*</span></label>
                <select name="fuente" class="form-control" required>
                    @foreach(\App\Models\Asistencia::$FUENTES as $k => $v)
                    <option value="{{ $k }}">{{ $v }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-md-3 form-group d-flex align-items-center pt-2">
                <div class="icheck-success">
                    <input type="checkbox" id="ausente" name="ausente" value="1">
                    <label for="ausente" class="font-weight-bold text-danger">Marcar como ausente</label>
                </div>
            </div>
        </div>

        <div class="row" id="horario-fields">
            <div class="col-md-3 form-group">
                <label>Hora de Entrada</label>
                <input type="time" name="hora_entrada" class="form-control" value="08:00">
                <small class="text-muted">Hora oficial: <strong>08:00</strong></small>
            </div>
            <div class="col-md-3 form-group">
                <label>Hora de Salida</label>
                <input type="time" name="hora_salida" class="form-control" value="18:00">
                <small class="text-muted">Hora oficial: <strong>18:00</strong></small>
            </div>
            <div class="col-md-6">
                <div class="callout callout-info py-2 mb-0">
                    <small>
                        <strong>Horario oficial:</strong> 08:00–13:00 / 14:00–18:00 &nbsp;(9h/día, almuerzo 13:00–14:00 no computable)<br>
                        Tardanza desde 08:01 &nbsp;·&nbsp; Salida anticipada antes de 18:00 &nbsp;·&nbsp;
                        Horas extra desde 18:01 (30% hasta 20:00 · 50% después)
                    </small>
                </div>
            </div>
        </div>

        <div class="form-group">
            <label>Observaciones</label>
            <textarea name="observaciones" class="form-control" rows="2" placeholder="Notas adicionales..."></textarea>
        </div>
    </div>
    <div class="card-footer">
        <button type="submit" class="btn btn-success mr-2"><i class="fas fa-save mr-1"></i>Guardar</button>
        <a href="{{ route('rrhh.asistencias.index') }}" class="btn btn-secondary">Cancelar</a>
    </div>
</div>
</form>
</div>
</section>
@endsection

@push('scripts')
<script>
document.getElementById('ausente').addEventListener('change', function() {
    document.getElementById('horario-fields').style.display = this.checked ? 'none' : '';
});
</script>
@endpush