{% extends "site.html" %}

{% block head %}
    {{ block.super }}
    <script>
        $(function () {
            let wo_task_id = 0;

            $("button[name^='btn-workorder-task-action-']").click(function (event) {
                wo_task_id = get_icon_button_value(event);
                $('#workorder-task-activity-rep-content').html('Loading workorder task activity report data...');
                $("#workorder-task-activity-rep").dialog("open");
            });

            $("#workorder-task-activity-rep").dialog({
                autoOpen: false,
                closeOnEscape: true,
                modal: true,
                draggable: false,
                position: {my: "center top", at: "center top", of: window},
                width: 1200,
                open: function (event, ui) {
                    $.ajax({
                        url: "{% url 'site:report-workorder-task-action' %}",
                        type: "POST",
                        data: {
                            csrfmiddlewaretoken: '{{csrf_token}}',
                            current_wo_task_id: wo_task_id
                        },
                        success: function (data, status, jqXHR) {
                            $('#workorder-task-activity-rep-content').html(data);
                        }
                    })
                },
                buttons: [
                    {
                        text: "Close",
                        "class": 'modal-dialog-button-right',
                        click: function () {
                            $(this).dialog("close");
                        }
                    }
                ]
            });
        });
    </script>
{% endblock %}

{% block pagehead %}
    {% include 'pagehead.html' %}
{% endblock %}

{% block content %}

<div>
    {% csrf_token %}
    <table id="printer-queue-table" class="table table-bordered">
        <thead style="position: sticky; top: 0;">
        <tr class="dosis-report-header">
            {% include 'report-table-header.html' %}
            <th><i class="icon-th-list"></i></th>
        </tr>
        </thead>
        <tbody>
            {% for print_job in report_list %}
                <tr>
                    {% if print_job.selected_key == 'wo' %}
                        <td><a href="{% url 'site:search-workorder-detail' print_job.primary_key %}">{{print_job.wo_task_id}}</a></td>
                    {% elif print_job.selected_key == 'can' %}
                        <td><a href="{% url 'site:search-canister-detail' print_job.primary_key %}">{{print_job.serial_number}}</a></td>
                    {% else %}
                        <td>{{print_job.primary_key}}</a></td>
                    {% endif %}
                    <td>{{print_job.printer}}</td>
                    <td>{{print_job.format}}</td>
                    <td>{{print_job.task_type}}</td>
                    <td>{{print_job.queue_type}}</td>
                    <td>{{print_job.dts_post|date:"m/d/Y h:i:s A"}}</td>
                    <td>{{print_job.dts_status|date:"m/d/Y h:i:s A"}}</td>
                    <td>{{print_job.status}}</td>
                    <td>{{print_job.cups_id}}</td>
                    <td>
                        {% if print_job.selected_key == 'wo' %}
                        <button class="btn btn-small btn-link" type="button"
                            id="btn-workorder-task-action-{{ print_job.wo_task_id }}"
                            name="btn-workorder-task-action-{{ print_job.wo_task_id }}"
                            value="{{ print_job.wo_task_id }}" title="Show Workorder Task Activity">
                        <i class="icon-file"></i></button>
                        {% endif %}
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
</div>

<div id="workorder-task-activity-rep" title="Workorder Task Actions" style="margin-left: 2px;">
    <div id="workorder-task-activity-rep-content">
        Loading workorder task activity report data...
    </div>
</div>

{% include 'pagenav.html' %}
{% endblock %}