021e4ea61146ff07aaaa87a3dc5ee9cb11081a3d
[koha-equinox.git] / koha-tmpl / intranet-tmpl / prog / en / modules / pos / pay.tt
1 [% USE raw %]
2 [% USE Asset %]
3 [% USE Koha %]
4 [% USE Price %]
5 [% SET footerjs = 1 %]
6 [% PROCESS 'payments.inc' %]
7 [% INCLUDE 'doc-head-open.inc' %]
8 <title>Koha &rsaquo; Payments</title>
9 [% INCLUDE 'doc-head-close.inc' %]
10 </head>
11
12 <body id="payments" class="pos">
13 [% INCLUDE 'header.inc' %]
14 [% INCLUDE 'circ-search.inc' %]
15
16 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; Point of sale</div>
17
18 <div class="main container-fluid">
19     <div class="row">
20         <div class="col-sm-10 col-sm-push-2">
21
22         [% IF ( error_registers ) %]
23         <div id="error_message" class="dialog alert">
24             You must have at least one cash register associated with this branch before you can record payments.
25         </div>
26         [% ELSE %]
27
28         [% IF payment_id && !Koha.Preference('FinePaymentAutoPopup') %]
29         <div class="dialog alert audio-alert-action">
30             Payment received: <a target="_blank" href="/cgi-bin/koha/pos/printreceipt.pl?action=print&accountlines_id=[% payment_id | uri %]&collected=[% collected | uri %]&change=[% change | uri %]" class="btn btn-default btn-xs"><i class="fa fa-print"></i> Print receipt</a>
31         </div>
32         [% END %]
33
34         <form name="payForm" id="payForm" method="post" action="/cgi-bin/koha/pos/pay.pl">
35             <div class="row">
36
37                 <div class="col-sm-6">
38                     <fieldset class="rows">
39                         <legend>Items for purchase</legend>
40                             Please select items from below to add to this transaction:
41                             [% IF invoice_types %]
42                             <table id="invoices">
43                             <thead>
44                                 <tr>
45                                     <th>Code</th>
46                                     <th>Description</th>
47                                     <th>Cost</th>
48                                     <th>Action</th>
49                                 </tr>
50                             </thead>
51                             <tbody>
52                             [% FOREACH invoice IN invoice_types %]
53                                 <tr>
54                                     <td>[% invoice.code | html %]</td>
55                                     <td>[% invoice.description | html %]</td>
56                                     <td>[% invoice.default_amount | $Price %]</td>
57                                     <td>
58                                         <button type="button" class="add_button" data-invoice-code="[% invoice.code | html %]" data-invoice-title="[% invoice.description | html %]" data-invoice-price="[% invoice.default_amount | html %]"><i class="fa fa-plus"></i> Add</button>
59                                     </td>
60                                 </tr>
61                             [% END %]
62                             </table>
63                             [% ELSE %]
64                             You have no manual invoice types defined
65                             [% END %]
66                     </fieldset>
67                 </div>
68
69                 <div class="col-sm-6">
70
71                     <fieldset class="rows">
72                         <legend>This sale</legend>
73                         <p>Click to edit item cost or quantities</p>
74                         <table id="sale" class="table_sale">
75                             <thead>
76                                 <tr>
77                                     <th>Item</th>
78                                     <th>Cost</th>
79                                     <th>Quantity</th>
80                                     <th>Total</th>
81                                     <th>Action</th>
82                                     <th>CODE</th>
83                                 </tr>
84                             </thead>
85                             <tbody>
86                             </tbody>
87                             <tfoot>
88                                 <tr>
89                                     <td colspan="3">Total payable:</td>
90                                     <td></td>
91                                     <td></td>
92                                     <td></td>
93                                 </tr>
94                             </tfoot>
95                         </table>
96                     </fieldset>
97
98                     <fieldset class="rows">
99                         <legend>Collect payment</legend>
100                         <ol>
101                             <li>
102                                 <label for="paid">Amount being paid: </label>
103                                 <input type="number" min="0.00" max="10000.00" step="0.01" name="paid" id="paid" value="[% amountoutstanding | $Price on_editing => 1 %]" readonly/>
104                             </li>
105                             <li>
106                                 <label for="collected">Amount tendered: </label>
107                                 <input type="number" min="0.00" max="10000.00" step="0.01" name="collected" id="collected" value=""/>
108                             </li>
109                             <li>
110                                 <label>Change to give: </label>
111                                 <span id="change">[% 0 | $Price %]</span>
112                                 <input type="hidden" name="change" value="[% 0 | $Price %]"/>
113                             </li>
114
115                             [% PROCESS account_payment_types %]
116
117                             <li>
118                                 <label for="registerid">Cash register: </label>
119                                 <select name="registerid" id="registerid">
120                                     [% FOREACH register IN registers %]
121                                       [% IF register.id == default_register %]
122                                     <option value="[% register.id | html %]" selected="selected">[% register.name | html %]</option>
123                                       [% ELSE %]
124                                     <option value="[% register.id | html %]">[% register.name | html %]</option>
125                                       [% END %]
126                                     [% END %]
127                                 </select>
128                             </li>
129                         </ol>
130
131                     </fieldset>
132                 </div>
133
134                 <div class="action">
135                     <input type="submit" id="submitbutton" name="submitbutton" value="Confirm" />
136                     <a class="cancel" href="/cgi-bin/koha/pos/pay.pl">Cancel</a>
137                 </div>
138             </div>
139         </form>
140         [% END %]
141     </div>
142
143     <div class="col-sm-2 col-sm-pull-10">
144         <aside>
145             [% INCLUDE 'pos-menu.inc' %]
146         </aside>
147     </div>
148 </div> <!-- /.row -->
149
150 <!-- Modal -->
151 <div id="confirm_change_form" class="modal" tabindex="-1" role="dialog" aria-hidden="true">
152     <div class="modal-dialog">
153         <div class="modal-content">
154             <div class="modal-header">
155                 <h3>The amount collected is more than the outstanding charge</h3>
156             </div>
157             <div class="modal-body">
158                 <p>The amount collected from the patron is higher than the amount to be paid.</p>
159                 <p>The change to give is <b><span id="modal_change">[% 0 | $Price %]</span></b>.</p>
160                 <p>Confirm this payment?</p>
161             </div>
162             <div class="modal-footer">
163                 <button class="btn btn-default approve" id="modal_submit" type="button"><i class="fa fa-check"></i> Yes</button>
164                 <button class="btn btn-default deny cancel" href="#" data-dismiss="modal" aria-hidden="true" type="button"><i class="fa fa-times"></i> No</button>
165             </div>
166         </div>
167     </div>
168 </div>
169
170 [% IF payment_id && Koha.Preference('FinePaymentAutoPopup') %]
171 <!-- Automatic Print Receipt -->
172       <a id="printReceipt" style="display: none" href="#"></a>
173 [% END %]
174
175 [% MACRO jsinclude BLOCK %]
176     [% INCLUDE 'format_price.inc' %]
177     [% INCLUDE 'datatables.inc' %]
178     [% Asset.js("lib/jquery/plugins/jquery.jeditable.mini.js") | $raw %]
179     <script>
180     function moneyFormat(textObj) {
181         var newValue = textObj.value;
182         var decAmount = "";
183         var dolAmount = "";
184         var decFlag   = false;
185         var aChar     = "";
186
187         for(var i=0; i < newValue.length; i++) {
188             aChar = newValue.substring(i, i+1);
189             if (aChar >= "0" && aChar <= "9") {
190                 if(decFlag) {
191                     decAmount = "" + decAmount + aChar;
192                 }
193                 else {
194                     dolAmount = "" + dolAmount + aChar;
195                 }
196             }
197             if (aChar == ".") {
198                 if (decFlag) {
199                     dolAmount = "";
200                     break;
201                 }
202                 decFlag = true;
203             }
204         }
205
206         if (dolAmount == "") {
207             dolAmount = "0";
208         }
209     // Strip leading 0s
210         if (dolAmount.length > 1) {
211             while(dolAmount.length > 1 && dolAmount.substring(0,1) == "0") {
212                 dolAmount = dolAmount.substring(1,dolAmount.length);
213             }
214         }
215         if (decAmount.length > 2) {
216             decAmount = decAmount.substring(0,2);
217         }
218     // Pad right side
219         if (decAmount.length == 1) {
220            decAmount = decAmount + "0";
221         }
222         if (decAmount.length == 0) {
223            decAmount = decAmount + "00";
224         }
225
226         textObj.value = dolAmount + "." + decAmount;
227     }
228
229     function fnClickAddRow( table, invoiceCode, invoiceTitle, invoicePrice ) {
230       var defaultPrice = { value: invoicePrice };
231       moneyFormat(defaultPrice);
232       table.fnAddData( [
233         invoiceTitle,
234         defaultPrice.value,
235         1,
236         null,
237         '<button class="drop" type="button"><i class="fa fa-trash"></i> Remove</button>',
238         invoiceCode
239         ]
240       );
241     }
242
243     function updateChangeValues() {
244         var change = $('#change')[0];
245         var zero_formatted = "[% 0 | $Price %]";
246         change.innerHTML = Math.round(($('#collected')[0].value - $('#paid')[0].value) * 100) / 100;
247         if (change.innerHTML <= 0) {
248             change.innerHTML = zero_formatted;
249         } else {
250             change.value = change.innerHTML;
251             moneyFormat(change);
252             change.innerHTML = change.value;
253         }
254
255         $(':input[name="change"]').val(change.value);
256         $('#modal_change').html(change.innerHTML);
257     }
258
259     $(document).ready(function() {
260         var sale_table = $("#sale").dataTable($.extend(true, {}, dataTablesDefaults, {
261             "bPaginate": false,
262             "bFilter": false,
263             "bInfo": false,
264             "bAutoWidth": false,
265             "aoColumnDefs": [{
266                 "aTargets": [-3],
267                 "bSortable": false,
268                 "bSearchable": false,
269             }, {
270                 "aTargets": [-3],
271                 "mRender": function ( data, type, full ) {
272                     var price = Number.parseFloat(data);
273                     return price.format_price();
274                 }
275             }, {
276                 "aTargets": [-5],
277                 "sClass" : "editable",
278             }, {
279                 "aTargets": [-4],
280                 "sClass" : "editable_int",
281             }, {
282                 "targets": [-1],
283                 "visible": false,
284                 "searchable": false
285             }],
286             "aaSorting": [
287                 [1, "asc"]
288             ],
289             "fnDrawCallback": function (oSettings) {
290                 var local = this;
291                 local.$('.editable').editable( function(value, settings) {
292                     var aPos = local.fnGetPosition( this );
293                     local.fnUpdate( value, aPos[0], aPos[1], true, false );
294                     return value;
295                 },{
296                     type    : 'number',
297                     step    : '0.01',
298                     min     : '0',
299                     onblur  : 'submit'
300                 });
301                 local.$('.editable_int').editable( function(value, settings) {
302                     var aPos = local.fnGetPosition( this );
303                     local.fnUpdate( value, aPos[0], aPos[1], true, false );
304                     return value;
305                 },{
306                     type    : 'number',
307                     step    : '1',
308                     min     : '0',
309                     onblur  : 'submit'
310                 });
311             },
312             "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
313                 var iTotal = aData[1] * aData[2];
314                 this.fnUpdate( iTotal, nRow, 3, false, false );
315             },
316             "fnFooterCallback": function(nFoot, aData, iStart, iEnd, aiDisplay) {
317                 var iTotalPrice = 0;
318                 for ( var i=0 ; i<aData.length ; i++ )
319                 {
320                     iTotalPrice += aData[i][3]*1;
321                 }
322                 nFoot.getElementsByTagName('td')[1].innerHTML = iTotalPrice.format_price();
323                 $('#paid').val(iTotalPrice);
324                 $('#paid').trigger('change');
325             }
326         }));
327
328         $("#sale").on("click", "button.drop", function(){
329                 sale_table.DataTable().row($(this).parents('tr')).remove().draw(false);
330         });
331
332         var items_table = $("#invoices").dataTable($.extend(true,{}, dataTablesDefaults, {
333                "aoColumnDefs": [
334                   { "aTargets": [ -1, -2 ], "bSortable": false, "bSearchable":false },
335                ],
336                "aaSorting": [[ 0, "asc" ]],
337                "paginationType": "full",
338         }));
339
340         $(".add_button").on("click", function(e) {
341             e.preventDefault();
342             fnClickAddRow(sale_table, $( this ).data('invoiceCode'), $( this ).data('invoiceTitle'), $( this ).data('invoicePrice') );
343             items_table.fnFilter( '' );
344         });
345
346         // Change calculation and modal
347         var change = $('#change')[0];
348         $("#paid, #collected").on("change",function() {
349             moneyFormat( this );
350             if (change != undefined) {
351                 updateChangeValues();
352             }
353         });
354
355         var checked = false;
356         $('#modal_submit').click(function() {
357             checked = true;
358             $('#payForm').submit();
359         });
360
361         $('#payForm').submit(function(e){
362             if (change != undefined && change.innerHTML > 0.00 && !checked) {
363                 e.preventDefault();
364                 $("#confirm_change_form").modal("show");
365             } else {
366                 var rows = sale_table.fnGetData();
367                 rows.forEach(function (row, index) {
368                     var sale = {
369                         code: row[5],
370                         price: row[1],
371                         quantity: row[2]
372                     };
373                     $('<input>').attr({
374                         type: 'hidden',
375                         name: 'sales',
376                         value: JSON.stringify(sale)
377                     }).appendTo('#payForm');
378                 });
379                 return true;
380             }
381         });
382
383         [% IF payment_id && Koha.Preference('FinePaymentAutoPopup') %]
384             $("#printReceipt").click(function() {
385                 var win = window.open('/cgi-bin/koha/pos/printreceipt.pl?action=print&accountlines_id=[% payment_id | uri %]&collected=[% collected | uri %]&change=[% change | uri %]', '_blank');
386                 win.focus();
387             });
388             $("#printReceipt").click();
389         [% END %]
390     });
391     </script>
392 [% END %]
393
394 [% INCLUDE 'intranet-bottom.inc' %]