koha-tmpl/intranet-tmpl/prog/en/modules/cataloguing/concerns.tt

   1 [% USE raw %]
   2 [% USE Asset %]
   3 [% SET footerjs = 1 %]
   4 [% USE TablesSettings %]
   5 [% INCLUDE 'doc-head-open.inc' %]
   6 <title>
   7     Catalog concerns &rsaquo; Tools &rsaquo; Koha
   8 </title>
   9 [% INCLUDE 'doc-head-close.inc' %]
  10 </head>
  11
  12 <body id="cat_concerns" class="cat">
  13     [% INCLUDE 'header.inc' %]
  14     [% INCLUDE 'cataloging-search.inc' %]
  15
  16     <nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumb">
  17         <ol>
  18             <li>
  19                 <a href="/cgi-bin/koha/mainpage.pl">Home</a>
  20             </li>
  21             <li>
  22                 <a href="/cgi-bin/koha/cataloguing/cataloging-home.pl">Cataloging</a>
  23             </li>
  24             <li>
  25                 <a href="#" aria-current="page">
  26                     Catalog concerns
  27                 </a>
  28             </li>
  29         </ol>
  30     </nav>
  31
  32     <div class="main container-fluid">
  33         <div class="row">
  34             <div class="col-sm-10 col-sm-push-2">
  35                 <main>
  36                     <h1>Concerns</h1>
  37
  38                     <div class="page-section">
  39                         <fieldset class="action" style="cursor:pointer;">
  40                             <a id="hideResolved"><i class="fa fa-minus-square"></i> Hide resolved</a>
  41                             | <a id="showAll"><i class="fa fa-bars"></i> Show all</a>
  42                         </fieldset>
  43
  44                         <table id="table_concerns">
  45                             <thead>
  46                                 <tr>
  47                                     <th>Reported</th>
  48                                     <th>Details</th>
  49                                     <th>Title</th>
  50                                     <th>Status</th>
  51                                     <th data-class-name="actions noExport">Actions</th>
  52                                 </tr>
  53                             </thead>
  54                         </table>
  55                     </div>
  56                 </main>
  57             </div> <!-- /.col-sm-10.col-sm-push-2 -->
  58
  59             <div class="col-sm-2 col-sm-pull-10">
  60                 <aside>
  61                     [% INCLUDE 'cat-menu.inc' %]
  62                 </aside>
  63             </div> <!-- /.col-sm-2.col-sm-pull-10 -->
  64         </div> <!-- /.row -->
  65
  66         <!-- Display updates concern modal -->
  67         <div class="modal" id="ticketDetailsModal" tabindex="-1" role="dialog" aria-labelledby="ticketDetailsLabel">
  68             <div class="modal-dialog modal-lg" role="document">
  69                 <div class="modal-content">
  70                     <div class="modal-header">
  71                         <button type="button" class="closebtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
  72                         <h4 class="modal-title" id="displayUpdateLabel">Ticket details</h4>
  73                     </div>
  74                     <div class="modal-body">
  75                         <div id="concern-details"></div>
  76                         <fieldset class="rows">
  77                             <ol>
  78                                 <li>
  79                                     <label for="message">Update: </label>
  80                                     <textarea id="update_message" name="message"></textarea>
  81                                 </li>
  82                                 <li>
  83                                     <label for="public">Notify: </label>
  84                                     <input type="checkbox" name="public" id="public">
  85                                 </li>
  86                             </ol>
  87                         </fieldset>
  88                     </div> <!-- /.modal-body -->
  89                     <div class="modal-footer">
  90                         <input type="hidden" name="ticket_id" id="ticket_id">
  91                         <button type="button" class="btn btn-default" id="resolveTicket">Resolve</button>
  92                         <button type="submit" class="btn btn-primary" id="updateTicket">Comment</button>
  93                     </div> <!-- /.modal-footer -->
  94                 </div> <!-- /.modal-content -->
  95             </div> <!-- /.modal-dialog -->
  96         </div> <!-- /#displayUpdateModal -->
  97
  98 [% MACRO jsinclude BLOCK %]
  99     [% INCLUDE 'datatables.inc' %]
 100     [% INCLUDE 'columns_settings.inc' %]
 101     [% INCLUDE 'js-date-format.inc' %]
 102     [% INCLUDE 'js-patron-format.inc' %]
 103     [% INCLUDE 'js-biblio-format.inc' %]
 104     <script>
 105         $(document).ready(function() {
 106
 107             var logged_in_user_borrowernumber = "[% logged_in_user.borrowernumber | html %]";
 108
 109             var table_settings = [% TablesSettings.GetTableSettings('cataloguing', 'concerns', 'table_concerns', 'json') | $raw %];
 110
 111             var tickets_url = '/api/v1/tickets';
 112             var tickets = $("#table_concerns").kohaTable({
 113                 "ajax": {
 114                     "url": tickets_url
 115                 },
 116                 "embed": [
 117                     "reporter",
 118                     "resolver",
 119                     "biblio",
 120                     "updates+count",
 121                 ],
 122                 'emptyTable': '<div class="dialog message">' + _("Congratulations, there are no catalog concerns.") + '</div>',
 123                 "columnDefs": [{
 124                     "targets": [0, 1, 2, 3],
 125                     "render": function(data, type, row, meta) {
 126                         if (type == 'display') {
 127                             if (data != null) {
 128                                 return data.escapeHtml();
 129                             } else {
 130                                 return "";
 131                             }
 132                         }
 133                         return data;
 134                     }
 135                 }],
 136                 "columns": [{
 137                         "data": "reported_date:reporter.firstname",
 138                         "render": function(data, type, row, meta) {
 139                             let reported = '<span class="date clearfix">' + $datetime(row.reported_date) + '</span>';
 140                             reported += '<span class="reporter clearfix">' + $patron_to_html(row.reporter, {
 141                                 display_cardnumber: false,
 142                                 url: true
 143                             }) + '</span>';
 144                             return reported;
 145                         },
 146                         "searchable": true,
 147                         "orderable": true
 148                     },
 149                     {
 150                         "data": "title:body",
 151                         "render": function(data, type, row, meta) {
 152                             let result = '<a role="button" href="#" data-toggle="modal" data-target="#ticketDetailsModal" data-concern="' + encodeURIComponent(row.ticket_id) + '">' + row.title + '</a>';
 153                             if (row.updates_count) {
 154                                 result += '<span class="pull-right"><a role="button" href="#" data-toggle="modal" data-target="#ticketDetailsModal" data-concern="' + encodeURIComponent(row.ticket_id) + '"><i class="fa fa-comment" aria-hidden="true"></i> ' + row.updates_count + '</a></span>';
 155                             }
 156                             result += '<div id="detail_' + row.ticket_id + '" class="hidden">' + row.body + '</div>';
 157                             return result;
 158                         },
 159                         "searchable": true,
 160                         "orderable": true
 161                     },
 162                     {
 163                         "data": "biblio.title",
 164                         "render": function(data, type, row, meta) {
 165                             return $biblio_to_html(row.biblio, {
 166                                 link: 1
 167                             });
 168                         },
 169                         "searchable": true,
 170                         "orderable": true
 171                     },
 172                     {
 173                         "data": "resolver.firstname:resolver.surname:resolved_date",
 174                         "render": function(data, type, row, meta) {
 175                             let result = '';
 176                             if (row.resolved_date) {
 177                                 result += _("Resolved by:") + ' <span>' + $patron_to_html(row.resolver, {
 178                                     display_cardnumber: false,
 179                                     url: true
 180                                 }) + '</span>';
 181                                 result += '<span class="clearfix">' + $datetime(row.resolved_date) + '</span>';
 182                             } else {
 183                                 result += _("Open");
 184                             }
 185                             return result;
 186                         },
 187                         "searchable": true,
 188                         "orderable": true
 189                     },
 190                     {
 191                         "data": function(row, type, val, meta) {
 192                             let result = '<a class="btn btn-default btn-xs" role="button" href="#" data-toggle="modal" data-target="#ticketDetailsModal" data-concern="' + encodeURIComponent(row.ticket_id) + '"><i class="fa fa-eye" aria-hidden="true"></i> ' + _("Details") + '</a>';
 193                             return result;
 194                         },
 195                         "searchable": false,
 196                         "orderable": false
 197                     },
 198                 ]
 199             }, table_settings, 1);
 200
 201             $('#hideResolved').on("click", function() {
 202                 // It would be great if we could pass null here but it gets stringified
 203                 tickets.DataTable().columns('3').search('special:undefined').draw();
 204             });
 205
 206             $('#showAll').on("click", function() {
 207                 tickets.DataTable().columns('3').search('').draw();
 208             });
 209
 210             $('#ticketDetailsModal').on('show.bs.modal', function(event) {
 211                 let modal = $(this);
 212                 let button = $(event.relatedTarget);
 213                 let ticket_id = button.data('concern');
 214                 modal.find('.modal-footer input').val(ticket_id);
 215
 216                 let detail = $('#detail_' + ticket_id).text();
 217
 218                 let display = '<div class="list-group">';
 219                 display += '<div class="list-group-item">';
 220                 display += '<span class="wrapfix">' + detail + '</span>';
 221                 display += '</div>';
 222                 display += '<div id="concern-updates" class="list-group-item">';
 223                 display += '<span>Loading updates . . .</span>';
 224                 display += '</div>';
 225                 display += '</div>';
 226
 227                 let details = modal.find('#concern-details');
 228                 details.html(display);
 229
 230                 $.ajax({
 231                     url: "/api/v1/tickets/" + ticket_id + "/updates",
 232                     method: "GET",
 233                     headers: {
 234                         "x-koha-embed": "user"
 235                     },
 236                 }).success(function(data) {
 237                     let updates_display = $('#concern-updates');
 238                     let updates = '';
 239                     data.forEach(function(item, index) {
 240                         updates += '<div class="list-group-item">';
 241                         updates += '<span class="wrapfix">' + item.message + '</span>';
 242                         updates += '<span class="clearfix">' + $patron_to_html(item.user, {
 243                             display_cardnumber: false,
 244                             url: true
 245                         }) + ' (' + $datetime(item.date) + ')</span>';
 246                         updates += '</div>';
 247                     });
 248                     updates_display.html(updates);
 249                 }).error(function() {
 250
 251                 });
 252             });
 253
 254             $('#ticketDetailsModal').on('click', '#updateTicket', function(e) {
 255                 let ticket_id = $('#ticket_id').val();
 256                 let params = {
 257                     'public': $('#public').is(":checked"),
 258                     message: $('#update_message').val(),
 259                     user_id: logged_in_user_borrowernumber
 260                 };
 261
 262                 $.ajax({
 263                     url: "/api/v1/tickets/" + ticket_id + "/updates",
 264                     method: "POST",
 265                     data: JSON.stringify(params),
 266                     ontentType: "application/json; charset=utf-8"
 267                 }).success(function() {
 268                     $("#ticketDetailsModal").modal('hide');
 269                     tickets.DataTable().ajax.reload(function(data) {
 270                         $("#concern_action_result_dialog").hide();
 271                         $("#concern_delete_success").html(_("Concern #%s updated successfully.").format(ticket_id)).show();
 272                     });
 273                 }).error(function() {
 274                     $("#concern_update_error").html(_("Error resolving concern #%s. Check the logs.").format(ticket_id)).show();
 275                 });
 276             });
 277
 278             $('#ticketDetailsModal').on('click', '#resolveTicket', function(e) {
 279                 let ticket_id = $('#ticket_id').val();
 280                 let params = {
 281                     'public': $('#public').is(":checked"),
 282                     message: $('#update_message').val(),
 283                     user_id: logged_in_user_borrowernumber,
 284                     state: 'resolved'
 285                 };
 286
 287                 $.ajax({
 288                     url: "/api/v1/tickets/" + ticket_id + "/updates",
 289                     method: "POST",
 290                     data: JSON.stringify(params),
 291                     ontentType: "application/json; charset=utf-8"
 292                 }).success(function() {
 293                     $("#ticketDetailsModal").modal('hide');
 294                     tickets.DataTable().ajax.reload(function(data) {
 295                         $("#concern_action_result_dialog").hide();
 296                         $("#concern_delete_success").html(_("Concern #%s updated successfully.").format(ticket_id)).show();
 297                     });
 298                 }).error(function() {
 299                     $("#concern_update_error").html(_("Error resolving concern #%s. Check the logs.").format(ticket_id)).show();
 300                 });
 301             });
 302
 303         });
 304     </script>
 305 [% END %]
 306 [% INCLUDE 'intranet-bottom.inc' %]