Bug 30952: Staff interface redesign (header)
[koha.git] / koha-tmpl / intranet-tmpl / prog / en / modules / tools / problem-reports.tt
1 [% USE raw %]
2 [% USE Asset %]
3 [% USE Koha %]
4 [% USE KohaDates %]
5 [% SET footerjs = 1 %]
6 [% INCLUDE 'doc-head-open.inc' %]
7 <title>OPAC problem reports &rsaquo; Administration &rsaquo; Koha</title>
8 [% INCLUDE 'doc-head-close.inc' %]
9 </head>
10
11 <body id="tools_problem-reports" class="tools">
12
13 [% WRAPPER 'header.inc' %]
14     [% INCLUDE 'prefs-admin-search.inc' %]
15 [% END %]
16
17 [% WRAPPER 'sub-header.inc' %]
18 <nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumb">
19     <ol>
20         <li>
21             <a href="/cgi-bin/koha/mainpage.pl"><i class="fa fa-home"></i></a>
22         </li>
23         <li>
24             <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a>
25         </li>
26         <li>
27             <a href="#" aria-current="page">
28                 OPAC problem reports
29             </a>
30         </li>
31     </ol>
32 </nav>
33 [% END %]
34
35 <div class="main container-fluid">
36     <div class="row">
37         <div class="col-sm-10 col-sm-push-2">
38             <main>
39
40             <h1>OPAC problem reports</h1>
41
42             <div class="dialog alert" id="error" style="display:none;"></div>
43
44             [% IF ( selected_count ) %]
45                 <div class="dialog message">
46                     [% IF ( action == 'viewed' ) %]
47                         <span>[% selected_count | html %] problem report(s) marked as viewed.</span>
48                     [% ELSIF ( action == 'closed' ) %]
49                         <span>[% selected_count | html %] problem report(s) marked as closed.</span>
50                     [% ELSIF ( action == 'new' ) %]
51                         <span>[% selected_count | html %] problem report(s) marked as new.</span>
52                     [% ELSE %]
53                         <span>Failed to change the status of [% selected_count | html %] problem report(s).</span>
54                     [% END %]
55                 </div>
56             [% END %]
57
58             [% IF ( problem_reports.count ) %]
59                 <form id="mark_selected" method="post" action="/cgi-bin/koha/tools/problem-reports.pl">
60                     <div id="toolbar" class="btn-toolbar">
61                         <button type="submit" class="btn btn-default markviewed" name="mark_selected-viewed" value="viewed" disabled="disabled"><i class="fa fa-eye"></i> Mark viewed</button>
62                         <button type="submit" class="btn btn-default markclosed" name="mark_selected-closed" value="closed" disabled="disabled"><i class="fa fa-times-circle"></i> Mark closed</button>
63                         <button type="submit" class="btn btn-default marknew" name="mark_selected-new" value="new" disabled="disabled"><i class="fa fa-star"></i> Mark new</button>
64                     </div>
65
66                     <fieldset class="action" style="cursor:pointer;">
67                         <a class="SelectAll"><i class="fa fa-check"></i> Select all</a>
68                         | <a class="ClearAll"><i class="fa fa-remove"></i> Clear all</a>
69                         | <a class="HideViewed"><i class="fa fa-minus-square"></i> Hide viewed</a>
70                         | <a class="HideClosed"><i class="fa fa-minus-square"></i> Hide closed</a>
71                         | <a class="HideNew"><i class="fa fa-minus-square"></i> Hide new</a>
72                         | <a class="ShowAll"><i class="fa fa-bars"></i> Show all</a>
73                     </fieldset>
74
75                     <table id="problemreportstable">
76                         <thead>
77                             <tr>
78                                 <th class="NoSort">&nbsp;</th>
79                                 <th class="anti-the">Message</th>
80                                 <th>Problem page</th>
81                                 <th>Sent to</th>
82                                 <th>Created on</th>
83                                 <th>Set by</th>
84                                 <th>Status</th>
85                                 <th class="NoSort noExport">Actions</th>
86                             </tr>
87                         </thead>
88                         <tbody>
89                             [% FOREACH report IN problem_reports %]
90                                 <tr>
91                                     <td><input type="checkbox" name="report_ids" value="[% report.reportid | html %]"></td>
92                                     <td>
93                                         <strong>[% report.title | html %]</strong><br>
94                                         [% report.content | html %]
95                                     </td>
96                                     <td><a href="[% OPACBaseURL | url %][% report.problempage | url %]">[% OPACBaseURL | url %][% report.problempage | html %]</a></td>
97                                     <td>
98                                         [% SWITCH report.recipient %]
99                                         [% CASE 'admin' %]<span>Koha administrator</span>
100                                         [% CASE 'library' %]<span>A librarian</span>
101                                         [% END %]
102                                     </td>
103                                     <td data-order="[% report.created_on | html %]">[% report.created_on | $KohaDates with_hours => 1 %]</td>
104                                     <td>[% INCLUDE 'patron-title.inc' patron => report.patron hide_patron_infos_if_needed=1 %]</td>
105                                     <td class="status[% report.status | html %]" name="status">
106                                         <span id="status_[% report.reportid | html %]">
107                                             [% SWITCH report.status %]
108                                             [% CASE 'New' %]<span>New</span>
109                                             [% CASE 'Closed' %]<span>Closed</span>
110                                             [% CASE 'Viewed' %]<span>Viewed</span>
111                                             [% CASE %]<span>Unknown status ([% report.status | html %])</span>
112                                             [% END %]
113                                         </span>
114                                     </td>
115                                     <td class="actions">
116                                         [% IF ( report.status == 'New' ) %]
117                                             <button name="viewed" data-report_id="[% report.reportid | html %]" class="viewed btn btn-default btn-xs"><i class="fa fa-eye"></i> Mark viewed</button> <button name="closed" data-report_id="[% report.reportid | html %]" class="closed btn btn-default btn-xs"><i class="fa fa-times-circle"></i> Mark closed</button> <button name="new" disabled="disabled" data-report_id="[% report.reportid | html %]" class="new btn btn-default btn-xs"><i class="fa fa-star"></i> Mark new</button>
118                                         [% ELSIF ( report.status == 'Viewed' ) %]
119                                             <button name="viewed" disabled="disabled" data-report_id="[% report.reportid | html %]" class="viewed btn btn-default btn-xs"><i class="fa fa-eye"></i> Mark viewed</button> <button name="closed" data-report_id="[% report.reportid | html %]" class="closed btn btn-default btn-xs"><i class="fa fa-times-circle"></i> Mark closed</button> <button name="new" data-report_id="[% report.reportid | html %]" class="new btn btn-default btn-xs"><i class="fa fa-star"></i> Mark new</button>
120                                         [% ELSE %]
121                                             <button name="viewed" data-report_id="[% report.reportid | html %]" class="viewed btn btn-default btn-xs"><i class="fa fa-eye"></i> Mark viewed</button> <button name="closed" disabled="disabled" data-report_id="[% report.reportid | html %]" class="closed btn btn-default btn-xs"><i class="fa fa-times-circle"></i> Mark closed</button> <button name="new" data-report_id="[% report.reportid | html %]" class="new btn btn-default btn-xs"><i class="fa fa-star"></i> Mark new</button>
122                                         [% END %]
123                                     </td>
124                                 </tr>
125                             [% END %]
126                         </tbody>
127                     </table>
128
129                 </form>
130
131             [% ELSE %]
132                 <div class="dialog message">There are currently no problem reports.</div>
133             [% END %] <!-- problem reports -->
134
135             </main>
136         </div> <!-- /.col-sm-10.col-sm-push-2 -->
137
138         <div class="col-sm-2 col-sm-pull-10">
139             <aside>
140                 [% INCLUDE 'tools-menu.inc' %]
141             </aside>
142         </div> <!-- /.col-sm-2.col-sm-pull-10 -->
143
144     </div> <!-- /.row -->
145
146 [% MACRO jsinclude BLOCK %]
147     [% INCLUDE 'calendar.inc' %]
148     [% INCLUDE 'datatables.inc' %]
149     <script>
150         $(document).ready(function(){
151             $("#problemreportstable").dataTable($.extend(true, {}, dataTablesDefaults, {
152                 "order": [[ 1, "asc" ]],
153                 "aoColumnDefs": [
154                     { "orderable": false, "searchable": false, 'targets': [ 'NoSort' ] },
155                     { "type": "anti-the", "targets": [ "anti-the" ] }
156                 ],
157                 "pagingType": "full"
158             }));
159
160             $(".SelectAll").on("click", function(){
161                 $("input[name='report_ids'][type='checkbox']").prop("checked", true);
162                 $(".markviewed").prop("disabled", false);
163                 $(".markclosed").prop("disabled", false);
164                 $(".marknew").prop("disabled", false);
165             });
166
167             $(".ClearAll").on("click", function(){
168                 $("input[name='report_ids'][type='checkbox']").prop("checked", false);
169                 $(".markviewed").prop("disabled", true);
170                 $(".markclosed").prop("disabled", true);
171                 $(".marknew").prop("disabled", true);
172             });
173
174
175
176             $(".HideViewed").on("click", function(){
177                 $(".statusViewed").parent().hide();
178             });
179
180             $(".HideClosed").on("click", function(){
181                 $(".statusClosed").parent().hide();
182             });
183
184             $(".HideNew").on("click", function(){
185                 $(".statusNew").parent().hide();
186             });
187
188             $(".ShowAll").on("click", function(){
189                 $("tr").show();
190             });
191
192             $("#error").hide();
193
194             $("#problemreportstable").on("change", "input[type='checkbox']", function(){
195                 if ( $("input[type='checkbox']").is(":checked") ) {
196                     $(".markviewed").prop("disabled", false);
197                     $(".markclosed").prop("disabled", false);
198                     $(".marknew").prop("disabled", false);
199                 } else {
200                     $(".markviewed").prop("disabled", true);
201                     $(".markclosed").prop("disabled", true);
202                     $(".marknew").prop("disabled", true);
203                 }
204             });
205
206             $("#problemreportstable").on("click", "button.viewed, button.closed, button.new", function(event){
207                 event.preventDefault(); // prevent form submission
208                 var $action = $(this).attr("name");
209                 var $report_id = $(this).data('report_id');
210                 var ajaxData = {
211                     'action': $action,
212                     'report_id': $report_id,
213                 };
214
215                 $.ajax({
216                     url: '/cgi-bin/koha/svc/problem_reports/',
217                     type: 'POST',
218                     dataType: 'json',
219                     data: ajaxData,
220                 })
221
222                 .done(function(data){
223                     if (data.status == 'success'){
224                         if ( $action == 'viewed' ){
225                             $("#status_" + $report_id).text(_("Viewed"));
226                             $(event.target).parent().siblings("[name='status']").removeClass().addClass("statusViewed");
227                             $(event.target).siblings(".closed").prop("disabled", false);
228                             $(event.target).siblings(".new").prop("disabled", false);
229                             $(event.target).prop("disabled", true);
230                         } else if ( $action == 'new' ){
231                             $("#status_" + $report_id).text(_("New"));
232                             $(event.target).parent().siblings("[name='status']").removeClass().addClass("statusNew");
233                             $(event.target).siblings(".closed").prop("disabled", false);
234                             $(event.target).siblings(".viewed").prop("disabled", false);
235                             $(event.target).prop("disabled", true);
236                         } else {
237                             $("#status_" + $report_id).text(_("Closed"));
238                             $(event.target).parent().siblings("[name='status']").removeClass().addClass("statusClosed");
239                             $(event.target).siblings(".viewed").prop("disabled", false);
240                             $(event.target).siblings(".new").prop("disabled", false);
241                             $(event.target).prop("disabled", true);
242                         }
243                     } else {
244                         $("#error").text(_("Unable to change status of problem report."));
245                         $("#error").show();
246                     }
247                 })
248                 .error(function(data){
249                     $("#error").text(_("Unable to change status of problem report."));
250                     $("#error").show();
251                 });
252             });
253         });
254     </script>
255 [% END %]
256
257 [% INCLUDE 'intranet-bottom.inc' %]