Bug 32341: (follow-up) Add responsivity to Curbside pickups table and changing button style for finestables

To activate Curbside pickups
    1- Enable the CurbsidePickup system preference
        1.1 Go to Administration > Global system preferences
        1.2 Search for CurbsidePickup
        1.3 Change the value for 'Enable'
        1.4 Click on 'Save all circulation preferences'
    2- Configure time slots for at least one library
        2.1 Go to Administration > Curbside pickup
        2.2 Fill out the form for Centerville (or another library)
            Enable: Check
            Pickup interval: 10 (or other)
            Maximum boss per interval: 3 (or other)
            Patron-scheduled pickup: Check
            Enable for waiting holds only: DO NOT check
        2.3 Add a time slot
            In 'New slot', enter
                Monday
                From: 10:00
                To: 12:00
            Click on 'Add'
    3- Make an appointment from the OPAC
        3.1 Go to OPAC
        3.2 Open mobile mode
        3.3 Connect with a user
        3.4 Click on 'Curbside pickups'
        3.5 Choose the library in 'Pick a library'
        3.6 Choose a date in 'Pickup date'
        3.7 Choose a time range in 'Select a time'
        3.8 Click on 'Schedule pickup'
            => Notice The table is not responsive
    4- Apply the patch
    5- Execute 'yarn build --view opac'
    6- Clean your cache or open your navigator on private mode (to load updated css files)
    7- Perform step 3.1, 3.2, 3.3, 3.4,
    8- click on 'Your pickups'
     => Confirm that the CurbsidePickup table are now displayed correctly and is now responsive.
    9- Click on 'Charges'
     => Confirm that the Charges table are now displayed correctly and is now responsive.

I correct a little bug. The "suspend_hold" button did not work anymore. This change resets it to it's original state.

Signed-off-by: David Cook <dcook@prosentient.com.au>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
This commit is contained in:
Hammat Wele 2023-02-16 18:06:56 +00:00 committed by Tomas Cohen Arazi
parent 6caeb1f627
commit 16008c24c5
Signed by: tomascohen
GPG key ID: 0A272EA1B2F3C15F
5 changed files with 48 additions and 11 deletions

View file

@ -256,14 +256,6 @@
#checkouts_filter {
display: block;
}
table.finestable tfoot tr {
display: flex !important;
width: max-content;
}
table.finestable tfoot td, table.finestable tfoot th {
display: flex !important;
}
}
@media only screen and ( max-width: 700px ) {

View file

@ -12,6 +12,7 @@
<th>Description</th>
<th>Amount</th>
<th>Amount outstanding</th>
<th></th>
</tr>
</thead>
@ -39,6 +40,7 @@
</td>
[% IF ( ACCOUNT_LINE.is_credit ) %]<td class="credit">[% ACCOUNT_LINE.amount * -1 | $Price %][% ELSE %]<td class="debit">[% ACCOUNT_LINE.amount | $Price %][% END %]</td>
[% IF ( ACCOUNT_LINE.is_credit ) %]<td class="credit">[% ACCOUNT_LINE.amountoutstanding * -1 | $Price %][% ELSE %]<td class="debit">[% ACCOUNT_LINE.amountoutstanding | $Price %][% END %]</td>
<td></td>
</tr>
[% END %]
</tbody>
@ -52,6 +54,7 @@
[%- END -%]
<th class="sum" colspan="[% COLSPAN | html %]">Total due</th>
<td class="sum">[% total | $Price %]</td>
<th></th>
</tr>
[% IF outstanding_credits.total_outstanding < 0 %]
[% FOREACH outstanding_credit IN outstanding_credits %]
@ -97,6 +100,7 @@
<th>Description</th>
<th>Fine amount</th>
<th>Amount outstanding</th>
<th></th>
</tr>
</thead>
@ -124,6 +128,7 @@
</td>
[% IF ( a.amount < 0 ) %]<td class="credit">[% ELSE %]<td class="debit">[% END %][% a.amount | $Price %]</td>
[% IF ( a.amountoutstanding < 0 ) %]<td class="credit">[% ELSE %]<td class="debit">[% END %][% a.amountoutstanding | $Price %]</td>
<td></td>
</tr>
[% END %]
</tbody>
@ -132,6 +137,7 @@
<tr>
<th class="sum" colspan="4">Total due</th>
<td class="sum">[% account_sum | $Price %]</td>
<th></th>
</tr>
</tfoot>
</table>

View file

@ -96,13 +96,37 @@ $( document ).ready(function() {
[% END %]
"dom": '<"#filter_p">',
"autoWidth": false,
"responsive": true,
"responsive": {
"details": { "type": 'column',"target": -1 }
},
"columnDefs": [
{ "className": 'dtr-control', "orderable": false, "targets": -1 }
],
'fnDrawCallback': function() {
show_hiddentfoot('#finestable');
}
} ));
$('table[id^="finestable-"]').dataTable($.extend(true, {}, dataTablesDefaults, {
"responsive": true
"autoWidth": false,
"responsive": {
"details": { "type": 'column',"target": -1 }
},
"columnDefs": [
{ "className": 'dtr-control', "orderable": false, "targets": -1 }
],
'fnDrawCallback': function() {
show_hiddentfoot('table[id^="finestable-"]');
}
} ));
function show_hiddentfoot(selector) {
$('.finestable tfoot .sum').show();
if ($(".finestable tfoot td.dtr-hidden").length > 0) {
$(selector+" tfoot th").removeAttr( "colspan" );
$(".finestable tfoot .dtr-control").hide();
}
}
$("#filter_p").html('<p><a href="#" id="filter_paid"><i class="fa fa-filter" aria-hidden="true"></i> '+txtActivefilter+'</a>');
$('#filter_paid').click(function(e) {
e.preventDefault();

View file

@ -179,6 +179,7 @@
<th>Schedule</th>
<th>Notes</th>
<th>Actions</th>
<th></th>
</tr>
</thead>
<tbody>
@ -211,6 +212,7 @@
<i class="fa fa-ban" aria-hidden="true"></i> Cancel this pickup</button>
</form>
</td>
<td></td>
</tr>
[% END %]
</tbody>
@ -280,6 +282,7 @@
<script>dayjs.extend(window.dayjs_plugin_isSameOrAfter)</script>
<script>dayjs.extend(window.dayjs_plugin_customParseFormat)</script>
[% INCLUDE 'calendar.inc' %]
[% INCLUDE 'datatables.inc' %]
<script>
[% SET pickup_exists_in = [] %]
[% FOR p IN patron_curbside_pickups %]
@ -324,6 +327,18 @@
});
$(document).ready(function() {
$('#pickups-table').dataTable($.extend(true, {}, dataTablesDefaults, {
"searching": false,
"paging": false,
"info": false,
"autoWidth": false,
"responsive": {
"details": { "type": 'column',"target": -1 }
},
"columnDefs": [
{ "className": 'dtr-control', "orderable": false, "targets": -1 }
],
}));
$("#pickup-branch option").each(function(){
if ( $(this).val() != "" && !policies[$(this).val()].enabled ) {
$(this).prop("disabled", "disabled");

View file

@ -1158,7 +1158,7 @@
minDate: "today"
});
$(".suspend_hold").on("click", function(e){
$(document).on("click", ".suspend_hold", function(e){
e.preventDefault();
var title = $(this).data("title");
var reserve_id = $(this).data("reserve_id");