jumpserver/apps/ops/templates/ops/task_list.html

{% extends '_base_list.html' %}
{% load i18n %}
{% load static %}
{% block content_left_head %}
    <link href="{% static 'css/plugins/datepicker/datepicker3.css' %}" rel="stylesheet">
{% endblock %}


{% block table_search %}
    <form id="search_form" method="get" action="" class="pull-right form-inline">
        <div class="form-group" id="date">
            <div class="input-daterange input-group" id="datepicker">
                <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                <input type="text" class="input-sm form-control" style="width: 100px;" name="date_from" value="{{ date_from|date:'Y-m-d' }}">
                <span class="input-group-addon">to</span>
                <input type="text" class="input-sm form-control" style="width: 100px;" name="date_to" value="{{ date_to|date:'Y-m-d' }}">
            </div>
        </div>
        <div class="input-group">
            <input type="text" class="form-control input-sm" name="keyword" placeholder="{% trans 'Search'  %}" value="{{ keyword }}">
        </div>
        <div class="input-group">
            <div class="input-group-btn">
                <button id='search_btn' type="submit" class="btn btn-sm btn-primary">
                    {% trans "Search"  %}
                </button>
            </div>
        </div>
    </form>
{% endblock %}

{% block table_head %}
    <th class="text-center"></th>
    <th class="text-center">{% trans 'Name' %}</th>
    <th class="text-center">{% trans 'Run times' %}</th>
    <th class="text-center">{% trans 'Versions' %}</th>
    <th class="text-center">{% trans 'Hosts' %}</th>
    <th class="text-center">{% trans 'Success' %}</th>
    <th class="text-center">{% trans 'Date' %}</th>
    <th class="text-center">{% trans 'Time' %}</th>
    <th class="text-center">{% trans 'Action' %}</th>
{% endblock %}

{% block table_body %}
    {% for object in task_list %}
        <tr class="gradeX">
            <td class="text-center"><input type="checkbox" class="cbx-term"> </td>
            <td class="text-left"><a href="{% url 'ops:task-detail' pk=object.id %}">{{ object.name }}</a></td>
            <td class="text-center">
                <span class="text-danger">{{ object.history_summary.failed }}</span>/<span class="text-navy">{{ object.history_summary.success}}</span>/{{ object.history_summary.total}}
            </td>
            <td class="text-center">{{ object.adhoc.all | length}}</td>
            <td class="text-center">{{ object.latest_adhoc.hosts | length}}</td>
            <td class="text-center">
            {% if object.latest_history %}
                {% if object.latest_history.is_success %}
                    <i class="fa fa-check text-navy"></i>
                {% else %}
                    <i class="fa fa-times text-danger"></i>
                {% endif %}
            {% endif %}
            </td>
            <td class="text-center">{{ object.latest_history.date_start }}</td>
            <td class="text-center">
                {% if object.latest_history %}
                {{ object.latest_history.timedelta|floatformat }} s
                {% endif %}
            </td>
            <td class="text-center">
                <a data-uid="{{ object.id }}" class="btn btn-xs btn-primary btn-run">{% trans "Run" %}</a>
                <a data-uid="{{ object.id }}" class="btn btn-xs btn-danger btn-del">{% trans "Delete" %}</a>
            </td>
        </tr>
    {% endfor %}
{% endblock %}

{% block custom_foot_js %}
<script src="{% static 'js/plugins/datepicker/bootstrap-datepicker.js' %}"></script>
<script>
$(document).ready(function() {
    $('table').DataTable({
        "searching": false,
        "paging": false,
        "bInfo" : false,
        "order": []
    });
    $('.select2').select2({
        dropdownAutoWidth : true,
        width: 'auto'
    });
    $('#date .input-daterange').datepicker({
        format: "yyyy-mm-dd",
        todayBtn: "linked",
        keyboardNavigation: false,
        forceParse: false,
        calendarWeeks: true,
        autoclose: true
    });

}).on('click', '.btn-del', function () {
    var $this = $(this);
    var name = $this.closest("tr").find(":nth-child(2)").children('a').html();
    var uid = $this.data('uid');
    var the_url = '{% url "api-ops:task-detail" pk=DEFAULT_PK %}'.replace('{{ DEFAULT_PK }}', uid);
    objectDelete($this, name, the_url);
}).on('click', '.btn-run', function () {
    var $this = $(this);
    var name = $this.closest("tr").find(":nth-child(2)").children('a').html();
    var uid = $this.data('uid');
    var the_url = '{% url "api-ops:task-run" pk=DEFAULT_PK %}'.replace('{{ DEFAULT_PK }}', uid);
    var error = function (data) {
        alert(data)
    };
    var success = function () {
        setTimeout(function () {
            console.log("ok")
        }, 1000);
        window.location = "{% url 'ops:task-detail' pk=DEFAULT_PK %}".replace('{{ DEFAULT_PK }}', uid);
    };
    APIUpdateAttr({
        url: the_url,
        error: error,
        method: 'GET',
        success: success,
        success_message: "{% trans 'Task start: ' %}" + " " + name
    });

})
</script>
{% endblock %}