{% extends 'admin/base.html.twig' %}

{% block title %}Paramètres - Boutique{% endblock %}

{% block breadcrumb %}Boutique <i class="fas fa-chevron-right"></i> Paramètres{% endblock %}

{% block body %}
<div class="container-fluid mt-4">
    <div class="row mb-4">
        <div class="col">
            <h1>
                <i class="fas fa-cog"></i> Paramètres de la boutique
            </h1>
        </div>
    </div>

    {% for message in app.flashes('success') %}
        <div class="alert alert-success alert-dismissible fade show">
            <i class="fas fa-check-circle me-2"></i>{{ message }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    {% endfor %}

    {{ form_start(form) }}

    <div class="row">
        <div class="col-lg-8">
            <!-- General Settings -->
            <div class="card mb-4">
                <div class="card-header bg-secondary text-white">
                    <h5 class="mb-0"><i class="fas fa-cog"></i> Paramètres généraux</h5>
                </div>
                <div class="card-body">
                    <div class="alert alert-info d-flex align-items-center mb-4">
                        <i class="fas fa-info-circle me-3 fs-4"></i>
                        <div>
                            <strong>Activation de la boutique :</strong> Pour activer ou désactiver la boutique en ligne, rendez-vous dans
                            <a href="{{ path('bo-global-parameters') }}" class="alert-link fw-semibold">Paramètres généraux</a>
                            › Section "E-commerce"
                        </div>
                    </div>

                    <h6 class="mb-3"><i class="fas fa-euro-sign"></i> Paramètres financiers</h6>
                    <div class="row mb-3">
                        <div class="col-md-6">
                            {{ form_row(form.currency) }}
                        </div>
                        <div class="col-md-6">
                            {{ form_row(form.vatRate) }}
                        </div>
                    </div>

                    <hr>

                    <h6 class="mb-3"><i class="fas fa-truck"></i> Livraison</h6>
                    <div class="form-check mb-3">
                        {{ form_widget(form.shippingEnabled) }}
                        {{ form_label(form.shippingEnabled) }}
                        {{ form_help(form.shippingEnabled) }}
                    </div>

                    <hr>

                    <h6 class="mb-3"><i class="fas fa-address-card"></i> Contact</h6>
                    <div class="row">
                        <div class="col-md-6">
                            {{ form_row(form.shopEmail) }}
                        </div>
                        <div class="col-md-6">
                            {{ form_row(form.shopPhone) }}
                        </div>
                    </div>
                </div>
            </div>

            <!-- Payment Methods -->
            <div class="card mb-4">
                <div class="card-header bg-primary text-white">
                    <h5 class="mb-0"><i class="fas fa-credit-card"></i> Moyens de paiement</h5>
                </div>
                <div class="card-body">
                    <!-- Stripe -->
                    <div class="payment-method-section mb-4">
                        <div class="d-flex align-items-center mb-3">
                            <i class="fab fa-stripe fa-2x me-3 text-primary"></i>
                            <div class="flex-grow-1">
                                <h6 class="mb-0">Stripe (Cartes bancaires)</h6>
                                <small class="text-muted">Acceptez les paiements par carte bancaire</small>
                            </div>
                            {{ form_widget(form.stripeEnabled) }}
                        </div>
                        <div id="stripe-config" class="collapse {{ settings.stripeEnabled ? 'show' : '' }} ps-4">
                            <div class="alert alert-info small">
                                <i class="fas fa-info-circle"></i>
                                Les clés Stripe sont configurées dans les <strong>Paramètres généraux</strong>.
                                <a href="{{ path('bo-global-parameters') }}" class="alert-link">
                                    Configurer les clés Stripe
                                </a>
                            </div>
                            {% if site.stripePublicKey and site.stripeSecretKey %}
                                <div class="alert alert-success small py-2">
                                    <i class="fas fa-check-circle"></i> Clés Stripe configurées
                                </div>
                            {% else %}
                                <div class="alert alert-warning small py-2">
                                    <i class="fas fa-exclamation-triangle"></i> Clés Stripe non configurées
                                </div>
                            {% endif %}
                        </div>
                    </div>

                    <hr>

                    <!-- PayPal -->
                    <div class="payment-method-section mb-4">
                        <div class="d-flex align-items-center mb-3">
                            <i class="fab fa-paypal fa-2x me-3 text-info"></i>
                            <div class="flex-grow-1">
                                <h6 class="mb-0">PayPal</h6>
                                <small class="text-muted">Acceptez les paiements via PayPal</small>
                            </div>
                            {{ form_widget(form.paypalEnabled) }}
                        </div>
                        <div id="paypal-config" class="collapse {{ settings.paypalEnabled ? 'show' : '' }} ps-4">
                            <div class="alert alert-info small mb-3">
                                <strong><i class="fas fa-info-circle"></i> Obtenir vos identifiants PayPal :</strong>
                                <ol class="mb-0 mt-2 small">
                                    <li>Créez un compte sur <a href="https://developer.paypal.com" target="_blank">developer.paypal.com</a></li>
                                    <li>Créez une application dans <strong>My Apps & Credentials</strong></li>
                                    <li>Copiez le <strong>Client ID</strong> et le <strong>Secret</strong></li>
                                </ol>
                            </div>
                            <div class="row">
                                <div class="col-md-6">
                                    {{ form_row(form.paypalClientId) }}
                                </div>
                                <div class="col-md-6">
                                    {{ form_row(form.paypalSecret) }}
                                </div>
                            </div>
                            <div class="form-check mb-3">
                                {{ form_widget(form.paypalSandboxMode) }}
                                {{ form_label(form.paypalSandboxMode) }}
                                {{ form_help(form.paypalSandboxMode) }}
                            </div>
                        </div>
                    </div>

                    <hr>

                    <!-- Bank Transfer -->
                    <div class="payment-method-section">
                        <div class="d-flex align-items-center mb-3">
                            <i class="fas fa-university fa-2x me-3 text-success"></i>
                            <div class="flex-grow-1">
                                <h6 class="mb-0">Virement bancaire</h6>
                                <small class="text-muted">Acceptez les paiements par virement</small>
                            </div>
                            {{ form_widget(form.bankTransferEnabled) }}
                        </div>
                        <div id="bank-config" class="collapse {{ settings.bankTransferEnabled ? 'show' : '' }} ps-4">
                            <div class="alert alert-info small mb-3">
                                <i class="fas fa-info-circle"></i>
                                Ces informations seront envoyées par email aux clients qui choisissent le virement bancaire.
                            </div>
                            {{ form_row(form.bankName) }}
                            <div class="row">
                                <div class="col-md-8">
                                    {{ form_row(form.iban) }}
                                </div>
                                <div class="col-md-4">
                                    {{ form_row(form.bic) }}
                                </div>
                            </div>
                            {{ form_row(form.bankAccountOwner) }}
                        </div>
                    </div>
                </div>
            </div>

            <!-- Invoice Configuration -->
            <div class="card mb-4">
                <div class="card-header bg-secondary text-white">
                    <h5 class="mb-0"><i class="fas fa-file-invoice"></i> Configuration des factures</h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            {{ form_row(form.invoicePrefix) }}
                        </div>
                        <div class="col-md-6">
                            {{ form_row(form.invoiceNumberStart) }}
                        </div>
                    </div>
                    {{ form_row(form.invoiceLegalInfo) }}
                    <div class="alert alert-success small mt-3">
                        <i class="fas fa-lightbulb"></i>
                        <strong>Compteur actuel :</strong> {{ settings.invoiceCounter }}
                        <br>
                        <strong>Prochaine facture :</strong> {{ settings.nextInvoiceNumber }}
                    </div>
                </div>
            </div>

            <!-- Terms and Policies -->
            <div class="card mb-4">
                <div class="card-header bg-secondary text-white">
                    <h5 class="mb-0"><i class="fas fa-file-contract"></i> Conditions et politique</h5>
                </div>
                <div class="card-body">
                    {{ form_row(form.termsAndConditions) }}
                    {{ form_row(form.returnPolicy) }}
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <!-- Summary Card -->
            <div class="card mb-4 sticky-top" style="top: 20px;">
                <div class="card-header">
                    <h6 class="mb-0"><i class="fas fa-check-circle"></i> Méthodes actives</h6>
                </div>
                <div class="card-body">
                    <div class="mb-3 p-2 bg-light rounded">
                        <div class="d-flex align-items-center justify-content-between">
                            <span><i class="fab fa-stripe me-2"></i> Stripe</span>
                            <span class="badge bg-{{ settings.stripeEnabled ? 'success' : 'secondary' }}">
                                {{ settings.stripeEnabled ? 'Actif' : 'Inactif' }}
                            </span>
                        </div>
                    </div>

                    <div class="mb-3 p-2 bg-light rounded">
                        <div class="d-flex align-items-center justify-content-between">
                            <span><i class="fab fa-paypal me-2"></i> PayPal</span>
                            <span class="badge bg-{{ settings.paypalEnabled ? 'success' : 'secondary' }}">
                                {{ settings.paypalEnabled ? 'Actif' : 'Inactif' }}
                            </span>
                        </div>
                    </div>

                    <div class="mb-3 p-2 bg-light rounded">
                        <div class="d-flex align-items-center justify-content-between">
                            <span><i class="fas fa-university me-2"></i> Virement</span>
                            <span class="badge bg-{{ settings.bankTransferEnabled ? 'success' : 'secondary' }}">
                                {{ settings.bankTransferEnabled ? 'Actif' : 'Inactif' }}
                            </span>
                        </div>
                    </div>

                    <hr>

                    {% set activeCount = (settings.stripeEnabled ? 1 : 0) + (settings.paypalEnabled ? 1 : 0) + (settings.bankTransferEnabled ? 1 : 0) %}

                    {% if activeCount == 0 %}
                        <div class="alert alert-warning py-2 px-3 mb-0 small">
                            <i class="fas fa-exclamation-triangle"></i> Aucune méthode active
                        </div>
                    {% else %}
                        <div class="alert alert-success py-2 px-3 mb-0 small">
                            <i class="fas fa-check"></i> {{ activeCount }} méthode(s) active(s)
                        </div>
                    {% endif %}
                </div>

                <div class="card-footer">
                    <button type="submit" class="btn btn-primary w-100">
                        <i class="fas fa-save"></i> Enregistrer
                    </button>
                </div>
            </div>

            <!-- Help Card -->
            <div class="card border-info">
                <div class="card-header bg-info text-white">
                    <h6 class="mb-0"><i class="fas fa-question-circle"></i> Documentation</h6>
                </div>
                <div class="card-body small">
                    <ul class="mb-0">
                        <li><a href="https://stripe.com/docs" target="_blank">Documentation Stripe</a></li>
                        <li><a href="https://developer.paypal.com/docs" target="_blank">Documentation PayPal</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

    {{ form_end(form) }}
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    // Toggle visibility based on checkbox
    const checkboxes = {
        'shop_settings_stripeEnabled': 'stripe-config',
        'shop_settings_paypalEnabled': 'paypal-config',
        'shop_settings_bankTransferEnabled': 'bank-config'
    };

    Object.keys(checkboxes).forEach(checkboxId => {
        const checkbox = document.getElementById(checkboxId);
        const targetId = checkboxes[checkboxId];

        if (checkbox) {
            checkbox.addEventListener('change', function() {
                const target = document.getElementById(targetId);
                if (target) {
                    if (this.checked) {
                        target.classList.add('show');
                    } else {
                        target.classList.remove('show');
                    }
                }
            });
        }
    });
});
</script>
{% endblock %}