@extends('layouts.base')

@section('content')
    @section('breadcrumb')
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0">
                <li class="breadcrumb-item"><a href="{{ route('front.index') }}">Tableau de bord</a></li>
                <li class="breadcrumb-item"><a href="{{ route('partner.applications') }}">Applications</a></li>
                <li class="breadcrumb-item"><a href="{{ route('partner.document-editors.index', $application) }}">Éditeurs de documents</a></li>
                <li class="breadcrumb-item active" aria-current="page">{{ isset($documentTemplate) ? 'Modifier' : 'Créer' }}</li>
            </ol>
        </nav>
    @endsection

    <div class="container-fluid py-4">
        @if ($errors->any())
            <div class="alert alert-danger alert-dismissible fade show" role="alert">
                <h5 class="alert-heading"><i class="fas fa-exclamation-triangle me-2"></i>Erreurs de validation</h5>
                <ul class="mb-0">
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        @endif

        <!-- Header -->
        <div class="row mb-4">
            <div class="col-12">
                <div class="card shadow-sm border-0">
                    <div class="card-body py-3">
                        <div class="d-flex justify-content-between align-items-center flex-wrap">
                            <div class="d-flex align-items-center gap-3">
                                @if($documentTemplate)
                                    <div class="avatar-lg bg-primary text-white rounded-circle d-flex align-items-center justify-content-center" style="width: 60px; height: 60px;">
                                        <i class="fas fa-file-alt"></i>
                                    </div>
                                    <div>
                                        <h3 class="mb-0">{{ $documentTemplate->name ?: 'Éditeur de documents' }}</h3>
                                        <p class="text-muted mb-0">Modification du document</p>
                                    </div>
                                @else
                                    <div class="avatar-lg bg-success text-white rounded-circle d-flex align-items-center justify-content-center" style="width: 60px; height: 60px;">
                                        <i class="fas fa-plus"></i>
                                    </div>
                                    <div>
                                        <h3 class="mb-0">Nouveau document</h3>
                                        <p class="text-muted mb-0">Création d'un nouveau document</p>
                                    </div>
                                @endif
                            </div>
                            <div class="d-flex gap-2">
                                @if($documentTemplate)
                                    <a href="{{ route('partner.document-editors.show', ['application' => $application, 'documentEditor' => $documentTemplate]) }}" class="btn btn-outline-primary">
                                        <i class="fas fa-eye me-2"></i>Voir l'éditeur
                                    </a>
                                @endif
                                <a href="{{ route('partner.document-editors.index', $application) }}" class="btn btn-outline-secondary">
                                    <i class="fas fa-arrow-left me-2"></i>Retour
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Form -->
        <div class="row">
            <div class="col-12">
                <div class="card shadow-sm">
                    <div class="card-header bg-primary">
                        <h5 class="mb-0 text-dark">
                            <i class="fas fa-{{ $documentTemplate ? 'edit' : 'plus' }} me-2"></i>
                            {{ $documentTemplate ? 'Modifier le document' : 'Créer un document' }}
                        </h5>
                    </div>
                    <div class="card-body">
                        <form method="POST" action="{{ isset($documentTemplate) ? route('partner.document-editors.update', ['application' => $application, 'documentEditor' => $documentTemplate]) : route('partner.document-editors.store', $application) }}">
                            @csrf
                            @if(isset($documentTemplate))
                                @method('PUT')
                            @endif

                            <div class="row g-3 mb-3">
                                <div class="col-md-12">
                                    <label class="form-label fw-bold">
                                        <i class="fas fa-tag me-1 text-primary"></i>Nom
                                    </label>
                                    <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" 
                                           value="{{ old('name', $documentTemplate?->name) }}" placeholder="Nom du document">
                                    @error('name')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                    <small class="text-muted">Nom du document (optionnel)</small>
                                </div>
                            </div>

                            @php
                                $initialCategory = old('category_type', $documentTemplate?->category_type?->value ?? \App\Enums\DocumentTemplateRelations::APPLICATION->value);
                                $isProgramAttached = $initialCategory === \App\Enums\DocumentTemplateRelations::PROGRAM->value;
                                $isProductAttached = $initialCategory === \App\Enums\DocumentTemplateRelations::PRODUCT->value;
                            @endphp
                            <input type="hidden" name="category_type" id="category_type_hidden" value="{{ $initialCategory }}">
                            <div class="row g-3 mb-3">
                                <div class="col-md-6">
                                    <label class="form-label fw-bold d-block">
                                        <i class="fas fa-folder me-1 text-primary"></i>Rattacher le document à …
                                    </label>
                                    <div class="form-check">
                                        <input class="form-check-input" type="checkbox" value="1" id="attach_program" {{ $isProgramAttached ? 'checked' : '' }}>
                                        <label class="form-check-label" for="attach_program">
                                            <strong>Un programme</strong>
                                        </label>
                                    </div>
                                    <div class="form-check">
                                        <input class="form-check-input" type="checkbox" value="1" id="attach_product" {{ $isProductAttached ? 'checked' : '' }}>
                                        <label class="form-check-label" for="attach_product">
                                            <strong>Un produit (lot)</strong>
                                        </label>
                                    </div>
                                    @error('category_type')
                                        <div class="invalid-feedback d-block">{{ $message }}</div>
                                    @enderror
                                    <small class="text-muted d-block">Si aucune option n'est sélectionnée, le document sera rattaché à toute l'application.</small>
                                </div>
                                <div class="col-md-6">
                                    <label class="form-label fw-bold">
                                        <i class="fas fa-file me-1 text-primary"></i>Type de document
                                    </label>
                                    <select name="document_type_category" id="document_type_category" class="form-select mb-2 @error('document_type_category') is-invalid @enderror">
                                        <option value="">-- Sélectionnez une catégorie --</option>
                                        @foreach($documentTypesByCategory as $category => $types)
                                            @php
                                                $selectedCategory = '';
                                                if ($documentTemplate && $documentTemplate->document_type) {
                                                    $docType = \App\Enums\DocumentTemplateType::tryFrom($documentTemplate->document_type);
                                                    if ($docType) {
                                                        $selectedCategory = $docType->category();
                                                    }
                                                }
                                            @endphp
                                            <option value="{{ $category }}" 
                                                {{ old('document_type_category', $selectedCategory) == $category ? 'selected' : '' }}>
                                                {{ $category }}
                                            </option>
                                        @endforeach
                                    </select>
                                    <select name="document_type" id="document_type" class="form-select @error('document_type') is-invalid @enderror" style="display: none;">
                                        <option value="">-- Sélectionnez d'abord une catégorie --</option>
                                    </select>
                                    @error('document_type')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                    @error('document_type_category')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                    <small class="text-muted">Sélectionnez d'abord une catégorie, puis un type de document</small>
                                </div>
                            </div>

                            <!-- Select Programme (affiché si programme ou produit est sélectionné) -->
                            <div class="row g-3 mb-3" id="program_select_container" style="{{ ($isProgramAttached || $isProductAttached) ? 'display: block;' : 'display: none;' }}">
                                <div class="col-md-12">
                                    <label class="form-label fw-bold">
                                        <i class="fas fa-building me-1 text-primary"></i>Programme <span class="text-danger">*</span>
                                    </label>
                                    <select name="program_id" id="program_id" class="form-select @error('program_id') is-invalid @enderror">
                                        <option value="">-- Sélectionnez un programme --</option>
                                        @foreach($programs as $program)
                                            <option value="{{ $program->id }}" 
                                                {{ old('program_id', $documentTemplate && $documentTemplate->document_templateable_type === \App\Models\Program::class ? $documentTemplate->document_templateable_id : ($documentTemplate && $documentTemplate->document_templateable_type === \App\Models\Product::class ? \App\Models\Product::find($documentTemplate->document_templateable_id)?->program_id : '')) == $program->id ? 'selected' : '' }}>
                                                {{ $program->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                    @error('program_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                    <small class="text-muted">Sélectionnez un programme</small>
                                </div>
                            </div>

                            <!-- Select Produit (affiché si produit est sélectionné) -->
                            <div class="row g-3 mb-3" id="product_select_container" style="{{ $isProductAttached ? 'display: block;' : 'display: none;' }}">
                                <div class="col-md-12">
                                    <label class="form-label fw-bold">
                                        <i class="fas fa-home me-1 text-primary"></i>Produit (Lot) <span class="text-danger">*</span>
                                    </label>
                                    <select name="product_id" id="product_id" class="form-select @error('product_id') is-invalid @enderror">
                                        <option value="">-- Sélectionnez d'abord un programme --</option>
                                        @if(isset($products) && $products->count() > 0)
                                            @foreach($products as $product)
                                                <option value="{{ $product->id }}" 
                                                    {{ old('product_id', $documentTemplate && $documentTemplate->document_templateable_type === \App\Models\Product::class ? $documentTemplate->document_templateable_id : '') == $product->id ? 'selected' : '' }}>
                                                    Lot {{ $product->number }}
                                                </option>
                                            @endforeach
                                        @endif
                                    </select>
                                    @error('product_id')
                                        <div class="invalid-feedback">{{ $message }}</div>
                                    @enderror
                                    <small class="text-muted">Sélectionnez un produit (lot)</small>
                                </div>
                            </div>

                            <div class="d-flex justify-content-between align-items-center mt-4">
                                <a href="{{ route('partner.document-editors.index', $application) }}" class="btn btn-outline-secondary">
                                    <i class="fas fa-times me-2"></i>Annuler
                                </a>
                                <button type="submit" class="btn btn-primary">
                                    <i class="fas fa-save me-2"></i>{{ $documentTemplate ? 'Mettre à jour' : 'Créer' }}
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
    document.addEventListener('DOMContentLoaded', function() {
        const attachProgramCheckbox = document.getElementById('attach_program');
        const attachProductCheckbox = document.getElementById('attach_product');
        const categoryTypeHidden = document.getElementById('category_type_hidden');
        const programSelectContainer = document.getElementById('program_select_container');
        const programSelect = document.getElementById('program_id');
        const productSelectContainer = document.getElementById('product_select_container');
        const productSelect = document.getElementById('product_id');

        function loadProducts(programId) {
            if (!programId) {
                productSelect.innerHTML = '<option value="">-- Sélectionnez d\'abord un programme --</option>';
                return;
            }

            productSelect.innerHTML = '<option value="">Chargement...</option>';
            productSelect.disabled = true;

            fetch('{{ route("partner.document-editors.products", ["application" => $application, "program" => ":programId"]) }}'.replace(':programId', programId))
                .then(response => response.json())
                .then(products => {
                    productSelect.innerHTML = '<option value="">-- Sélectionnez un produit --</option>';
                    products.forEach(product => {
                        const option = document.createElement('option');
                        option.value = product.id;
                        option.textContent = 'Lot ' + product.number;
                        productSelect.appendChild(option);
                    });
                    productSelect.disabled = false;
                    
                    @if($documentTemplate && $documentTemplate->document_templateable_type === \App\Models\Product::class)
                        const selectedProductId = {{ $documentTemplate->document_templateable_id }};
                        if (selectedProductId) {
                            productSelect.value = selectedProductId;
                        }
                    @endif
                })
                .catch(error => {
                    console.error('Erreur lors du chargement des produits:', error);
                    productSelect.innerHTML = '<option value="">Erreur lors du chargement</option>';
                    productSelect.disabled = false;
                });
        }

        function updateAttachmentFields() {
            let categoryValue = '{{ \App\Enums\DocumentTemplateRelations::APPLICATION->value }}';

            if (attachProductCheckbox.checked) {
                categoryValue = '{{ \App\Enums\DocumentTemplateRelations::PRODUCT->value }}';
                attachProgramCheckbox.checked = false;
            } else if (attachProgramCheckbox.checked) {
                categoryValue = '{{ \App\Enums\DocumentTemplateRelations::PROGRAM->value }}';
            }

            categoryTypeHidden.value = categoryValue;

            if (categoryValue === '{{ \App\Enums\DocumentTemplateRelations::PRODUCT->value }}') {
                programSelectContainer.style.display = 'block';
                programSelect.setAttribute('required', 'required');
                productSelectContainer.style.display = 'block';
                productSelect.setAttribute('required', 'required');
                if (programSelect.value) {
                    loadProducts(programSelect.value);
                }
            } else if (categoryValue === '{{ \App\Enums\DocumentTemplateRelations::PROGRAM->value }}') {
                programSelectContainer.style.display = 'block';
                programSelect.setAttribute('required', 'required');
                productSelectContainer.style.display = 'none';
                productSelect.removeAttribute('required');
                productSelect.value = '';
            } else {
                programSelectContainer.style.display = 'none';
                programSelect.removeAttribute('required');
                programSelect.value = '';
                productSelectContainer.style.display = 'none';
                productSelect.removeAttribute('required');
                productSelect.value = '';
            }
        }

        attachProgramCheckbox.addEventListener('change', () => {
            if (attachProgramCheckbox.checked) {
                attachProductCheckbox.checked = false;
            }
            updateAttachmentFields();
        });

        attachProductCheckbox.addEventListener('change', () => {
            if (attachProductCheckbox.checked) {
                attachProgramCheckbox.checked = false;
            }
            updateAttachmentFields();
        });

        programSelect.addEventListener('change', function() {
            if (categoryTypeHidden.value === '{{ \App\Enums\DocumentTemplateRelations::PRODUCT->value }}') {
                loadProducts(this.value);
                if (this.value) {
                    productSelectContainer.style.display = 'block';
                    productSelect.setAttribute('required', 'required');
                } else {
                    productSelectContainer.style.display = 'none';
                    productSelect.removeAttribute('required');
                }
            }
        });

        updateAttachmentFields();

        // Gestion des selects de type de document
        const documentTypeCategorySelect = document.getElementById('document_type_category');
        const documentTypeSelect = document.getElementById('document_type');
        
        // Données des types par catégorie (depuis PHP)
        const documentTypesByCategory = @json($documentTypesByCategory);
        
        // Valeur sélectionnée actuelle (si édition)
        @if($documentTemplate && $documentTemplate->document_type)
            const currentDocumentType = '{{ $documentTemplate->document_type }}';
            const currentDocumentTypeEnum = @json(\App\Enums\DocumentTemplateType::tryFrom($documentTemplate->document_type));
        @else
            const currentDocumentType = null;
            const currentDocumentTypeEnum = null;
        @endif

        function updateDocumentTypeSelect() {
            const selectedCategory = documentTypeCategorySelect.value;
            
            if (!selectedCategory) {
                documentTypeSelect.style.display = 'none';
                documentTypeSelect.innerHTML = '<option value="">-- Sélectionnez d\'abord une catégorie --</option>';
                return;
            }

            // Afficher le select et le remplir avec les types de la catégorie
            documentTypeSelect.style.display = 'block';
            documentTypeSelect.innerHTML = '<option value="">-- Sélectionnez un type --</option>';
            
            if (documentTypesByCategory[selectedCategory]) {
                documentTypesByCategory[selectedCategory].forEach(type => {
                    const option = document.createElement('option');
                    option.value = type.value;
                    option.textContent = type.label;
                    
                    // Pré-sélectionner si c'est le type actuel
                    if (currentDocumentType && currentDocumentType === type.value) {
                        option.selected = true;
                    }
                    
                    documentTypeSelect.appendChild(option);
                });
            }
        }

        // Écouter les changements de catégorie de document
        documentTypeCategorySelect.addEventListener('change', updateDocumentTypeSelect);

        // Initialiser au chargement si une catégorie est déjà sélectionnée
        if (documentTypeCategorySelect.value) {
            updateDocumentTypeSelect();
        }
    });
    </script>

@endsection