From 1f348a34d67358848dd24ff26e0cb72706b76cf3 Mon Sep 17 00:00:00 2001 From: Owen Leonard <oleonard@myacpl.org> Date: Wed, 31 May 2017 13:58:27 +0000 Subject: [PATCH] Bug 18708 [Revised] Show itemBarcodeFallbackSearch results in a modal window This patch modifies the circulation template so that itemBarcodeFallbackSearch results show in a modal window. To test, enable the itemBarcodeFallbackSearch system preference and open a patron's account in circulation. - Submit a string which will return search results. When the page reloads a modal should display showing a table of title search results. - Test the "Check out" button and confirm that the correct item is submitted. - Test closing the modal and re-displaying it using the new "Show matching titles" button. - Confirm that the "Add record using fast cataloging" button still works correctly. - Submit a string which will return no results. No modal window should display, and only the "Add record" button should appear. - Confirm that normal checkout works correctly. - Test with itemBarcodeFallbackSearch disabled, and with a user who lacks Fast Cataloging permission. Revision removes a heading which was made redundant by the modal markup. --- koha-tmpl/intranet-tmpl/prog/css/staff-global.css | 18 ++++- .../prog/en/modules/circ/circulation.tt | 89 +++++++++++++++------- .../intranet-tmpl/prog/js/pages/circulation.js | 4 + 3 files changed, 82 insertions(+), 29 deletions(-) diff --git a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css b/koha-tmpl/intranet-tmpl/prog/css/staff-global.css index fb09d51..784fc3e 100644 --- a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css +++ b/koha-tmpl/intranet-tmpl/prog/css/staff-global.css @@ -1177,24 +1177,32 @@ div.alert strong { list-style-position:inside; } -.dialog button { +.dialog button, +.dialog a.approve { background: #fff none; border: 1px outset #999999; border-top-color: #666; border-left-color: #666; + color: #000; margin : .4em; padding : .4em; white-space: pre-line; } -.dialog button:hover { +.dialog button:hover, +.dialog a.approve:hover { background-color : #ffc; } -.dialog button:active { +.dialog button:active, +.dialog a.approve:active { border : 1px inset #999999; } +.dialog a.approve { + display: inline-block; +} + .approve i.fa, .success i.fa { color: green; @@ -2638,6 +2646,10 @@ button.closebtn{padding:0;cursor:pointer;background:transparent;border:0;-webkit overflow-y: auto; } +.modal-dialog.modal-wide { + width: 80%; +} + .btn-group label, .btn-group select { font-size: 13px; diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tt index a0855e8..1457c52 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/circulation.tt @@ -438,34 +438,24 @@ $(document).ready(function() { [% IF ( UNKNOWN_BARCODE ) %] <li>The barcode was not found: <span class="ex">[% barcode |html %]</span> - [% IF ( fast_cataloging ) %] - [% IF ( CAN_user_editcatalogue_fast_cataloging ) %] - <a href="/cgi-bin/koha/cataloguing/addbiblio.pl?frameworkcode=FA&barcode=[% barcode |uri %]&circborrowernumber=[% borrowernumber %]&branch=[% branch %]&duedatespec=[% duedatespec %]&stickyduedate=[% stickyduedate %]">Add record using fast cataloging</a> - [% END %] - [% END %] - [% IF ( FALLBACK ) %] - [% IF options %] - <br />The following items were found by searching: - [% FOREACH book IN options %] - <br /> - <form method="post" action="/cgi-bin/koha/circ/circulation.pl" autocomplete="off"> - [% IF (forceallow) %]<input type="hidden" name="forceallow" value="1">[% END %] - <input type="hidden" name="restoreduedatespec" /> - <input type="hidden" name="borrowernumber" value="[% borrowernumber %]" /> - <input type="hidden" name="duedatespec" value="[% duedatespec %]" /> - <input type="hidden" name="stickyduedate" value="[% stickyduedate %]" /> - <input type="hidden" name="branch" value="[% branch %]" /> - <input type="hidden" name="barcode" value="[% book.barcode %]" /> - <button type="submit" name="x"><i class="fa fa-check"></i> Check out [% book.barcode %]: [% book.title %]</button> - </form> - [% END %] - [% ELSE %] - <br />No items were found by searching. - [% END %] - [% END %] + <div> + [% IF ( FALLBACK ) %] + [% IF options %] + <button type="button" class="approve" data-toggle="modal" data-target="#itemSearchFallback"><i class="fa fa-search"></i> Show matching titles</button> + [% ELSE %] + <div>No items were found by searching.</div> + [% END %] + [% END %] - </li> + [% IF ( fast_cataloging ) %] + [% IF ( CAN_user_editcatalogue_fast_cataloging ) %] + <a class="approve" href="/cgi-bin/koha/cataloguing/addbiblio.pl?frameworkcode=FA&barcode=[% barcode |uri %]&circborrowernumber=[% borrowernumber %]&branch=[% branch %]&duedatespec=[% duedatespec %]&stickyduedate=[% stickyduedate %]"><i class="fa fa-plus"></i> Add record using fast cataloging</a> + [% END %] + [% END %] + </div> + + </li> [% END %] [% IF ( NOT_FOR_LOAN ) %] @@ -545,6 +535,53 @@ $(document).ready(function() { [% END %] </div></div> + + [% IF ( FALLBACK ) %] + [% IF options %] + + <!-- Modal --> + <div class="modal" id="itemSearchFallback" tabindex="-1" role="dialog" aria-labelledby="itemSearchFallbackLabel"> + <div class="modal-dialog modal-wide" role="document"> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="closebtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> + <h3 id="itemSearchFallbackLabel"><h3>Barcode not found. The following items were found by searching:</h3> + </div> + <div class="modal-body"> + <table class="table_borrowers"> + [% FOREACH book IN options %] + <tr> + <td> + <a class="popup" target="_blank" href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% book.biblionumber %]">[% book.title %]</a> + [% book.barcode %] + </td> + <td> + <form method="post" action="/cgi-bin/koha/circ/circulation.pl" autocomplete="off"> + [% IF (forceallow) %] + <input type="hidden" name="forceallow" value="1"> + [% END %] + <input type="hidden" name="restoreduedatespec" /> + <input type="hidden" name="borrowernumber" value="[% borrowernumber %]" /> + <input type="hidden" name="duedatespec" value="[% duedatespec %]" /> + <input type="hidden" name="stickyduedate" value="[% stickyduedate %]" /> + <input type="hidden" name="branch" value="[% branch %]" /> + <input type="hidden" name="barcode" value="[% book.barcode %]" /> + <button class="btn btn-default btn-xs" type="submit" name="x"><i class="fa fa-check"></i> Check out</button> + </form> + </td> + </tr> + [% END %] + </table> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> + </div> + </div> + </div> + </div> + [% END %] + [% END %] + [% ELSE %] [% IF (forceallow) %] <div id="overridden_debarment" class="dialog alert">Restriction overridden temporarily</div> diff --git a/koha-tmpl/intranet-tmpl/prog/js/pages/circulation.js b/koha-tmpl/intranet-tmpl/prog/js/pages/circulation.js index cbe274b..aeeaf8b 100644 --- a/koha-tmpl/intranet-tmpl/prog/js/pages/circulation.js +++ b/koha-tmpl/intranet-tmpl/prog/js/pages/circulation.js @@ -81,6 +81,10 @@ $(document).ready(function() { $("#barcode").focus(); }); + $("#itemSearchFallback").ready(function(){ + $("#itemSearchFallback").modal("show"); + }); + }); function export_checkouts(format) { -- 2.1.4