{% extends "sysadmin/base.html" %}
{% load i18n seahub_tags %}

{% block cur_inst %}tab-cur{% endblock %}

{% block right_panel %}
<div class="tabnav ovhd">
    <ul class="tabnav-tabs fleft">
        <h3>{% trans "All Institutions" %}</h3>
    </ul>
    <div class="fright">
        <button id="add-inst-btn">{% trans "Add" %}</button>
    </div>
</div>

<form id="add-inst-form" action="" method="post" class="hide">{% csrf_token %}
    <h3>{% trans "Add institution" %}</h3>
    <label for="id_name">{% trans "Name" %}</label><br />
    <input type="text" name="name" id="id_name" class="input" /><br />
    <p class="error hide"></p>
    <button type="submit" class="submit">{% trans "Submit" %}</button>
</form>

{% if insts %}
<table>
    <tr>
        <th width="62%">{% trans "Name" %}</th>
        <th width="20%">{% trans "Create At" %}</th>
        <th width="18%">{% trans "Operations" %}</th>
    </tr>
    {% for inst in insts %}
    <tr>
        <td><a href="{% url "sys_inst_info_users" inst.pk %}">{{ inst.name }}</a></td>
        <td>{{ inst.create_time|translate_seahub_time }} </td>
        <td>
            <a class="op vh rm-link" data-target="{{ inst.name }}" data-url="{% url "sys_inst_remove" inst.pk %}" href="#">{% trans "Remove" %}</a>
        </td>
    </tr>
    {% endfor %}
</table>

{% include "snippets/admin_paginator.html" %}
{% else %}
<p>{% trans "Empty" %}</p>
{% endif %}
{% endblock %}

{% block extra_script %}
<script type="text/javascript">
$('#add-inst-btn').click(function() {
    $('#add-inst-form').modal();
    $('#simplemodal-container').css({'width':'auto', 'height':'auto'});
});
$('#add-inst-form').submit(function() {
    var form = $(this),
    form_id = $(this).attr('id'),
        name = $.trim(form.find('[name="name"]').val());

    if (!name) {
        apply_form_error(form_id, "{% trans "Name can not be blank" %}");
        return false;
    }
    
});
addConfirmTo($('.rm-link'), {
    'title':"{% trans "Delete Institution" %}",
    'con':"{% trans "Are you sure you want to delete %s ?" %}",
    'post': true // post request
});
</script>
{% endblock %}
