{% extends 'generic/cid_group_base.html' %}
<!-- {% load static from static %} -->

{% block css %}
{% endblock %}
{% block js %}
<!--<script type="text/javascript" src="/admin/jsi18n/"></script>-->
    {{form.media}}

    <script type="text/javascript">
    </script>

<!-- {{ form.media }} -->
{% endblock %}
{% block content %}
    {% if form.instance.id %}
        <h2>Edit Group: {{cidusergroup.name}}</h2>
        Use this form to edit a CID user group.
    {% else %}
        <h2>Add New Group</h2>
        Use this form to create a CID user group.
    {% endif %}
    <form action="" method="post" enctype="multipart/form-data" id="condition-form">
        {% csrf_token %}

        <div class="card mb-3">
            <div class="card-body">
                <div class="row">
                    <div class="col-12 col-md-8">
                        {% for field in form.visible_fields %}
                            <div class="mb-3">
                                {{ field.label_tag }}
                                {{ field }}
                                {% if field.help_text %}
                                    <div class="form-text text-muted">{{ field.help_text }}</div>
                                {% endif %}
                                {% if field.errors %}
                                    <div class="text-danger small">{{ field.errors|striptags }}</div>
                                {% endif %}
                            </div>
                        {% endfor %}
                        <div class="mt-2">
                            <button type="submit" class="btn btn-primary btn-sm">Save group</button>
                            <a href="{% url 'generic:manage_cids' %}" class="btn btn-link btn-sm ms-2">Manage CIDs</a>
                        </div>
                    </div>
                    <div class="col-12 col-md-4">
                        {% if cidusergroup %}
                            <div class="small text-muted mb-2">Users currently in this group</div>
                            <ul class="list-group list-group-flush small">
                                {% for user in cidusergroup.ciduser_set.all %}
                                    <li class="list-group-item bg-transparent border-0 px-0 py-1">
                                        <a href="{% url 'generic:update_cid' user.pk %}">{{ user.cid }}</a>
                                        <div class="text-muted">{{ user.name }} &middot; {{ user.email }}</div>
                                    </li>
                                {% empty %}
                                    <li class="list-group-item bg-transparent border-0 px-0 py-1 text-muted">Group currently has no users.</li>
                                {% endfor %}
                            </ul>
                            <div class="small text-muted mt-2">Count: {{ cidusergroup.ciduser_set.count }}</div>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>

    </form>
{% endblock %}