Browse Source

Add number pad and currency calculator tools, close #16

master
Skylar Ittner 11 months ago
parent
commit
ce10e4af95
9 changed files with 269 additions and 3 deletions
  1. 1
    1
      lang/en_us.php
  2. 2
    0
      pages.php
  3. 18
    0
      pages/pos.php
  4. 10
    0
      static/js/bsalert.js
  5. 99
    0
      static/js/bsmoneypad.js
  6. 68
    0
      static/js/bsnumpad.js
  7. 17
    0
      static/js/pos_items.js
  8. 12
    1
      static/js/pos_management.js
  9. 42
    1
      static/js/pos_payment.js

+ 1
- 1
lang/en_us.php View File

@@ -120,7 +120,7 @@ define("STRINGS", [
120 120
     "pick cash" => "Choose",
121 121
     "cash already closed" => "Cash already closed, cannot edit this transaction.  Process a return instead.",
122 122
     "update" => "Update",
123
-    "transaction search" => "Search transactions (by Tx ID or customer)",
123
+    "transaction search" => "Search transactions",
124 124
     "return" => "Return",
125 125
     "enter refund" => "Enter Refund",
126 126
     "refund" => "Refund",

+ 2
- 0
pages.php View File

@@ -21,6 +21,8 @@ define("PAGES", [
21 21
         "scripts" => [
22 22
             "static/js/input_type_money.js",
23 23
             "static/js/bsalert.js",
24
+            "static/js/bsnumpad.js",
25
+            "static/js/bsmoneypad.js",
24 26
             "static/js/pos_items.js",
25 27
             "static/js/pos_customer.js",
26 28
             "static/js/pos_gridview.js",

+ 18
- 0
pages/pos.php View File

@@ -102,6 +102,9 @@ if (isset($_GET['switch']) || !isset($_SESSION['register']) || !$registeropen) {
102 102
                             <div class="input-group">
103 103
                                 <input type="text" class="form-control" id="transactionsearch" placeholder="<?php lang("transaction search"); ?>" />
104 104
                                 <div class="input-group-append">
105
+                                    <span class="btn btn-link open-number-pad-btn">
106
+                                        <i class="fas fa-keyboard"></i>
107
+                                    </span>
105 108
                                     <button class="btn btn-link" type="button" id="transactionsearchbtn"><i class="fas fa-search"></i></button>
106 109
                                 </div>
107 110
                             </div>
@@ -174,6 +177,11 @@ if (isset($_GET['switch']) || !isset($_SESSION['register']) || !$registeropen) {
174 177
                                             <span class="input-group-text pr-1"><b>$</b></span>
175 178
                                         </div>
176 179
                                         <input type="money" class="form-control item-price" value="<?php echo number_format($amount, 2); ?>"/>
180
+                                        <div class="input-group-append">
181
+                                            <span class="btn btn-outline-primary open-number-pad-btn">
182
+                                                <i class="fas fa-keyboard"></i>
183
+                                            </span>
184
+                                        </div>
177 185
                                         <div class="input-group-prepend">
178 186
                                             <span class="input-group-text px-2"><i class="fas fa-times"></i></span>
179 187
                                             <button class="btn btn-red qty-minus" type="button"><i class="fas <?php
@@ -319,6 +327,11 @@ if (isset($_GET['switch']) || !isset($_SESSION['register']) || !$registeropen) {
319 327
                                             </span>
320 328
                                         </div>
321 329
                                         <input class="form-control payment-entry" type="money" data-type="<?php echo $p['typename']; ?>" value="<?php echo number_format($p['amount'], 2); ?>" />
330
+                                        <div class="input-group-prepend input-group-append">
331
+                                            <span class="btn btn-outline-success open-money-pad-btn">
332
+                                                <i class="fas fa-calculator"></i>
333
+                                            </span>
334
+                                        </div>
322 335
                                         <?php
323 336
                                         if ($p['typename'] == 'giftcard') {
324 337
                                             ?>
@@ -328,6 +341,11 @@ if (isset($_GET['switch']) || !isset($_SESSION['register']) || !$registeropen) {
328 341
                                                 </span>
329 342
                                             </div>
330 343
                                             <input class="form-control giftcard-number" type="number" value="<?php echo $p['certcode']; ?>" />
344
+                                            <div class="input-group-prepend input-group-append">
345
+                                                <span class="btn btn-outline-primary open-number-pad-btn" data-gc="1">
346
+                                                    <i class="fas fa-keyboard"></i>
347
+                                                </span>
348
+                                            </div>
331 349
                                             <?php
332 350
                                         }
333 351
                                         ?>

+ 10
- 0
static/js/bsalert.js View File

@@ -47,6 +47,16 @@ function bsalert(title, message, okbtn, cancelbtn, callback) {
47 47
     $("#bsalert").modal("show");
48 48
 }
49 49
 
50
+/**
51
+ * Prompt the user for input with a modal dialog.
52
+ * @param {type} title Modal title
53
+ * @param {type} message Message content
54
+ * @param {type} okbtn Text for the OK button
55
+ * @param {type} cancelbtn Text for the cancel button
56
+ * @param {type} type Input box type (text, number, etc)
57
+ * @param {type} callback Function to pass the user input to
58
+ * @returns {undefined}
59
+ */
50 60
 function bsprompt(title, message, okbtn, cancelbtn, type, callback) {
51 61
     var html = '<div class="modal fade" id="bsprompt">'
52 62
             + '  <div class="modal-dialog">'

+ 99
- 0
static/js/bsmoneypad.js View File

@@ -0,0 +1,99 @@
1
+/*
2
+ * This Source Code Form is subject to the terms of the Mozilla Public
3
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
4
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
5
+ */
6
+
7
+
8
+function bsmoneypad(title, amount, okbtn, cancelbtn, denominations, callback) {
9
+    var html = '<div class="modal fade" id="bsmoneypad">'
10
+            + '  <div class="modal-dialog">'
11
+            + '    <div class="modal-content">'
12
+            + '      <div class="modal-header">'
13
+            + '        <h5 class="modal-title" id="bsmoneypad-title"></h5>'
14
+            + '        <button type="button" class="close" data-dismiss="modal" aria-label="Close">'
15
+            + '          <span aria-hidden="true">&times;</span>'
16
+            + '        </button>'
17
+            + '      </div>'
18
+            + '      <div class="modal-body" id="bsmoneypad-body">'
19
+            + '        <div class="d-flex justify-content-between align-content-center m-2">'
20
+            + '          <div class="btn btn-outline-success" id="bsmoneypad-plusminus" data-direction="plus"><i class="fas fa-plus"></i></div>'
21
+            + '          <div class="h2" id="bsmoneypad-amount" data-amount="0">$0.00</div>'
22
+            + '          <div class="btn btn-outline-primary" id="bsmoneypad-reset"><i class="fas fa-eraser"></i></div>'
23
+            + '        </div>'
24
+            + '        <div id="bsmoneypad-pad" class="d-flex flex-wrap"></div>'
25
+            + '      </div>'
26
+            + '      <div class="modal-footer">'
27
+            + '        <button type="button" class="btn btn-secondary" data-dismiss="modal" id="bsmoneypad-cancel">Cancel</button>'
28
+            + '        <button type="button" class="btn btn-primary" id="bsmoneypad-ok">OK</button>'
29
+            + '      </div>'
30
+            + '    </div>'
31
+            + '  </div>'
32
+            + '</div>';
33
+    $("body").append(html);
34
+    if (denominations == null) {
35
+        denominations = [1.00, 2.00, 5.00, 10.00, 20.00, 50.00, 100.00, null, 0.01, 0.05, 0.10, 0.25, 0.50];
36
+    }
37
+    function addButton(val, label) {
38
+        $("#bsmoneypad-pad").append('<div class="btn btn-default moneypadbtn m-1" data-amount="' + val + '"><h5>' + label + '</h5></div>');
39
+    }
40
+    for (var i = 0; i < denominations.length; i++) {
41
+        if (denominations[i] === null) {
42
+            $("#bsmoneypad-pad").append('<div class="w-100 my-0 py-0"><hr /></div>');
43
+            continue;
44
+        }
45
+        var lbl = "";
46
+        if (denominations[i] < 1) {
47
+            lbl = denominations[i] * 100.0 + "¢";
48
+        } else if (denominations[i] % 1 === 0) {
49
+            lbl = "$" + denominations[i];
50
+        } else {
51
+            lbl = "$" + denominations[i].toFixed(2);
52
+        }
53
+        addButton(denominations[i], lbl);
54
+    }
55
+    $("#bsmoneypad-title").html(title);
56
+    $("#bsmoneypad-amount").text("$" + (amount * 1.0).toFixed(2));
57
+    $("#bsmoneypad-amount").data('amount', (amount * 1.0));
58
+    $("#bsmoneypad-ok").html(okbtn);
59
+    $("#bsmoneypad-cancel").html(cancelbtn);
60
+    $("#bsmoneypad-pad").on("click", ".moneypadbtn", function () {
61
+        var total = $("#bsmoneypad-amount").data('amount') * 1.0;
62
+        var amount = $(this).data('amount');
63
+        if ($("#bsmoneypad-plusminus").data("direction") == "plus") {
64
+            total += amount;
65
+        } else {
66
+            total -= amount;
67
+        }
68
+        $("#bsmoneypad-amount").text("$" + (total * 1.0).toFixed(2));
69
+        $("#bsmoneypad-amount").data('amount', (total * 1.0));
70
+    });
71
+    $("#bsmoneypad-plusminus").on("click", function () {
72
+        if ($(this).data("direction") == "plus") {
73
+            $(this).data("direction", "minus");
74
+            $(this).removeClass("btn-outline-success");
75
+            $(this).addClass("btn-outline-danger");
76
+            $(this).html('<i class="fas fa-minus"></i>');
77
+        } else {
78
+            $(this).data("direction", "plus");
79
+            $(this).removeClass("btn-outline-danger");
80
+            $(this).addClass("btn-outline-success");
81
+            $(this).html('<i class="fas fa-plus"></i>');
82
+        }
83
+    });
84
+    $("#bsmoneypad-reset").on("click", function () {
85
+        $("#bsmoneypad-amount").text("$0.00");
86
+        $("#bsmoneypad-amount").data('amount', 0.0);
87
+    });
88
+    $("#bsmoneypad-ok").on("click", function () {
89
+        callback($("#bsmoneypad-amount").data('amount').toFixed(2) * 1.0);
90
+        $("#bsmoneypad").modal("hide");
91
+    });
92
+    $("#bsmoneypad").on("shown.bs.modal", function () {
93
+        $("#bsmoneypad-input").focus();
94
+    });
95
+    $("#bsmoneypad").on("hidden.bs.modal", function () {
96
+        $("#bsmoneypad").remove();
97
+    });
98
+    $("#bsmoneypad").modal("show");
99
+}

+ 68
- 0
static/js/bsnumpad.js View File

@@ -0,0 +1,68 @@
1
+/*
2
+ * This Source Code Form is subject to the terms of the Mozilla Public
3
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
4
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
5
+ */
6
+
7
+
8
+function bsnumpad(title, content, okbtn, cancelbtn, callback) {
9
+    var html = '<div class="modal fade" id="bsnumpad">'
10
+            + '  <div class="modal-dialog">'
11
+            + '    <div class="modal-content">'
12
+            + '      <div class="modal-header">'
13
+            + '        <h5 class="modal-title" id="bsnumpad-title"></h5>'
14
+            + '        <button type="button" class="close" data-dismiss="modal" aria-label="Close">'
15
+            + '          <span aria-hidden="true">&times;</span>'
16
+            + '        </button>'
17
+            + '      </div>'
18
+            + '      <div class="modal-body" id="bsnumpad-body">'
19
+            + '        <div class="display-4 text-center">&nbsp;<span id="bsnumpad-input"></span>&nbsp;</div>'
20
+            + '        <div id="bsnumpad-pad" class="row"></div>'
21
+            + '      </div>'
22
+            + '      <div class="modal-footer">'
23
+            + '        <button type="button" class="btn btn-secondary" data-dismiss="modal" id="bsnumpad-cancel">Cancel</button>'
24
+            + '        <button type="button" class="btn btn-primary" id="bsnumpad-ok">OK</button>'
25
+            + '      </div>'
26
+            + '    </div>'
27
+            + '  </div>'
28
+            + '</div>';
29
+    $("body").append(html);
30
+    function addButton(val, label) {
31
+        $("#bsnumpad-pad").append('<div class="col-4 p-1"><div class="w-100 h-100 p-2 py-3 btn btn-default numpadbtn" data-key="' + val + '"><h5>' + label + '</h5></div></div>');
32
+    }
33
+    for (var i = 1; i <= 9; i++) {
34
+        addButton(i, i);
35
+    }
36
+    addButton('0', '0');
37
+    addButton('.', '.');
38
+    addButton('clear', '<i class="fas fa-eraser"></i>');
39
+    $("#bsnumpad-pad").on("click", ".numpadbtn", function () {
40
+        var char = $(this).data('key');
41
+        var val = $("#bsnumpad-input").text();
42
+        if (char == "clear") {
43
+            val = "";
44
+        } else if (char == ".") {
45
+            if (!val.includes('.')) {
46
+                val += char;
47
+            }
48
+        } else {
49
+            val += char;
50
+        }
51
+        $("#bsnumpad-input").text(val);
52
+    });
53
+    $("#bsnumpad-title").html(title);
54
+    $("#bsnumpad-input").text(content);
55
+    $("#bsnumpad-ok").html(okbtn);
56
+    $("#bsnumpad-cancel").html(cancelbtn);
57
+    $("#bsnumpad-ok").on("click", function () {
58
+        callback($("#bsnumpad-input").text());
59
+        $("#bsnumpad").modal("hide");
60
+    });
61
+    $("#bsnumpad").on("shown.bs.modal", function () {
62
+        $("#bsnumpad-input").focus();
63
+    });
64
+    $("#bsnumpad").on("hidden.bs.modal", function () {
65
+        $("#bsnumpad").remove();
66
+    });
67
+    $("#bsnumpad").modal("show");
68
+}

+ 17
- 0
static/js/pos_items.js View File

@@ -30,6 +30,11 @@ function addItem(name, code, price, id) {
30 30
             + '<span class="input-group-text pr-1"><b>$</b></span>'
31 31
             + '</div>'
32 32
             + '<input type="money" class="form-control item-price" value="' + price + '"/>'
33
+            + '        <div class="input-group-append">'
34
+            + '            <span class="btn btn-outline-primary open-number-pad-btn">'
35
+            + '                <i class="fas fa-keyboard"></i>'
36
+            + '            </span>'
37
+            + '        </div>'
33 38
             + '<div class="input-group-prepend">'
34 39
             + '<span class="input-group-text px-2"><i class="fas fa-times"></i></span>'
35 40
             + '<button class="btn btn-red qty-minus" type="button"><i class="fas fa-trash"></i></button>'
@@ -153,6 +158,18 @@ $("#pos-lines-box").on("keypress", ".item-qty,.item-price", function (e) {
153 158
     }
154 159
 });
155 160
 
161
+$("#pos-lines-box").on("click", ".open-number-pad-btn", function (e) {
162
+    var inputbox = $(this).parents('.input-group').children(".item-price");
163
+    var value = inputbox.val();
164
+    if (isNaN(value)) {
165
+        value = '';
166
+    }
167
+    bsnumpad("Keyboard", value, "Save", "Cancel", function (answer) {
168
+        inputbox.val(answer);
169
+        recalculate();
170
+    });
171
+});
172
+
156 173
 $("#barcode").on('keypress', function (e) {
157 174
     if (e.which === 13) {
158 175
         findItem($("#barcode").val());

+ 12
- 1
static/js/pos_management.js View File

@@ -85,7 +85,7 @@ $("#transactionsearch").on('keypress', function (e) {
85 85
 });
86 86
 
87 87
 $("#transactionsearchbtn").on("click", function () {
88
-    showCustomerList($("#transactionsearch").val());
88
+    showTransactionList($("#transactionsearch").val());
89 89
     $("#transactionsearch").val("");
90 90
 });
91 91
 
@@ -94,4 +94,15 @@ $("#managermodal").on("click", ".printreceiptbtn", function () {
94 94
     $("#receiptchangediv").addClass("d-none");
95 95
     $("#receiptframe").attr("src", 'action.php?action=getreceipt&txid=' + $(this).data("txid"));
96 96
     $("#receiptmodal").modal();
97
+});
98
+
99
+$("#managermodal .open-number-pad-btn").click(function () {
100
+    var inputbox = $("#transactionsearch");
101
+    var value = inputbox.val();
102
+    if (isNaN(value)) {
103
+        value = '';
104
+    }
105
+    bsnumpad("Keyboard", value, '<i class="fas fa-search"></i> Search', "Cancel", function (answer) {
106
+        showTransactionList(answer);
107
+    });
97 108
 });

+ 42
- 1
static/js/pos_payment.js View File

@@ -13,7 +13,12 @@ function addPayment(type, icon, text) {
13 13
                 + '                #'
14 14
                 + '            </span>'
15 15
                 + '        </div>'
16
-                + '        <input class="form-control giftcard-number" type="number" />';
16
+                + '        <input class="form-control giftcard-number" type="number" />'
17
+                + '        <div class="input-group-prepend input-group-append">'
18
+                + '            <span class="btn btn-outline-primary open-number-pad-btn" data-gc="1">'
19
+                + '                <i class="fas fa-keyboard"></i>'
20
+                + '            </span>'
21
+                + '        </div>';
17 22
     }
18 23
     var amount = "";
19 24
     // Autofill the exact due amount for payment methods that are flexible like that
@@ -37,6 +42,14 @@ function addPayment(type, icon, text) {
37 42
             + '            </span>'
38 43
             + '        </div>'
39 44
             + '        <input class="form-control payment-entry" type="money" data-type="' + type + '" value="' + amount + '" />'
45
+            + '        <div class="input-group-prepend input-group-append">'
46
+//            + '            <span class="btn btn-outline-primary open-number-pad-btn" data-gc="0">'
47
+//            + '                <i class="fas fa-keyboard"></i>'
48
+//            + '            </span>'
49
+            + '            <span class="btn btn-outline-success open-money-pad-btn">'
50
+            + '                <i class="fas fa-calculator"></i>'
51
+            + '            </span>'
52
+            + '        </div>'
40 53
             + extrafield
41 54
             + '        <div class="input-group-append">'
42 55
             + '            <span class="btn btn-outline-danger remove-payment-btn">'
@@ -102,6 +115,34 @@ $("#payment-lines").on("click", ".remove-payment-btn", function () {
102 115
     recalculate();
103 116
 });
104 117
 
118
+$("#payment-lines").on("click", ".open-money-pad-btn", function () {
119
+    var inputbox = $(this).parents('.input-group').children(".payment-entry");
120
+    var value = inputbox.val();
121
+    if (isNaN(value)) {
122
+        value = 0.0;
123
+    }
124
+    bsmoneypad("Currency Calculator", value * 1.0, "Save", "Cancel", null, function (answer) {
125
+        inputbox.val(answer);
126
+        recalculate();
127
+    });
128
+});
129
+
130
+$("#payment-lines").on("click", ".open-number-pad-btn", function () {
131
+    if ($(this).data('gc') == '1') {
132
+        var inputbox = $(this).parents('.input-group').children(".giftcard-number");
133
+    } else {
134
+        var inputbox = $(this).parents('.input-group').children(".payment-entry");
135
+    }
136
+    var value = inputbox.val();
137
+    if (isNaN(value)) {
138
+        value = '';
139
+    }
140
+    bsnumpad("Keyboard", value, "Save", "Cancel", function (answer) {
141
+        inputbox.val(answer);
142
+        recalculate();
143
+    });
144
+});
145
+
105 146
 $("#paymentbtn").click(function () {
106 147
     $("#paymentui").removeClass("d-none");
107 148
 });

Loading…
Cancel
Save