{% extends "base.html" %}
{% block title %}{% if editing %}Edit{% else %}Add{% endif %} subscriber - RadiusForge{% endblock %}
{% block content %}
    <div class="rf-page-head">
        <div>
            <h1>{% if editing %}Edit {{ editing.username }}{% else %}Add subscriber{% endif %}</h1>
            {% if usage %}<p class="rf-lede">Usage this period: {{ usage.text }}</p>{% endif %}
        </div>
    </div>
    <p class="hint">Hover over a field's label for an explanation.</p>
    <form method="post" class="rf-form-card">
        {% csrf_token %}
        {% if form.non_field_errors %}<div class="errorlist">{{ form.non_field_errors }}</div>{% endif %}
        {{ form.organization }}
        {% for field in form %}
            {% if field.name != "organization" %}
                <label for="{{ field.id_for_label }}" title="{{ field.field.widget.attrs.title }}">{{ field.label }}</label>
                {{ field }}
                {% if field.help_text %}<div class="helptext">{{ field.help_text }}</div>{% endif %}
                {% if field.errors %}<div class="errorlist">{{ field.errors }}</div>{% endif %}
            {% endif %}
        {% endfor %}
        <div class="rf-form-actions">
            <button type="submit">Save</button>
            <a href="{% url 'subscriber-list' %}">Cancel</a>
        </div>
    </form>

    {% if editing %}
    <hr class="rf-divider">
    <h2>Advanced attributes</h2>
    <p class="hint">Extra RADIUS attributes for this subscriber alone, on top of the Static IP above:
       a routed subnet to a CPE (Framed-Route), a netmask, a firewall filter and more. Pick from the
       list rather than typing a raw attribute name; each option explains the value it expects.</p>

    {% if extra_attributes %}
    <table class="rf-cards">
        <thead>
            <tr><th>Attribute</th><th>Value</th><th><span class="rf-visually-hidden">Actions</span></th></tr>
        </thead>
        <tbody>
        {% for extra in extra_attributes %}
            <tr>
                <td data-label="Attribute" class="rf-primary">{{ extra.attribute }}</td>
                <td data-label="Value" class="mono">{{ extra.value }}</td>
                <td class="rf-actions">
                    <form method="post" action="{% url 'subscriber-attribute-delete' editing.pk extra.pk %}"
                          onsubmit="return confirm('Remove this attribute from the subscriber?');">
                        {% csrf_token %}
                        <button type="submit" class="small-button">Remove</button>
                    </form>
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
    {% else %}
    <p class="rf-empty">No advanced attributes on this subscriber.</p>
    {% endif %}

    <form method="post" action="{% url 'subscriber-attribute-add' editing.pk %}" class="rf-form-card rf-form-spaced">
        {% csrf_token %}
        <label for="{{ attribute_form.attribute.id_for_label }}">{{ attribute_form.attribute.label }}</label>
        {{ attribute_form.attribute }}

        <label for="{{ attribute_form.value.id_for_label }}" title="{{ attribute_form.value.field.widget.attrs.title }}">{{ attribute_form.value.label }}</label>
        {{ attribute_form.value }}

        <div class="rf-form-actions">
            <button type="submit">Add attribute</button>
        </div>
    </form>
    {% endif %}

    {% if editing and cancelled %}
        {% if can_delete %}
    <p class="hint">{{ editing.username }} is cancelled. <a href="{% url 'subscriber-delete' editing.pk %}">Delete {{ editing.username }}</a> - you will be asked to confirm.</p>
        {% else %}
    <p class="hint">{{ editing.username }} is cancelled. The Organization's Owner can delete them.</p>
        {% endif %}
    {% endif %}
{% endblock %}