{% extends "base.html" %}
{% block title %}Setari - GoMag Import{% endblock %}
{% block nav_settings %}active{% endblock %}

{% block content %}
<h4 class="mb-3">Setari</h4>

<div class="row g-3 mb-3">
    <!-- GoMag API card -->
    <div class="col-md-6">
        <div class="card h-100">
            <div class="card-header py-2 px-3 fw-semibold">GoMag API</div>
            <div class="card-body py-2 px-3">
                <div class="mb-2">
                    <label class="form-label mb-0 small">API Key</label>
                    <input type="text" class="form-control form-control-sm" id="settGomagApiKey" placeholder="4c5e46...">
                </div>
                <div class="mb-2">
                    <label class="form-label mb-0 small">Shop URL</label>
                    <input type="text" class="form-control form-control-sm" id="settGomagApiShop" placeholder="https://coffeepoint.ro">
                </div>
                <div class="row g-2">
                    <div class="col-6">
                        <label class="form-label mb-0 small">Zile înapoi</label>
                        <input type="number" class="form-control form-control-sm" id="settGomagDaysBack" value="7" min="1">
                    </div>
                    <div class="col-6">
                        <label class="form-label mb-0 small">Limită/pagină</label>
                        <input type="number" class="form-control form-control-sm" id="settGomagLimit" value="100" min="1">
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Import ROA card -->
    <div class="col-md-6">
        <div class="card h-100">
            <div class="card-header py-2 px-3 fw-semibold">Import ROA</div>
            <div class="card-body py-2 px-3">
                <div class="mb-2">
                    <label class="form-label mb-0 small">Gestiuni pentru verificare stoc</label>
                    <div id="settGestiuniContainer" class="border rounded p-2" style="max-height:120px;overflow-y:auto;font-size:0.85rem">
                        <span class="text-muted small">Se încarcă...</span>
                    </div>
                    <div class="form-text" style="font-size:0.75rem">Nicio selecție = orice gestiune</div>
                </div>
                <div class="mb-2">
                    <label class="form-label mb-0 small">Secție (ID_SECTIE)</label>
                    <select class="form-select form-select-sm" id="settIdSectie">
                        <option value="">— selectează secție —</option>
                    </select>
                </div>
                <div class="mb-2">
                    <label class="form-label mb-0 small">Politică Preț Vânzare (ID_POL)</label>
                    <select class="form-select form-select-sm" id="settIdPol">
                        <option value="">— selectează politică —</option>
                    </select>
                </div>
                <div class="mb-2">
                    <label class="form-label mb-0 small">Politică Preț Producție</label>
                    <select class="form-select form-select-sm" id="settIdPolProductie">
                        <option value="">— fără politică producție —</option>
                    </select>
                    <div class="form-text" style="font-size:0.75rem">Pentru articole cu cont 341/345 (producție proprie)</div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row g-3 mb-3">
    <!-- Transport card -->
    <div class="col-md-6">
        <div class="card h-100">
            <div class="card-header py-2 px-3 fw-semibold">Transport</div>
            <div class="card-body py-2 px-3">
                <div class="mb-2">
                    <label class="form-label mb-0 small">CODMAT Transport</label>
                    <div class="position-relative">
                        <input type="text" class="form-control form-control-sm" id="settTransportCodmat" placeholder="ex: TRANSPORT" autocomplete="off">
                        <div class="autocomplete-dropdown d-none" id="settTransportAc"></div>
                    </div>
                </div>
                <div class="row g-2">
                    <div class="col-6">
                        <label class="form-label mb-0 small">TVA Transport (%)</label>
                        <select class="form-select form-select-sm" id="settTransportVat">
                            <option value="5">5%</option>
                            <option value="9">9%</option>
                            <option value="19">19%</option>
                            <option value="21" selected>21%</option>
                        </select>
                    </div>
                    <div class="col-6">
                        <label class="form-label mb-0 small">Politică Transport</label>
                        <select class="form-select form-select-sm" id="settTransportIdPol">
                            <option value="">— implicită —</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Discount card -->
    <div class="col-md-6">
        <div class="card h-100">
            <div class="card-header py-2 px-3 fw-semibold">Discount</div>
            <div class="card-body py-2 px-3">
                <div class="mb-2">
                    <label class="form-label mb-0 small">CODMAT Discount</label>
                    <div class="position-relative">
                        <input type="text" class="form-control form-control-sm" id="settDiscountCodmat" placeholder="ex: DISCOUNT" autocomplete="off">
                        <div class="autocomplete-dropdown d-none" id="settDiscountAc"></div>
                    </div>
                </div>
                <div class="row g-2">
                    <div class="col-6">
                        <label class="form-label mb-0 small">TVA Discount (fallback %)</label>
                        <select class="form-select form-select-sm" id="settDiscountVat">
                            <option value="5">5%</option>
                            <option value="9">9%</option>
                            <option value="11">11%</option>
                            <option value="19">19%</option>
                            <option value="21" selected>21%</option>
                        </select>
                    </div>
                    <div class="col-6">
                        <label class="form-label mb-0 small">Politică Discount</label>
                        <select class="form-select form-select-sm" id="settDiscountIdPol">
                            <option value="">— implicită —</option>
                        </select>
                    </div>
                </div>
                <div class="mt-2 form-check">
                    <input type="checkbox" class="form-check-input" id="settSplitDiscountVat">
                    <label class="form-check-label small" for="settSplitDiscountVat">
                        Împarte discount pe cote TVA (proporțional cu valoarea articolelor)
                    </label>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row g-3 mb-3">
    <div class="col-md-6">
        <div class="card h-100">
            <div class="card-header py-2 px-3 fw-semibold">Dashboard</div>
            <div class="card-body py-2 px-3">
                <div class="mb-2">
                    <label class="form-label mb-0 small">Interval polling (secunde)</label>
                    <input type="number" class="form-control form-control-sm" id="settDashPollSeconds" value="5" min="1" max="300">
                    <div class="form-text" style="font-size:0.75rem">Cât de des verifică dashboard-ul starea sync-ului (implicit 5s)</div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="mb-3">
    <button class="btn btn-primary btn-sm" onclick="saveSettings()">Salvează Setările</button>
    <span id="settSaveResult" class="ms-2 small"></span>
</div>

{% endblock %}

{% block scripts %}
<script src="{{ request.scope.get('root_path', '') }}/static/js/settings.js?v=6"></script>
{% endblock %}