71208264a91ae92af19bc2dae061e780664524df
[qcg-portal.git] / qcg / templates / qcg / jobs.html
1 {% extends 'qcg/base.html' %}
2 {% load staticfiles bootstrap3 query_string qcg_utils %}
3
4 {% block extra_css %}
5     <link href="{% static 'qcg/treegrid/css/jquery.treegrid.css' %}" rel="stylesheet">
6     <link href="{% static 'qcg/daterangepicker/daterangepicker-bs3.css' %}" rel="stylesheet" />
7 {% endblock %}
8
9 {% block extra_js %}
10     <script src="{% static 'qcg/treegrid/js/jquery.treegrid.js' %}"></script>
11     <script src="{% static 'qcg/moment/moment.min.js' %}"></script>
12     <script src="{% static 'qcg/daterangepicker/daterangepicker.js' %}"></script>
13     <script src="{% static 'qcg/cookie/jquery.cookie.min.js' %}"></script>
14
15     <script>
16         $(function() {
17             $('.tree').treegrid({
18                 initialState: 'collapsed',
19                 expanderExpandedClass: 'glyphicon glyphicon-chevron-down small',
20                 expanderCollapsedClass: 'glyphicon glyphicon-chevron-right small',
21                 onChange: function() {
22                     $(this).find('.glyphicon-folder-open,.glyphicon-folder-close')
23                             .toggleClass('glyphicon-folder-open').toggleClass('glyphicon-folder-close');
24                 }
25             });
26
27             $('input[name="submission"],input[name="finish"]').daterangepicker({
28                 opens: 'center',
29                 format: 'DD.MM.YYYY',
30                 ranges: {
31                     'Dzisiaj': [moment(), moment()],
32                     'Wczoraj': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
33                     'Ostatnie 7 dni': [moment().subtract(6, 'days'), moment()],
34                     'Ostatnie 30 dni': [moment().subtract(29, 'days'), moment()]
35                 },
36                 locale: {
37                     applyLabel: 'OK',
38                     cancelLabel: 'Anuluj',
39                     fromLabel: 'Od',
40                     toLabel: 'Do',
41                     weekLabel: 'T',
42                     customRangeLabel: 'Zakres',
43                     daysOfWeek: moment.weekdaysMin(),
44                     monthNames: ['Sty', 'Lut', 'Mar', 'Kwi', 'Maj', 'Cze', 'Lip', 'Sie', 'Wrz', 'Paź', 'Lis', 'Gru'],
45                     firstDay: 1
46                 }
47             });
48
49             $('#select-all-columns').click(function() {
50                 $('#id_columns').find('.checkbox input').prop('checked', true);
51             });
52
53             $('#default-columns').click(function() {
54                 $('#select-all-columns').click();
55                 $('#id_columns_0').prop('checked', false);
56             });
57
58             $('#columns-form').submit(function(e) {
59                 e.preventDefault();
60                 $.cookie.raw = true;
61                 $.cookie('columns', $(this).serialize(), {path: location.pathname});
62                 location.reload();
63             });
64         });
65     </script>
66 {% endblock %}
67
68 {% block container %}
69     <form action="." class="pull-right">
70         {% get_params_as_hidden 'host' 'submission' 'finish' %}
71         <div class="btn-toolbar" role="toolbar">
72             <div class="btn-group" role="group">
73                 <div class="input-group">
74                     <input type="search" name="keywords" value="{{ filters.keywords.value|default:'' }}"
75                            maxlength="500" class="form-control" placeholder="Wyszukaj frazę">
76                     <span class="input-group-btn">
77                         <button class="btn btn-default" type="submit" title="Szukaj">
78                             <span class="glyphicon glyphicon-search"></span>
79                         </button>
80                     </span>
81                 </div>
82             </div>
83             <div class="btn-group" data-toggle="buttons">
84                 <label class="btn btn-default{% if checked_status.0 %} active{% endif %}" title="Aktywne">
85                     <input name="status" value="0" type="checkbox" {% if checked_status.0 %}checked{% endif %} onchange="this.form.submit()">
86                     <span class="glyphicon glyphicon-hourglass" aria-hidden="true"></span>
87                 </label>
88                 <label class="btn btn-default{% if checked_status.1 %} active{% endif %}" title="Zakończone">
89                     <input name="status" value="1" type="checkbox" {% if checked_status.1 %}checked{% endif %} onchange="this.form.submit()">
90                     <span class="glyphicon glyphicon-saved" aria-hidden="true"></span>
91                 </label>
92                 <label class="btn btn-default{% if checked_status.2 %} active{% endif %}" title="Niepowodzenia">
93                     <input name="status" value="2" type="checkbox" {% if checked_status.2 %}checked{% endif %} onchange="this.form.submit()">
94                     <span class="glyphicon glyphicon-alert" aria-hidden="true"></span>
95                 </label>
96             </div>
97             <div class="btn-group" role="group">
98                 <a href="#advanced" data-toggle="modal" class="btn btn-default" title="Filtry zaawansowane">
99                     <span class="glyphicon glyphicon-option-horizontal"></span>
100                 </a>
101             </div>
102             <div class="btn-group" role="group">
103                 <a href="#columns" data-toggle="modal" class="btn btn-default" title="Kolumny">
104                     <span class="glyphicon glyphicon-list"></span>
105                 </a>
106             </div>
107         </div>
108     </form>
109
110     <h1 class="page-header">
111         {% block title %}Lista zadań{% endblock %}
112     </h1>
113
114     {% if selected_filters %}
115         <div class="row">
116             <div class="col-md-offset-1 col-md-10">
117                 <a href="." class="pull-right"><span class="text-muted small">Wyczyść wszystkie filtry</span></a>
118                 <strong>Wybrane filtry:</strong>
119                 {% for label, param, val in selected_filters %}
120                     <span class="label label-primary">{{ label }}&nbsp;<a href=".{% query_string param-=val %}" style="color: white"><span class="glyphicon glyphicon-remove"></span></a></span>
121                 {% endfor %}
122             </div>
123         </div>
124
125         <hr>
126     {% endif %}
127
128     <nav class="text-center" style="margin-bottom: 15px">
129         <form action="." method="get" class="form-inline" role="form" style="display: inline-block">
130             <div class="input-group input-group-sm">
131                 <span class="input-group-btn">
132                     {% if page.has_previous %}
133                         <a href="{% query_string "page"=page.previous_page_number %}" class="btn btn-default">
134                     {% else %}
135                         <a href="#" class="btn btn-default disabled">
136                     {% endif %}
137                         <span class="glyphicon glyphicon-chevron-left"></span>
138                     </a>
139                 </span>
140                 <label class="sr-only" for="page">Strona</label>
141                 <input type="text" class="form-control text-center" id="page" name="page" value="{{ page.number }}" style="width: 50px">
142                 <span class="input-group-btn">
143                     {% if page.has_next %}
144                         <a href="{% query_string "page"=page.next_page_number %}" class="btn btn-default">
145                     {% else %}
146                         <a href="#" class="btn btn-default disabled">
147                     {% endif %}
148                         <span class="glyphicon glyphicon-chevron-right"></span>
149                     </a>
150                 </span>
151             </div>
152         </form>
153         &nbsp;z&nbsp;
154         <a href="{% query_string "page"=num_pages %}">{{ num_pages }}</a>
155     </nav>
156
157     <table class="table table-hover tree">
158         <thead>
159             <tr>
160                 <th{% if columns.JOB_ID not in displayed %} style="width: 80px"{% endif %}></th>
161                 {% if columns.DESCRIPTION in displayed %}<th>Opis</th>{% endif %}
162                 {% if columns.SUBMISSION in displayed %}<th>Wysłane</th>{% endif %}
163                 {% if columns.START in displayed %}<th>Start</th>{% endif %}
164                 {% if columns.END in displayed %}<th>Koniec</th>{% endif %}
165                 {% if columns.STATUS in displayed %}<th>Status</th>{% endif %}
166                 {% if columns.HOST in displayed %}<th>Host</th>{% endif %}
167                 <th></th>
168 {#                <th>Uwagi</th>#}
169             </tr>
170         </thead>
171         <tbody>
172             {% regroup page by job as jobs %}
173
174             {% for job in jobs %}
175                 {% ifequal job.list|length 1 %}
176                     {% with job.list.0 as task %}
177                         <tr class="treegrid-{{ forloop.counter }}">
178                             <td>
179                                 <a href="{{ task.get_absolute_url }}">
180                                     <span class="glyphicon glyphicon-file" aria-hidden="true"></span>
181                                     {% if columns.JOB_ID in displayed %}{{ task }}{% endif %}
182                                 </a>
183                             </td>
184                             {% if columns.DESCRIPTION in displayed %}<td>{{ task.note }}</td>{% endif %}
185                             {% if columns.SUBMISSION in displayed %}<td>{{ task.submission_time|date:"CUSTOM_DATETIME_FORMAT" }}</td>{% endif %}
186                             {% if columns.START in displayed %}<td>{{ task.start_time|date:"CUSTOM_DATETIME_FORMAT" }}</td>{% endif %}
187                             {% if columns.END in displayed %}<td>{{ task.finish_time|date:"CUSTOM_DATETIME_FORMAT" }}</td>{% endif %}
188                             {% if columns.STATUS in displayed %}<td>{{ task.get_status_display }}</td>{% endif %}
189                             {% if columns.HOST in displayed %}<td>{{ task.short_host_names|join:', ' }}</td>{% endif %}
190                             <td><a href="{{ task.get_absolute_url }}">szczegóły&nbsp;&rsaquo;</a></td>
191                         </tr>
192                     {% endwith %}
193                 {% else %}
194                     <tr class="treegrid-{{ forloop.counter }}">
195                         <td>
196                             <a href="{{ job.grouper.get_absolute_url }}">
197                                 <span class="glyphicon glyphicon-folder-close" aria-hidden="true"></span>
198                                 {% if columns.JOB_ID in displayed %}{{ job.grouper }}{% endif %}
199                             </a>
200                         </td>
201                         {% if columns.DESCRIPTION in displayed %}<td>{{ job.grouper.note }}</td>{% endif %}
202                         {% if columns.SUBMISSION in displayed %}<td>{{ job.grouper.submission_time|date:"CUSTOM_DATETIME_FORMAT" }}</td>{% endif %}
203                         {% if columns.START in displayed %}<td>-</td>{% endif %}
204                         {% if columns.END in displayed %}<td>{{ job.grouper.finish_time|date:"CUSTOM_DATETIME_FORMAT" }}</td>{% endif %}
205                         {% if columns.STATUS in displayed %}<td>{{ job.grouper.get_status_display }}</td>{% endif %}
206                         {% if columns.HOST in displayed %}<td>-</td>{% endif %}
207                         <td><a href="{{ job.grouper.get_absolute_url }}">szczegóły&nbsp;&rsaquo;</a></td>
208                     </tr>
209
210                     {% for task in job.list %}
211                         <tr class="treegrid-{{ forloop.parentloop.counter }}-{{ forloop.counter }} treegrid-parent-{{ forloop.parentloop.counter }}">
212                             <td>
213                                 <a href="{{ task.get_absolute_url }}">
214                                     <span class="glyphicon glyphicon-file" aria-hidden="true"></span>
215                                     {% if columns.JOB_ID in displayed %}{{ task }}{% endif %}
216                                 </a>
217                             </td>
218                             {% if columns.DESCRIPTION in displayed %}<td>{{ task.note }}</td>{% endif %}
219                             {% if columns.SUBMISSION in displayed %}<td>{{ task.submission_time|date:"CUSTOM_DATETIME_FORMAT" }}</td>{% endif %}
220                             {% if columns.START in displayed %}<td>{{ task.start_time|date:"CUSTOM_DATETIME_FORMAT" }}</td>{% endif %}
221                             {% if columns.END in displayed %}<td>{{ task.finish_time|date:"CUSTOM_DATETIME_FORMAT" }}</td>{% endif %}
222                             {% if columns.STATUS in displayed %}<td>{{ task.get_status_display }}</td>{% endif %}
223                             {% if columns.HOST in displayed %}<td>{{ task.short_host_names|join:', ' }}</td>{% endif %}
224                             <td><a href="{{ task.get_absolute_url }}">szczegóły&nbsp;&rsaquo;</a></td>
225                         </tr>
226                     {% endfor %}
227                 {% endifequal %}
228             {% endfor %}
229         </tbody>
230     </table>
231
232     {% if not page %}
233         <div class="alert alert-info">
234             <span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>
235             Brak zadań spełniających wybrane kryteria
236         </div>
237     {% endif %}
238
239     <nav class="text-center">
240         <ul class="pagination">
241             {% if page.has_previous %}
242                 <li>
243                     <a href="{% query_string "page"=page.previous_page_number %}" aria-label="Previous">
244                     <span aria-hidden="true"><span class="glyphicon glyphicon-chevron-left"></span>&nbsp;poprzednia</span>
245                 </a>
246             {% endif %}
247             </li>
248
249             <li{% ifequal page.number 1 %} class="active"{% endifequal %}>
250                 <a href="{% query_string "page"=1 %}">1</a>
251             </li>
252
253             {% if pages_range.0 > 2 %}
254                 <li class="disabled"><span aria-hidden="true"><strong>&hellip;</strong></span></li>
255             {% endif %}
256
257             {% for num in pages_range %}
258                 <li{% ifequal page.number num %} class="active"{% endifequal %}>
259                     <a href="{% query_string "page"=num %}">{{ num }}</a>
260                 </li>
261             {% endfor %}
262
263             <li class="disabled"><span aria-hidden="true"><strong>z</strong></span></li>
264             <li><a href="{% query_string "page"=num_pages %}">{{ num_pages }}</a></li>
265
266             {% if page.has_next %}
267                 <li>
268                     <a href="{% query_string "page"=page.next_page_number %}" aria-label="Next">
269                     <span aria-hidden="true">następna&nbsp;<span class="glyphicon glyphicon-chevron-right"></span></span>
270                 </a>
271             {% endif %}
272             </li>
273         </ul>
274     </nav>
275
276     <!-- Modal -->
277     <div class="modal fade" id="advanced" tabindex="-1" role="dialog" aria-labelledby="modal-label" aria-hidden="true">
278         <div class="modal-dialog modal-lg">
279             <div class="modal-content">
280                 <div class="modal-header">
281                     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
282                     <h4 class="modal-title" id="modal-label">Filtry zaawansowane</h4>
283                 </div>
284                 <div class="modal-body">
285                     <form id="advanced-form" action="." class="form-horizontal">
286                         {% bootstrap_field filters.keywords layout='horizontal' bound_css_class=' ' %}
287                         <div class="form-group">
288                             <label class="col-sm-3 col-md-4 control-label">Status</label>
289                             <div class="col-sm-9 col-md-6">
290                                 <div class="btn-group" data-toggle="buttons">
291                                     {% for choice in filters.status %}
292                                         <label class="btn btn-default{% if choice.is_checked %} active{% endif %}">
293                                             <input type="checkbox" name="{{ choice.name }}" value="{{ choice.choice_value }}"
294                                                    {% if choice.is_checked %}checked{% endif %}> {{ choice.choice_label }}
295                                         </label>
296                                     {% endfor %}
297                                 </div>
298                             </div>
299                         </div>
300
301                         <div class="form-group">
302                             <label class="col-sm-3 col-md-4 control-label">Host</label>
303                             <div class="col-sm-9 col-md-6">
304                                 <div class="btn-group" data-toggle="buttons">
305                                     {% for choice in filters.host %}
306                                         <label class="btn btn-default{% if choice.is_checked %} active{% endif %}">
307                                             <input type="checkbox" name="{{ choice.name }}" value="{{ choice.choice_value }}"
308                                                    {% if choice.is_checked %}checked{% endif %}> {{ choice.choice_label }}
309                                         </label>
310                                     {% endfor %}
311                                 </div>
312                             </div>
313                         </div>
314                         {% bootstrap_field filters.submission layout='horizontal' bound_css_class=' ' %}
315                         {% bootstrap_field filters.finish layout='horizontal' bound_css_class=' ' %}
316                     </form>
317                 </div>
318                 <div class="modal-footer">
319                     <button type="button" class="btn btn-default" data-dismiss="modal">Anuluj</button>
320                     <a href="." class="btn btn-warning">Wyczyść filtry</a>
321                     <button type="submit" class="btn btn-primary" form="advanced-form">Filtruj</button>
322                 </div>
323             </div>
324         </div>
325     </div>
326
327     {# Column selection modal #}
328     <div class="modal fade" id="columns" tabindex="-1" role="dialog" aria-labelledby="modal-label" aria-hidden="true">
329         <div class="modal-dialog">
330             <div class="modal-content">
331                 <div class="modal-header">
332                     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
333                     <h4 class="modal-title" id="modal-label">Wybór kolumn</h4>
334                 </div>
335                 <div class="modal-body">
336                     <form id="columns-form" action=".">
337                         {% bootstrap_field columns.columns %}
338                     </form>
339                 </div>
340                 <div class="modal-footer">
341                     <button type="button" class="btn btn-default" data-dismiss="modal">Anuluj</button>
342                     <a id="select-all-columns" class="btn btn-success">Wybierz wszystkie</a>
343                     <a id="default-columns" class="btn btn-warning">Domyślne</a>
344                     <button type="submit" class="btn btn-primary" form="columns-form">Zapisz</button>
345                 </div>
346             </div>
347         </div>
348     </div>
349
350 {% endblock container %}