@extends('adminlte::page')

@section('title','Editar GrupoProcesso')

@section('content_header')
  <h1>Editar GrupoProcesso</h1>
@endsection

@section('content')
  @if ($errors->any())
    <div class="alert alert-danger">
      <ul class="mb-0">
        <h5><i class="icon fas fa-ban"></i> Ocorreu um erro</h5>
        @foreach ($errors->all() as $error) <li>{{ $error }}</li> @endforeach
      </ul>
    </div>
  @endif

  @if (session('success'))
    <div class="alert alert-success"><i class="fas fa-check"></i> {{ session('success') }}</div>
  @endif

  <div class="card">
    <div class="card-body">
      <form action="{{ route('grupo-processo.update', $grupo->id_grupo_processo) }}" method="POST" id="form-grupo-processo">
        @csrf
        @method('PUT')

        {{-- Cabeçalho do grupo (opcional) --}}
        <div class="form-group row">
          <label class="col-sm-2 col-form-label">Nome do Grupo</label>
          <div class="col-sm-10">
            <input type="text" name="grupo_nome" class="form-control" value="{{ old('grupo_nome', $grupo->grupo_nome) }}">
          </div>
        </div>

        <div class="form-group row">
          <label class="col-sm-2 col-form-label">Status do Grupo</label>
          <div class="col-sm-10">
            <select name="grupo_status" class="form-control">
              <option value=""  {{ (string)old('grupo_status', $grupo->grupo_status)==='' ? 'selected' : '' }}>—</option>
              <option value="1" {{ (string)old('grupo_status', $grupo->grupo_status)==='1' ? 'selected' : '' }}>Ativo</option>
              <option value="2" {{ (string)old('grupo_status', $grupo->grupo_status)==='2' ? 'selected' : '' }}>Inativo</option>
            </select>
          </div>
        </div>

        <hr>

        {{-- =======================  SEÇÃO: PARTICULAR  ======================= --}}
        <div class="d-flex justify-content-between align-items-center mb-2">
          <h4 class="mb-0">Processos — Particular</h4>
        </div>

        @foreach ($funils_particular as $f)
          @php
            $fid = (string)$f->id_funil;
            $items = collect($grouped[$fid] ?? []); // cada item: ['idx'=>int,'row'=>array]
          @endphp

          <div class="card collapsed-card mb-3 border border-primary">
            <div class="card-header py-2 d-flex align-items-center">
              <h3 class="card-title mb-0"><strong>Particular — {{ $f->funil_nome }} - ({{ $items->count() }})</strong></h3>
              <div class="card-tools d-flex align-items-center">
                <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Expandir/Recolher">
                  <i class="fas fa-plus"></i>
                </button>
                <button type="button"
                        class="btn btn-sm btn-primary ml-2 btn-add-row"
                        data-funil-id="{{ $f->id_funil }}"
                        data-target="#tbody-particular-{{ $f->id_funil }}">
                  <i class="fas fa-plus"></i> Adicionar linha
                </button>
              </div>
            </div>

            <div class="card-body p-2">
              <div class="table-responsive">
                <table class="table table-bordered mb-0">
                  <thead class="thead-light">
                    <tr>
                      <th style="width:40%">Nome do Processo</th>
                      <th style="width:15%">Ordem</th>
                      <th style="width:15%">Status</th>
                      <th style="width:10%" class="text-center">Ações</th>
                    </tr>
                  </thead>
                  <tbody id="tbody-particular-{{ $f->id_funil }}">
                    @foreach ($items as $it)
                      @php $idx = $it['idx']; $proc = $it['row']; @endphp
                      <tr>
                        <input type="hidden" name="processos[{{ $idx }}][id_processo]" value="{{ $proc['id_processo'] ?? '' }}">
                        <input type="hidden" name="processos[{{ $idx }}][_delete]"    value="{{ $proc['_delete'] ?? 0 }}">
                        <input type="hidden" name="processos[{{ $idx }}][id_funil]"    value="{{ $f->id_funil }}">

                        <td><input type="text"   name="processos[{{ $idx }}][processo_nome]"  class="form-control" value="{{ $proc['processo_nome'] ?? '' }}"></td>
                        <td><input type="number" name="processos[{{ $idx }}][processo_ordem]" class="form-control" min="1" value="{{ $proc['processo_ordem'] ?? '' }}"></td>
                        <td>
                          <select name="processos[{{ $idx }}][processo_status]" class="form-control">
                            <option value=""  {{ ($proc['processo_status'] ?? '')==='' ? 'selected' : '' }}>—</option>
                            <option value="1" {{ (string)($proc['processo_status'] ?? '')==='1' ? 'selected' : '' }}>Ativo</option>
                            <option value="2" {{ (string)($proc['processo_status'] ?? '')==='2' ? 'selected' : '' }}>Inativo</option>
                          </select>
                        </td>
                        <td class="text-center">
                          <button type="button" class="btn btn-sm btn-danger btn-remove-row">Remover</button>
                        </td>
                      </tr>
                    @endforeach
                    {{-- Nenhuma linha vazia automática aqui --}}
                  </tbody>
                </table>
              </div>
            </div>
          </div>
        @endforeach

        {{-- =======================  SEÇÃO: CONVÊNIO  ======================= --}}
        <div class="d-flex justify-content-between align-items-center mt-4 mb-2">
          <h4 class="mb-0">Processos — Convênio</h4>
        </div>

        @foreach ($funils_convenio as $f)
          @php
            $fid = (string)$f->id_funil;
            $items = collect($grouped[$fid] ?? []);
          @endphp

          <div class="card collapsed-card mb-3 border border-success">
            <div class="card-header py-2 d-flex align-items-center">
              <h3 class="card-title mb-0"><strong>Convênio — {{ $f->funil_nome }} - ({{ $items->count() }})</strong></h3>
              <div class="card-tools d-flex align-items-center">
                <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Expandir/Recolher">
                  <i class="fas fa-plus"></i>
                </button>
                <button type="button"
                        class="btn btn-sm btn-primary ml-2 btn-add-row"
                        data-funil-id="{{ $f->id_funil }}"
                        data-target="#tbody-convenio-{{ $f->id_funil }}">
                  <i class="fas fa-plus"></i> Adicionar linha
                </button>
              </div>
            </div>

            <div class="card-body p-2">
              <div class="table-responsive">
                <table class="table table-bordered mb-0">
                  <thead class="thead-light">
                    <tr>
                      <th style="width:40%">Nome do Processo</th>
                      <th style="width:15%">Ordem</th>
                      <th style="width:15%">Status</th>
                      <th style="width:10%" class="text-center">Ações</th>
                    </tr>
                  </thead>
                  <tbody id="tbody-convenio-{{ $f->id_funil }}">
                    @foreach ($items as $it)
                      @php $idx = $it['idx']; $proc = $it['row']; @endphp
                      <tr>
                        <input type="hidden" name="processos[{{ $idx }}][id_processo]" value="{{ $proc['id_processo'] ?? '' }}">
                        <input type="hidden" name="processos[{{ $idx }}][_delete]"    value="{{ $proc['_delete'] ?? 0 }}">
                        <input type="hidden" name="processos[{{ $idx }}][id_funil]"    value="{{ $f->id_funil }}">

                        <td><input type="text"   name="processos[{{ $idx }}][processo_nome]"  class="form-control" value="{{ $proc['processo_nome'] ?? '' }}"></td>
                        <td><input type="number" name="processos[{{ $idx }}][processo_ordem]" class="form-control" min="1" value="{{ $proc['processo_ordem'] ?? '' }}"></td>
                        <td>
                          <select name="processos[{{ $idx }}][processo_status]" class="form-control">
                            <option value=""  {{ ($proc['processo_status'] ?? '')==='' ? 'selected' : '' }}>—</option>
                            <option value="1" {{ (string)($proc['processo_status'] ?? '')==='1' ? 'selected' : '' }}>Ativo</option>
                            <option value="2" {{ (string)($proc['processo_status'] ?? '')==='2' ? 'selected' : '' }}>Inativo</option>
                          </select>
                        </td>
                        <td class="text-center">
                          <button type="button" class="btn btn-sm btn-danger btn-remove-row">Remover</button>
                        </td>
                      </tr>
                    @endforeach
                    {{-- Nenhuma linha vazia automática aqui --}}
                  </tbody>
                </table>
              </div>
            </div>
          </div>
        @endforeach

        {{-- Índice global para o JS continuar numerando sem colisão --}}
        <input type="hidden" id="next-index" value="{{ $nextIndex }}">

        <div class="form-group row mt-4">
          <label class="col-sm-2 col-form-label"></label>
          <div class="col-sm-10">
            <button type="submit" class="btn btn-success">
              <i class="fas fa-check"></i> Salvar
            </button>
            <a href="{{ route('grupo-processo.index') }}" class="btn btn-secondary ml-2">
              <i class="fas fa-arrow-left"></i> Voltar
            </a>
          </div>
        </div>
      </form>
    </div>
  </div>
@endsection

@push('js')
<script>
(function(){
  function templateRow(idx, funilId) {
    return `
      <tr>
        <input type="hidden" name="processos[${idx}][id_processo]" value="">
        <input type="hidden" name="processos[${idx}][_delete]"    value="0">
        <input type="hidden" name="processos[${idx}][id_funil]"    value="${funilId}">
        <td><input type="text"   name="processos[${idx}][processo_nome]"  class="form-control"></td>
        <td><input type="number" name="processos[${idx}][processo_ordem]" class="form-control" min="1" value="1"></td>
        <td>
          <select name="processos[${idx}][processo_status]" class="form-control">
            <option value="" selected>—</option>
            <option value="1">Ativo</option>
            <option value="2">Inativo</option>
          </select>
        </td>
        <td class="text-center">
          <button type="button" class="btn btn-sm btn-danger btn-remove-row">Remover</button>
        </td>
      </tr>`;
  }

  let nextIndex = parseInt(document.getElementById('next-index').value || '0', 10);

  // Adicionar linha no grid do funil
  document.addEventListener('click', function(e){
    if (e.target.classList.contains('btn-add-row')) {
      const funilId = e.target.getAttribute('data-funil-id');
      const target  = e.target.getAttribute('data-target');
      const tbody   = document.querySelector(target);
      if (!tbody) return;

      tbody.insertAdjacentHTML('beforeend', templateRow(nextIndex, funilId));
      nextIndex++;
      document.getElementById('next-index').value = nextIndex;
    }

    // Remover (marca _delete=1 e esconde)
    if (e.target.classList.contains('btn-remove-row')) {
      const tr = e.target.closest('tr');
      const inputDelete = tr.querySelector('input[name*="[_delete]"]');
      if (inputDelete) inputDelete.value = '1';
      tr.style.display = 'none';
    }
  });
})();
</script>
@endpush