Lines 11-16
Link Here
|
11 |
[% t("Koha") | html %] |
11 |
[% t("Koha") | html %] |
12 |
[% END %]</title> |
12 |
[% END %]</title> |
13 |
[% INCLUDE 'doc-head-close.inc' %] |
13 |
[% INCLUDE 'doc-head-close.inc' %] |
|
|
14 |
<style> |
15 |
#bookings-timeline .vis-item.vis-range { |
16 |
&.cancelled { |
17 |
background: rgba(128, 128, 128, 0.3); |
18 |
} |
19 |
} |
20 |
</style> |
14 |
</head> |
21 |
</head> |
15 |
|
22 |
|
16 |
<body id="circ_request" class="catalog"> |
23 |
<body id="circ_request" class="catalog"> |
Lines 43-50
Link Here
|
43 |
<h1>Bookings for [% INCLUDE 'biblio-title-head.inc' %]</h1> |
50 |
<h1>Bookings for [% INCLUDE 'biblio-title-head.inc' %]</h1> |
44 |
<div class="page-section" id="bookings-timeline"></div> |
51 |
<div class="page-section" id="bookings-timeline"></div> |
45 |
<div class="page-section"> |
52 |
<div class="page-section"> |
46 |
<fieldset class="action filters" style="cursor:pointer;"> |
53 |
<fieldset class="action filters" style="cursor:pointer; display: flex; flex-direction: column;"> |
47 |
<a id="expired_filter" class="filtered"><i class="fa fa-bars"></i> Show expired</a> |
54 |
<a id="expired_filter" class="filtered"><i class="fa fa-bars"></i> Show expired</a> |
|
|
55 |
<a id="cancelled_filter" class="filtered"><i class="fa fa-bars"></i> Show cancelled</a> |
48 |
</fieldset> |
56 |
</fieldset> |
49 |
|
57 |
|
50 |
<table id="bookings_table"></table> |
58 |
<table id="bookings_table"></table> |
Lines 122-136
Link Here
|
122 |
url: false |
130 |
url: false |
123 |
}), |
131 |
}), |
124 |
[% IF CAN_user_circulate_manage_bookings %] |
132 |
[% IF CAN_user_circulate_manage_bookings %] |
125 |
editable: { remove: true, updateTime: true }, |
133 |
editable: booking.status != 'cancelled' ? { remove: true, updateTime: true } : false, |
126 |
[% ELSE %] |
134 |
[% ELSE %] |
127 |
editable: false, |
135 |
editable: false, |
128 |
[% END %] |
136 |
[% END %] |
129 |
type: 'range', |
137 |
type: 'range', |
130 |
group: booking.item_id ? booking.item_id : 0 |
138 |
group: booking.item_id ? booking.item_id : 0, |
|
|
139 |
className: booking.status, |
131 |
}); |
140 |
}); |
132 |
} |
141 |
} |
133 |
|
142 |
|
|
|
143 |
const cancelledItems = document.querySelectorAll('#bookings-timeline .vis-item.vis-range.cancelled'); |
144 |
cancelledItems.forEach(item => { |
145 |
item.style.background = 'repeating-linear-gradient(' + |
146 |
'135deg,' + |
147 |
'rgba(211, 211, 211, 0.5) 0,' + |
148 |
'rgba(211, 211, 211, 0.5) 10px,' + |
149 |
'transparent 10px,' + |
150 |
'transparent 20px' + |
151 |
');'; |
152 |
}); |
153 |
|
134 |
var container = document.getElementById('bookings-timeline'); |
154 |
var container = document.getElementById('bookings-timeline'); |
135 |
var options = { |
155 |
var options = { |
136 |
stack: true, |
156 |
stack: true, |
Lines 206-211
Link Here
|
206 |
); |
226 |
); |
207 |
|
227 |
|
208 |
let filter_expired = true; |
228 |
let filter_expired = true; |
|
|
229 |
let filter_cancelled = false; |
209 |
let additional_filters = { |
230 |
let additional_filters = { |
210 |
end_date: function(){ |
231 |
end_date: function(){ |
211 |
if ( filter_expired ) { |
232 |
if ( filter_expired ) { |
Lines 214-219
Link Here
|
214 |
} else { |
235 |
} else { |
215 |
return; |
236 |
return; |
216 |
} |
237 |
} |
|
|
238 |
}, |
239 |
status: function(){ |
240 |
if ( filter_cancelled ) { |
241 |
return { "=": 'cancelled' } |
242 |
} else { |
243 |
return; |
244 |
} |
217 |
} |
245 |
} |
218 |
}; |
246 |
}; |
219 |
|
247 |
|
Lines 241-250
Link Here
|
241 |
visible: false, |
269 |
visible: false, |
242 |
render: function (data, type, row, meta) { |
270 |
render: function (data, type, row, meta) { |
243 |
let is_expired = dayjs(row.end_date).isBefore(new Date()); |
271 |
let is_expired = dayjs(row.end_date).isBefore(new Date()); |
|
|
272 |
let is_cancelled = row.status == 'cancelled' ? 1 : 0; |
244 |
if (is_expired) { |
273 |
if (is_expired) { |
245 |
return '<span class="badge rounded-pill bg-secondary">' + _("Expired") + '</span>'; |
274 |
return '<span class="badge rounded-pill bg-secondary">' + _("Expired") + '</span>'; |
246 |
} |
275 |
} |
247 |
|
276 |
if (is_cancelled) { |
|
|
277 |
return '<span class="badge rounded-pill bg-secondary">' + _("Cancelled") + '</span>'; |
278 |
} |
248 |
return '<span class="badge rounded-pill bg-success">' + _("Active") + '</span>'; |
279 |
return '<span class="badge rounded-pill bg-success">' + _("Active") + '</span>'; |
249 |
} |
280 |
} |
250 |
}, |
281 |
}, |
Lines 309-342
Link Here
|
309 |
"orderable": false, |
340 |
"orderable": false, |
310 |
"render": function(data, type, row, meta) { |
341 |
"render": function(data, type, row, meta) { |
311 |
let result = ""; |
342 |
let result = ""; |
|
|
343 |
let is_cancelled = row.status == 'cancelled' ? 1 : 0; |
312 |
[% IF CAN_user_circulate_manage_bookings %] |
344 |
[% IF CAN_user_circulate_manage_bookings %] |
313 |
result += '<button type="button" class="btn btn-default btn-xs edit-action" data-bs-toggle="modal" data-bs-target="#placeBookingModal" data-booking="'+row.booking_id+'" data-biblionumber="[% biblionumber | uri %]" data-itemnumber="'+row.item_id+'" data-patron="'+row.patron_id+'" data-pickup_library="'+row.pickup_library_id+'" data-start_date="'+row.start_date+'" data-end_date="'+row.end_date+'"><i class="fa fa-pencil" aria-hidden="true"></i> '+_("Edit")+'</button>'; |
345 |
if( !is_cancelled ){ |
314 |
result += '<button type="button" class="btn btn-default btn-xs cancel-action" data-bs-toggle="modal" data-bs-target="#cancelBookingModal" data-booking="'+row.booking_id+'"><i class="fa fa-trash" aria-hidden="true"></i> '+_("Cancel")+'</button>'; |
346 |
result += '<button type="button" class="btn btn-default btn-xs edit-action" data-bs-toggle="modal" data-bs-target="#placeBookingModal" data-booking="'+row.booking_id+'" data-biblionumber="[% biblionumber | uri %]" data-itemnumber="'+row.item_id+'" data-patron="'+row.patron_id+'" data-pickup_library="'+row.pickup_library_id+'" data-start_date="'+row.start_date+'" data-end_date="'+row.end_date+'"><i class="fa fa-pencil" aria-hidden="true"></i> '+_("Edit")+'</button>'; |
|
|
347 |
result += '<button type="button" class="btn btn-default btn-xs cancel-action" data-bs-toggle="modal" data-bs-target="#cancelBookingModal" data-booking="'+row.booking_id+'"><i class="fa fa-trash" aria-hidden="true"></i> '+_("Cancel")+'</button>'; |
348 |
} |
315 |
[% END %] |
349 |
[% END %] |
316 |
return result; |
350 |
return result; |
317 |
} |
351 |
} |
318 |
}] |
352 |
}] |
319 |
}, [], 0, additional_filters); |
353 |
}, [], 0, additional_filters); |
320 |
|
354 |
|
321 |
var txtActivefilter = _("Show expired"); |
355 |
function setupFilter(filterId, activeText, inactiveText, filterVariable) { |
322 |
var txtInactivefilter = _("Hide expired"); |
356 |
$(filterId).on("click", function() { |
323 |
$("#expired_filter").on("click", function() { |
357 |
if ($(this).hasClass('filtered')) { |
324 |
if ($(this).hasClass('filtered')){ |
358 |
filterVariable = false; |
325 |
filter_expired = false; |
359 |
$(this).html('<i class="fa fa-filter"></i> ' + inactiveText); |
326 |
$(this).html('<i class="fa fa-filter"></i> '+txtInactivefilter); |
360 |
} else { |
327 |
} else { |
361 |
filterVariable = true; |
328 |
filter_expired = true; |
362 |
$(this).html('<i class="fa fa-bars"></i> ' + activeText); |
329 |
$(this).html('<i class="fa fa-bars"></i> '+txtActivefilter); |
363 |
} |
330 |
} |
|
|
331 |
|
364 |
|
332 |
bookings_table.DataTable().ajax.reload(() => { |
365 |
bookings_table.DataTable().ajax.reload(() => { |
333 |
bookings_table |
366 |
bookings_table.DataTable().column("status:name").visible(!filterVariable, false); |
334 |
.DataTable() |
367 |
}); |
335 |
.column("status:name") |
368 |
$(this).toggleClass('filtered'); |
336 |
.visible(!filter_expired, false); |
|
|
337 |
}); |
369 |
}); |
338 |
$(this).toggleClass('filtered'); |
370 |
} |
339 |
}); |
371 |
|
|
|
372 |
setupFilter("#expired_filter", _("Show expired"), _("Hide expired"), filter_expired); |
373 |
setupFilter("#cancelled_filter", _("Show cancelled"), _("Hide cancelled"), filter_cancelled); |
340 |
|
374 |
|
341 |
}); |
375 |
}); |
342 |
</script> |
376 |
</script> |