{% extends "op_zz_frame.html" %}
{% block centercontent %}
<style>
  .cp-metadata-pre {
    white-space: pre-wrap;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  .cp-metadata-pre code {
    white-space: inherit;
  }
</style>
<main class="ct-docs-content-col" role="main">
  <h1 class="ct-docs-page-h1-title" id="content">Core CPMS – CP Metadata</h1>
  <p class="text-muted">Verwalten Sie OICP-Metadaten für <strong>{{ metadata.chargepoint_id }}</strong>.</p>

  {% if error_message %}
  <div class="alert alert-danger" role="alert">{{ error_message }}</div>
  {% endif %}
  {% if success_message %}
  <div class="alert alert-success" role="alert">{{ success_message }}</div>
  {% endif %}
  {% if sync_error_message %}
  <div class="alert alert-danger" role="alert">{{ sync_error_message }}</div>
  {% endif %}
  {% if sync_success_message %}
  <div class="alert alert-success" role="alert">{{ sync_success_message }}</div>
  {% endif %}

  <div class="card mb-4">
    <div class="card-body">
      <form method="post" class="mb-0">
        <div class="row g-3">
          <div class="col-md-4">
            <label class="form-label" for="chargepoint_id">Chargepoint ID</label>
            <input type="text" class="form-control" id="chargepoint_id" value="{{ metadata.chargepoint_id }}" readonly>
          </div>
          <div class="col-md-4">
            <label class="form-label" for="operator_id">Operator ID</label>
            <input type="text" class="form-control" id="operator_id" name="operator_id" value="{{ metadata.operator_id }}" placeholder="z.&nbsp;B. DE*ABC">
          </div>
          <div class="col-md-4">
            <label class="form-label" for="operator_name">Operator Name</label>
            <input type="text" class="form-control" id="operator_name" name="operator_name" value="{{ metadata.operator_name }}">
          </div>
          <div class="col-md-4">
            <label class="form-label" for="evse_id">EVSE ID (DE*WLE*E0000008*01)</label>
            <input type="text" class="form-control" id="evse_id" name="evse_id" value="{{ metadata.evse_id }}" placeholder="z.&nbsp;B. DE*WLE*E100TEST*01">
          </div>
          <div class="col-md-2">
            <label class="form-label" for="latitude">Latitude</label>
            <input type="text" class="form-control" id="latitude" name="latitude" value="{{ metadata.latitude }}" placeholder="z.&nbsp;B. 52.1234567">
          </div>
          <div class="col-md-2">
            <label class="form-label" for="longitude">Longitude</label>
            <input type="text" class="form-control" id="longitude" name="longitude" value="{{ metadata.longitude }}" placeholder="z.&nbsp;B. 13.1234567">
          </div>
          <div class="col-md-3">
            <label class="form-label" for="address_country">Land (ISO 3166-1 Alpha-2 oder Alpha-3)</label>
            <input type="text" class="form-control" id="address_country" name="address_country" value="{{ metadata.address_country }}" placeholder="DE oder DEU" required maxlength="3" pattern="[A-Za-z]{2,3}" title="Bitte geben Sie einen ISO-3166-Ländercode mit zwei oder drei Buchstaben ein.">
          </div>
          <div class="col-md-3">
            <label class="form-label" for="address_postal_code">PLZ</label>
            <input type="text" class="form-control" id="address_postal_code" name="address_postal_code" value="{{ metadata.address_postal_code }}">
          </div>
          <div class="col-md-6">
            <label class="form-label" for="address_city">Ort</label>
            <input type="text" class="form-control" id="address_city" name="address_city" value="{{ metadata.address_city }}">
          </div>
          <div class="col-md-6">
            <label class="form-label" for="address_street">Straße</label>
            <input type="text" class="form-control" id="address_street" name="address_street" value="{{ metadata.address_street }}">
          </div>
          <div class="col-md-3">
            <label class="form-label" for="address_house_number">Hausnummer</label>
            <input type="text" class="form-control" id="address_house_number" name="address_house_number" value="{{ metadata.address_house_number }}">
          </div>
          <div class="col-md-6">
            <label class="form-label" for="charging_station_name_de">Charging Station Name (DE)</label>
            <input type="text" class="form-control" id="charging_station_name_de" name="charging_station_name_de" value="{{ metadata.charging_station_name_de }}" required>
          </div>
          <div class="col-md-6">
            <label class="form-label" for="charging_station_name_en">Charging Station Name (EN)</label>
            <input type="text" class="form-control" id="charging_station_name_en" name="charging_station_name_en" value="{{ metadata.charging_station_name_en }}" required>
          </div>
          <div class="col-12">
            <label class="form-label" for="charging_station_image">Charging Station Image URL</label>
            <input type="text" class="form-control" id="charging_station_image" name="charging_station_image" value="{{ metadata.charging_station_image }}">
          </div>
          <div class="col-md-4">
            <label class="form-label" for="accessibility">Accessibility</label>
            <select class="form-select" id="accessibility" name="accessibility">
              {% for option in accessibility_choices %}
              <option value="{{ option }}" {% if metadata.accessibility == option %}selected{% endif %}>{{ option }}</option>
              {% endfor %}
            </select>
          </div>
          <div class="col-md-4">
            <label class="form-label" for="accessibility_location">Accessibility Location</label>
            <select class="form-select" id="accessibility_location" name="accessibility_location">
              {% for option in accessibility_location_choices %}
              <option value="{{ option }}" {% if metadata.accessibility_location == option %}selected{% endif %}>{{ option }}</option>
              {% endfor %}
            </select>
          </div>
          <div class="col-md-4">
            <label class="form-label" for="plugs">Plugs</label>
            {% set ns = namespace(has_match=False) %}
            <select class="form-select" id="plugs" name="plugs">
              {% for value, label in plug_type_choices %}
              {% if metadata.plugs == value %}{% set ns.has_match = True %}{% endif %}
              <option value="{{ value }}" {% if metadata.plugs == value %}selected{% endif %}>{{ label }}</option>
              {% endfor %}
              {% if not ns.has_match and metadata.plugs %}
              <option value="{{ metadata.plugs }}" selected>{{ metadata.plugs }}</option>
              {% endif %}
            </select>
          </div>
          <div class="col-md-4">
            <label class="form-label" for="value_added_services">Value Added Services</label>
            {% set selected_services = metadata.value_added_services if metadata.value_added_services else [] %}
            <select class="form-select" id="value_added_services" name="value_added_services" multiple required size="{{ value_added_service_choices|length }}">
              {% for service in value_added_service_choices %}
              <option value="{{ service }}" {% if service in selected_services %}selected{% endif %}>{{ service }}</option>
              {% endfor %}
            </select>
            <small class="form-text text-muted">Mindestens ein Eintrag erforderlich.</small>
          </div>
          <div class="col-md-4">
            <label class="form-label" for="authentication_modes">Authentication Modes</label>
            {% set selected_modes = metadata.authentication_modes if metadata.authentication_modes else [] %}
            <select class="form-select" id="authentication_modes" name="authentication_modes" multiple size="{{ authentication_mode_choices|length }}">
              {% for mode in authentication_mode_choices %}
              <option value="{{ mode }}" {% if mode in selected_modes %}selected{% endif %}>{{ mode }}</option>
              {% endfor %}
            </select>
            <small class="form-text text-muted">Mehrfachauswahl möglich – Standard ist eine Auswahl aller verfügbaren Modi.</small>
          </div>
          <div class="col-12">
            <label class="form-label" for="additional_data">Zusätzliche Hubject Felder (JSON)</label>
            <textarea class="form-control" id="additional_data" name="additional_data" rows="6" placeholder="{&#10;  &quot;evse_record&quot;: { ... }&#10;}">{{ metadata.additional_data }}</textarea>
            <small class="form-text text-muted">Optional: JSON-Struktur zum Ergänzen der erzeugten Payload. Unterstützt die Schlüssel <code>payload</code>, <code>operator</code> und <code>evse_record</code>.</small>
          </div>
          <div class="col-12">
            <label class="form-label" for="charging_facilities">Charging Facilities (JSON)</label>
            <textarea class="form-control" id="charging_facilities" name="charging_facilities" rows="6" required>{{ metadata.charging_facilities }}</textarea>
            <small class="form-text text-muted">Nicht-leere Liste mit Objekten, z.&nbsp;B. <code>[{&quot;ChargingFacilityStatus&quot;: &quot;Available&quot;, &quot;PowerType&quot;: &quot;AC_3_PHASE&quot;, &quot;Power&quot;: 22}]</code>.</small>
          </div>
        </div>
        <div class="d-flex flex-wrap justify-content-between align-items-center gap-2 mt-4">
          <a href="{{ url_for('mini_cpms_cp_config') }}" class="btn btn-outline-secondary btn-sm">Zurück</a>
          <div class="d-flex gap-2">
            <button type="submit" name="action" value="save" class="btn btn-primary btn-sm">Speichern</button>
            <button type="submit" name="action" value="insert" class="btn btn-outline-success btn-sm">OICP Insert Data</button>
            <button type="submit" name="action" value="update" class="btn btn-outline-success btn-sm">OICP Update Data</button>
          </div>
        </div>
      </form>
    </div>
  </div>

  <div class="row mb-4 g-3">
    <div class="col-md-6">
      <div class="card h-100">
        <div class="card-header">Letzter OICP Data Push</div>
        <div class="card-body">
          <dl class="row mb-0">
            <dt class="col-sm-4">Zeitpunkt</dt>
            <dd class="col-sm-8">{{ metadata.last_data_push_at or '-' }}</dd>
            <dt class="col-sm-4">Aktion</dt>
            <dd class="col-sm-8">{{ metadata.last_data_push_action or '-' }}</dd>
            <dt class="col-sm-4">Status</dt>
            <dd class="col-sm-8 d-flex align-items-center gap-2">
              {% set success = metadata.last_data_push_success %}
              {% if success is none %}
              <span class="badge bg-secondary">unbekannt</span>
              {% elif success %}
              <span class="badge bg-success">erfolgreich</span>
              {% else %}
              <span class="badge bg-danger">fehlgeschlagen</span>
              {% endif %}
              <span class="text-muted">{{ metadata.last_data_push_status or 'keine Statusmeldung' }}</span>
            </dd>
          </dl>
        </div>
      </div>
    </div>
    <div class="col-md-6">
      <div class="card h-100">
        <div class="card-header">Letzter Status Push</div>
        <div class="card-body">
          <dl class="row mb-0">
            <dt class="col-sm-4">Zeitpunkt</dt>
            <dd class="col-sm-8">{{ metadata.last_status_push_at or '-' }}</dd>
            <dt class="col-sm-4">Aktion</dt>
            <dd class="col-sm-8">{{ metadata.last_status_push_action or '-' }}</dd>
            <dt class="col-sm-4">EVSE-Status</dt>
            <dd class="col-sm-8">{{ metadata.last_status_value or '-' }}</dd>
            <dt class="col-sm-4">Status</dt>
            <dd class="col-sm-8 d-flex align-items-center gap-2">
              {% set success = metadata.last_status_push_success %}
              {% if success is none %}
              <span class="badge bg-secondary">unbekannt</span>
              {% elif success %}
              <span class="badge bg-success">erfolgreich</span>
              {% else %}
              <span class="badge bg-danger">fehlgeschlagen</span>
              {% endif %}
              <span class="text-muted">{{ metadata.last_status_push_status or 'keine Statusmeldung' }}</span>
            </dd>
          </dl>
        </div>
      </div>
    </div>
  </div>

  <div class="card mb-4">
    <div class="card-header">Hubject EVSE-Status Push</div>
    <div class="card-body">
      <form method="post" class="row g-3 align-items-end">
        <div class="col-md-6 col-lg-4">
          <label class="form-label" for="evse_status">EVSE Status</label>
          <select class="form-select" id="evse_status" name="evse_status">
            {% for value, description in evse_status_choices %}
            <option value="{{ value }}" {% if metadata.evse_status == value %}selected{% endif %}>
              {{ value }} – {{ description }}
            </option>
            {% endfor %}
          </select>
        </div>
        <div class="col-md-auto d-flex gap-2">
          <button type="submit" name="action" value="status_update" class="btn btn-outline-primary btn-sm">
            Push Update
          </button>
          <button type="submit" name="action" value="status_fullload" class="btn btn-outline-primary btn-sm">
            Push FullLoad
          </button>
        </div>
        <div class="col-12">
          <small class="text-muted">Sendet einen Hubject eRoamingPushEvseStatusData-Aufruf für die aktuelle EVSE.</small>
        </div>
      </form>
    </div>
  </div>

  {% if sync_response is not none %}
  <div class="card">
    <div class="card-header">Antwort der Hubject API</div>
    <div class="card-body">
      {% if sync_status_text %}
      <p class="text-muted mb-2">Status: {{ sync_status_text }}</p>
      {% endif %}
      {% if sync_response is mapping or (sync_response is sequence and sync_response is not string) %}
      <pre class="mb-0 cp-metadata-pre"><code>{{ sync_response | tojson(indent=2) }}</code></pre>
      {% else %}
      <pre class="mb-0 cp-metadata-pre"><code>{{ sync_response }}</code></pre>
      {% endif %}
    </div>
  </div>
  {% endif %}
</main>
{% endblock %}