@extends('adminlte::page')

@section('title', env('APP_NAME') . ' - Ver Colaborador')
@section('content_header')
    <h1>Información del Colaborador</h1>
@stop

@section('content')
    <div class="row mb-3">
        <div class="col-md-12">
            <a href="{{ route('empleados.index') }}" class="btn btn-secondary mr-2"> <i class="fa fa-list"></i> Volver</a>
            @can('admin.empleados.edit')
                <a href="{{ route('empleados.edit', $empleado) }}" class="btn btn-warning"> <i class="fa fa-edit"></i> Editar</a>
            @endcan
        </div>
    </div>

    {{-- Card principal: nombre y estado --}}
    <div class="card mb-3">
        <div class="card-header bg-primary text-white">
            <h3 class="card-title mb-0">{{ $empleado->nombre }} {{ $empleado->apellido }}</h3>
            <div class="card-tools">
                <span class="badge badge-{{ $empleado->estado ? 'success' : 'danger' }}">
                    {{ $empleado->estado ? 'Activo' : 'Inactivo' }}
                </span>
            </div>
        </div>
        <div class="card-body py-2">
            <p class="text-muted mb-0">{{ $empleado->cargo }}</p>
        </div>
    </div>

    <div class="row">
        {{-- Card: Datos personales --}}
        <div class="col-lg-4 col-md-6 mb-3">
            <div class="card">
                <div class="card-header bg-info text-white">
                    <h3 class="card-title mb-0">Datos personales</h3>
                </div>
                <div class="card-body">
                    <dl class="mb-0">
                        <dt>DNI / C.E</dt>
                        <dd>{{ $empleado->codigo }}</dd>
                        <dt>Nombre</dt>
                        <dd>{{ $empleado->nombre }}</dd>
                        <dt>Apellido</dt>
                        <dd>{{ $empleado->apellido }}</dd>
                        <dt>Celular</dt>
                        <dd>{{ $empleado->celular ?? '-' }}</dd>
                    </dl>
                </div>
            </div>
        </div>

        {{-- Card: Datos laborales --}}
        <div class="col-lg-4 col-md-6 mb-3">
            <div class="card">
                <div class="card-header bg-info text-white">
                    <h3 class="card-title mb-0">Datos laborales</h3>
                </div>
                <div class="card-body">
                    <dl class="mb-0">
                        <dt>Cargo</dt>
                        <dd>{{ $empleado->cargo }}</dd>
                        <dt>Tipo de empleado</dt>
                        <dd>{{ $empleado->tipo_empleado ?? '-' }}</dd>
                        <dt>Fecha de ingreso</dt>
                        <dd>{{ $empleado->fecha_ingreso_laboral ? $empleado->fecha_ingreso_laboral->format('d/m/Y') : '-' }}</dd>
                        <dt>Turnos</dt>
                        <dd>
                            @if($empleado->turnos->isNotEmpty())
                                @foreach($empleado->turnos as $t)
                                    <span class="badge badge-secondary mr-1">{{ $t->descripcion }}</span>
                                @endforeach
                            @else
                                -
                            @endif
                        </dd>
                    </dl>
                </div>
            </div>
        </div>

        {{-- Card: Remuneración --}}
        <div class="col-lg-4 col-md-6 mb-3">
            <div class="card">
                <div class="card-header bg-success text-white">
                    <h3 class="card-title mb-0">Remuneración</h3>
                </div>
                <div class="card-body text-center">
                    @if($empleado->sueldo_base !== null)
                        <p class="mb-0 h4 text-success font-weight-bold">S/ {{ number_format($empleado->sueldo_base, 2) }}</p>
                        <small class="text-muted">Sueldo base</small>
                    @else
                        <p class="mb-0 text-muted">No registrado</p>
                    @endif
                </div>
            </div>
        </div>
    </div>
@stop