{% extends "admin/base.html" %}
{% block title %}CSV Export/Import{% endblock %}

{% block content %}
<div class="d-flex justify-content-between align-items-start mb-4">
    <div>
        <h1><i class="bi bi-filetype-csv me-2"></i>CSV Export/Import</h1>
        <p class="text-muted">Konfigurieren Sie, welche Felder exportiert und importiert werden</p>
    </div>
    <div class="btn-group">
        <a href="{{ url_for('admin.customers_export') }}" class="btn btn-success">
            <i class="bi bi-download me-1"></i>Export testen
        </a>
    </div>
</div>

<form method="POST" action="{{ url_for('admin.settings_csv') }}">
    <!-- Export Fields -->
    <div class="card mb-4">
        <div class="card-header">
            <i class="bi bi-list-check me-2"></i>
            Export-Felder
        </div>
        <div class="card-body">
            <p class="text-muted small mb-3">
                Waehlen Sie aus, welche Felder in der CSV-Datei enthalten sein sollen.
                Spaltenreihenfolge entspricht der Reihenfolge in dieser Liste.
            </p>
            <div class="table-responsive">
                <table class="table table-dark table-hover mb-0">
                    <thead>
                        <tr>
                            <th class="text-center" style="width: 80px;">Aktiv</th>
                            <th>Feld</th>
                            <th style="width: 250px;">Spaltenname (CSV)</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for field in config.export_fields %}
                        <tr>
                            <td class="text-center">
                                <div class="form-check form-switch d-inline-block">
                                    <input class="form-check-input" type="checkbox"
                                           name="enabled_{{ field.key }}"
                                           id="enabled_{{ field.key }}"
                                           {% if field.enabled %}checked{% endif %}
                                           {% if field.key == 'email' %}disabled title="E-Mail ist Pflichtfeld"{% endif %}>
                                </div>
                                {% if field.key == 'email' %}
                                <input type="hidden" name="enabled_{{ field.key }}" value="on">
                                {% endif %}
                            </td>
                            <td>
                                <code class="text-info">{{ field.key }}</code>
                                {% if field.key == 'email' %}
                                <span class="badge bg-danger ms-2">Pflicht</span>
                                {% endif %}
                                {% if field.key in ['created_at', 'updated_at'] %}
                                <span class="badge bg-secondary ms-2">System</span>
                                {% endif %}
                            </td>
                            <td>
                                <input type="text" class="form-control form-control-sm"
                                       name="label_{{ field.key }}"
                                       value="{{ field.label }}"
                                       placeholder="{{ field.label }}">
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <!-- Advanced Options -->
    <div class="card mb-4">
        <div class="card-header">
            <i class="bi bi-gear me-2"></i>
            Erweiterte Optionen
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <div class="mb-3">
                        <label for="delimiter" class="form-label">Trennzeichen</label>
                        <select class="form-select" name="delimiter" id="delimiter">
                            <option value=";" {% if config.delimiter == ';' %}selected{% endif %}>Semikolon (;) - Excel-kompatibel</option>
                            <option value="," {% if config.delimiter == ',' %}selected{% endif %}>Komma (,) - Standard CSV</option>
                            <option value="\t" {% if config.delimiter == '\t' %}selected{% endif %}>Tabulator - TSV</option>
                        </select>
                        <div class="form-text">Semikolon wird fuer deutsche Excel-Versionen empfohlen.</div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="form-check form-switch mt-4">
                        <input class="form-check-input" type="checkbox"
                               name="include_custom_fields"
                               id="include_custom_fields"
                               {% if config.include_custom_fields %}checked{% endif %}>
                        <label class="form-check-label" for="include_custom_fields">
                            <strong>Zusatzfelder exportieren</strong>
                        </label>
                        <p class="text-muted small mb-0 mt-1">
                            Fuegt eine JSON-Spalte mit MEC/WordPress Zusatzfeldern hinzu.
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Import Info -->
    <div class="card mb-4 border-info">
        <div class="card-header bg-info bg-opacity-10">
            <i class="bi bi-info-circle me-2"></i>
            Import-Hinweise
        </div>
        <div class="card-body">
            <ul class="mb-0">
                <li>Der Import erkennt Spalten automatisch anhand der <strong>Spaltennamen</strong> (erste Zeile)</li>
                <li><strong>E-Mail</strong> ist das Schluesselfeld - bestehende Kunden werden aktualisiert</li>
                <li>Werte fuer Ja/Nein-Felder: <code>Ja</code>, <code>1</code>, <code>true</code> = aktiviert</li>
                <li>Leere Zellen werden beim Import uebersprungen (bestehende Werte bleiben)</li>
                <li>Die <strong>ID</strong>-Spalte wird beim Import ignoriert</li>
            </ul>
        </div>
    </div>

    <!-- Submit -->
    <div class="d-flex gap-2">
        <button type="submit" class="btn btn-danger">
            <i class="bi bi-check-lg me-1"></i>
            Speichern
        </button>
        <a href="{{ url_for('admin.customers') }}" class="btn btn-outline-secondary">
            Zurueck zur Kundenliste
        </a>
    </div>
</form>
{% endblock %}