{% extends "base.html" %}
{% load bootstrap4 %}

{% block title %}Settings{% endblock title %}

{% block content %}
<br><br>
<section class="page-section" id="services">
    <div class="container">
        <h2>User Settings</h2>
        <br>
        <div class="row">
            <div class="col-4">
                <form action="" method="post" class="form" enctype="multipart/form-data">
                    {{ user_form.management_form }}
                    {% csrf_token %}
                    {% bootstrap_form user_form %}
                    {% buttons %}
                    <button type="submit" class="btn btn-sm btn-info">Save</button>
                    {% endbuttons %}
                </form> 
            </div>
            <div class="col-4">
                <h4>Invitations</h4>
                {% for invite in invitations%}
                <div class="row">
                    <p><a class="btn btn-sm btn-outline-primary" href="{% url 'qmds:settings_accept_invite' %}{{invite.company.pk}}/">Accept</a> - {{invite.company.company_name}} </p>
                </div>
                {%endfor%}
            </div>
            <div class="col-4">
                <h4>Team Member</h4>
                {% for member in team_member %}
                <div class="row">
                    <p><a class="btn btn-sm btn-outline-primary" href="{% url 'web:client_remove_member' %}{{member.cid}}/{{member.email}}/">Remove</a> - {{member.company_name}} </p>
                </div>
                {%endfor%}
            </div>
        </div>
        {% if request.user.is_superuser and not request.user.view_as_user %}
        <br>
        <br>
        <div class="row">
            <div class="col-11"><h2>Users</h2></div>
            <div class="col-1"><a class="btn btn-sm btn-outline-primary" href="{% url 'qmds:settings_create_user' %}">Create</a></div>
        </div>
        <br>
        {%for user in all_client_users %}
        <div class="row p-2 border bg-light">
            <div class="col-4">{{user.email}}</div>
            <div class="col-3">{{user.first_name}}</div>
            <div class="col-3">{{user.last_name}}</div>
            <div class="col-1"><a class="btn btn-sm btn-outline-primary" href="{% url 'qmds:settings_create_user' %}{{user.email}}/">Modify</a></div>
            <div class="col-1"><a class="btn btn-sm btn-outline-danger" href="{% url 'qmds:settings_delete_user' %}{{user.email}}/" onclick="return deleteClicked(this);">Delete</a></div>
        </div>
        {%endfor%}
        <br>
        <h2>Base Tag Settings</h2>
        <br>
        Currently chosen tag/questions source file:
        <div class="row">
            <div class="col-8">{{current_tagfile}}</div>
            <div class="col-2">{{current_tagfile_date}}</div>
            <div class="col-2"><a class="btn btn-sm btn-info" href="{{current_tagfile_url}}">Download</a></div>
        </div>
        <br>
        <div class="row">
            <form method="post" class="form">
                {{ select_form.management_form }}
                {% csrf_token %}
                {% bootstrap_form select_form %}
                {% buttons %}
                <button type="submit" class="btn btn-sm btn-info">Save</button>
                {% endbuttons %}
            </form>
        </div>
        <br><br>
        <div class="row">
            <h4>Upload new Base Tag Source File</h4>
            <form action="{% url 'qmds:settings_document_upload' %}" method="post" class="form" enctype="multipart/form-data">
                {{ file_form.management_form }}
                {% csrf_token %}
                {% bootstrap_form file_form %}
                {% buttons %}
                <button type="submit" class="btn btn-sm btn-info">Save</button>
                {% endbuttons %}
            </form>
        </div>
        <br><br><br>
        <h2>Questions Settings</h2>
        <br>
        <h4>List of Questions Source Files</h4>
        <br>
        <div class="row">
            <div class="col-1"></div>
            <div class="col-4">filename</div>
            <div class="col-2">created</div>
            <div class="col-2"></div> 
            <div class="col-2">num_questions</div>
            <div class="col-1">delete</div>
        </div>
        <br>
        {% for file in question_files %}
        <div class="row">
            <div class="col-1">{{forloop.counter}}</div>
            <div class="col-4">{{file.file.name}}</div>
            <div class="col-2">{{file.created_at}}</div>
            <div class="col-2"></div> 
            <div class="col-2">{{file.num_questions}}</div>
            <div class="col-1"><a class="btn btn-sm btn-danger" href="{% url 'questioning:questions_document_delete' %}{{file.id}}/">X</a></div>
        </div>
        {%endfor%}
        <br>
        <div class="row">
            <h4>Upload new Questions Source File</h4>
            <form action="{% url 'questioning:questions_document_upload' %}" method="post" class="form" enctype="multipart/form-data">
                {{ file_form_question.management_form }}
                {% csrf_token %}
                {% bootstrap_form file_form_question %}
                {% buttons %}
                <button type="submit" class="btn btn-sm btn-info">Save</button>
                {% endbuttons %}
            </form>
        </div>
        {%endif%}

        {%if personal_quiz_results %}
        <br><br>
        <h4>Personal Quiz Results</h4>
        {% for result in personal_quiz_results %}
        <div class="row justify-content-md-left">
            <div class="col col-md-3">{{result.testee}}</div> 
            <div class="col col-md-3">{{result.result|floatformat:-2}} %</div>
            <div class="col col-md-3">{{result.duration|floatformat:-1}} min</div>
            <div class="col col-md-3">{{result.created_at}}</div>
        </div>
        {%endfor%}
        {%endif%}
    </div>
</section>
<br><br>
{% endblock content %}

{% block footer_scripts %}
<script>
    function deleteClicked(obj) {
        if (confirm("Warning!\r\nThis action cannot be undone. Do you want to delete this user permanently?")) {
            return true;
        }
        return false;
    }
</script>
{% endblock footer_scripts %}