@extends('layouts.app')
@section('title', 'Registrar Temperatura Producto — BPM')
@section('page-title', 'Registrar Control de Temperatura de Producto')
@section('breadcrumb')
    <li class="breadcrumb-item"><a href="{{ route('bpm.dashboard') }}">BPM</a></li>
    <li class="breadcrumb-item"><a href="{{ route('bpm.temperatura-producto.index') }}">Temperatura Producto</a></li>
    <li class="breadcrumb-item active">Registrar</li>
@endsection
@section('content')

@if($errors->any())<div class="alert alert-danger">{{ $errors->first() }}</div>@endif

<form method="POST" action="{{ route('bpm.temperatura-producto.store') }}">
@csrf
<div class="row">
    <div class="col-md-8">
        <div class="card card-outline card-info">
            <div class="card-header">
                <h3 class="card-title"><i class="fas fa-thermometer-full mr-1"></i> Datos del Registro</h3>
            </div>
            <div class="card-body">

                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label>Fecha <span class="text-danger">*</span></label>
                            <input type="date" name="fecha" value="{{ old('fecha', now()->format('Y-m-d')) }}"
                                class="form-control @error('fecha') is-invalid @enderror" required>
                            @error('fecha')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label>Hora <span class="text-danger">*</span></label>
                            <input type="time" name="hora" value="{{ old('hora', now()->format('H:i')) }}"
                                class="form-control @error('hora') is-invalid @enderror" required>
                            @error('hora')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                    </div>
                    <div class="col-md-5">
                        <div class="form-group">
                            <label>Etapa del proceso <span class="text-danger">*</span></label>
                            <select name="etapa" id="etapa_sel" class="form-control @error('etapa') is-invalid @enderror" required onchange="updateLimite()">
                                <option value="">— Seleccionar —</option>
                                @foreach(\App\Models\BpmControlTemperaturaProd::$ETAPAS as $k => $v)
                                <option value="{{ $k }}" data-min="{{ \App\Models\BpmControlTemperaturaProd::$LIMITES[$k]['min'] ?? '' }}"
                                    data-max="{{ \App\Models\BpmControlTemperaturaProd::$LIMITES[$k]['max'] ?? '' }}"
                                    {{ old('etapa')===$k?'selected':'' }}>{{ $v }}</option>
                                @endforeach
                            </select>
                            @error('etapa')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                    </div>
                </div>

                {{-- Límite crítico dinámico --}}
                <div id="limite_info" class="alert alert-secondary py-2 mb-3" style="display:none;">
                    <i class="fas fa-exclamation-circle mr-1"></i>
                    Límite crítico para esta etapa: <strong id="limite_texto">—</strong>
                </div>

                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label>Temperatura registrada (°C) <span class="text-danger">*</span></label>
                            <div class="input-group">
                                <input type="number" name="temperatura_c" id="temp_input"
                                    value="{{ old('temperatura_c') }}" step="0.1" min="-50" max="200"
                                    class="form-control @error('temperatura_c') is-invalid @enderror"
                                    required onchange="checkTemp()" oninput="checkTemp()">
                                <div class="input-group-append"><span class="input-group-text">°C</span></div>
                            </div>
                            @error('temperatura_c')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            <div id="temp_status" class="mt-1"></div>
                        </div>
                    </div>
                    <div class="col-md-8">
                        <div class="form-group">
                            <label>Orden de Producción (opcional)</label>
                            <select name="orden_produccion_id" class="form-control">
                                <option value="">— Sin orden vinculada —</option>
                                @foreach($ordenes as $o)
                                <option value="{{ $o->id }}" {{ old('orden_produccion_id')==$o->id?'selected':'' }}>
                                    {{ $o->codigo }} — {{ $o->fruta->nombre }} — {{ $o->fecha->format('d/m/Y') }}
                                </option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>

                {{-- Acción correctiva (se muestra si fuera de rango) --}}
                <div id="accion_section">
                    <div class="form-group">
                        <label>Acción correctiva tomada
                            <span id="accion_required_badge" class="badge badge-danger ml-1" style="display:none;">Requerida</span>
                        </label>
                        <textarea name="accion_correctiva" rows="3" id="accion_input"
                            class="form-control @error('accion_correctiva') is-invalid @enderror"
                            placeholder="Describe la acción tomada si la temperatura está fuera del límite...">{{ old('accion_correctiva') }}</textarea>
                        @error('accion_correctiva')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                </div>

                <div class="form-group">
                    <label>Responsable <span class="text-danger">*</span></label>
                    <select name="responsable_id" class="form-control @error('responsable_id') is-invalid @enderror" required>
                        @foreach($usuarios as $u)
                        <option value="{{ $u->id }}" {{ old('responsable_id', auth()->id())==$u->id?'selected':'' }}>{{ $u->name }}</option>
                        @endforeach
                    </select>
                    @error('responsable_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>

            </div>
            <div class="card-footer d-flex">
                <button type="submit" class="btn btn-info mr-2"><i class="fas fa-save mr-1"></i> Registrar</button>
                <a href="{{ route('bpm.temperatura-producto.index') }}" class="btn btn-secondary">Cancelar</a>
            </div>
        </div>
    </div>

    <div class="col-md-4">
        <div class="card bg-light border-0">
            <div class="card-body">
                <h6><i class="fas fa-info-circle text-info mr-1"></i> Límites críticos por etapa</h6>
                <table class="table table-sm table-borderless mb-0">
                    @foreach(\App\Models\BpmControlTemperaturaProd::$LIMITES as $etapa => $lim)
                    <tr>
                        <td class="text-muted small">{{ \App\Models\BpmControlTemperaturaProd::$ETAPAS[$etapa] }}</td>
                        <td class="font-weight-bold small">{{ $lim['min'] }}–{{ $lim['max'] }}°C</td>
                    </tr>
                    @endforeach
                    <tr>
                        <td class="text-muted small">Recepción MP / Llenado</td>
                        <td class="small text-muted">Sin límite definido</td>
                    </tr>
                </table>
                <hr>
                <p class="small text-muted mb-0">
                    <i class="fas fa-exclamation-triangle text-warning mr-1"></i>
                    Si la temperatura está <strong>fuera del límite</strong>, se genera automáticamente una Acción Correctiva.
                </p>
            </div>
        </div>
    </div>
</div>
</form>

@push('scripts')
<script>
const limites = @json(\App\Models\BpmControlTemperaturaProd::$LIMITES);

function updateLimite() {
    const sel = document.getElementById('etapa_sel');
    const opt = sel.options[sel.selectedIndex];
    const etapa = sel.value;
    const lim = limites[etapa];
    const info = document.getElementById('limite_info');
    if (lim) {
        document.getElementById('limite_texto').textContent = lim.min + ' – ' + lim.max + ' °C';
        info.style.display = '';
        info.className = 'alert alert-warning py-2 mb-3';
    } else {
        info.style.display = 'none';
    }
    checkTemp();
}

function checkTemp() {
    const sel   = document.getElementById('etapa_sel');
    const etapa = sel.value;
    const temp  = parseFloat(document.getElementById('temp_input').value);
    const lim   = limites[etapa];
    const badge = document.getElementById('accion_required_badge');
    const status= document.getElementById('temp_status');

    if (!isNaN(temp) && lim) {
        if (temp < lim.min || temp > lim.max) {
            status.innerHTML = '<span class="badge badge-danger"><i class="fas fa-exclamation-triangle mr-1"></i> FUERA DEL LÍMITE CRÍTICO</span>';
            badge.style.display = '';
        } else {
            status.innerHTML = '<span class="badge badge-success"><i class="fas fa-check mr-1"></i> Dentro del límite</span>';
            badge.style.display = 'none';
        }
    } else {
        status.innerHTML = '';
        badge.style.display = 'none';
    }
}

// Init
updateLimite();
</script>
@endpush
@endsection