@extends('adminlte::page')

@section('title','Editar Prestador')
@section('content_header')
    <h1>Editar Prestador</h1>
@endsection
@section('css')
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/icheck-bootstrap/3.0.1/icheck-bootstrap.min.css">
    <style>
        .select2-selection--single {
            height: 38px !important;

        }

        .select2-container {
            width: 100% !important;
        }

    </style>
@stop
@section('content')

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


        <div class="card">
            <div class="card-body">
                <form action="{{route('prestador.update', ['id'=>$cg->id_cg])}}" method="POST" class="form-horizontal">
                    @method('PUT')
                    @csrf

                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Nome</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_nome" class="form-control @error('cg_nome') is-invalid @enderror" value="{{ $cg->cg_nome }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">
                            Especialidades <b class="text-danger">*</b>
                        </label>
                        <div class="col-sm-10">
                            <select
                            @if($user->admin == 1 || $user->admin == 2)
                                readonly
                            @endif
                            class="form-control select2-cg"
                            name="especialidades[]"
                            id="especialidades"
                            multiple
                            data-placeholder="Selecione uma ou mais especialidades"
                            style="width:100%;"
                            >
                            {{-- opção vazia para o placeholder/clear do Select2 --}}
                            <option value=""></option>

                            @php
                                $selecionadasOldOuModel = collect(old('especialidades', $selecionadas ?? []));
                            @endphp

                            @foreach ($especialidade_select as $especialidade)
                                <option
                                value="{{ $especialidade->id_especialidade }}"
                                {{ $selecionadasOldOuModel->contains($especialidade->id_especialidade) ? 'selected' : '' }}
                                >
                                {{ $especialidade->nome }}
                                </option>
                            @endforeach
                            </select>

                            @error('especialidades')
                            <span class="text-danger small">{{ $message }}</span>
                            @enderror
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Apelido</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_apelido" class="form-control @error('cg_apelido') is-invalid @enderror" value="{{ $cg->cg_apelido }}">
                        </div>
                    </div>

                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">CPF</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_cpf" class="form-control @error('cg_cpf') is-invalid @enderror" value="{{ $cg->cg_cpf }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Estado Civil</label>
                        <div class="col-sm-10">
                            <select required class="col-sm-10 form-control" name="cg_estado_civil">
                                <option value="" {{ $cg->cg_estado_civil == '' ? 'selected' : '' }}>Nenhum</option>
                                <option value="1" {{ $cg->cg_estado_civil == 1 ? 'selected' : '' }}>Solteiro</option>
                                <option value="2" {{ $cg->cg_estado_civil == 2 ? 'selected' : '' }}>União estável</option>
                                <option value="3" {{ $cg->cg_estado_civil == 3 ? 'selected' : '' }}>Casado</option>
                                <option value="4" {{ $cg->cg_estado_civil == 4 ? 'selected' : '' }}>Divorciado</option>
                            </select>
                        </div>
                    </div>
                    <div   class="form-group row">
                        <label class="col-sm-2 col-form-label">RQE</label>
                        <div class="col-sm-10">
                            <input type="text" name="cg_rqe" class="form-control @error('cg_rqe') is-invalid @enderror" value=" {{ $cg->cg_rqe }}">
                        </div>
                    </div>
                    <div   class="form-group row">
                        <label class="col-sm-2 col-form-label">CRM</label>
                        <div class="col-sm-10">
                            <input  type="text" name="cg_crm" class="form-control @error('cg_crm') is-invalid @enderror" value=" {{ $cg->cg_crm }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">CNPJ</label>
                        <div class="col-sm-10">
                            <input type="text" name="cg_cnpj" class="form-control @error('cg_cnpj') is-invalid @enderror" value="{{ $cg->cg_cnpj }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Telefone1</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_telefone1" class="form-control @error('cg_telefone1') is-invalid @enderror" value="{{ $cg->cg_telefone1 }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Telefone2</label>
                        <div class="col-sm-10">
                            <input type="text" name="cg_telefone2" class="form-control @error('cg_telefone2') is-invalid @enderror" value="{{ $cg->cg_telefone2 }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Telefone3</label>
                        <div class="col-sm-10">
                            <input type="text" name="cg_telefone3" class="form-control @error('cg_telefone3') is-invalid @enderror" value="{{ $cg->cg_telefone3 }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Endereço</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_endereco" class="form-control @error('cg_endereco') is-invalid @enderror" value="{{ $cg->cg_endereco }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Data Nascimento</label>
                        <div class="col-sm-10">
                            <input type="date" name="cg_dt_nasc" class="form-control @error('cg_dt_nasc') is-invalid @enderror" value="{{ $cg->cg_dt_nasc }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Email</label>
                        <div class="col-sm-10">
                            <input required type="email" name="cg_email" class="form-control @error('cg_email') is-invalid @enderror" value="{{ $cg->cg_email }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Nome do conjugue</label>
                        <div class="col-sm-10">
                            <input type="text" name="cg_nome_conjuge" class="form-control @error('cg_nome_conjuge') is-invalid @enderror" value="{{ $cg->cg_nome_conjuge }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Data Nascimento Conjuge</label>
                        <div class="col-sm-10">
                            <input type="date" name="cg_dt_nasc_conjuge" class="form-control @error('cg_dt_nasc_conjuge') is-invalid @enderror" value="{{ $cg->cg_dt_nasc_conjuge }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">
                            Familiares
                            <span id="BADGE-FAM" class="badge badge-info" style="cursor:default;margin-left:6px;">+0</span>
                            @if($user->admin == 1 || $user->admin == 2)
                                <button type="button" id="btn-manage-fam" class="btn btn-xs btn-primary" style="margin-left:6px;">
                                <i class="fas fa-user-friends"></i> Gerenciar
                                </button>
                            @endif
                        </label>
                        <div class="col-sm-10">
                            <div class="form-control" style="height:auto;min-height:38px;">
                            <small class="text-muted">Use o botão <b>Gerenciar</b> para adicionar/remover familiares deste prestador.</small>
                            </div>
                        </div>
                    </div>

                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Doce Preferida</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_alimento_preferido" class="form-control @error('cg_alimento_preferido') is-invalid @enderror" value="{{ $cg->cg_alimento_preferido }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Tamanho da roupa</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_tamanho_roupa" class="form-control @error('cg_tamanho_roupa') is-invalid @enderror" value="{{ $cg->cg_tamanho_roupa }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Tamanho do Calçado</label>
                        <div class="col-sm-10">
                            <input required type="number" name="cg_tamanho_calcado" class="form-control @error('cg_tamanho_calcado') is-invalid @enderror" value="{{ $cg->cg_tamanho_calcado }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Cor Preferida</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_cor_preferida" class="form-control @error('cg_cor_preferida') is-invalid @enderror" value="{{ $cg->cg_cor_preferida }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Time Preferido</label>
                        <div class="col-sm-10">
                            <input required type="text" name="cg_time_preferido" class="form-control @error('cg_time_preferido') is-invalid @enderror" value="{{ $cg->cg_time_preferido }}">
                        </div>
                    </div>
                    {{-- <div required class="form-group row">
                        <label class="col-sm-2 col-form-label">Acesso Médico</label>
                        <div class="col-sm-10">
                            <select class="col-sm-10 form-control select2-prestador" name="id_usuario_prestador"
                                @error('id_usuario_prestador') is-invalid @enderror id="id_usuario_prestador">
                                <option value="">Nenhum selecionado</option>
                                @foreach ($usuarios_prestador as $prestador)
                                    <option value="{{ $prestador->id }}"  @if ($prestador->id == $cg->id_usuario_prestador) selected="selected" @endif>{{ $prestador->id }} - {{ $prestador->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div> --}}
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Link do Google</label>
                        <div class="col-sm-10">
                            <input type="text" name="cg_link_pesquisa_google" class="form-control @error('cg_link_pesquisa_google') is-invalid @enderror" value="{{ $cg->cg_link_pesquisa_google }}">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">Observação</label>
                        <div class="col-sm-10">
                            <textarea  name="cg_observacao" id="cg_observacao" style="width: 100%;">{{ $cg->cg_observacao}}</textarea>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">
                            Processos
                            <span id="BADGE-PROC" class="badge badge-info" style="cursor:default;margin-left:6px;">+0</span>
                            @if($user->admin == 1 || $user->admin == 2)
                            <button type="button" id="btn-manage-proc" class="btn btn-xs btn-primary" style="margin-left:6px;">
                                <i class="fas fa-tasks"></i> Gerenciar
                            </button>
                            @endif
                        </label>
                        <div class="col-sm-10">
                            <div class="form-control" style="height:auto;min-height:38px;">
                            <small class="text-muted">Use o botão <b>Gerenciar</b> para vincular/desvincular processos deste prestador.</small>
                            </div>
                        </div>
                    </div>

                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label">
                            Usuários
                            <span id="BADGE-USERS" class="badge badge-info" style="cursor:default; margin-left:6px;">+0</span>
                            @if($user->admin == 1 || $user->admin == 2)
                                <button type="button" id="btn-manage-users" class="btn btn-xs btn-primary" title="Gerenciar usuários" style="margin-left:6px;">
                                <i class="fas fa-user-cog"></i> Gerenciar
                                </button>
                            @endif

                        </label>
                        <div class="col-sm-10">
                            <div class="form-control" style="height:auto;min-height:38px;">
                                <small class="text-muted">Use o botão <b>Gerenciar</b> para adicionar/remover usuários deste prestador.</small>
                            </div>
                        </div>
                    </div>
                    @if($user->admin == 1 || $user->admin == 2)
                        <div class="form-group row">
                            <label  class="col-sm-2 col-form-label"></label>
                            <div class="col-sm-10">
                                <input type="submit" class="btn btn-success" value="Salvar">
                            </div>
                        </div>
                    @endif

                </form>



            </div>
        </div>
        {{-- Modal CRUD de usuários do prestador --}}
        <div class="modal fade" id="modalUsuariosPrestador" tabindex="-1" role="dialog" aria-labelledby="modalUsuariosPrestadorLabel" aria-hidden="true">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title"><b>Usuários com acesso ao Prestador</b></h5>
                    <button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
                </div>
                <div class="modal-body">
                    <div class="form-inline mb-3">
                        <select class="form-control mr-2" id="user_to_add" style="min-width: 320px;">
                            <option value="">Selecione um usuário</option>
                            @foreach ($usuarios_prestador as $u)
                                <option value="{{ $u->id }}">{{ $u->id }} - {{ $u->name }}</option>
                            @endforeach
                        </select>

                        {{-- opcional: marcar como principal pela pivot (se quiser usar) --}}
                        <div class="form-check mr-2">
                            <input class="form-check-input" type="checkbox" id="chkPrincipal">
                            <label class="form-check-label" for="chkPrincipal">Principal</label>
                        </div>

                        <button type="button" class="btn btn-success" id="btnAddUser">
                            <i class="fas fa-plus"></i> Adicionar
                        </button>
                    </div>

                    <table class="table table-sm table-striped" id="tblUsersPrestador">
                        <thead>
                            <tr>
                                <th style="width:50%">Nome</th>
                                <th style="width:30%">E-mail</th>
                                <th style="width:20%; text-align:right">Ações</th>
                            </tr>
                        </thead>
                        <tbody>
                            {{-- preenchido via JS --}}
                        </tbody>
                    </table>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                </div>
                </div>
            </div>
        </div>

        {{-- Modal XL: criar + listar --}}
        <div class="modal fade" id="modalFamiliaresPrestador" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog modal-xl" role="document">
                <div class="modal-content">
                <div class="modal-header bg-primary text-white">
                    <div>
                    <h5 class="modal-title mb-0"><b>Familiares do Prestador</b></h5>
                    <small class="opacity-75">Cadastre e vincule rapidamente</small>
                    </div>
                    <button type="button" class="close text-white" data-dismiss="modal"><span>&times;</span></button>
                </div>

                <div class="modal-body">
                    <div id="fam-alert" style="display:none;"></div>

                    <div class="card mb-3 shadow-sm">
                    <div class="card-body">
                        <div class="d-flex align-items-center mb-3">
                        <i class="fas fa-user-plus mr-2"></i>
                        <h6 class="mb-0"><b>Novo familiar</b></h6>
                        </div>

                        <div class="row">
                        <div class="col-md-6">
                            <div class="form-group mb-2">
                            <label>Nome <span class="text-danger">*</span></label>
                            <input type="text" id="fam_nome" class="form-control" placeholder="Ex.: João da Silva">
                            </div>
                        </div>
                        <div class="col-md-3">
                            <div class="form-group mb-2">
                            <label>Tipo <span class="text-danger">*</span></label>
                            <select id="fam_tipo" class="form-control">
                                <option value="">Selecione...</option>
                                <option value="filha">Filha</option>
                                <option value="filho">Filho</option>
                                <option value="marido">Marido</option>
                                <option value="esposa">Esposa</option>
                                <option value="enteado">Enteado</option>
                                <option value="enteada">Enteada</option>
                                <option value="outros">Outros</option>
                            </select>
                            </div>
                        </div>
                        <div class="col-md-3 d-flex align-items-center">
                            <div class="form-group mb-2 w-100">
                            <label>Data de Nascimento</label>
                            <input type="date" id="fam_data_nascimento" class="form-control">
                            </div>
                        </div>
                        <div class="col-md-12">
                            <div class="form-group mb-2">
                            <label>Observação</label>
                            <textarea id="fam_observacao" class="form-control" rows="2" placeholder="Alergias, observações..."></textarea>
                            </div>
                        </div>
                        </div>

                        <div class="text-right">
                        <button type="button" id="btnAddFam" class="btn btn-success">
                            <i class="fas fa-plus-circle"></i> Adicionar e vincular
                        </button>
                        </div>
                    </div>
                    </div>

                    <div class="card shadow-sm">
                    <div class="card-body">
                        <div class="d-flex align-items-center mb-2">
                        <i class="fas fa-users mr-2"></i>
                        <h6 class="mb-0"><b>Familiares vinculados</b></h6>
                        <span class="badge badge-info ml-2" id="BADGE-FAM-MODAL">+0</span>
                        </div>

                        <div class="table-responsive">
                        <table class="table table-hover table-sm" id="tblFamiliaresPrestador">
                            <thead class="thead-light">
                            <tr>
                                <th style="width:35%">Nome</th>
                                <th style="width:20%">Tipo</th>
                                <th style="width:20%">Data de Nascimento</th>
                                <th>Observação</th>
                                <th style="width:10%; text-align:right">Ações</th>
                            </tr>
                            </thead>
                            <tbody>
                            {{-- via JS --}}
                            </tbody>
                        </table>
                        </div>
                    </div>
                    </div>

                </div>

                <div class="modal-footer">
                    <button class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                </div>
            </div>
        </div>

        {{-- Modal: Processos do Prestador --}}
        <div class="modal fade" id="modalProcessosPrestador" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content modal-slim-shadow">

                <div class="modal-header py-2">
                    <h5 class="modal-title">
                    <i class="fas fa-tasks mr-2 text-primary"></i>
                    <b>Processos vinculados ao Prestador</b>
                    </h5>
                    <button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
                </div>

                <div class="modal-body pt-3 pb-0">

                    {{-- Alert feedback --}}
                    <div id="proc-alert" class="mb-3" style="display:none;"></div>

                    {{-- Linha de ação --}}
                    <div class="form-row align-items-center mb-3">
                    <div class="col-12 col-md-9 mb-2 mb-md-0">
                        <select class="form-control select2-cg" id="proc_to_add" data-placeholder="Selecione um processo">
                        <option value=""></option>
                        {{-- opções via JS --}}
                        </select>
                    </div>
                    <div class="col-12 col-md-3 text-md-right">
                        <button type="button" id="btnAddProc" class="btn btn-success btn-block">
                        <i class="fas fa-plus-circle"></i> Adicionar
                        </button>
                    </div>
                    </div>

                    {{-- Tabela --}}
                    <div class="table-responsive">
                    <table class="table table-hover table-sm mb-3" id="tblProcessosPrestador">
                        <thead class="thead-light">
                        <tr>
                            <th>Nome</th>
                            <th class="text-right" style="width: 90px;">Ações</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr class="empty-row d-none">
                            <td colspan="2" class="text-muted">
                            <i class="far fa-folder-open mr-1"></i> Nenhum processo vinculado
                            </td>
                        </tr>
                        </tbody>
                    </table>
                    </div>

                </div>

                <div class="modal-footer d-flex justify-content-between">
                    <span class="badge badge-info" id="BADGE-PROC-MODAL">+0</span>
                    <button class="btn btn-secondary" data-dismiss="modal">Fechar</button>
                </div>

                </div>
            </div>
        </div>





</div>


@endsection
@section('js')
<script>
$(function () {
  $('.select2-cg').select2();

  const cgId = {{ $cg->id_cg }};

  // ================= FAMILIARES =================

  function apiListarFamiliares() {
    return $.get("{{ route('prestador.familiares.index', ':cg') }}".replace(':cg', cgId));
  }
  function apiCriarEVincularFamiliar(payload) {
    return $.post("{{ route('prestador.familiares.storeNew', ':cg') }}".replace(':cg', cgId), {
      _token: '{{ csrf_token() }}',
      ...payload
    });
  }
  function apiExcluirFamiliar(id_familiar) {
    return $.ajax({
      url: "{{ route('prestador.familiares.destroy', [':cg', ':f']) }}"
              .replace(':cg', cgId).replace(':f', id_familiar),
      type: 'DELETE',
      data: { _token: '{{ csrf_token() }}' }
    });
  }

  function showFamAlert(type, msg) {
    const $a = $('#fam-alert');
    const html = `
      <div class="alert alert-${type} alert-dismissible fade show" role="alert">
        ${msg}
        <button type="button" class="close" data-dismiss="alert"><span>&times;</span></button>
      </div>`;
    $a.hide().html(html).fadeIn(150);
  }
  function clearFamForm() {
    $('#fam_nome').val('');
    $('#fam_tipo').val('');
    $('#fam_data_nascimento').val('');
    $('#fam_observacao').val('');
  }
  function renderTabelaFamiliares(items) {
    const $tb = $('#tblFamiliaresPrestador tbody');
    $tb.empty();
    if (!items.length) {
      $tb.append('<tr><td colspan="5"><i>Nenhum familiar vinculado</i></td></tr>');
      return;
    }
    items.forEach(row => {
      const tr = `
        <tr data-id="${row.id_familiar}">
          <td>${row.nome}</td>
          <td>${row.tipo ? row.tipo.charAt(0).toUpperCase()+row.tipo.slice(1) : ''}</td>
          <td>${row.data_nascimento ?? ''}</td>
          <td>${row.observacao ?? ''}</td>
          <td style="text-align:right">
            <button class="btn btn-xs btn-danger btnDelFam"><i class="fas fa-trash-alt"></i></button>
          </td>
        </tr>`;
      $tb.append(tr);
    });
  }
  function atualizarBadgesFamiliares(count) {
    $('#BADGE-FAM').hide().html('+' + count).fadeIn(150);
    $('#BADGE-FAM-MODAL').hide().html('+' + count).fadeIn(150);
  }

  async function listarFamiliares() {
    try {
      const res = await apiListarFamiliares();
      renderTabelaFamiliares(res.items);
      atualizarBadgesFamiliares(res.count);
    } catch(e) {
      console.error(e);
      showFamAlert('danger', 'Erro ao carregar familiares.');
    }
  }
  async function criarEVincular() {
    const payload = {
      nome: $('#fam_nome').val().trim(),
      tipo: $('#fam_tipo').val(),
      data_nascimento: $('#fam_data_nascimento').val() || null,
      observacao: $('#fam_observacao').val().trim() || null,
    };
    if (!payload.nome) { showFamAlert('warning','Informe o <b>nome</b>.'); $('#fam_nome').focus(); return; }
    if (!payload.tipo) { showFamAlert('warning','Selecione o <b>tipo</b>.'); $('#fam_tipo').focus(); return; }

    try {
      await apiCriarEVincularFamiliar(payload);
      clearFamForm();
      await listarFamiliares();
      showFamAlert('success','Familiar criado e vinculado com sucesso.');
    } catch(e) {
      console.error(e);
      showFamAlert('danger','Não foi possível salvar o familiar.');
    }
  }
  async function excluirFamiliar(id_familiar) {
    try {
      await apiExcluirFamiliar(id_familiar);
      await listarFamiliares();
      showFamAlert('success','Familiar desvinculado.');
    } catch(e) {
      console.error(e);
      showFamAlert('danger','Erro ao excluir vínculo.');
    }
  }

  $(document).on('click', '#btn-manage-fam', async function() {
    await listarFamiliares();
    $('#modalFamiliaresPrestador').modal('show');
  });
  $(document).on('click', '#btnAddFam', async function() { await criarEVincular(); });
  $(document).on('click', '.btnDelFam', async function(e) {
    e.preventDefault();
    const id = $(this).closest('tr').data('id');
    if (confirm('Remover este familiar do prestador?')) await excluirFamiliar(id);
  });

  // ================= USUÁRIOS (mantive seu padrão) =================

  function apiListarUsers() {
    return $.get("{{ route('prestador.usuarios.index', ':cg') }}".replace(':cg', cgId));
  }
  function apiInserirUser(user_id, principal) {
    return $.post("{{ route('prestador.usuarios.store', ':cg') }}".replace(':cg', cgId), {
      _token: '{{ csrf_token() }}',
      user_id, principal
    });
  }
  function apiExcluirUser(user_id) {
    return $.ajax({
      url: "{{ route('prestador.usuarios.destroy', [':cg', ':user']) }}"
            .replace(':cg', cgId).replace(':user', user_id),
      type: 'DELETE',
      data: { _token: '{{ csrf_token() }}' }
    });
  }

  function renderTabelaUsers(items) {
    const $tb = $('#tblUsersPrestador tbody');
    $tb.empty();
    if (!items.length) {
      $tb.append('<tr><td colspan="3"><i>Nenhum usuário vinculado</i></td></tr>');
      return;
    }
    items.forEach(row => {
      const tr = `
        <tr data-id="${row.id}">
          <td>${row.name}</td>
          <td>${row.email ?? ''}</td>
          <td style="text-align:right">
            <button class="btn btn-xs btn-danger btnDelUser"><i class="fas fa-trash-alt"></i></button>
          </td>
        </tr>`;
      $tb.append(tr);
    });
  }
  function atualizarBadgeUsers(count) {
    const $badge = $('#BADGE-USERS');
    $badge.hide().html('+'+ count).fadeIn(150);
  }

  async function listarUsuarios() {
    try {
      const res = await apiListarUsers();
      renderTabelaUsers(res.items);
      atualizarBadgeUsers(res.count);
    } catch(e){ console.error(e); }
  }
  async function inserirUsuario() {
    const user_id = $('#user_to_add').val();
    const principal = $('#chkPrincipal').is(':checked') ? 1 : 0;
    if (!user_id) return;
    try {
      await apiInserirUser(user_id, principal);
      $('#user_to_add').val('');
      $('#chkPrincipal').prop('checked', false);
      await listarUsuarios();
    } catch(e){ console.error(e); alert('Erro ao adicionar usuário'); }
  }
  async function excluirUsuario(user_id) {
    try {
      await apiExcluirUser(user_id);
      await listarUsuarios();
    } catch(e){ console.error(e); alert('Erro ao excluir usuário'); }
  }

  $(document).on('click', '#btn-manage-users', async function() {
    await listarUsuarios();
    $('#modalUsuariosPrestador').modal('show');
  });
  $(document).on('click', '#btnAddUser', async function() { await inserirUsuario(); });
  $(document).on('click', '.btnDelUser', async function(e) {
    e.preventDefault();
    const id = $(this).closest('tr').data('id');
    if (confirm('Remover este usuário do prestador?')) await excluirUsuario(id);
  });


  const CSRF = '{{ csrf_token() }}';

  // --- Select2 dentro do modal (evita overlay atrás do backdrop)
  $('#proc_to_add').select2({ dropdownParent: $('#modalProcessosPrestador') });

  // --- Helpers de API
  function apiListarProcessos() {
    return $.get("{{ route('prestador.processos.index', ':cg') }}".replace(':cg', cgId));
  }
  function apiCriarVinculo(processo_id) {
    return $.post("{{ route('prestador.processos.store', ':cg') }}".replace(':cg', cgId), {
      _token: CSRF,
      processo_id
    });
  }
  function apiExcluirVinculo(processo_id) {
    return $.ajax({
      url: "{{ route('prestador.processos.destroy', [':cg', ':proc']) }}"
            .replace(':cg', cgId).replace(':proc', processo_id),
      type: 'DELETE',
      data: { _token: CSRF }
    });
  }
  function apiTodosProcessos() { // para popular o select com processo:all
    return $.get("{{ route('processo.all') }}");
  }

  // --- Alert helper
  function procAlert(type, msg) {
    const $a = $('#proc-alert');
    const html = `
      <div class="alert alert-${type} alert-dismissible fade show" role="alert">
        ${msg}
        <button type="button" class="close" data-dismiss="alert"><span>&times;</span></button>
      </div>`;
    $a.hide().html(html).fadeIn(120);
  }

  // --- Render tabela
  function renderTabelaProcessos(items) {
    const $tb = $('#tblProcessosPrestador tbody');
    $tb.empty();

    if (!items || !items.length) {
      $tb.append('<tr><td colspan="2"><i>Nenhum processo vinculado</i></td></tr>');
      return;
    }

    items.forEach(row => {
      $tb.append(`
        <tr data-id="${row.id_processo}">
          <td>${row.processo_nome}</td>
          <td style="text-align:right">
            <button class="btn btn-xs btn-danger btnDelProc">
              <i class="fas fa-trash-alt"></i>
            </button>
          </td>
        </tr>
      `);
    });
  }

  function atualizarBadgesProc(count) {
    $('#BADGE-PROC').hide().html('+' + count).fadeIn(120);
  }

  // --- Carregar lista vinculada
  async function listarProcessos() {
    try {
      const res = await apiListarProcessos();
      renderTabelaProcessos(res.items || []);
      atualizarBadgesProc(res.count ?? (res.items ? res.items.length : 0));
    } catch (e) {
      console.error(e);
      procAlert('danger', 'Erro ao carregar processos vinculados.');
    }
  }

  // --- Popular select com TODOS os processos
  async function preencherSelectProcessosTodos() {
    try {
      const res = await apiTodosProcessos();
      const $sel = $('#proc_to_add');
      $sel.empty().append('<option value=""></option>');
      (res.items || []).forEach(p => {
        $sel.append(`<option value="${p.id_processo}">${p.processo_nome}</option>`);
      });
      $sel.trigger('change');
    } catch (e) {
      console.error(e);
      procAlert('danger', 'Não foi possível carregar a lista de processos.');
    }
  }

  // --- Criar (vincular)
  let vincularProcLoading = false;
  async function vincularProcesso() {
    if (vincularProcLoading) return;

    const processo_id = $('#proc_to_add').val();
    if (!processo_id) { procAlert('warning', 'Selecione um processo.'); return; }

    // Evita duplicidade visual
    if ($('#tblProcessosPrestador tbody tr[data-id="'+processo_id+'"]').length) {
      procAlert('info', 'Este processo já está vinculado.');
      return;
    }

    try {
      vincularProcLoading = true;
      $('#btnAddProc').prop('disabled', true);
      await apiCriarVinculo(processo_id);
      $('#proc_to_add').val('').trigger('change');
      await listarProcessos();
      procAlert('success', 'Processo vinculado com sucesso.');
    } catch (e) {
      console.error(e);
      procAlert('danger', 'Não foi possível vincular o processo.');
    } finally {
      vincularProcLoading = false;
      $('#btnAddProc').prop('disabled', false);
    }
  }

  // --- Remover (desvincular)
  async function desvincularProcesso(id) {
    try {
      await apiExcluirVinculo(id);
      await listarProcessos();
      procAlert('success', 'Processo removido.');
    } catch (e) {
      console.error(e);
      procAlert('danger', 'Erro ao remover processo.');
    }
  }

  // --- Abrir modal
  $(document).on('click', '#btn-manage-proc', async function() {
    const $m = $('#modalProcessosPrestador');

    // Garante que o modal não herda z-index de containers
    if (!$m.parent().is('body')) $m.appendTo('body');

    // Abre o modal
    $m.modal('show');

    // Carrega tabela e select (todos os processos)
    await Promise.all([
      listarProcessos(),
      preencherSelectProcessosTodos()
    ]);
  });

  // --- Ações
  $(document).on('click', '#btnAddProc', vincularProcesso);
  $(document).on('click', '.btnDelProc', async function(e){
    e.preventDefault();
    const id = $(this).closest('tr').data('id');
    if (confirm('Remover este processo do prestador?')) await desvincularProcesso(id);
  });

});
</script>
@endsection