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

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

{% block left_panel %}{{block.super}}
<form action="{% url 'sys_link_search' %}" method="get" class="side-search-form">
    <input type="text" name="token" class="input" value="" placeholder="{% trans "Search download links by token..." %}" />
</form>
{% endblock %}

{% block right_panel %}
    <div class="hd ovhd">
        <ul class="tab-tabs-nav fleft">
            <li class="tab ui-state-active">
                <a href="{% url 'sys_publink_admin' %}" class="a">{% trans "Share Links" %}</a>
            </li>
            <li class="tab">
                <a href="{% url 'sys_upload_link_admin' %}" class="a">{% trans "Upload Links" %}</a>
            </li>
        </ul>
    </div>

{% if publinks %}
<table>
    <tr>
        <th width="25%">{% trans "Name" %}</th>
        <th width="19%">{% trans "Token" %}</th>
        <th width="22%">{% trans "Owner" %}</th>
        <th width="18%"><a class="table-sort-op by-time" href="#">{% trans "Create At" %} {% if sort_by == 'time_down' %}<span class="sort-icon icon-caret-down"></span>{% elif sort_by == 'time_up' %}<span class="sort-icon icon-caret-up"></span>{% endif %}</a></th>
        <th width="8%"><a class="table-sort-op by-count" href="#">{% trans "Count" %} {% if sort_by == 'count_down' %}<span class="sort-icon icon-caret-up"></span>{% elif sort_by == 'count_up' %}<span class="sort-icon icon-caret-down"></span>{% endif %}</a></th>
        <th width="8%"></th>
    </tr>
    {% for publink in publinks %}
    <tr>
        <td>{{ publink.name }}</td>
        <td>{{ publink.token }}</td>
        <td><a href="{% url 'user_info' publink.username %}">{{ publink.username }}</a></td>
        <td>{{ publink.ctime|translate_seahub_time }} </td>
        <td>{{ publink.view_cnt }}</td>
        <td>
            <a class="op vh rm-link" href="#" data-token="{{ publink.token }}">{% trans "Remove" %}</a>
        </td>
    </tr>
    {% endfor %}
</table>

<div id="paginator">
    {% if current_page != 1 %}
    <a href="?page={{ prev_page }}&per_page={{ per_page }}&sort_by={{ sort_by }}">{% trans "Previous" %}</a>
    {% endif %}
    {% if page_next %}
    <a href="?page={{ next_page }}&per_page={{ per_page }}&sort_by={{ sort_by }}">{% trans "Next" %}</a>
    {% endif %}
    {% if current_page != 1 or page_next %}
    |
    {% endif %}
    <span>{% trans "Per page: " %}</span>
    {% if per_page == 25 %}
    <span> 25 </span>
    {% else %}
    <a href="?per_page=25&sort_by={{ sort_by }}" class="per-page">25</a>
    {% endif %}
    {% if per_page == 50 %}
    <span> 50 </span>
    {% else %}
    <a href="?per_page=50&sort_by={{ sort_by }}" class="per-page">50</a>
    {% endif %}
    {% if per_page == 100 %}
    <span> 100 </span>
    {% else %}
    <a href="?per_page=100&sort_by={{ sort_by }}" class="per-page">100</a>
    {% endif %}
</div>
{% else %}
<p>{% trans "Empty" %}</p>
{% endif %}
{% endblock %}

{% block extra_script %}
<script type="text/javascript">
$('.rm-link').on('click', function() {
    var _this = $(this);
    $.ajax({
        url: '{% url 'sys_publink_remove' %}',
        type: 'POST',
        data: {'t': _this.attr('data-token')},
        cache: false,
        dataType: 'json',
        beforeSend: prepareCSRFToken,
        success: function() {
            _this.closest('tr').remove();
        },
        error: ajaxErrorHandler
    });
    return false;
});

var sort_by = '{{ sort_by }}';
var url = '{% url 'sys_publink_admin' %}' + '?per_page={{ per_page }}';
$(".by-time").on('click', function () {
    if (sort_by == 'time_down') {
        location.href = url + '&sort_by=time_up';
    } else {
        location.href = url + '&sort_by=time_down';
    }
    return false;
});
$(".by-count").on('click', function () {
    if (sort_by == 'count_down') {
        location.href = url + '&sort_by=count_up';
    } else {
        location.href = url + '&sort_by=count_down';
    }
    return false;
});
</script>
{% endblock %}
