[Enhancement] POS, numeric keypad
diff --git a/erpnext/public/build.json b/erpnext/public/build.json
index c405681..858514e 100644
--- a/erpnext/public/build.json
+++ b/erpnext/public/build.json
@@ -20,6 +20,7 @@
"public/js/controllers/transaction.js",
"public/js/pos/pos.html",
"public/js/pos/pos_bill_item.html",
+ "public/js/pos/pos_selected_item.html",
"public/js/pos/pos_item.html",
"public/js/pos/pos_tax_row.html",
"public/js/pos/pos_invoice_list.html",
diff --git a/erpnext/public/css/erpnext.css b/erpnext/public/css/erpnext.css
index cfe9f63..b1f1985 100644
--- a/erpnext/public/css/erpnext.css
+++ b/erpnext/public/css/erpnext.css
@@ -59,7 +59,8 @@
padding: 10px 0px;
border-bottom: 1px solid #d1d8dd;
}
-.item-list-area {
+.item-list-area,
+.list-customers {
padding: 15px 0px;
overflow-y: scroll;
height: calc(100vh - 162px);
@@ -82,6 +83,19 @@
margin-left: -15px;
margin-right: -15px;
}
+.item-cart {
+ overflow-y: scroll;
+ height: calc(100vh - 60vh);
+}
+.edit-pos-item {
+ height: 40px;
+ font-size: 14px;
+ border-top: 1px solid #d1d8dd;
+}
+.pos-bill-item:hover {
+ background-color: #f5f7fa;
+ cursor: pointer;
+}
.pos-bill-row {
margin: 0px;
padding: 7px 0px;
@@ -157,13 +171,20 @@
.pos-keyboard-key,
.delete-btn {
border: 1px solid #d1d8dd;
- height: 85px;
- width: 85px;
- margin: 10px 10px;
- font-size: 24px;
+ height: 69px;
+ width: 69px;
+ font-size: 20px;
font-weight: 200;
background-color: #FDFDFD;
border-color: #e8e8e8;
+ margin-left: -4px;
+}
+.pos-pay {
+ height: 69px;
+ width: 69px;
+ font-size: 17px;
+ font-weight: 200;
+ margin-left: -4px;
}
.multimode-payments {
padding-left: 30px;
diff --git a/erpnext/public/js/pos/pos.html b/erpnext/public/js/pos/pos.html
index 44e42d7..c634135 100644
--- a/erpnext/public/js/pos/pos.html
+++ b/erpnext/public/js/pos/pos.html
@@ -17,12 +17,12 @@
</div>
<div class="pos-bill">
<div class="item-cart">
- <div class="row pos-bill-row pos-bill-header">
+ <!-- <div class="row pos-bill-row pos-bill-header">
<div class="col-xs-4"><h6>{%= __("Item") %}</h6></div>
<div class="col-xs-3"><h6 class="text-right">{%= __("Quantity") %}</h6></div>
<div class="col-xs-2"><h6 class="text-right">{%= __("Discount") %}</h6></div>
<div class="col-xs-3"><h6 class="text-right">{%= __("Rate") %}</h6></div>
- </div>
+ </div> -->
<div class="items"></div>
</div>
<div class="totals-area">
@@ -54,15 +54,38 @@
</div>
</div>
{% } %}
- <div class="row pos-bill-row grand-total-area">
+ <div class="row pos-bill-row grand-total-area" style="border-bottom:1px solid #d1d8dd;">
<div class="col-xs-6"><h6>{%= __("Grand Total") %}</h6></div>
<div class="col-xs-6"><h6 class="grand-total text-right"></h6></div>
</div>
</div>
</div>
- <div class="list-customers">
+
+ <div class="list-customers" style = "display:none">
</div>
+ <div class="row">
+ <div class="col-xs-5 selected-item">
+
+ </div>
+ <div class="col-xs-7 numeric_keypad" style="display:none">
+ {% var chartData = ["Qty", "Disc", "Price"] %}
+ {% for(var i=0; i<3; i++) { %}
+ <div class="row text-right">
+ {% for(var j=i*3; j<(i+1)*3; j++) { %}
+ <button type="button" class="btn btn-default pos-keyboard-key">{{j+1}}</button>
+ {% } %}
+ <button type="button" class="btn text-center btn-default pos-keyboard-key">{{ chartData[i] }}</button>
+ </div>
+ {% } %}
+ <div class="row text-right">
+ <button type="button" class="btn btn-default delete-btn">Del</button>
+ <button type="button" class="btn btn-default pos-keyboard-key">0</button>
+ <button type="button" class="btn btn-default pos-keyboard-key">.</button>
+ <button type="button" class="btn btn-primary pos-pay">Pay</button>
+ </div>
+ </div>
+ </div>
</div>
<div class="col-sm-6 pos-items-section">
<div class="row pos-item-area">
@@ -77,10 +100,10 @@
<div class="app-listing item-list"></ul>
</div>
</div>
- <div class="row">
+ <!-- <div class="row">
<div class="text-right list-paging-area">
<button class="btn btn-default btn-more btn-sm" style="margin:5px 20px">{{ __("More") }}</button>
</div>
- </div>
+ </div> -->
</div>
</div>
diff --git a/erpnext/public/js/pos/pos_selected_item.html b/erpnext/public/js/pos/pos_selected_item.html
new file mode 100644
index 0000000..491938e
--- /dev/null
+++ b/erpnext/public/js/pos/pos_selected_item.html
@@ -0,0 +1,27 @@
+<h5 style="margin-top:5px">Item <span class="text-primary no-margin font-montserrat">{%= item_name %}</h5>
+<div class="pos-bill-item" data-item-code="{%= item_code %}">
+ <div class="form-group edit-pos-item">
+ <label class=" text-left col-xs-4">Price:</label>
+ <div class="col-xs-8">
+ <input class="form-control text-right" value="{%= rate %}">
+ </div>
+ </div>
+ <div class="form-group edit-pos-item">
+ <label class=" text-left col-xs-4">Qty:</label>
+ <div class="col-xs-8">
+ <input class="form-control text-right pos-item-qty" value="{%= qty %}">
+ </div>
+ </div>
+ <div class="form-group edit-pos-item">
+ <label class=" text-left col-xs-4">Discount:</label>
+ <div class="col-xs-8">
+ <input class="form-control text-right" value="{%= discount_percentage %}">
+ </div>
+ </div>
+ <div class="form-group edit-pos-item">
+ <label class=" text-left col-xs-4">Amount:</label>
+ <div class="col-xs-8">
+ <input class="form-control text-right " value="{%= amount %}">
+ </div>
+ </div>
+</div>
\ No newline at end of file
diff --git a/erpnext/public/less/erpnext.less b/erpnext/public/less/erpnext.less
index 495e618..34ea901 100644
--- a/erpnext/public/less/erpnext.less
+++ b/erpnext/public/less/erpnext.less
@@ -74,7 +74,7 @@
border-bottom: 1px solid #d1d8dd;
}
-.item-list-area {
+.item-list-area, .list-customers {
padding: 15px 0px;
overflow-y: scroll;
height: ~"calc(100vh - 162px)";
@@ -102,6 +102,22 @@
margin-right: -15px;
}
+.item-cart {
+ overflow-y: scroll;
+ height: ~"calc(100vh - 60vh)";
+}
+
+.edit-pos-item {
+ height: 40px;
+ font-size: 14px;
+ border-top: 1px solid @border-color;
+}
+
+.pos-bill-item:hover {
+ background-color: #f5f7fa;
+ cursor: pointer;
+}
+
.pos-bill-row {
margin: 0px;
padding: 7px 0px;
@@ -197,13 +213,21 @@
.pos-keyboard-key, .delete-btn {
border: 1px solid #d1d8dd;
- height:85px;
- width:85px;
- margin:10px 10px;
- font-size:24px;
+ height:69px;
+ width:69px;
+ font-size:20px;
font-weight:200;
background-color: #FDFDFD;
border-color: #e8e8e8;
+ margin-left:-4px;
+}
+
+.pos-pay {
+ height:69px;
+ width:69px;
+ font-size:17px;
+ font-weight:200;
+ margin-left:-4px;
}
.multimode-payments {