koha-tmpl/intranet-tmpl/prog/en/modules/pos/pay.tt

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