- Changed table layout of the credit card charges on the Account screen.
Moved checkbox to left of screen, added a column for Billing Type.
- Add button to Pay Selected vs All Charges.
- Include image of credit cards accepted (need to update with one with
AmEx)
- Reformatted page for inputting credit card
- Updated confirmation screen to bold amount, and list the titles as
the ones the user is paying for.
- Changed Print reciept template in seed data to look more readable and
like other itemized reciepts.
Signed-off-by: Suzanne Paterno <paterno@noblenet.org>
Signed-off-by: Cesar Velez <cesar.velez@equinoxinitiative.org>
Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>
'xact.usr',
'print-on-demand',
$$
+
[%- USE date -%][%- SET user = target.0.xact.usr -%]
-<div style="li { padding: 8px; margin 5px; }">
- <div>[% date.format %]</div><br/>
+<div style="font-family: Arial, Helvetica, sans-serif;">
+
+ <!-- Header aligned left -->
+ <div style="text-align:left;">
+ <img src="https://evergreen.noblenet.org/opac/images/noble_logo.jpg" style="width:30%; "/> <br />
+ <span style="padding-top:1em;">[% date.format %]</span>
+ </div><br/>
+
+ [% SET grand_total = 0.00 %]
<ol>
[% SET xact_mp_hash = {} %]
- [% FOR mp IN target %][%# Template is hooked around payments, but let us make the receipt focused on transactions %]
+ [% FOR mp IN target %][%# Create an array of transactions/amount paid for each payment made %]
[% SET xact_id = mp.xact.id %]
- [% IF ! xact_mp_hash.defined( xact_id ) %][% xact_mp_hash.$xact_id = { 'xact' => mp.xact, 'payments' => [] } %][% END %]
- [% xact_mp_hash.$xact_id.payments.push(mp) %]
+ [% SET amount = mp.amount %]
+ [% IF ! xact_mp_hash.defined( xact_id ) %]
+ [% xact_mp_hash.$xact_id = { 'xact' => mp.xact, 'payment' => amount } %]
+ [% END %]
[% END %]
+
[% FOR xact_id IN xact_mp_hash.keys.sort %]
[% SET xact = xact_mp_hash.$xact_id.xact %]
- <li>Transaction ID: [% xact_id %]
- [% IF xact.circulation %][% helpers.get_copy_bib_basics(xact.circulation.target_copy).title %]
- [% ELSE %]Miscellaneous
- [% END %]
- Line item billings:<ol>
- [% SET mb_type_hash = {} %]
- [% FOR mb IN xact.billings %][%# Group billings by their btype %]
- [% IF mb.voided == 'f' %]
- [% SET mb_type = mb.btype.id %]
- [% IF ! mb_type_hash.defined( mb_type ) %][% mb_type_hash.$mb_type = { 'sum' => 0.00, 'billings' => [] } %][% END %]
- [% IF ! mb_type_hash.$mb_type.defined( 'first_ts' ) %][% mb_type_hash.$mb_type.first_ts = mb.billing_ts %][% END %]
- [% mb_type_hash.$mb_type.last_ts = mb.billing_ts %]
- [% mb_type_hash.$mb_type.sum = mb_type_hash.$mb_type.sum + mb.amount %]
- [% mb_type_hash.$mb_type.billings.push( mb ) %]
- [% END %]
- [% END %]
- [% FOR mb_type IN mb_type_hash.keys.sort %]
- <li>[% IF mb_type == 1 %][%# Consolidated view of overdue billings %]
- $[% mb_type_hash.$mb_type.sum %] for [% mb_type_hash.$mb_type.billings.0.btype.name %]
- on [% mb_type_hash.$mb_type.first_ts %] through [% mb_type_hash.$mb_type.last_ts %]
- [% ELSE %][%# all other billings show individually %]
- [% FOR mb IN mb_type_hash.$mb_type.billings %]
- $[% mb.amount %] for [% mb.btype.name %] on [% mb.billing_ts %] [% mb.note %]
- [% END %]
- [% END %]</li>
- [% END %]
- </ol>
- Line item payments:<ol>
- [% FOR mp IN xact_mp_hash.$xact_id.payments %]
- <li>Payment ID: [% mp.id %]
- Paid [% mp.amount %] via [% SWITCH mp.payment_type -%]
- [% CASE "cash_payment" %]cash
- [% CASE "check_payment" %]check
- [% CASE "credit_card_payment" %]credit card
- [%- IF mp.credit_card_payment.cc_number %] ([% mp.credit_card_payment.cc_number %])[% END %]
- [% CASE "credit_payment" %]credit
- [% CASE "forgive_payment" %]forgiveness
- [% CASE "goods_payment" %]goods
- [% CASE "work_payment" %]work
- [%- END %] on [% mp.payment_ts %] [% mp.note %]
- </li>
- [% END %]
- </ol>
+ <li>
+ Transaction ID: [% xact_mp_hash.$xact_id.xact.id %]<br />
+ [% IF xact.circulation %]
+ Title: "[% helpers.get_copy_bib_basics(xact.circulation.target_copy).title %]" <br />
+ [% END %]
+
+ [%# Go get all the date needed from xact_summary %]
+
+ [% SET mbts = xact.summary %]
+
+ Transaction Type: [% mbts.last_billing_type%]<br />
+ Date: [% mbts.last_billing_ts %] <br />
+
+ Note: [% mbts.last_billing_note %] <br />
+
+ Amount: $[% xact_mp_hash.$xact_id.payment | format("%.2f") %]
+ [% grand_total = grand_total + xact_mp_hash.$xact_id.payment %]
</li>
+ <br />
[% END %]
</ol>
+
+ <div> <!-- Summary of all the information -->
+ Payment Type: Credit Card <br />
+ Total:<strong> $[% grand_total | format("%.2f") %] </strong>
+ </div>
+
</div>
$$
)
float:right;
padding: 15px 0px 0px 23px;
[% END -%]
- background-color: [% css_colors.accent_ultralight %];
width: 177px;
- height: 166px;
+}
+
+.cc_logo_img
+{
+ width: 79%;
+ [% IF rtl == 't' -%]
+ padding-right: .5em;
+ [% ELSE -%]
+ padding-left: .5em;
+ [% END -%]
}
#myopac_sum_fines_placehold {
[% END -%]
}
-#acct_checked_main_header, #acct_holds_main_header, #acct_checked_hist_header, #acct_holds_hist_header, #acct_list_header, #acct_list_header_anon, #temp_list_holds, #acct_messages_main_header, #ebook_circs_main_table, #ebook_holds_main_table {
+#acct_checked_main_header, #acct_holds_main_header, #acct_fines_main_header, #acct_fees_main_header, #acct_checked_hist_header, #acct_holds_hist_header, #acct_list_header, #acct_list_header_anon, #temp_list_holds, #acct_messages_main_header, #ebook_circs_main_table, #ebook_holds_main_table {
border-collapse: collapse;
}
+.acct_fines_header
+{
+ width: 100%;
+ padding-bottom:1em;
+ [% IF rtl == 't' -%]
+ float: right;
+ [% ELSE -%]
+ float:left;
+ [% END -%]
+}
+
+/* tables for entering payment information */
+#acct_fines_main_header,
+#acct_fees_main_header
+{
+ width: 100%;
+}
+
+/* tables for entering payment information */
+#billing_info_table
+{
+ width: auto;
+ [% IF rtl == 't' -%]
+ float: right;
+ [% ELSE -%]
+ float:left;
+ [% END -%]
+ display:inline;
+ padding-left: 1em;
+ padding-right: 1em;
+}
+
+/* tables for entering payment information */
+#credit_card_info_table
+{
+ width: auto;
+ display: block;
+}
+
+/* tables for entering payment information */
+#billing_info_table td,
+#credit_card_info_table td
+{
+ [% IF rtl == 't' -%]
+ padding-right: .5em;
+ [% ELSE -%]
+ padding-left: .5em;
+ [% END -%]
+
+}
+
+/* div for the payment buttons with the total */
+#payment_actions
+{
+ width: auto;
+ display: block;
+ padding: 1em 0 0 1em;
+ text-align:center;
+}
+
+/* text to state what is seen on cc statement */
+.cc_disclaimer
+{
+ font-style:italic;
+ font-size: 90%;
+ color:[% css_colors.primary_fade %];
+}
+
.hold_notes {
text-transform: none;
font-weight: normal;
}
.hold_note_title { font-weight: bold; }
-
-#acct_checked_main_header td, #acct_holds_main_header td, #acct_checked_hist_header td, #acct_holds_hist_header td, #acct_list_header td, #acct_list_header_anon td, #temp_list_holds td, #acct_messages_main_header, #ebook_circs_main_table td, #ebook_holds_main_table td {
- background-color: [% css_colors.accent_lighter2 %];
+#acct_checked_main_header td, #acct_holds_main_header td, #acct_fines_main_header td, #acct_fines_confirm_header td, #acct_fees_main_header td,#acct_checked_hist_header td, #acct_holds_hist_header td, #acct_list_header td, #acct_list_header_anon td, #temp_list_holds td, #acct_messages_main_header td, #ebook_circs_main_table td, #ebook_holds_main_table td {
+ background-color: [% css_colors.background %];
padding: 10px;
-}
+ border: 1px solid #d3d3d3;
+}
-#acct_checked_main_header th, #acct_holds_main_header th, #acct_checked_hist_header th, acct_holds_hist_header th, #acct_list_header th, #acct_list_header_anon th, #temp_list_holds th, #acct_messages_main_header, #ebook_circs_main_table th, #ebook_holds_main_table th {
+#acct_checked_main_header th, #acct_holds_main_header th, #acct_fines_main_header th, #acct_fines_confirm_header th, #acct_fees_main_header th, #acct_checked_hist_header th, #acct_holds_hist_header th, #acct_list_header th, #acct_list_header_anon th, #temp_list_holds th, #acct_messages_main_header th, #ebook_holds_main_table th {
[% IF rtl == 't' -%]
text-align: right;
[% ELSE -%]
.myopac_payments_table form { display: inline; }
.myopac_payments_table input[type="submit"] { padding: 1px; }
+.cc_header
+{
+ padding-top:1em;
+ background-color: [% css_colors.accent_lighter %];
+}
+
.payment-error {
font-weight: bold; color: [% css_colors.text_alert %];
padding: 10px; border: 1px solid [% css_colors.accent_medium_dark %];
[% IF myopac_cc_allowed;
# http://www.w3.org/TR/WCAG20-TECHS/H32.html
# avoid forms w/ no submit action %]
-<form action="[% ctx.opac_root %]/myopac/main_payment_form" method="get">
+<form action="[% ctx.opac_root %]/myopac/main_payment_form#payment" method="get">
[% END %]
[% IF ctx.fines.circulation.size > 0 %]
<div id='myopac_circ_trans_div'>
- <table width='100%' class='data_grid' title="[% l('Items Checked Out') %]">
+ <!--moved tables heading to outside of the table itself - took internal styling -->
+ <div class="header_middle">
+ <span class="acct_fines_header">
+ <!-- Different heading when not able to pay -->
+ [% IF myopac_cc_allowed %]
+ [% l("Pay Selected Circulation Charges") %]
+ [% ELSE %]
+ [% l("Circulation Charges") %]
+ [% END %]
+ </span>
+
+ </div>
+
+ <table id="acct_fines_main_header" class="table_no_border_space table_no_cell_pad" title="[% l('Items Checked Out') %]">
<thead>
+
<tr>
- <td colspan='10' style='padding: 6px'>
- <strong>[% l("Pay Selected Circulation Charges") %]</strong>
- </td>
- </tr>
- <tr>
- <td>[% l("Title") %]</td>
- <td>[% l("Author") %]</td>
- <td>[% l("Checkout Date") %]</td>
- <td>[% l("Due Date") %]</td>
- <td>[% l("Date Returned") %]</td>
- <td>[% l("Balance Owed") %]</td>
- [% IF myopac_cc_allowed %]
- <td nowrap="nowrap" style="white-space:nowrap;">
+
+ [% IF myopac_cc_allowed %]
+ <th nowrap="nowrap" style="white-space:nowrap;">
<input id="pay_fines_box1" checked="checked"
type="checkbox" onclick="select_all_checkboxes('xact', this.checked)"
- title="[% l('Click to (un)select all fines') %]" />
- <label for="pay_fines_box1">[% l('Pay Charges') %]</label>
- </td>
+ title="[% l('Click to (un)select all charges') %]" />
+ </th>
[% END %]
+ <th>[% l("Owed") %]</th>
+ <th class="mobile_hide">[% l("Billing Type") %]</th>
+ <th>[% l("Title") %]</th>
+ <th class='mobile_hide'>[% l("Checkout") %]</th>
+ <th>[% l(" Due ") %]</th>
+ <th>
+ <span class="mobile_hide">[% l(" Returned/Renewed") %]</span>
+ <span class="mobile_view">[% l(" Returned*") %]</span>
+ </th>
+
</tr>
</thead>
<tbody id='myopac_circ_trans_tbody'>
attrs.title = f.xact.reservation.target_resource_type.name;
END %]
<tr id='myopac_circ_trans_row'>
+ [% IF myopac_cc_allowed %]
+ <td>
+ <input type="checkbox" checked="checked"
+ title="[% l('Pay this fine') %]" name="xact"
+ value="[% f.xact.id %]" />
+ </td>
+ [% END %]
+
+ <td>
+ <strong class="alert">
+ [% money(f.xact.balance_owed)%]
+ </strong>
+ </td>
+
+ <td class="mobile_hide">
+ [% f.xact.last_billing_type %]
+ </td>
+
<td>
[% recid = f.xact.circulation.target_copy.call_number.record.id || f.xact.reservation.target_resource_type.record.id;
IF recid; %]
[% attrs.title | html %]
[% END %]
</td>
- <td>[%- author_query = attrs.author.replace('[,\.:;]', ''); %]
- <a href="[% mkurl(ctx.opac_root _ '/results',
- {qtype => 'author', query => author_query,
- loc => ctx.search_ou}) %]">[% attrs.author | html %]</a>
- </td>
- <td name='myopac_circ_trans_start'>
+
+ <td name='myopac_circ_trans_start' class='mobile_hide'>
[% ts = f.xact.circulation.xact_start || f.xact.reservation.start_time || 0;
IF ts;
date.format(ctx.parse_datetime(ts), DATE_FORMAT);
END %]
</td>
- <td name='myopac_circ_trans_due'>
+
+ <td name='myopac_circ_trans_due' >
[% ts = f.xact.circulation.due_date || f.xact.reservation.end_time || 0;
due_org = f.xact.circulation.circ_lib || f.xact.reservation.pickup_lib;
IF ts;
date.format(ctx.parse_datetime(ts, due_org), DATE_FORMAT);
END %]
</td>
- <td name='myopac_circ_trans_finished'>
+
+ <td name='myopac_circ_trans_finished' >
[% ts = f.xact.circulation.checkin_time || f.xact.reservation.return_time || 0;
IF ts;
date.format(ctx.parse_datetime(ts), DATE_FORMAT);
ELSE %]
<!-- XXX TODO fines aren't really accruing
if circ has hit maxfines. more clarity
- here? -->
+ here? -->
<span class="alert">[% l('(fines accruing)') %]</span>
[% END %]
</td>
- <td>
- <strong class="alert">
- [% money(f.xact.balance_owed) %]
- </strong>
- </td>
- [% IF myopac_cc_allowed %]
- <td>
- <input type="checkbox" checked="checked"
- title="[% l('Pay this fine') %]" name="xact"
- value="[% f.xact.id %]" />
- </td>
- [% END %]
+
</tr>
[% END %]
</tbody>
</table>
+ <!-- Disclaimer for mobile -->
+ <span class="mobile_view cc_disclaimer"> <strong>*</strong>Items may have been renewed. </span>
</div>
[% END %]
[% IF ctx.fines.grocery.size > 0 %]
<!-- Table for all non-circulation transactions -->
<div id='myopac_trans_div'>
- <br/>
- <hr class='opac-auto-013' color="#dcdbdb" />
- <br/>
- <table width='100%' class='data_grid data_grid_center'
- id='myopac_trans_table' title="[% l('Other Charges and Fees') %]">
+ <br/><br/>
+ <div class="header_middle">
+ <span class="acct_fines_header">
+
+ [% IF myopac_cc_allowed %]
+ [% l("Pay Selected Other Charges") %]
+ [% ELSE %]
+ [% l("Other Charges") %]
+ [% END %]
+
+ </span>
+ </div>
+
+ <table id="acct_fees_main_header" class="table_no_border_space table_no_cell_pad"title="[% l('Other Fines and Fees') %]">
<thead>
<tr>
- <td colspan='8' style='padding: 6px'>
- <span class="bold">[% l("Pay Selected Other Charges") %]</span>
- </td>
- </tr>
- <tr>
- <td width='16%'>[% l("Transaction Start Time") %]</td>
- <td width='16%'>[% l("Last Payment Time") %]</td>
- <td width='16%'>[% l("Initial Amount Owed") %]</td>
- <td width='16%'>[% l("Total Amount Paid") %]</td>
- <td width='16%'>[% l("Balance Owed") %]</td>
- <td width='16%'>[% l("Billing Type") %]</td>
- [% IF myopac_cc_allowed %]
- <td width='4%' align="center" nowrap="nowrap"
- style="white-space:nowrap;">
+
+ [% IF myopac_cc_allowed %]
+ <th nowrap="nowrap" style="white-space:nowrap;">
<input id="pay_fines_box2" checked="checked"
type="checkbox" onclick="select_all_checkboxes('xact_misc', this.checked)"
- title="[% l('Click to (un)select all charges') %]" />
- <label for="pay_fines_box2">[% l("Pay Charges") %]</label>
- </td>
+ title="[% l('Click to (un)select all fines') %]" />
+ </th>
[% END %]
+ <th >[% l("Owed") %]</th><!-- NOBLE - Removed word balance -->
+ <th >[% l("Billing Type") %]</th><!-- added style for mobile - NOBLE -->
+ <th >[% l("Note") %]</th> <!-- NOBLE - added -->
+ <th >[% l("Date") %]</th><!-- NOBLE - Changed wording of "Transation Start time" -->
+
+
</tr>
</thead>
<tbody id='myopac_trans_tbody'>
[% FOR f IN ctx.fines.grocery %]
<tr id='myopac_trans_row'>
- <td>[% date.format(
- ctx.parse_datetime(f.xact.xact_start),
- DATE_FORMAT
- ) %]</td>
- <td>
- [% IF f.xact.last_payment_ts;
- date.format(
- ctx.parse_datetime(
- f.xact.last_payment_ts
- ), DATE_FORMAT
- );
- END %]
+
+ [% IF myopac_cc_allowed %]
+ <td >
+ <input type="checkbox" title='[% l("Pay this fine") %]'
+ name="xact_misc" value="[% f.xact.id %]"
+ checked="checked" />
</td>
- <td>[% money(f.xact.total_owed) %]</td>
- <td>[% money(f.xact.total_paid) %]</td>
+ [% END %]
+
<td class="alert">
<strong>
[% money(f.xact.balance_owed) %]
</strong>
</td>
+
<td>[% f.xact.last_billing_type %]</td>
- [% IF myopac_cc_allowed %]
+
<td>
- <input type="checkbox" title='[% l("Pay this fine") %]'
- name="xact_misc" value="[% f.xact.id %]"
- checked="checked" />
+ [% f.xact.last_billing_note %]
</td>
- [% END %]
+
+ <td>[% date.format(
+ ctx.parse_datetime(f.xact.xact_start),
+ DATE_FORMAT
+ ) %]</td>
+
</tr>
[% END %]
</tbody>
</table>
+
</div>
[% END %]
[% UNLESS ctx.fines.grocery.size OR ctx.fines.circulation.size %]
<div>[% l('You have no current fines.') %]</div>
[% ELSIF myopac_cc_allowed %]
- <div class="text-right pad-top-ten">
+ <div class="text-left pad-top-ten">
<input type="submit"
value="[% l('Pay selected charges') %]"
title="[% l('Pay selected charges') %]"
retry_url = mkurl(ctx.opac_root _ '/myopac/main_payment_form', url_args, 1);
%]
<br/>
- <a href="[% retry_url %]">[%
- l('Go back to try again or to cancel this payment attempt.')
- %]</a>
+
+ <a href="[% mkurl(ctx.opac_root _ '/myopac/main', {}, 1) %]" class="opac-button">[% l('Account Home') %]</a>
+ <a href="[% retry_url %]" class="opac-button">[% l('Try Payment Again') %]</a>
</p>
[% ELSE %]
<p><big>[% l('Your payment has been approved.') %]</big></p>
END %]
<p>[ <a href="[% ctx.opac_root %]/myopac/receipt_print?[% print_args.join('&') %]"
target="_egrecpt"
+ class="opac-button"
onclick="try { print_node('printable-receipt'); } catch (e) { window.print(); } return false;">[% l('Print receipt') %]</a> ]</p>
<tt id="printable-receipt">
[% ctx.printable_receipt.template_output.data %]
+ <br />
</tt>
[% ELSE %]
<div class="payment-error">
) | html %]
</div>
[% END %]
- <p>[ <a href="[% ctx.opac_root %]/myopac/main">[%
+ <p>[ <a href="[% ctx.opac_root %]/myopac/main" class="opac-button">[%
l("Back to Account Summary") %]</a> ]</p>
[% END %]
</div>
ctx.get_org_setting(ctx.user.home_ou.id, 'credit.processor.stripe.enabled') AND ctx.get_org_setting(ctx.user.home_ou.id, 'credit.processor.default') == 'Stripe';
ctx.use_stripe = 1;
END %]
+
+<a name="payment"> </a>
<h3 class="sr-only">[% l('Pay Charges') %]</h3>
[% IF ctx.fines.balance_owed <= 0 %]
<div>
- [% l("You either have no fines to pay or you have selected fines whose " _
- "total is non-positive. We cannot process non-positive amounts.") %]
+ [% l("The minimum amount you can pay is \$0.01.") %]
</div>
[% ELSE %]
[% IF ctx.use_stripe %]
[% END %]
<div id="pay_fines_now"[% IF ctx.use_stripe %] class="hide_me"[% END %]>
[% IF last_chance %]
- <p><big>[% l("Are you sure you are ready to charge [_1] to your credit card?", money(ctx.fines.balance_owed)) %]</big></p>
+
+ <p><big>[% l("Are you sure you are ready to charge ") %]
+ <strong> [% l("[_1] ", money(ctx.fines.balance_owed))%]</strong>
+ [% l("to your credit card?") %]</big></p>
<form action="[% ctx.opac_root %]/myopac/main_pay_init" method="post">
[% FOR k IN CGI.Vars;
NEXT UNLESS k;
FOR val IN CGI.param(k) %]
<input type="hidden" name="[% k | html %]" value="[% val | html %]" />
[% END; END %]
- <input type="submit" value="[% l('Submit Payment') %]" />
- <a href="[% mkurl(ctx.opac_root _ '/myopac/main', {}, 1) %]">[% l('Cancel') %]</a>
+
+ <input type="submit" value="[% l('Submit') %]" class="opac-button"/>
+ <a href="[% mkurl(ctx.opac_root _ '/myopac/main#selected_fines', {}, 1) %]" class="opac-button">[% l('Cancel') %]</a>
+
+ <table title="[% l('List of Transactions') %]" id="acct_fines_confirm_header"
+ class="table_no_border_space table_no_cell_pad" style="padding-top:1em;">
+ <thead>
+ <tr>
+ <th>[% l('Charge/Fee') %]</th>
+ <th>[% l('Amount') %]</th>
+ </tr>
+ </thead>
+ <tbody>
+ [%
+ FOR f IN ctx.fines.circulation;
+ NEXT IF CGI.param('xact').size &&
+ !CGI.param('xact').grep(f.xact.id).size;
+ attrs = {marc_xml => f.marc_xml};
+ IF f.marc_xml;
+ PROCESS get_marc_attrs args=attrs;
+ ELSIF f.xact.reservation;
+ attrs.title = f.xact.reservation.target_resource_type.name;
+ END %]
+ <tr>
+ <td>[% attrs.title | html %]</td>
+ <td class="text-right">[% money(f.xact.balance_owed) %]</td>
+ </tr>
+ [%
+ END;
+ FOR f IN ctx.fines.grocery;
+ NEXT IF CGI.param('xact_misc').size &&
+ !CGI.param('xact_misc').grep(f.xact.id).size %]
+ <tr>
+ <td>[% f.xact.last_billing_type | html %]</td>
+ <td class="text-right">[% money(f.xact.balance_owed) %]</td>
+ </tr>
+ [% END %]
+ </tbody>
+ </table>
+
+ <p style="padding-top: 2em;">
+ <big>[% l("Are you sure you are ready to charge ") %]
+ <strong> [% l("[_1] ", money(ctx.fines.balance_owed))%]</strong>
+ [% l("to your credit card?") %]</big></p>
+ <input type="submit" value="[% l('Submit') %]" class="opac-button"/>
+ <a href="[% mkurl(ctx.opac_root _ '/myopac/main#selected_fines', {}, 1) %]" class="opac-button">[% l('Cancel') %]</a>
[% ELSE %]
- <form method="post" id="payment_form"
+
+ <form method="post" id="payment_form" action='#payment'
[% IF ctx.use_stripe %]
onsubmit="return stripe_onsubmit();"
[% END %]
<input type="hidden" name="stripe_token" id="stripe_token" />
[% END %]
- <table title="[% l('Billing Information') %]">
- <tbody>
- <tr>
- <td colspan='2'><strong>[% l('Billing Information') %]</strong></td>
- <td rowspan='13' valign='top'>
- <p>[% l('Selected fines you are paying for:') %]</p>
- <table title="[% l('List of Transactions') %]"
- class="table_no_border_space table_no_cell_pad myopac_payments_table">
- <thead>
- <tr>
- <th>[% l('Name') %]</th>
- <th>[% l('Amount') %]</th>
- </tr>
- </thead>
- <tbody>
- [%
- FOR f IN ctx.fines.circulation;
- NEXT IF CGI.param('xact').size &&
- !CGI.param('xact').grep(f.xact.id).size;
- attrs = {marc_xml => f.marc_xml};
- IF f.marc_xml;
- PROCESS get_marc_attrs args=attrs;
- ELSIF f.xact.reservation;
- attrs.title = f.xact.reservation.target_resource_type.name;
- END %]
- <tr>
- <td>[% attrs.title | html %]</td>
- <td class="text-right">[% money(f.xact.balance_owed) %]</td>
- </tr>
- [%
- END;
- FOR f IN ctx.fines.grocery;
- NEXT IF CGI.param('xact_misc').size &&
- !CGI.param('xact_misc').grep(f.xact.id).size %]
- <tr>
- <td>[% f.xact.last_billing_type | html %]</td>
- <td class="text-right">[% money(f.xact.balance_owed) %]</td>
- </tr>
- [% END %]
- </tbody>
- </table>
- <br />
- <div>
- [% l('Total amount to pay:') %]
- <strong>[% money(ctx.fines.balance_owed) %]</strong>
- </div>
- <br />
- [% | l('<strong>', '</strong>') %]Click [_1]Cancel[_2] to go back and (un)select other fines.[% END %]
- </td>
- </tr>
- <tr>
- <td><label for="payment-first-name">[% l('First Name') %]</label></td>
+ <table id="billing_info_table">
+ <tbody>
+ <tr>
+ <td colspan='2' class="cc_header"><strong>[% l('Billing Information') %]</strong></td>
+ </tr>
+ <tr>
+ <td><label for="payment-first-name">[% l('First Name') %]</label></td>
<td><input type="text" name="billing_first" id="payment-first-name"
value="[% ctx.user.first_given_name | html %]" /></td>
</tr>
<td><input type="text" name="billing_last" id="payment-last-name"
value="[% ctx.user.family_name | html %]" /></td>
</tr>
+
<tr>
<td><label for="payment-email-addr">[% l('Email Address') %]</label></td>
<td>
- <input id="payment-email-addr" type="text" disabled="disabled"
- readonly="readonly" value="[% ctx.user.email | html %]" />
+
+ <input id="payment-email-addr" type="text"
+ value="[% ctx.user.email | html %]" disabled="disabled"
+ readonly="readonly" />
<a title="[% l('Update Email Address') %]"
href="[% ctx.opac_root %]/myopac/update_email?return_to_referer=1">[% l("Update") %]</a>
- </td>
+ </td
</tr>
<tr>
<td><label for="payment-billing-address">[% l('Street Address') %]</label></td>
</tr>
<tr>
<td><label for="paymenet-billing-zip">[% l('ZIP or Postal Code') %]</label></td>
- <td><input type="text" name="billing_zip" id="paymenet-billing-zip"
- value="[% ctx.user.billing_address.post_code | html %]" /></td>
+ [% USE zip=String(ctx.user.billing_address.post_code) %]
+ <td><input type="tel" pattern="[0-9]*" maxlength="5" size="5" name="billing_zip" id="paymenet-billing-zip"
+ value="[% zip.truncate(5) %]" /></td>
</tr>
+ </tbody>
+ </table>
+
+ <table id="credit_card_info_table">
+ <tbody>
<tr>
- <td colspan='2'><strong>[% l('Credit Card Information') %]</strong></td>
+ <td colspan='2' class="cc_header"><strong>[% l('Credit Card Information') %]</strong></td>
</tr>
<tr>
<td><label for="payment-credit-card">[% l('Credit Card #') %]</label></td>
- <td><input type="text" maxlength="16" id="payment-credit-card"
+
+ <!-- Make type tel, which prompts for numbers in mobile -->
+ <td><input type="tel" pattern="[0-9]*" maxlength="16" id="payment-credit-card" required
[% IF ctx.use_stripe %]
data-stripe="number"
[% ELSE %]
<tr>
<td><label for="payment-security-code">[% l('Security Code') %]</label></td>
<td>
- <input type="text" size="4" maxlength="5" id="payment-security-code"
+ <!-- Make type tel, which prompts for numbers in mobile -->
+ <input type="tel" pattern="[0-9]*" size="4" maxlength="5" id="payment-security-code"
[% IF ctx.use_stripe %]
data-stripe="cvc"
[% ELSE %]
<tr>
<td><label for="payment-expire-month">[% l('Expiration Month') %]</label></td>
<td>
- <select id="payment-expire-month"
+ <select id="payment-expire-month" required
[% IF ctx.use_stripe %]
data-stripe="exp_month"
[% ELSE %]
name="expire_month"
[% END %]
>
- <option value="01">[% l("January") %]</option>
- <option value="02">[% l("February") %]</option>
- <option value="03">[% l("March") %]</option>
- <option value="04">[% l("April") %]</option>
- <option value="05">[% l("May") %]</option>
- <option value="06">[% l("June") %]</option>
- <option value="07">[% l("July") %]</option>
- <option value="08">[% l("August") %]</option>
- <option value="09">[% l("September") %]</option>
- <option value="10">[% l("October") %]</option>
- <option value="11">[% l("November") %]</option>
- <option value="12">[% l("December") %]</option>
+ <option value="-1"></option>
+ <option value="01">[% l("January (1)") %]</option>
+ <option value="02">[% l("February (2)") %]</option>
+ <option value="03">[% l("March (3)") %]</option>
+ <option value="04">[% l("April (4)") %]</option>
+ <option value="05">[% l("May (5)") %]</option>
+ <option value="06">[% l("June (6)") %]</option>
+ <option value="07">[% l("July (7)") %]</option>
+ <option value="08">[% l("August (8)") %]</option>
+ <option value="09">[% l("September (9)") %]</option>
+ <option value="10">[% l("October (10)") %]</option>
+ <option value="11">[% l("November (11)") %]</option>
+ <option value="12">[% l("December (12)") %]</option>
</select>
</td>
</tr>
</td>
</tr>
<tr>
- <td colspan='2' align="center">
- <input type="submit" id="payment_submit" value="[% l('Next') %]" />
- <a href="[% mkurl(ctx.opac_root _ '/myopac/main', {}, 1) %]">[% l('Cancel') %]</a>
- </td>
+ <td colspan='2'>
+ <div id="payment_actions">
+ [% l('Total amount:') %]
+ <strong>[% money(ctx.fines.balance_owed) %]</strong><br />
+
+ <input type="submit" id="payment_submit" value="[% l('Next') %]" class="opac-button" />
+ <a href="[% mkurl(ctx.opac_root _ '/myopac/main', {}, 1) %]" class="opac-button">[% l('Cancel') %]</a>
+ <br/>
+
+
+ </div>
+ </td>
</tr>
- [% INCLUDE "opac/parts/myopac/main_refund_policy.tt2" %]
- </tbody>
+
+ </tbody>
</table>
+ [% INCLUDE "opac/parts/myopac/main_refund_policy.tt2" %]
+
[% END %]
</form>
</div>
[% money(ctx.user_stats.fines.balance_owed) %]
</span><br />
[% IF (ctx.fines.grocery.size OR ctx.fines.circulation.size) AND ctx.get_org_setting(ctx.user.home_ou, 'credit.payments.allow') == 1 %]
- <form action="[% ctx.opac_root %]/myopac/main_payment_form" method="get"><input
- type="submit" title="[% l('Pay Charges') %]"
- value="[% l('Pay Charges') %]" class="pos-rel-top-5 opac-button" /></form>
- [% END %]
+ <form action="[% ctx.opac_root %]/myopac/main_payment_form" method="get"><input
+ type="submit" title="[% l('Pay All Charges') %]"
+ value="[% l('Pay All Charges') %]" class="pos-rel-top-5 opac-button" /></form>
+ <br />
+ <a href="#selected_fines" class="opac-button">[% l('View Charges') %]</a>
+ <img alt="[% l('Credit Card Logo') %]" src="[% ctx.media_prefix %]/images/credit_card_logo.png" class="cc_logo_img"/>
+ <!--added next two lines to add spacing when not accepting credit card payments -->
+ [% ELSE %]
+ <br />
+ [% END %]
</div>
[% END %]