{% extends '@Commercial/commercial/layout.html.twig' %}
{% block commercial_title %}{{ order ? 'Modifier le bon de commande' : 'Nouveau bon de commande' }}{% endblock %}
{% block commercial_content %}
{% set back_url = order ? path('sales_order_show', {idtoken: order.idtoken}) : path('sales_order_index') %}
<form method="post" class="billing-editor" data-controller="sales-order-form">
    <input type="hidden" name="_token" value="{{ csrf_token(csrfId) }}">
    <header class="billing-editor__topbar">
        <div><a href="{{ back_url }}" class="billing-button billing-button--muted"><i class="ti ti-arrow-left"></i> Retour</a><div><h1>{{ order ? 'Modifier le bon de commande' : 'Nouveau bon de commande' }} <span>BROUILLON</span></h1><p>Bon de commande{% if order and order.sourceDocument %} · Devis source {{ order.sourceDocument.number }}{% endif %}</p></div></div>
        <div><a class="billing-button billing-button--secondary" href="{{ back_url }}">Annuler</a><button class="billing-button billing-button--primary"><i class="ti ti-check"></i> Enregistrer le brouillon</button></div>
    </header>
    {% for error in errors %}<div class="billing-alert billing-alert--danger" role="alert">{{ error }}</div>{% endfor %}
    <div class="billing-editor__layout">
        <main>
            <section class="billing-editor-card"><header><h2>Informations générales</h2></header><div class="billing-editor-card__body billing-form-grid">

                <label>Client / prospect *<select name="order[customerToken]" data-controller="tom-select" data-tom-select-placeholder-value="Rechercher un client ou un prospect…" data-sales-order-form-target="customer" data-action="change->sales-order-form#customerChanged" required><option value="">Choisir un client ou un prospect</option>{% for client in clients %}<option value="{{ client.idtoken }}" {{ input.customerToken == client.idtoken ? 'selected' : '' }}>{{ client.nom }} — {{ client.entite }}</option>{% endfor %}</select></label>
                <label>Contact client<select name="order[contactToken]" data-sales-order-form-target="contact"><option value="">Sans contact</option>{% for client in clients %}{% for contact in client.users %}{% if not contact.deleted and not contact.archive %}<option value="{{ contact.idtoken }}" data-client-id="{{ client.idtoken }}" {{ input.contactToken == contact.idtoken ? 'selected' : '' }}>{{ client.nom }} — {{ contact.prenom }} {{ contact.nom }}</option>{% endif %}{% endfor %}{% endfor %}</select></label>
                <label>Responsable<select name="order[responsibleUserToken]"><option value="">Non assigné</option>{% for user in responsibles %}<option value="{{ user.idtoken }}" {{ input.responsibleUserToken == user.idtoken ? 'selected' : '' }}>{{ user.prenom }} {{ user.nom }}</option>{% endfor %}</select></label>
                <label>Date de commande *<input type="date" name="order[orderDate]" value="{{ input.document.issueDate }}" required></label>
                <label>Référence de commande client<input name="order[customerOrderReference]" value="{{ input.customerOrderReference }}" maxlength="255"></label>
                <label>Date de commande client<input type="date" name="order[customerOrderDate]" value="{{ input.customerOrderDate }}"></label>
                <label>Exécution prévue<input type="date" name="order[expectedExecutionDate]" value="{{ input.expectedExecutionDate }}"></label>
                <label>Devise<select name="order[currency]" data-sales-order-form-target="currency" data-action="change->sales-order-form#refresh">{% for currency in ['EUR','USD','GBP','CHF','CAD','JPY'] %}<option {{ input.document.currency == currency ? 'selected' : '' }}>{{ currency }}</option>{% endfor %}</select></label>
                <label>Mode de confirmation *<select name="order[confirmationMode]" required><option value="">Choisir un mode</option>{% for value,label in modes %}{% if value != 'quote_acceptance' or (order and order.sourceDocument) %}<option value="{{ value }}" {{ input.confirmationMode == value ? 'selected' : '' }}>{{ label }}</option>{% endif %}{% endfor %}</select></label>
                <label>Objet<input name="order[subject]" value="{{ input.subject }}" maxlength="255"></label>
                <label>Type de document<input value="Bon de commande" readonly></label>
                <label>Numéro<input value="{{ order and order.number ? order.number : 'Attribué à la validation' }}" readonly></label>
            </div></section>
            <section class="billing-editor-card"><header><h2>Texte d’introduction</h2></header><div class="billing-editor-card__body"><textarea name="order[introduction]" rows="4" placeholder="Texte affiché avant les lignes du document.">{{ input.document.introText }}</textarea></div></section>
            <section class="billing-editor-card billing-lines-card">
                <header><div><h2>Lignes du document</h2><p>Sélectionnez plusieurs produits en une fois ou ajoutez une ligne libre.</p></div><div><button type="button" class="billing-button billing-button--secondary" data-action="sales-order-form#openProducts"><i class="ti ti-package"></i> Ajouter des produits</button><button type="button" class="billing-button billing-button--outline" data-action="sales-order-form#addFreeLine"><i class="ti ti-plus"></i> Ligne libre</button></div></header>
                <div class="billing-editor-card__body"><div class="billing-lines-table"><div class="billing-lines-table__head"><span></span><span>Produit / service</span><span>Qté / unité</span><span>Prix HT</span><span>Remise</span><span>TVA</span><span>Total HT</span><span></span></div><div data-sales-order-form-target="lines">
                    {% for line in input.document.lines %}{% include '@Commercial/commercial/order/_line_form.html.twig' with {index: loop.index0, line: line, unit: input.units[loop.index0]|default(''), productToken: input.productTokens[loop.index0]|default('')} %}{% endfor %}
                </div></div></div>
            </section>
            <div class="billing-editor__notes">
                <section class="billing-editor-card"><header><h2>Notes au client</h2></header><div class="billing-editor-card__body"><textarea name="order[visibleNotes]" rows="7" placeholder="Notes visibles sur le document.">{{ input.document.footerNotes }}</textarea></div></section>
                <section class="billing-editor-card"><header><h2>Conditions &amp; règlement</h2></header><div class="billing-editor-card__body"><textarea name="order[paymentTerms]" rows="4" placeholder="Conditions de règlement, délais, pénalités.">{{ input.document.paymentTerms }}</textarea><label>Notes internes<textarea name="order[internalNotes]" rows="3" placeholder="Notes réservées à l’équipe.">{{ input.document.internalNotes }}</textarea></label></div></section>
            </div>
        </main>
        <aside>
            <section class="billing-editor-card billing-summary"><header><h2>Résumé financier</h2></header><div class="billing-editor-card__body"><dl><div><dt>Sous-total HT</dt><dd data-sales-order-form-target="subtotal">—</dd></div><div><dt>Remises HT</dt><dd data-sales-order-form-target="discount">—</dd></div><div><dt>TVA</dt><dd data-sales-order-form-target="vat">—</dd></div><div class="is-total"><dt>Total TTC</dt><dd data-sales-order-form-target="total">—</dd></div></dl><p class="text-muted small">Aperçu recalculé à l’enregistrement. Aucun paiement n’est rattaché directement au bon de commande.</p></div></section>
            <section class="billing-editor-card billing-context"><header><h2>Contexte document</h2></header><div class="billing-editor-card__body"><small>Type</small><strong>Bon de commande</strong><small>Client</small><strong data-sales-order-form-target="clientName">Aucun client sélectionné</strong><small>Facturation</small><strong>Après validation et confirmation</strong></div></section>
        </aside>
    </div>
    <dialog class="billing-dialog" data-sales-order-form-target="lineDialog"><div class="billing-dialog__header"><h2>Modifier la ligne</h2><button type="button" data-action="sales-order-form#closeLine">×</button></div><div class="billing-dialog__body billing-form-grid"><p class="is-wide text-danger" role="alert" data-sales-order-form-target="lineError" hidden></p><label class="is-wide">Libellé<input maxlength="255" data-sales-order-form-target="modalLabel"></label><label class="is-wide">Description<textarea rows="5" data-sales-order-form-target="modalDescription"></textarea></label><label>Quantité<input inputmode="decimal" data-sales-order-form-target="modalQuantity"></label><label>Unité<input maxlength="30" data-sales-order-form-target="modalUnit"></label><label>Prix HT<input inputmode="decimal" data-sales-order-form-target="modalPrice"></label><label>Remise %<input inputmode="decimal" data-sales-order-form-target="modalDiscount"></label><label>TVA %<input inputmode="decimal" data-sales-order-form-target="modalVat"></label></div><div class="billing-dialog__footer"><button type="button" class="billing-button billing-button--secondary" data-action="sales-order-form#closeLine">Annuler</button><button type="button" class="billing-button billing-button--primary" data-action="sales-order-form#saveLine">Valider la ligne</button></div></dialog>
    <dialog class="billing-dialog billing-dialog--products" data-sales-order-form-target="productDialog"><div class="billing-dialog__header"><h2>Ajouter des produits</h2><button type="button" data-action="sales-order-form#closeProducts">×</button></div><div class="billing-dialog__body"><div class="billing-product-search"><input type="search" placeholder="Rechercher un produit…" data-action="input->sales-order-form#filterProducts"><span>Sélectionnez un ou plusieurs produits, puis ajoutez-les en lignes.</span></div><div class="billing-products"><div class="billing-products__head"><span></span><span>Produit</span><span>Description</span><span>Prix HT</span><span>TVA</span></div>{% for product in products %}<label class="billing-product" data-sales-order-form-target="product" data-search="{{ (product.nom ~ ' ' ~ product.description)|lower|e('html_attr') }}"><input type="checkbox" data-product-token="{{ product.idtoken }}" data-product-unit="{{ product.unit }}" data-product-name="{{ product.nom|e('html_attr') }}" data-product-description="{{ product.description|default('')|e('html_attr') }}" data-product-price="{{ product.prix|number_format(2, '.', '') }}" data-product-vat="{{ product.taxe ? product.taxe.taux|number_format(2, '.', '') : '0.00' }}"><strong>{{ product.nom }}</strong><span>{{ product.description|striptags }}</span><b>{{ product.prix|number_format(2, ',', ' ') }} {{ input.document.currency }}</b><b>{{ product.taxe ? product.taxe.taux|number_format(2, ',', ' ') : '0,00' }} %</b></label>{% else %}<p class="billing-empty">Aucun produit disponible.</p>{% endfor %}</div></div><div class="billing-dialog__footer"><button type="button" class="billing-button billing-button--secondary" data-action="sales-order-form#closeProducts">Fermer</button><button type="button" class="billing-button billing-button--primary" data-action="sales-order-form#addProducts"><i class="ti ti-plus"></i> Ajouter les produits sélectionnés</button></div></dialog>
    <template data-sales-order-form-target="template">{% include '@Commercial/commercial/order/_line_form.html.twig' with {index: '__INDEX__', line: {label: '', description: '', quantity: '1.000', unitPriceHt: '0.00', discountRate: '0.00', vatRate: '20.00'}, unit: '', productToken: ''} %}</template>
</form>
{% endblock %}