Bugzilla – Attachment 194545 Details for
Bug 41993
Add a page to show items available for bookings
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 41993: (follow-up) Fix markup of sidebar menu, correct Select2 style
Bug-41993-follow-up-Fix-markup-of-sidebar-menu-cor.patch (text/plain), 16.14 KB, created by
Owen Leonard
on 2026-03-05 17:17:52 UTC
(
hide
)
Description:
Bug 41993: (follow-up) Fix markup of sidebar menu, correct Select2 style
Filename:
MIME Type:
Creator:
Owen Leonard
Created:
2026-03-05 17:17:52 UTC
Size:
16.14 KB
patch
obsolete
>From 4ce691afabeda5b46f4569d2943e3ba5132c98d2 Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Thu, 5 Mar 2026 12:00:15 -0500 >Subject: [PATCH] Bug 41993: (follow-up) Fix markup of sidebar menu, correct > Select2 style > >The library selection in the sidebar works better if we use Select2. I >made a corresponding minor change to select2.css. > >This patch also restructures the in-page JavaScript so that template >variables are in a separate <script> block (see Bug 41563 etc.). >--- > koha-tmpl/intranet-tmpl/prog/css/select2.css | 2 +- > .../en/modules/circ/available-bookings.tt | 253 +++++++++--------- > 2 files changed, 129 insertions(+), 126 deletions(-) > >diff --git a/koha-tmpl/intranet-tmpl/prog/css/select2.css b/koha-tmpl/intranet-tmpl/prog/css/select2.css >index faa0f0d89bb..6bde99748fd 100644 >--- a/koha-tmpl/intranet-tmpl/prog/css/select2.css >+++ b/koha-tmpl/intranet-tmpl/prog/css/select2.css >@@ -59,7 +59,7 @@ fieldset.rows li .select2.select2-container.select2-container--default { > } > > aside .select2.select2-container.select2-container--default { >- max-width: unset; >+ max-width: 100%; > } > > aside .select2-container .select2-selection--multiple .select2-selection__rendered { >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/available-bookings.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/available-bookings.tt >index 0b86347704c..d4032e042ed 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/available-bookings.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/available-bookings.tt >@@ -52,7 +52,7 @@ > <div class="col-md-2 order-sm-2 order-md-1"> > <aside> > <form id="available_items_filter"> >- <fieldset class="rows"> >+ <fieldset class="brief"> > <h4>Filter by</h4> > <ol> > <li> >@@ -75,7 +75,7 @@ > </li> > <li> > <label for="item_type">Item type:</label> >- <select name="item_type" id="item_type" style="width: auto; min-width: 200px;"> >+ <select name="item_type" id="item_type"> > <option value="">Any</option> > [% FOREACH itemtype IN ItemTypes.Get() %] > <option value="[% itemtype.itemtype | html %]">[% itemtype.description | html %]</option> >@@ -86,7 +86,7 @@ > </fieldset> > <fieldset class="action"> > <input type="submit" name="run_report" value="Search" class="btn btn-primary" /> >- <input type="reset" name="clear_form" value="Clear" class="btn btn-default" /> >+ <input type="reset" name="clear_form" value="Clear" class="btn btn-default clear_search" /> > </fieldset> > </form> > >@@ -102,172 +102,175 @@ > [% INCLUDE 'datatables.inc' %] > [% INCLUDE 'js-biblio-format.inc' %] > [% INCLUDE 'js-date-format.inc' %] >+ [% INCLUDE 'select2.inc' %] > <script> > let table_settings = [% TablesSettings.GetTableSettings( 'circ', 'available-bookings', 'available-items', 'json' ) | $raw %]; >- >- $(document).ready(function() { >- >+ [% SET libraries = Branches.all %] >+ let all_libraries = [% To.json(libraries) | $raw %].map(e => { >+ e['_id'] = e.branchcode; >+ e['_str'] = e.branchname; >+ return e; >+ }); >+ let filters_options = {}; >+ </script> >+ <script> >+ $(document).ready(function () { > let additional_filters = { >- 'me.holding_library_id': function() { >+ "me.holding_library_id": function () { > let selectedLibraries = $("#pickup_libraries").val(); > if (selectedLibraries && selectedLibraries.length > 0) { >- selectedLibraries = selectedLibraries.filter(lib => lib !== ''); >+ selectedLibraries = selectedLibraries.filter(lib => lib !== ""); > if (selectedLibraries.length > 0) { > return selectedLibraries; > } > } > return; > }, >- 'me.item_type_id': function() { >+ "me.item_type_id": function () { > let itemType = $("#item_type").val(); >- if (itemType && itemType !== '') { >+ if (itemType && itemType !== "") { > return itemType; > } > return; >- } >+ }, > }; > >- [% SET libraries = Branches.all %] >- let all_libraries = [% To.json(libraries) | $raw %].map(e => { >- e['_id'] = e.branchcode; >- e['_str'] = e.branchname; >- return e; >- }); > let filters_options = {}; > >- var available_items_table_url = '/api/v1/items/available_for_booking'; >+ var available_items_table_url = "/api/v1/items/available_for_booking"; > >- var available_items_table = $("#available_items_table").kohaTable({ >- "ajax": { >- "url": available_items_table_url >- }, >- "embed": [ >- "biblio", >- "+strings", >- "home_library", >- "holding_library", >- "item_type" >- ], >- "order": [[ 2, "asc" ]], >- "columns": [{ >- "data": "home_library.name", >- "title": _("Homebranch"), >- "searchable": true, >- "orderable": true, >- "render": function( data, type, row, meta ) { >- return escape_str(row.home_library_id ? row.home_library.name : row.home_library_id); >- } >- }, >- { >- "data": "holding_library.name", >- "title": _("Pickup library"), >- "searchable": true, >- "orderable": true, >- "render": function( data, type, row, meta ) { >- return escape_str(row.holding_library_id ? row.holding_library.name : row.holding_library_id); >- } >- }, >+ var available_items_table = $("#available_items_table").kohaTable( > { >- "data": "biblio.title", >- "title": _("Title"), >- "searchable": true, >- "orderable": true, >- "render": function(data,type,row,meta) { >- if ( row.biblio ) { >- return $biblio_to_html(row.biblio, { >- link: 'detail' >- }); >- } else { >- return 'No title'; >- } >- } >+ ajax: { >+ url: available_items_table_url, >+ }, >+ embed: ["biblio", "+strings", "home_library", "holding_library", "item_type"], >+ order: [[2, "asc"]], >+ columns: [ >+ { >+ data: "home_library.name", >+ title: _("Homebranch"), >+ searchable: true, >+ orderable: true, >+ render: function (data, type, row, meta) { >+ return escape_str(row.home_library_id ? row.home_library.name : row.home_library_id); >+ }, >+ }, >+ { >+ data: "holding_library.name", >+ title: _("Pickup library"), >+ searchable: true, >+ orderable: true, >+ render: function (data, type, row, meta) { >+ return escape_str(row.holding_library_id ? row.holding_library.name : row.holding_library_id); >+ }, >+ }, >+ { >+ data: "biblio.title", >+ title: _("Title"), >+ searchable: true, >+ orderable: true, >+ render: function (data, type, row, meta) { >+ if (row.biblio) { >+ return $biblio_to_html(row.biblio, { >+ link: "detail", >+ }); >+ } else { >+ return "No title"; >+ } >+ }, >+ }, >+ { >+ data: "item_type_id", >+ title: _("Item type"), >+ searchable: true, >+ orderable: true, >+ render: function (data, type, row, meta) { >+ if (row.item_type && row.item_type.description) { >+ return escape_str(row.item_type.description); >+ } else if (row._strings && row._strings.item_type_id) { >+ return escape_str(row._strings.item_type_id.str); >+ } else { >+ return escape_str(row.item_type_id || ""); >+ } >+ }, >+ }, >+ { >+ data: "external_id", >+ title: _("Barcode"), >+ searchable: true, >+ orderable: true, >+ }, >+ { >+ data: "callnumber", >+ title: _("Callnumber"), >+ searchable: true, >+ orderable: true, >+ }, >+ { >+ data: "location", >+ title: _("Location"), >+ searchable: true, >+ orderable: true, >+ render: function (data, type, row, meta) { >+ if (row._strings && row._strings.location) { >+ return row._strings.location.str; >+ } else { >+ return row.location || ""; >+ } >+ }, >+ }, >+ { >+ data: "localuse", >+ title: _("Local use"), >+ searchable: true, >+ orderable: true, >+ }, >+ ], > }, >- { >- "data": "item_type_id", >- "title": _("Item type"), >- "searchable": true, >- "orderable": true, >- "render": function(data,type,row,meta) { >- if ( row.item_type && row.item_type.description ) { >- return escape_str(row.item_type.description); >- } else if ( row._strings && row._strings.item_type_id ) { >- return escape_str(row._strings.item_type_id.str); >- } else { >- return escape_str(row.item_type_id || ''); >- } >- } >- }, >- { >- "data": "external_id", >- "title": _("Barcode"), >- "searchable": true, >- "orderable": true >- }, >- { >- "data": "callnumber", >- "title": _("Callnumber"), >- "searchable": true, >- "orderable": true >- }, >- { >- "data": "location", >- "title": _("Location"), >- "searchable": true, >- "orderable": true, >- "render": function(data,type,row,meta) { >- if ( row._strings && row._strings.location ) { >- return row._strings.location.str; >- } else { >- return row.location || ''; >- } >- } >- }, >- { >- "data": "localuse", >- "title": _("Local use"), >- "searchable": true, >- "orderable": true >- }] >- }, table_settings, 1, additional_filters, filters_options); >+ table_settings, >+ 1, >+ additional_filters, >+ filters_options >+ ); > >- $("#available_items_filter").on("submit", function(e){ >+ $("#available_items_filter").on("submit", function (e) { > e.preventDefault(); > > if (!$("#start_date").val() || !$("#end_date").val()) { > alert("Please select both start and end dates"); > return false; > } >- let newUrl = '/api/v1/items/available_for_booking'; >+ let newUrl = "/api/v1/items/available_for_booking"; > let params = []; > > let fromdate = $("#start_date"); > let todate = $("#end_date"); >- if ( fromdate.val() !== '' && todate.val() !== '' ) { >- let fromDateStr = fromdate.val(); >- let toDateStr = todate.val(); >- params.push('start_date=' + encodeURIComponent(fromDateStr)); >- params.push('end_date=' + encodeURIComponent(toDateStr)); >- >+ if (fromdate.val() !== "" && todate.val() !== "") { >+ let fromDateStr = fromdate.val(); >+ let toDateStr = todate.val(); >+ params.push("start_date=" + encodeURIComponent(fromDateStr)); >+ params.push("end_date=" + encodeURIComponent(toDateStr)); > } > if (params.length > 0) { >- newUrl += '?' + params.join('&'); >+ newUrl += "?" + params.join("&"); > } > available_items_table.DataTable().ajax.url(newUrl).load(); > }); > >- $("#available_items_filter input[type=reset]").on("click", function(e){ >+ $("#available_items_filter input[type=reset]").on("click", function (e) { > $("#pickup_libraries").val([]); >- $("#item_type").val(''); >- $("#start_date").val('[% start_date_default | html %]'); >- $("#end_date").val('[% end_date_default | html %]'); >+ $("#item_type").val(""); >+ $("#start_date").val(start_date_default); >+ $("#end_date").val(end_date_default); > >- let resetUrl = '/api/v1/items/available_for_booking'; >- if ('[% start_date_default | html %]' && '[% end_date_default | html %]') { >- resetUrl += '?start_date=[% start_date_default | uri %]&end_date=[% end_date_default | uri %]'; >+ let resetUrl = "/api/v1/items/available_for_booking"; >+ if (start_date_default && end_date_default) { >+ resetUrl += `?start_date=${start_date_default}&end_date=${end_date_default}`; > } > available_items_table.DataTable().ajax.url(resetUrl).load(); > }); >- >+ $("#pickup_libraries").select2(); > }); > </script> > [% END %] >-- >2.39.5
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 41993
:
194490
|
194543
|
194544
| 194545