Bug 27742: Page titles have unique info first
[koha.git] / koha-tmpl / opac-tmpl / bootstrap / en / modules / opac-account.tt
1 [% USE raw %]
2 [% USE Asset %]
3 [% USE Koha %]
4 [% USE KohaDates %]
5 [% USE AuthorisedValues %]
6 [% USE Price %]
7 [% SET ENABLE_OPAC_PAYMENTS = Koha.Preference('EnablePayPalOpacPayments') || plugins %]
8 [% SET DISPLAY_PAYMENT_BLOCK = 0 %]
9 [% INCLUDE 'doc-head-open.inc' %]
10 <title>Your charges &rsaquo; [% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog</title>
11 [% INCLUDE 'doc-head-close.inc' %]
12 [% BLOCK cssinclude %]
13     [% Asset.css("css/datatables.css") | $raw %]
14 [% END %]
15 </head>
16
17 [% INCLUDE 'bodytag.inc' bodyid='opac-account' bodyclass='scrollto' %]
18 [% INCLUDE 'masthead.inc' %]
19
20 <div class="main">
21     <nav aria-label="breadcrumb">
22         <ul class="breadcrumb">
23             <li class="breadcrumb-item">
24                 <a href="/cgi-bin/koha/opac-main.pl">Home</a>
25             </li>
26             <li class="breadcrumb-item">
27                 <a href="/cgi-bin/koha/opac-user.pl">[% INCLUDE 'patron-title.inc' patron = logged_in_user %]</a>
28             </li>
29             <li class="breadcrumb-item active" aria-current="page">
30                 <a href="#">Your charges</a>
31             </li>
32         </ul>
33     </nav>
34
35     <div class="container-fluid">
36         <div class="row">
37             <div class="col col-lg-2 order-2 order-lg-1">
38                 <div id="navigation">
39                     [% INCLUDE 'navigation.inc' IsPatronPage=1 %]
40                 </div>
41             </div>
42             <div class="col-md-12 col-lg-10 order-1">
43                 <div id="useraccount" class="maincontent">
44
45                     [% IF message %]
46                         <div class="alert alert-info">
47                             [% IF message == 'valid_payment' %]
48                                 <p>Your payment of $[% message_value | html %] has been processed successfully!</p>
49                             [% ELSIF message == 'duplicate_payment' %]
50                                 <p>A payment with the transaction id '[% message_value | html %]' has already been posted to an account.</p>
51                                 <p>Please contact a librarian for details.</p>
52                             [% ELSIF message == 'invalid_payment' %]
53                                 <p>The transaction id '[% message_value | html %]' for this payment is invalid.</p>
54                                 <p>Please contact a librarian for details.</p>
55                             [% END %]
56                         </div>
57                     [% END %]
58
59                     [% IF payment_error %]
60                         <div id="error" class="alert alert-warning">
61                             <p><strong>Error:</strong> there was a problem processing your payment</p>
62
63                             [% IF payment_error == "PAYPAL_UNABLE_TO_CONNECT" %]
64                                 <p>Unable to connect to PayPal.</p>
65                                 <p>Please contact a librarian to verify your payment.</p>
66                             [% ELSIF payment_error == "PAYPAL_ERROR_PROCESSING" %]
67                                 <p>Unable to verify payment.</p>
68                                 <p>Please contact a librarian to verify your payment.</p>
69                             [% END %]
70                         </div>
71                     [% ELSIF payment %]
72                         <div class="alert alert-info">
73                             <p><strong>Payment applied:</strong> your payment of [% payment | html %] has been applied to your account</p>
74                         </div>
75                     [% END %]
76                     <h2>Charges</h2>
77                     [% PROCESS 'account-table.inc' ACCOUNT_LINES = ACCOUNT_LINES, ENABLE_OPAC_PAYMENTS = ENABLE_OPAC_PAYMENTS, plugins = plugins %]
78
79                 </div> <!-- / #useraccount -->
80             </div> <!-- / .col-10 -->
81         </div> <!-- / .row -->
82     </div> <!-- / .container-fluid -->
83 </div> <!-- / .main -->
84
85 [% INCLUDE 'opac-bottom.inc' %]
86 [% BLOCK jsinclude %]
87 [% INCLUDE 'datatables.inc' %]
88 <script>
89 $( document ).ready(function() {
90
91     var MSG_MIN_THRESHOLD = _("Minimum amount needed by this service is %s");
92     var txtActivefilter = _("Filter paid transactions");
93     var txtInactivefilter = _("Show all transactions");
94
95     var fines_table = $("#finestable").dataTable($.extend(true, {}, dataTablesDefaults, {
96         "columnDefs": [
97              { "type": "title-string", "targets" : [ "title-string" ] }
98          ],
99          [% IF ENABLE_OPAC_PAYMENTS %]
100          "order": [[ 1, "desc" ]],
101          [% ELSE %]
102          "order": [[ 0, "desc" ]],
103          [% END %]
104          "dom": '<"#filter_p">',
105     } ));
106
107     $("#filter_p").html('<p><a href="#" id="filter_paid"><i class="fa fa-filter" aria-hidden="true"></i> '+txtActivefilter+'</a>');
108     $('#filter_paid').click(function(e) {
109         e.preventDefault();
110         if ($(this).hasClass('filtered')) {
111             var filteredValue = '';
112             $(this).html('<i class="fa fa-filter" aria-hidden="true"></i> '+txtActivefilter);
113         } else { //Not filtered. Let's do it!
114             var filteredValue = '^((?!0.00).*)$'; //Filter not matching 0.00 http://stackoverflow.com/a/406408
115             $(this).html('<i class="fa fa-filter" aria-hidden="true"></i> '+txtInactivefilter);
116         }
117         fines_table.fnFilter(filteredValue, -1, true, false);
118         $(this).toggleClass('filtered');
119     });
120
121     //Start filtered
122     $('#filter_paid').click();
123
124     $(".paypal").on("click", function() {
125         window.open('https://www.paypal.com/webapps/mpp/paypal-popup','WIPaypal','toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=1060, height=700');
126         return false;
127     });
128
129     $(".pay-online").removeClass("hidden");
130
131     $("#amount-to-pay-label").hide();
132
133     $(".checkbox-pay, input[name='payment_method']").change( function() {
134         // Disable the pay button if no fees are selected
135         //$("#submit-pay").prop("disabled", ! $(".checkbox-pay:checked").length );
136
137         // Calculate the total amount to be paid based on selected fees
138         var total = 0;
139         $(".checkbox-pay").each( function() {
140             if ( $(this).is(":checked") ) {
141                 var id = this.id.split("checkbox-pay-")[1];
142                 total += parseFloat( $("#amount-" + id).val() );
143             }
144         });
145
146         var p = Promise.resolve();
147         if ( total ) {
148             p = Promise.all(
149                 $('input[name="payment_method"]').map(function() {
150                     var self = this;
151                     return new Promise(function(resolve, reject) {
152                         var threshold = $(self).data('threshold');
153                         var help = $(self).parent().siblings('.help-block');
154                         if(!threshold || threshold == '' || threshold <= total) {
155                             $(self).prop('disabled', false);
156                             help.addClass('hide');
157                         } else {
158                             $(self).prop('disabled', true);
159                             help.html(MSG_MIN_THRESHOLD.format(parseInt(threshold,10).toFixed(2))).removeClass('hide');
160                         }
161                         resolve();
162                     })
163                 }).toArray()
164             );
165
166             $("#amount-to-pay").html( total.toFixed(2) );
167             $("#amount-to-pay-label").show();
168         } else {
169             $('input[name="payment_method"]').prop('disabled', false).parent().siblings('.help-block').addClass('hide');
170             $("#amount-to-pay-label").hide();
171         }
172         p.then(function() {
173             $("#submit-pay").prop("disabled", ! $(".checkbox-pay:checked").length || ! $('input[name="payment_method"]:checked:not(:disabled)').length);
174         })
175     });
176 });
177 </script>
178 [% END %]