@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">
                <div class="col-12">
                    <div class="card card-primary card-tabs">
                        <div class="card-header p-0 pt-1">
                            <ul class="nav nav-tabs" id="custom-tabs-one-tab" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link active" id="dados-pessoais-tab" data-toggle="pill" href="#dados-pessoais" role="tab" aria-controls="dados-pessoais" aria-selected="true">Dados pessoais</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="dados-complementares-tab" data-toggle="pill" href="#dados-complementares" role="tab" aria-controls="dados-complementares" aria-selected="false">Dados complementares</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="dados-configuracoes-tab" data-toggle="pill" href="#dados-configuracoes" role="tab" aria-controls="dados-configuracoes" aria-selected="false">Configurações</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="configuracoes_orcamento-tab" data-toggle="pill" href="#configuracoes_orcamento" role="tab" aria-controls="configuracoes_orcamento" aria-selected="false">Orçamento</a>
                            </li>
                            </ul>
                        </div>
                        <div class="card-body">

                            <form action="{{route('prestador.update', ['id'=>$cg->id_cg])}}" method="POST" class="form-horizontal" enctype="multipart/form-data">
                                @method('PUT')
                                @csrf
                                <div class="tab-content" id="custom-tabs-one-tabContent">
                                    <div class="tab-pane fade show active" id="dados-pessoais" role="tabpanel" aria-labelledby="dados-pessoais-tab">
                                        <div class="form-group row">
                                            <label class="col-sm-2 col-form-label">Nome</label>
                                            <div class="col-sm-10">
                                                <input tag 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 tag 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 tag 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 tag 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 tag 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 tag 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 tag type="email" name="cg_email" class="form-control @error('cg_email') is-invalid @enderror" value="{{ $cg->cg_email }}">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="tab-pane fade" id="dados-complementares" role="tabpanel" aria-labelledby="dados-complementares-tab">
                                        <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 tag 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 tag 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 tag 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 tag 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 tag type="text" name="cg_time_preferido" class="form-control @error('cg_time_preferido') is-invalid @enderror" value="{{ $cg->cg_time_preferido }}">
                                            </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>
                                    <div class="tab-pane fade" id="dados-configuracoes" role="tabpanel" aria-labelledby="dados-configuracoes-tab">
                                    <div class="form-group row">
                                        <label class="col-sm-2 col-form-label">
                                            Grupo de Processo
                                        </label>
                                        <div class="col-sm-10">
                                            <select
                                                class="form-control select2-cg"
                                                name="grupo_processo_id"
                                                id="grupo_processo_id"
                                                data-placeholder="Selecione um grupo de processo"
                                                style="width:100%;"
                                            >
                                                <option value=""></option>
                                                @foreach($grupos_select as $g)
                                                    <option value="{{ $g->id_grupo_processo }}"
                                                        {{ (string)old('grupo_processo_id', $grupoSelecionadoId) === (string)$g->id_grupo_processo ? 'selected' : '' }}>
                                                        {{ $g->grupo_nome }}
                                                        @if(isset($g->processos_count))
                                                            ({{ $g->processos_count }} processos)
                                                        @endif
                                                    </option>
                                                @endforeach
                                            </select>
                                            <small class="form-text text-muted">
                                                Ao salvar, todos os processos pertencentes ao grupo selecionado serão vinculados ao prestador.
                                            </small>
                                        </div>
                                                                        </div>

                                        {{-- Usuários (permanece igual) --}}
                                        <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>
                                    </div>

                                    <div class="tab-pane fade" id="configuracoes_orcamento" role="tabpanel" aria-labelledby="configuracoes_orcamento-tab">

                                            <div class="form-group row">
                                                <div class="col-sm-12">
                                                <h4 class="mb-3">Configuração do Orçamento</h4>
                                                </div>
                                            </div>
                                            <div class="form-group row">
                                                <label class="col-sm-2 col-form-label" for="imagem_capa">Imagem de capa</label>
                                                <div class="col-sm-10">
                                                <input
                                                    type="file"
                                                    name="imagem_capa"
                                                    id="imagem_capa"
                                                    class="form-control-file @error('imagem_capa') is-invalid @enderror"
                                                    accept="image/*">
                                                @error('imagem_capa')
                                                    <div class="invalid-feedback d-block">{{ $message }}</div>
                                                @enderror

                                                @if($cg->imagem_capa_url)
                                                    <small class="form-text text-muted mt-1">
                                                        Atual: <a href="{{ $cg->imagem_capa_url }}" target="_blank" rel="noopener">ver imagem</a>
                                                    </small>
                                                @endif

                                                </div>
                                            </div>


                                            <div class="form-group row">
                                                <label class="col-sm-2 col-form-label" for="imagem_apresentacao">Imagem de apresentação</label>
                                                <div class="col-sm-10">
                                                <input
                                                    type="file"
                                                    name="imagem_apresentacao"
                                                    id="imagem_apresentacao"
                                                    class="form-control-file @error('imagem_apresentacao') is-invalid @enderror"
                                                    accept="image/*">
                                                @error('imagem_apresentacao')
                                                    <div class="invalid-feedback d-block">{{ $message }}</div>
                                                @enderror


                                                @if($cg->imagem_apresentacao_url)
                                                    <small class="form-text text-muted mt-1">
                                                        Atual: <a href="{{ $cg->imagem_apresentacao_url }}" target="_blank" rel="noopener">ver imagem</a>
                                                    </small>
                                                @endif
                                                </div>
                                            </div>
                                            <div class="form-group row">
                                                <label class="col-sm-3 col-form-label" for="apresentacao_descricao">
                                                    Descrição da apresentação
                                                </label>
                                                <div class="col-sm-9">
                                                    <textarea
                                                        name="apresentacao_descricao"
                                                        id="apresentacao_descricao"
                                                        class="form-control @error('apresentacao_descricao') is-invalid @enderror"
                                                        rows="8"
                                                        placeholder="Coloque aqui uma descrição detalhada, instruções, observações, etc."
                                                    >{{ old('apresentacao_descricao', $cg->apresentacao_descricao ?? '') }}</textarea>
                                                    <small id="desc-counter" class="form-text text-muted">
                                                        1000 caracteres restantes
                                                    </small>
                                                    @error('apresentacao_descricao')
                                                        <div class="invalid-feedback">{{ $message }}</div>
                                                    @enderror
                                                </div>
                                            </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>
            </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>

</div>


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

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

    // ===== limite de caracteres apresentação =====
    const MAX_DESC = 750;
    const $ta = $('#apresentacao_descricao');
    const $counter = $('#desc-counter');

    function atualizaContador() {
        let val = $ta.val() || '';
        if (val.length > MAX_DESC) {
            // corta e bloqueia
            val = val.substring(0, MAX_DESC);
            $ta.val(val);
        }
        const restante = MAX_DESC - val.length;
        $counter
            .text(restante + ' caracteres restantes')
            .toggleClass('text-danger font-weight-bold', restante <= 10);
        // alerta 10 antes
        if (restante === 10) {
            alert('Faltam só 10 caracteres para o limite de 1000.');
        }
    }

    // já conta o que veio do banco
    atualizaContador();

    // bloqueia digitação quando chegar no limite
    $ta.on('input', function () {
        atualizaContador();
    });

    // prevenção extra para colar texto gigante
    $ta.on('paste', function () {
        setTimeout(atualizaContador, 10);
    });


  // ================= 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