@extends('layouts.app')
@section('titulo', 'Editar Usuario '.$usuario->nombre)
@section('contenido')

<form action="{{ route('usuarios.update', $usuario->id) }}" method="POST" class="">
    @csrf
    @method('PUT')



    <div class="row g-4">
        <!-- Información Personal -->
        <div class="col-md-6">
            <h5 class="mb-3">Información Personal</h5>

            <div class="form-floating mb-3">
                <input type="text" class="form-control" id="nombre" name="nombre" value="{{ old('nombre', $usuario->nombre) }}" required>
                <label for="nombre">Nombre</label>
            </div>

            <div class="row g-3 mb-3">
                <div class="col-12 col-md-6">
                    <div class="form-floating">
                        <input type="text" class="form-control" id="primer_apellido" name="primer_apellido" value="{{ old('primer_apellido', $usuario->primer_apellido) }}" required placeholder="Primer Apellido">
                        <label for="primer_apellido">Primer Apellido</label>
                    </div>
                </div>
                <div class="col-12 col-md-6">
                    <div class="form-floating">
                        <input type="text" class="form-control" id="segundo_apellido" name="segundo_apellido" value="{{ old('segundo_apellido', $usuario->segundo_apellido) }}" required placeholder="Segundo Apellido">
                        <label for="segundo_apellido">Segundo Apellido</label>
                    </div>
                </div>
            </div>

            <div class="form-floating mb-3">
                <input type="email" class="form-control" id="email" name="email" value="{{ old('email', $usuario->email) }}" required placeholder="Correo Electrónico">
                <label for="email">Correo Electrónico</label>
            </div>

            <div class="mb-3">
                <label class="form-label">Empresa</label>
                <input type="text" class="form-control" value="{{ $usuario->empresa ? $usuario->empresa->nombre_comercial : '—' }}" readonly disabled>
                <p class="small text-muted mb-0">Asignada al crear la cuenta; no se modifica desde aquí.</p>
            </div>

            <div class="row g-3">
                <!-- Contraseña -->
                <div class="col-md-6">
                    <div class="form-floating">
                        <input type="password" class="form-control" id="password" name="password">
                        <label for="password">Nueva Contraseña</label>
                    </div>
                </div>

                <!-- Confirmar Contraseña -->
                <div class="col-md-6">
                    <div class="form-floating">
                        <input type="password" class="form-control" id="password_confirmation" name="password_confirmation">
                        <label for="password_confirmation">Confirmar Contraseña</label>
                    </div>
                </div>
            </div>
        </div>

        <!-- Contrato -->
        <div class="col-md-6">
            <h5 class="mb-3">Contrato</h5>

            <div class="row g-3 mb-3">
                <div class="col-12 col-md-6">
                    <div class="form-floating">
                        <input type="text" class="form-control" id="contrato_categoria" name="contrato_categoria" value="{{ old('contrato_categoria', $usuario->contrato_categoria) }}">
                        <label for="contrato_categoria">Categoría de Contrato</label>
                    </div>
                </div>
                <div class="col-12 col-md-6">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="contrato_horas" name="contrato_horas" value="{{ old('contrato_horas', $usuario->contrato_horas) }}">
                        <label for="contrato_horas">Horas Semanales en Contrato</label>
                    </div>
                </div>
            </div>

            <div class="row g-3 mb-3">
                <div class="col-12 col-md-4">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="extras_normales" name="extras_normales" value="{{ old('extras_normales', $usuario->extras_normales) }}">
                        <label for="extras_normales">Extras Normales</label>
                    </div>
                </div>
                <div class="col-12 col-md-4">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="extras_sabados" name="extras_sabados" value="{{ old('extras_sabados', $usuario->extras_sabados) }}">
                        <label for="extras_sabados">Extras Sábados</label>
                    </div>
                </div>
                <div class="col-12 col-md-4">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="extras_festivos" name="extras_festivos" value="{{ old('extras_festivos', $usuario->extras_festivos) }}">
                        <label for="extras_festivos">Extras festivos y domingos</label>
                    </div>
                </div>
            </div>

            @php
                $oldCobraExtras = old('cobra_extras_fin_mes');
                if ($oldCobraExtras === null) {
                    $cobraExtrasValor = $usuario->cobra_extras_fin_mes ? '1' : '0';
                } else {
                    $cobraExtrasValor = (string) $oldCobraExtras;
                }
            @endphp
            <div class="mb-3">
                <label class="form-label d-block">¿Cobra extras a final de mes? <span class="text-danger">*</span></label>
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="cobra_extras_fin_mes" id="cobra_extras_si" value="1" required @checked($cobraExtrasValor === '1')>
                    <label class="form-check-label" for="cobra_extras_si">Sí</label>
                </div>
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="cobra_extras_fin_mes" id="cobra_extras_no" value="0" required @checked($cobraExtrasValor === '0')>
                    <label class="form-check-label" for="cobra_extras_no">No</label>
                </div>
                @error('cobra_extras_fin_mes')
                    <div class="text-danger small mt-1">{{ $message }}</div>
                @enderror
            </div>

            @php
                $oldTipoDieta = old('dieta_pactada_tipo');
                if ($oldTipoDieta !== null) {
                    $tipoDietaValor = (string) $oldTipoDieta;
                } else {
                    $tipoDietaValor = ($usuario->dieta_fija_mensual_euros !== null && (float) $usuario->dieta_fija_mensual_euros > 0) ? 'fija' : 'ticket';
                }
            @endphp

            <div class="mb-3">
                <label class="form-label d-block">Tiene dietas pactadas: ¿Fijas o por Ticket? <span class="text-danger">*</span></label>
                <div class="form-check form-check-inline">
                    <input class="form-check-input js-dieta-tipo" type="radio" name="dieta_pactada_tipo" id="dieta_tipo_fija" value="fija" required @checked($tipoDietaValor === 'fija')>
                    <label class="form-check-label" for="dieta_tipo_fija">Fijas</label>
                </div>
                <div class="form-check form-check-inline">
                    <input class="form-check-input js-dieta-tipo" type="radio" name="dieta_pactada_tipo" id="dieta_tipo_ticket" value="ticket" required @checked($tipoDietaValor === 'ticket')>
                    <label class="form-check-label" for="dieta_tipo_ticket">Por Ticket</label>
                </div>
                @error('dieta_pactada_tipo')
                    <div class="text-danger small mt-1">{{ $message }}</div>
                @enderror
            </div>

            <div class="form-floating mb-3" id="dieta-fija-container" style="display:none;">
                <input type="number" class="form-control" id="dieta_fija_mensual_euros" name="dieta_fija_mensual_euros" value="{{ old('dieta_fija_mensual_euros', $usuario->dieta_fija_mensual_euros) }}" step="0.01" min="0.01" placeholder="0,00">
                <label for="dieta_fija_mensual_euros">Dietas fijas mensuales (€/mes)</label>
            </div>

            <div class="form-floating mb-3" id="dieta-ticket-container" style="display:none;">
                <input type="number" class="form-control" id="dieta_max_importe_dia" name="dieta_max_importe_dia" value="{{ old('dieta_max_importe_dia', $usuario->dieta_max_importe_dia) }}" step="0.01" min="0.01" placeholder="0,00">
                <label for="dieta_max_importe_dia">Máx. importe por ticket (€/ticket)</label>
            </div>
            <p class="small text-muted mb-0">Elige una de las dos opciones para habilitar el campo correspondiente.</p>
        </div>
    </div>

    <!-- Botón -->
    <div class="text-center">
        <button type="submit" class="btn btn-primary text-uppercase">Guardar</button>
    </div>

</form>

@push('scripts')
<script>
    document.addEventListener('DOMContentLoaded', function () {
        const fija = document.getElementById('dieta_tipo_fija');
        const ticket = document.getElementById('dieta_tipo_ticket');
        const fijaWrap = document.getElementById('dieta-fija-container');
        const ticketWrap = document.getElementById('dieta-ticket-container');
        const fijaInput = document.getElementById('dieta_fija_mensual_euros');
        const ticketInput = document.getElementById('dieta_max_importe_dia');

        function refresh() {
            const isFija = fija.checked;
            const isTicket = ticket.checked;

            fijaWrap.style.display = isFija ? '' : 'none';
            ticketWrap.style.display = isTicket ? '' : 'none';

            if (fijaInput) fijaInput.required = isFija;
            if (ticketInput) ticketInput.required = isTicket;

            if (!isFija && fijaInput) fijaInput.value = '';
            if (!isTicket && ticketInput) ticketInput.value = '';
        }

        fija.addEventListener('change', refresh);
        ticket.addEventListener('change', refresh);
        refresh();
    });
</script>
@endpush


@endsection



@section('contenido1')

<div class="card border-0 shadow-sm mb-4">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h5 class="card-title py-3 my-0 px-1">Horario Laboral</h5>
        <h6 class="card-subtitle text-muted"></h6>
    </div>
    <div class="card-body">

        <form action="{{ route('trabajo.horas.update', $usuario->id) }}" method="POST">
            @csrf
            @method('PUT')

            <div class="row g-3">
                <!-- Lunes -->
                <div class="col-md-4">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="lunes" name="lunes" value="{{ old('lunes', $usuario->horasLaborales?->lunes ?? 0) }}" required>
                        <label for="lunes">Lunes</label>
                    </div>
                </div>

                <!-- Martes -->
                <div class="col-md-4">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="martes" name="martes" value="{{ old('martes', $usuario->horasLaborales?->martes ?? 0) }}" required>
                        <label for="martes">Martes</label>
                    </div>
                </div>

                <!-- Miércoles -->
                <div class="col-md-4">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="miercoles" name="miercoles" value="{{ old('miercoles', $usuario->horasLaborales?->miercoles ?? 0) }}" required>
                        <label for="miercoles">Miércoles</label>
                    </div>
                </div>
            </div>

            <div class="row g-3 mt-1">
                <!-- Jueves -->
                <div class="col-md-6">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="jueves" name="jueves" value="{{ old('jueves', $usuario->horasLaborales?->jueves ?? 0) }}" required>
                        <label for="jueves">Jueves</label>
                    </div>
                </div>

                <!-- Viernes -->
                <div class="col-md-6">
                    <div class="form-floating">
                        <input type="number" class="form-control" id="viernes" name="viernes" value="{{ old('viernes', $usuario->horasLaborales?->viernes ?? 0) }}" required>
                        <label for="viernes">Viernes</label>
                    </div>
                </div>

                <div class="text-center">
                    <button type="submit" class="btn btn-primary text-uppercase">Guardar</button>
                </div>

            </div>

        </form>

    </div>
</div>

@php
    $etiquetasRoles = [
        'admin' => 'Administrador',
        'gestor' => 'Gestor',
        'oficina' => 'Oficina',
        'encargado' => 'Responsable de equipo',
        'trabajador' => 'Trabajador',
        'contra-incendios' => 'Contra incendios',
        'user' => 'Usuario',
    ];
    $rolesSeleccionados = collect(old('roles', $usuario->roles->pluck('id')->all()))
        ->map(fn ($v) => (int) $v)
        ->all();
@endphp

<div class="row g-4 mb-4 align-items-stretch">
    <div class="col-12 col-lg-6">
        <div class="card border-0 shadow-sm h-100 mb-0">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="card-title py-3 my-0 px-1">Roles y permisos</h5>
                <h6 class="card-subtitle text-muted"></h6>
            </div>
            <div class="card-body">
                <p class="small text-muted mb-3">Usa el interruptor de cada fila para asignar o quitar roles. Si ninguno está activo, el usuario quedará sin roles.</p>
                <form action="{{ route('usuarios.roles.update', $usuario) }}" method="POST">
                    @csrf
                    @method('PUT')
                    <div class="list-group rounded-3 shadow-sm overflow-hidden">
                        @foreach($roles as $role)
                            @php
                                $titulo = $etiquetasRoles[$role->name] ?? \Illuminate\Support\Str::title(str_replace('-', ' ', $role->name));
                                $activo = in_array((int) $role->id, $rolesSeleccionados, true);
                            @endphp
                            <label class="list-group-item list-group-item-action d-flex align-items-center gap-3 gap-md-4 py-3 mb-0">
                                <span class="form-check form-switch form-switch-lg mb-0 flex-shrink-0">
                                    <input class="form-check-input m-0" type="checkbox" role="switch" name="roles[]" id="role_{{ $role->id }}" value="{{ $role->id }}" {{ $activo ? 'checked' : '' }}>
                                </span>
                                <span class="flex-grow-1 min-w-0">
                                    <span class="fw-semibold d-block">{{ $titulo }}</span>
                                    <span class="small text-muted font-monospace">{{ $role->name }}</span>
                                </span>
                            </label>
                        @endforeach
                    </div>
                    @error('roles')
                        <div class="text-danger small mt-3">{{ $message }}</div>
                    @enderror
                    @error('roles.*')
                        <div class="text-danger small mt-3">{{ $message }}</div>
                    @enderror
                    <div class="text-center mt-3">
                        <button type="submit" class="btn btn-primary text-uppercase">Guardar</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="col-12 col-lg-6">
        @php
            $tiposFichajeSeleccionados = collect(old('tipos_fichaje', $usuario->tiposFichaje->pluck('tipo_fichaje')->all()))
                ->map(fn ($v) => normalizarTipoFichajeAId($v))
                ->filter()
                ->unique()
                ->values()
                ->all();
            $codigoFichajeActual = old('codigo', $usuario->tiposFichaje->firstWhere('tipo_fichaje', 1)->codigo ?? $usuario->tiposFichaje->firstWhere('tipo_fichaje', 'Código')->codigo ?? '');
        @endphp

        <div class="card border-0 shadow-sm h-100 mb-0">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="card-title py-3 my-0 px-1">Tipos de fichaje</h5>
                <h6 class="card-subtitle text-muted"></h6>
            </div>
            <div class="card-body">
                <p class="small text-muted mb-3">Activa o desactiva los métodos de fichaje del usuario. Para <strong>Código</strong> se puede fijar un código numérico (si lo dejas vacío se genera uno).</p>

                <form action="{{ route('usuarios.tipos_fichaje.update', $usuario) }}" method="POST">
                    @csrf
                    @method('PUT')

                    <div class="list-group rounded-3 shadow-sm overflow-hidden">
                        @foreach(getTiposFichaje() as $label => $value)
                            @php $activo = in_array((int) $value, $tiposFichajeSeleccionados, true); @endphp
                            <label class="list-group-item list-group-item-action d-flex align-items-center gap-3 gap-md-4 py-3 mb-0">
                                <span class="form-check form-switch form-switch-lg mb-0 flex-shrink-0">
                                    <input class="form-check-input m-0 js-tipo-fichaje-switch" type="checkbox" role="switch" name="tipos_fichaje[]" value="{{ $value }}" {{ $activo ? 'checked' : '' }} data-tipo="{{ $value }}">
                                </span>
                                <span class="flex-grow-1 min-w-0">
                                    <span class="fw-semibold d-block">{{ $label }}</span>
                                    <span class="small text-muted font-monospace">{{ $value }}</span>
                                </span>
                            </label>
                        @endforeach
                    </div>

                    <div class="row g-3 mt-3" id="codigo-fichaje-container" style="display: none;">
                        <div class="col-md-6">
                            <div class="form-floating">
                                <input type="text" class="form-control" id="codigo_fichaje" name="codigo" value="{{ $codigoFichajeActual }}" placeholder="Código">
                                <label for="codigo_fichaje">Código de fichaje</label>
                            </div>
                            @error('codigo')
                                <div class="text-danger small mt-2">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>

                    @error('tipos_fichaje')
                        <div class="text-danger small mt-3">{{ $message }}</div>
                    @enderror
                    @error('tipos_fichaje.*')
                        <div class="text-danger small mt-3">{{ $message }}</div>
                    @enderror

                    <div class="text-center mt-3">
                        <button type="submit" class="btn btn-primary text-uppercase">Guardar</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

@php $mostrarCardEquipoEncargado = $usuario->hasRole('encargado'); @endphp
<div class="row g-4 mb-4 align-items-stretch">
    @if($mostrarCardEquipoEncargado)
        <div class="col-12 col-lg-6">
            @include('admin.usuarios._equipo_grupo')
        </div>
    @endif
    <div class="col-12 @if($mostrarCardEquipoEncargado) col-lg-6 @endif">
        @include('admin.usuarios._equipo_como_trabajador')
    </div>
</div>

@push('scripts')
<script>
    document.addEventListener('DOMContentLoaded', function () {
        const containerCodigo = document.getElementById('codigo-fichaje-container');
        const inputCodigo = document.getElementById('codigo_fichaje');
        const switches = Array.from(document.querySelectorAll('.js-tipo-fichaje-switch'));

        function isCodigoActivo() {
            return switches.some(sw => sw.checked && sw.dataset.tipo === '1');
        }

        function refrescarCodigo() {
            if (!containerCodigo) return;
            if (isCodigoActivo()) {
                containerCodigo.style.display = '';
                if (inputCodigo && inputCodigo.value === '') {
                    inputCodigo.value = Math.floor(Math.random() * 900000) + 100000;
                }
            } else {
                containerCodigo.style.display = 'none';
                if (inputCodigo) inputCodigo.value = '';
            }
        }

        switches.forEach(sw => sw.addEventListener('change', refrescarCodigo));
        refrescarCodigo();
    });
</script>
@endpush

@endsection