gitea
/
Koha-clms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Bug 29212: (follow-up) Fixes to suspend hold process 

This patch reworks the process of suspending an individual hold from the
patron's hold list. Instead of repeating the modal markup in each line
of the holds table, a single modal is re-used.

A "focus: false" is added to the modal via a data-attribute in order to
overcome problems with selecting months and using keyboard navigation in
the calendar popup.

To test, apply the patch and log into the OPAC as a user with holds.

- View the holds tab under "Your summary."
- Click the "Suspend" button next to one of the holds.
- You should see a modal which shows the title of the item in question.
- Test that the date picker works correctly:
  - Test selecting a month and year
  - Test selecting a date both with the mouse and by using arrow keys.
  - Test that you can clear the selected date both by clicking the X and
    by clicking the text link.
- Select a date and close the modal without submitting the suspension.
- Click the "Suspend" link on another title to confirm that the date
  picker still works correctly.
- Submit a suspension and confirm that the it completes successfully.
-

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
This commit is contained in:
Owen 2021-11-01 14:39:14 +00:00 committed by Fridolin Somers
parent 168b3e6704
commit 8389b5f332
2 changed files with 58 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
koha-tmpl/opac-tmpl/bootstrap/en/includes/holds-table.inc
View File

@ -138,38 +138,7 @@
</form>
[% ELSE %]
[% IF AutoResumeSuspendedHolds %]
<a class="btn btn-link js-show" href="#suspendModal[% HOLD.reserve_id | html %]" role="button" data-toggle="modal"><i class="fa fa-pause" aria-hidden="true"></i> Suspend</a>
[% # hold suspend modal form %]
<div id="suspendModal[% HOLD.reserve_id | html %]" class="modal-nojs" tabindex="-1" role="dialog" aria-labelledby="suspendModal[% HOLD.reserve_id | html %]Label" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<form action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
<div class="modal-header">
[% IF HOLD.suspend %]
<h3 class="modal-title" id="suspendModal[% HOLD.reserve_id | html %]Label">Resume your hold on <em>[% HOLD.biblio.title | html %]</em></h3>
[% ELSE %]
<h3 class="modal-title" id="suspendModal[% HOLD.reserve_id | html %]Label">Suspend your hold on <em>[% HOLD.biblio.title | html %]</em></h3>
[% END %]
<button type="button" class="closebtn" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">x</span>
</button>
</div>
<div class="modal-body">
<input type="hidden" name="reserve_id" value="[% HOLD.reserve_id | html %]" />
<label for="suspend_until_[% HOLD.reserve_id | html %]">Suspend until:</label>
<input type="text" name="suspend_until" id="suspend_until_[% HOLD.reserve_id | html %]" class="suspend-until flatpickr futuredate" size="10" />
[% INCLUDE 'date-format.inc' %]
<p class="js-show"><a href="#" onclick="document.getElementById('suspend_until_[% HOLD.reserve_id | html %]').value='';return false;">Clear date to suspend indefinitely</a></p>
<button class="btn btn-primary btn-sm js-hide" type="submit" name="submit">Suspend</button>
</div>
<div class="modal-footer">
<button class="btn btn-primary"><i class="fa fa-check" aria-hidden="true"></i> Suspend</button>
<button data-dismiss="modal" class="btn btn-secondary"><i class="fa fa-remove" aria-hidden="true"></i> Do not suspend</button>
</div>
</form>
</div> <!-- /.modal-content -->
</div> <!-- /.modal-dialog -->
</div> <!-- /#suspendModal[% HOLD.reserve_id | html %] -->
<a class="btn btn-link suspend_hold js-show" href="#" role="button" data-title="[% HOLD.biblio.title | html %] [% FOREACH subtitle IN HOLD.biblio.subtitle.split(' \| ') %][% IF Koha.Preference('marcflavour')=='UNIMARC' %],[% END %][% subtitle | html %][% END %]" data-reserve_id="[% HOLD.reserve_id | html %]"><i class="fa fa-pause" aria-hidden="true"></i> Suspend</a>
[% ELSE %]
<form class="form-inline" action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
<input type="hidden" name="reserve_id" value="[% HOLD.reserve_id | html %]" />

57
koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
View File

@ -865,6 +865,38 @@
</div> <!-- /.container-fluid -->
</div> <!-- /#main -->
[% # hold suspend modal form %]
<div id="suspendHoldModal" class="modal" tabindex="-1" role="dialog" aria-labelledby="suspendModalLabel" aria-hidden="true" data-focus="false">
<div class="modal-dialog">
<div class="modal-content">
<form action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
<div class="modal-header">
[% IF HOLD.suspend %]
<h5 class="modal-title" id="suspendModalLabel">Resume hold</h5>
[% ELSE %]
<h5 class="modal-title" id="suspendModalLabel">Suspend hold</h5>
[% END %]
<button type="button" class="closebtn" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">x</span>
</button>
</div>
<div class="modal-body">
<h6 id="suspendHoldTitle"></h6>
<input type="hidden" name="reserve_id" id="suspendHoldReserveId" value="" />
<label for="suspend_untilDate">Suspend until:</label>
<input type="text" name="suspend_until" id="suspend_untilDate" size="10" />
[% INCLUDE 'date-format.inc' %]
<p><a href="#" id="suspend-modal-clear-date">Clear date to suspend indefinitely</a></p>
</div>
<div class="modal-footer">
<button class="btn btn-primary"><i class="fa fa-check" aria-hidden="true"></i> Suspend</button>
<button data-dismiss="modal" class="btn btn-secondary"><i class="fa fa-remove" aria-hidden="true"></i> Do not suspend</button>
</div>
</form>
</div> <!-- /.modal-content -->
</div> <!-- /.modal-dialog -->
</div> <!-- /#suspendModal -->
[% IF ( OverDriveCirculation ) %]
[% INCLUDE 'overdrive-checkout.inc' %]
[% IF ( Koha.Preference('OverDrivePasswordRequired') ) %]
@ -941,6 +973,31 @@
})($(this))
});
/* We initiate this flatpickr instance here so that we can use the variable later */
var suspend_until_date = $("#suspend_untilDate").flatpickr({
minDate: "today"
});
$(".suspend_hold").on("click", function(e){
e.preventDefault();
var title = $(this).data("title");
var reserve_id = $(this).data("reserve_id");
$("#suspendHoldReserveId").val( reserve_id );
$("#suspendHoldTitle").html( "<em>" + title + "</em>" );
$("#suspendHoldModal").modal("show");
});
$("#suspend-modal-clear-date").on( "click", function(e) {
e.preventDefault();
suspend_until_date.clear();
});
$("#suspendHoldModal").on("hidden.bs.modal", function(){
$("#suspendHoldTitle").html("");
$("#suspendHoldReserveId").val("");
suspend_until_date.clear();
});
$("#suspend_all_submit").on("click", function(e){
e.preventDefault();
var title = _("Are you sure you want to suspend all holds?");