@extends('adminlte.app')

@section('content')

<div class="content-wrapper pb-3">
    <!-- Content Header (Page header) -->
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">Anexar Documentos</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
            
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->

    @if ($message = Session::get('success'))
        <div class="alert alert-success">
            <p>{{ $message }}</p>
        </div>
    @endif
     @if ($message = Session::get('error'))
        <div class="alert alert-danger">
            <p>{{ $message }}</p>
        </div>
    @endif

    <div class="card mx-3 mt-3">
        <div class="card-header">
            <div class="row">
                <div class="col-md-6">
                    Anexar Documentos
                </div>
            </div>
        </div>

        <div class="card-body">
            <form method="POST" id="formFolhaDeCaixa" action="{{ route('folha_de_caixa_anexar_computador_store') }}" enctype="multipart/form-data">
                @csrf
                <input type="hidden" name="folha_de_caixa_id" value="{{ $folhaId }}">
             
                <div id="anexos-container">
                    <div class="form-group row">
                        @if(!empty($anexos))
                            @foreach($anexos as $index => $anexo)
                                <div class="col-md-6 mb-5">
                                     <a href="{{ route('anexo.download', ['file' => basename($anexo->anexo), 'view' => true, 'folha_id' => $folhaId]) }}" target="_blank"title="Exibir" class="btn btn-primary  btn-sm ml-1"><i class="fa fa-eye"></i></a>
                                    <label for="anexo-{{ $index }}">Anexo {{ $index + 1 }}</label>
                                    <select name="tipo_anexo_id[]" class="form-control mt-2">
                                        <option value="">Selecione o Tipo de Anexo</option>
                                        @foreach($tiposAnexos as $tipo)
                                            <option value="{{ $tipo->id }}">{{ $tipo->nome_anexo }}</option>
                                        @endforeach
                                    </select>
                                    <input type="hidden" name="anexos[]" value="{{ $anexo->anexo }}">

                                    @php
                                        $extensao = strtolower(pathinfo($anexo->anexo, PATHINFO_EXTENSION));
                                        $url = route('anexo.download', ['file' => basename($anexo->anexo), 'view' => true, 'folha_id' => $folhaId]);
                                    @endphp

                                    {{-- Se for imagem --}}
                                    @if(in_array($extensao, ['jpg','jpeg','png','gif','bmp','webp']))
                                        <br>
                                        <img src="{{ $url }}" alt="Anexo {{ $index + 1 }}" class="img-fluid rounded shadow mb-2" style="max-height:500px; object-fit:cover;">
                                    
                                    {{-- Se for PDF --}}
                                    @elseif($extensao === 'pdf' or $extensao === 'utf-8')
                                        <iframe src="{{ $url }}" width="100%" height="500" style="border:1px solid #ccc; border-radius:8px;"></iframe>
                                    
                                    {{-- Caso contrário, mostra só botão para abrir --}}
                                    @else
                                        <a href="{{ $url }}" target="_blank" class="btn btn-primary btn-sm">
                                            <i class="fa fa-eye"></i> Visualizar
                                        </a>
                                    @endif
                                    <br>
                                    <span>Selecione a Folha de Caixa que deseja anexar o arquivo:</span>
                                    <div class="table-responsive mt-2">
                                        <table class="table table-bordered">
                                            <thead>
                                                <tr>
                                                    <th>Selecionar</th>
                                                    <th>ID Folha de Caixa</th>
                                                    <th>Posto</th>
                                                    <th>Turno</th>
                                                    <th>Data de Criação</th>
                                                    <th>Observação</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                @foreach($folhasCaixa as $folha)
                                                    <tr>
                                                        <td>
                                                            <input type="checkbox" @if($folha->id == $folhaId) checked @endif name="folha_caixa_selecionada_{{ $index }}[]" value="{{ $folha->id }}">
                                                        </td>
                                                        <td>{{ $folha->id }}</td>
                                                        <td>{{ $folha->posto->nome_posto }}</td>
                                                        <td>{{ $folha->turno }}</td>
                                                        <td>{{ $folha->created_at->format('d/m/Y H:i') }}</td>
                                                        <td><input type="text" name="observacao_{{ $index }}[]" class="form-control form-control-sm" placeholder="Observação"></td>
                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </div>


                                </div>
                            @endforeach
                        @else
                            <div class="col-md-12"></div>
                                <p>Nenhum anexo disponível.</p>
                        
                        @endif

                    </div>
                    <div class="form-group row">
                        <div class="col-md-12 text-center">
                            <button type="submit" class="btn btn-primary">Salvar Anexos</button>
                        </div>
                    </div>
                </div>

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

</div>
<script>
        $('#formFolhaDeCaixa').on('submit', function(e) {
            let tiposSelecionados = $('select[name="tipo_anexo_id[]"]').map(function() {
                return $(this).val();
            }).get();

            let documentosObrigatorios = @json($documentosObrigatorios); // array de IDs

            let faltando = documentosObrigatorios.filter(id => !tiposSelecionados.includes(id.toString()));
            console.log(faltando);
            console.log(tiposSelecionados);
            console.log(documentosObrigatorios);
            if (faltando.length > 0) {
                e.preventDefault();
                alert('Você deve anexar todos os documentos obrigatórios!');
            }
        });
</script>
@endsection