{% extends 'base.html' %}

{% block title %}Search-DB Analyse{% endblock %}
{% block page_id %}search_db_analyzer{% endblock %}

{% block content %}
<div class="container">
  <h2>Ordner auswerten</h2>
  <p class="text-muted">
    Ordner auswählen und die Anzahl der Dateien pro Kategorie aus der Dateiindex abrufen.
  </p>

  <form id="analyzer-form" class="row g-3">
    <div class="col-12">
      <label class="form-label">Ordnerauswahl</label>
      <div id="folder-levels" class="d-flex flex-wrap gap-2 align-items-end"></div>
      <div class="form-text">Wähle zuerst den Hauptordner, füge dann bei Bedarf Unterordner hinzu.</div>
    </div>
    <div class="col-md-2 col-12 d-flex align-items-end">
      <button type="submit" class="btn btn-primary w-100">Abfrage starten</button>
    </div>
  </form>

  <div id="analyzer-feedback" class="mt-3 text-danger" style="display: none;"></div>

  <div id="analyzer-result" class="mt-4" style="display: none;">
    <div class="d-flex justify-content-between align-items-center mb-2">
      <h4 class="mb-0">Ergebnis</h4>
      <span class="badge bg-secondary" id="totalCount"></span>
    </div>
    <div class="row g-3">
      <div class="col-lg-7">
        <div class="table-responsive">
          <table class="table table-striped align-middle">
            <thead>
              <tr>
                <th>Kategorie</th>
                <th>Anzahl Dateien</th>
              </tr>
            </thead>
            <tbody id="result-body"></tbody>
          </table>
        </div>
      </div>
      <div class="col-lg-5">
        <div class="table-responsive">
          <table class="table table-striped align-middle">
            <thead>
              <tr>
                <th>Dateityp</th>
                <th>Anzahl Dateien</th>
              </tr>
            </thead>
            <tbody id="filetype-body"></tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</div>
<script type="application/json" id="search-db-analyzer-data">
  {{ {
    'folders_url': url_for('search_db_folders'),
    'query_url': url_for('search_db_query')
  } | tojson }}
</script>
{% endblock %}

{% block scripts %}{% endblock %}