@extends('frontend.layouts.app')

@section('content')
<div class="container">
    <h2>Upload multiple de fichiers</h2>

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

    <form method="POST" action="{{ route('printsystems.multiUpload') }}" enctype="multipart/form-data">
        @csrf
        <div id="file-upload-section" class="form-group">
            <label>Fichiers</label>
            <input type="file" name="files[]" class="form-control mb-2" multiple required>
        </div>
        <button type="submit" class="btn btn-success mt-2">Uploader</button>
        <button type="button" class="btn btn-secondary mt-2 ms-2" onclick="addFileInput()">+ Nouveau fichier</button>
    </form>

    <script>
        function addFileInput() {
            const section = document.getElementById('file-upload-section');
            const input = document.createElement('input');
            input.type = 'file';
            input.name = 'files[]';
            input.classList.add('form-control', 'mb-2');
            section.appendChild(input);
        }
    </script>

    @if(isset($uploadedFiles) && count($uploadedFiles) > 0)
        <h4 class="mt-5">Fichiers Uploadés</h4>
        <div class="row">
            @foreach($uploadedFiles as $file)
                <div class="col-md-6 mb-4">
                    <div class="card">
                        @if(in_array(pathinfo($file['path'], PATHINFO_EXTENSION), ['jpg','jpeg','png','gif','webp']))
                            <img src="{{ $file['url'] }}" class="card-img-top" alt="preview">
                        @else
                            <div class="p-3">
                                <i class="fa fa-file fa-2x"></i>
                                <p>{{ $file['name'] }}</p>
                                <a href="{{ $file['url'] }}" target="_blank" class="btn btn-sm btn-primary">Voir le fichier</a>
                            </div>
                        @endif

                        <div class="card-body">
                            <p><strong>Taille :</strong> {{ $file['size_kb'] }} KB</p>
                            <p><strong>Pages :</strong> {{ $file['pages'] }}</p>
                            <p><strong>Orientation :</strong> {{ implode(', ', $file['orientation']) }}</p>

                            <form action="#" method="POST">
                                @csrf
                                <div class="form-group mt-2">
                                    <label>Type d'impression :</label>
                                    <select name="print_type" class="form-control">
                                        <option value="couleur">Couleur</option>
                                        <option value="noir_blanc">Noir & Blanc</option>
                                    </select>
                                </div>
                                <div class="form-group mt-2">
                                    <label>Quantité :</label>
                                    <input type="number" name="quantity" class="form-control" value="1" min="1">
                                </div>
                            </form>

                            <form action="{{ route('printsystems.deleteFile', ['file' => $file['path']]) }}" method="POST" class="mt-3">
                                @csrf
                                @method('DELETE')
                                <button class="btn btn-danger btn-sm">Supprimer</button>
                            </form>
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    @endif
</div>
@endsection