@extends('layouts.app')
@section('titulo','Orden de trabajo')
@section('contenido')
@php $editando = (bool) $orden->id; @endphp
<h4><i class="fa fa-wrench"></i> {{ $editando?'Editar':'Nueva' }} orden ({{ ucfirst($orden->clase) }})</h4>
<form method="POST" action="{{ $editando ? route('ordenes.update',$orden) : route('ordenes.store') }}" class="card p-3">
  @csrf @if($editando) @method('PUT') @endif
  <input type="hidden" name="clase" value="{{ $orden->clase }}">
  <div class="row g-3">
    <div class="col-md-3"><label class="form-label small">Plan (opcional)</label>
      <select name="plan_id" class="form-select"><option value="">—</option>
        @foreach($planes as $p)
          <option value="{{ $p->id }}"
                  data-area="{{ $p->area_id }}"
                  data-sistema="{{ $p->sistema_id }}"
                  data-equipo="{{ $p->equipo_id }}"
                  data-responsable="{{ optional($p->items->first())->responsable_id }}"
                  @selected(old('plan_id',$orden->plan_id)==$p->id)>{{ $p->codigo }} - {{ $p->nombre }}</option>
        @endforeach
      </select></div>
    <div class="col-md-3"><label class="form-label small">Área</label>
      <select name="area_id" class="form-select"><option value="">—</option>
        @foreach($areas as $a)<option value="{{ $a->id }}" @selected(old('area_id',$orden->area_id)==$a->id)>{{ $a->nombre }}</option>@endforeach
      </select></div>
    <div class="col-md-3"><label class="form-label small">Equipo *</label>
      <select name="equipo_id" class="form-select" required><option value="">—</option>
        @foreach($equipos as $e)<option value="{{ $e->id }}" @selected(old('equipo_id',$orden->equipo_id)==$e->id)>{{ $e->codigo }} - {{ $e->nombre }}</option>@endforeach
      </select></div>
    <div class="col-md-3"><label class="form-label small">Responsable principal</label>
      <select name="responsable_id" class="form-select"><option value="">—</option>
        @foreach($usuarios as $u)<option value="{{ $u->id }}" @selected(old('responsable_id',$orden->responsable_id)==$u->id)>{{ $u->nombre_completo ?: $u->usuario }}</option>@endforeach
      </select></div>
    <div class="col-md-3"><label class="form-label small">Estado</label>
      <select name="estado_id" class="form-select"><option value="">—</option>
        @foreach($estados as $e)<option value="{{ $e->id }}" @selected(old('estado_id',$orden->estado_id)==$e->id)>{{ $e->nombre }}</option>@endforeach
      </select></div>
    <div class="col-md-3"><label class="form-label small">Prioridad</label>
      <select name="prioridad_id" class="form-select"><option value="">—</option>
        @foreach($prioridades as $p)<option value="{{ $p->id }}" @selected(old('prioridad_id',$orden->prioridad_id)==$p->id)>{{ $p->nombre }}</option>@endforeach
      </select></div>
    <div class="col-md-3"><label class="form-label small">Fecha programada</label>
      <input type="date" name="fecha_programada" value="{{ old('fecha_programada',optional($orden->fecha_programada)->format('Y-m-d')) }}" class="form-control"></div>
    <div class="col-md-3"><label class="form-label small">Vencimiento</label>
      <input type="datetime-local" name="fecha_vencimiento" value="{{ old('fecha_vencimiento',optional($orden->fecha_vencimiento)->format('Y-m-d\TH:i')) }}" class="form-control"></div>
    <div class="col-md-3"><label class="form-label small">Horómetro inicio
        <small class="text-muted">(auto a las 08:00)</small>
      </label>
      <div class="input-group input-group-sm">
        <input type="number" step="0.01" name="horometro_inicio" id="horometroInicio"
               value="{{ old('horometro_inicio',$orden->horometro_inicio) }}" class="form-control">
        <button type="button" class="btn btn-outline-info" onclick="calcularHorometroInicio(true)"
                title="Recalcular horómetro estimado para esta fecha y equipo">
          <i class="fa fa-calculator"></i>
        </button>
      </div>
      <small id="horometroHint" class="text-muted"></small>
    </div>
    <div class="col-md-3"><label class="form-label small">Horómetro fin
        <small class="text-muted">(lo llena el técnico al cerrar)</small>
      </label>
      <input type="number" step="0.01" name="horometro_fin" value="{{ old('horometro_fin',$orden->horometro_fin) }}" class="form-control"></div>
    <div class="col-12"><label class="form-label small">Descripción</label>
      <textarea name="descripcion" class="form-control" rows="2">{{ old('descripcion',$orden->descripcion) }}</textarea></div>
    <div class="col-12"><label class="form-label small">Observaciones</label>
      <textarea name="observaciones" class="form-control" rows="2">{{ old('observaciones',$orden->observaciones) }}</textarea></div>
    <div class="col-12"><label class="form-label small">Observaciones de cierre</label>
      <textarea name="observaciones_cierre" class="form-control" rows="2">{{ old('observaciones_cierre',$orden->observaciones_cierre) }}</textarea></div>
  </div>

  {{-- ===== Conclusiones y recomendaciones (siempre visible) ===== --}}
  <h6 class="mt-4 mb-2"><i class="fa fa-clipboard-check"></i> Conclusiones y recomendaciones</h6>
  <small class="text-muted d-block mb-2">Aparecen en el informe técnico. Recomendado llenarlos al cerrar la OT.</small>
  <div class="row g-3">
    <div class="col-md-6">
      <label class="form-label small">Conclusiones</label>
      <textarea name="conclusiones" class="form-control" rows="3"
                placeholder="Síntesis de la ejecución. Ej. Mantenimiento ejecutado al 100% en tiempo y costos planificados. Equipo operativo.">{{ old('conclusiones',$orden->conclusiones) }}</textarea>
    </div>
    <div class="col-md-6">
      <label class="form-label small">Recomendaciones</label>
      <textarea name="recomendaciones" class="form-control" rows="3"
                placeholder="Acciones sugeridas. Ej. Reemplazar rodamiento principal en la próxima PM 4320h. Inspeccionar fugas en cada turno.">{{ old('recomendaciones',$orden->recomendaciones) }}</textarea>
    </div>
  </div>

  {{-- ===== Análisis de falla y causa raíz (solo correctivas) ===== --}}
  <div id="bloqueFalla" style="display: {{ old('clase', $orden->clase) === 'correctivo' ? 'block' : 'none' }};">
    <h6 class="mt-4 mb-2"><i class="fa fa-triangle-exclamation"></i> Análisis de falla y causa raíz <small class="text-muted">— solo correctivas</small></h6>
    <div class="row g-3">
      <div class="col-md-6">
        <label class="form-label small">Síntoma observado</label>
        <textarea name="falla_sintoma" class="form-control" rows="2"
                  placeholder="¿Qué se manifestó? Ej. Ruido anormal en el rodamiento, vibración excesiva, fuga de aceite por el sello.">{{ old('falla_sintoma',$orden->falla_sintoma) }}</textarea>
      </div>
      <div class="col-md-6">
        <label class="form-label small">Causa probable</label>
        <textarea name="falla_causa_probable" class="form-control" rows="2"
                  placeholder="Hipótesis inicial. Ej. Desalineación del eje motriz, falta de lubricación, sobrecarga.">{{ old('falla_causa_probable',$orden->falla_causa_probable) }}</textarea>
      </div>
      <div class="col-md-12">
        <label class="form-label small">Causa raíz (RCA)</label>
        <textarea name="falla_causa_raiz" class="form-control" rows="2"
                  placeholder="Origen real determinado tras inspección/análisis. Ej. Programa de lubricación deficiente que llevó a desgaste prematuro del rodamiento N° 6206.">{{ old('falla_causa_raiz',$orden->falla_causa_raiz) }}</textarea>
      </div>
      <div class="col-md-6">
        <label class="form-label small">Acción correctiva ejecutada</label>
        <textarea name="falla_accion_correctiva" class="form-control" rows="2"
                  placeholder="Qué se hizo para resolver la falla. Ej. Cambio de rodamiento, ajuste de alineación, sustitución de retén.">{{ old('falla_accion_correctiva',$orden->falla_accion_correctiva) }}</textarea>
      </div>
      <div class="col-md-6">
        <label class="form-label small">Acción preventiva sugerida</label>
        <textarea name="falla_accion_preventiva" class="form-control" rows="2"
                  placeholder="Cómo evitar que vuelva a ocurrir. Ej. Incluir lubricación quincenal en plan PM 01. Capacitar al operador.">{{ old('falla_accion_preventiva',$orden->falla_accion_preventiva) }}</textarea>
      </div>
    </div>
  </div>

  <div class="mt-3 text-end">
    <a href="{{ route('ordenes.index') }}" class="btn btn-outline-secondary">Cancelar</a>
    <button class="btn btn-primario"><i class="fa fa-save"></i> Guardar</button>
  </div>
</form>

@push('scripts_inline')
(function () {
  const planSel = document.querySelector('select[name="plan_id"]');
  if (!planSel) return;
  const areaSel = document.querySelector('select[name="area_id"]');
  const equipoSel = document.querySelector('select[name="equipo_id"]');
  const respSel = document.querySelector('select[name="responsable_id"]');

  const setVal = (sel, val) => {
    if (!sel || val === '' || val == null) return;
    if (sel.tomselect) sel.tomselect.setValue(String(val), true);
    else sel.value = String(val);
  };

  const llenar = () => {
    const opt = planSel.options[planSel.selectedIndex];
    if (!opt || !opt.value) return;
    setVal(areaSel, opt.dataset.area);
    setVal(equipoSel, opt.dataset.equipo);
    if (respSel && !respSel.value && opt.dataset.responsable) {
      setVal(respSel, opt.dataset.responsable);
    }
  };

  planSel.addEventListener('change', llenar);
})();

// === Auto-rellenar horometro_inicio según equipo + fecha programada (hora 08:00) ===
function calcularHorometroInicio(forzar = false) {
  const equipoSel = document.querySelector('select[name="equipo_id"]');
  const fechaInput = document.querySelector('input[name="fecha_programada"]');
  const horoInput = document.getElementById('horometroInicio');
  const hint = document.getElementById('horometroHint');
  if (!equipoSel || !fechaInput || !horoInput) return;

  const equipoId = equipoSel.value;
  const fecha = fechaInput.value;
  if (!equipoId || !fecha) return;

  // Si el usuario ya escribió algo manualmente, no sobrescribir (a menos que sea recálculo forzado)
  if (!forzar && horoInput.value !== '' && horoInput.dataset.auto !== '1') return;

  const url = '{{ route('ordenes.horometro-estimado') }}?equipo_id=' + encodeURIComponent(equipoId) + '&fecha=' + encodeURIComponent(fecha);
  fetch(url, { headers: { 'Accept': 'application/json' } })
    .then(r => r.json())
    .then(data => {
      if (data.horometro !== null && data.horometro !== undefined) {
        horoInput.value = data.horometro;
        horoInput.dataset.auto = '1';
        hint.innerHTML = '<i class="fa fa-check text-success"></i> ' + data.fecha_calculada + ' · ' + data.horas_dia + ' h/d · ref. ' + data.fecha_referencia;
      } else if (data.mensaje) {
        hint.innerHTML = '<i class="fa fa-triangle-exclamation text-warning"></i> ' + data.mensaje;
      }
    })
    .catch(() => { hint.textContent = ''; });
}

// Marcar input como editado manualmente si el usuario lo cambia
document.getElementById('horometroInicio')?.addEventListener('input', e => {
  e.target.dataset.auto = '0';
});

// Disparar cálculo cuando cambia equipo o fecha
['equipo_id', 'fecha_programada'].forEach(name => {
  const el = document.querySelector('[name="' + name + '"]');
  if (el) el.addEventListener('change', () => calcularHorometroInicio(false));
});

// Cálculo inicial si ya hay equipo y fecha y el campo está vacío
window.addEventListener('DOMContentLoaded', () => {
  const horoInput = document.getElementById('horometroInicio');
  if (horoInput && horoInput.value === '') calcularHorometroInicio(false);
});
@endpush

@endsection