@@ -13,9 +13,9 @@ export var PackagingQtyPickerMixin = {
1313 methods : {
1414 on_change_pkg_qty : function ( event ) {
1515 const input = event . target ;
16- let new_qty = parseInt ( input . value , 10 ) ;
16+ let new_qty = parseInt ( input . value || 0 , 10 ) ;
1717 const data = $ ( input ) . data ( ) ;
18- const origvalue = data . origvalue || 0 ;
18+ const origvalue = parseInt ( data . origvalue || 0 , 10 ) ;
1919 // Check max qty reached
2020 const future_qty = this . value + data . pkg . qty * ( new_qty - origvalue ) ;
2121 if ( new_qty && future_qty > this . original_value ) {
@@ -75,6 +75,10 @@ export var PackagingQtyPickerMixin = {
7575 // const min_unit = _.last(pkg_by_qty);
7676 pkg_by_qty . forEach ( function ( pkg ) {
7777 let qty_per_pkg = 0 ;
78+ if ( ! pkg . qty ) {
79+ console . error ( "Packaging with no quantity: skipping" , pkg ) ;
80+ return { } ;
81+ }
7882 [ qty_per_pkg , qty ] = self . _qty_by_pkg ( pkg . qty , qty ) ;
7983 if ( qty_per_pkg ) res [ pkg . id ] = qty_per_pkg ;
8084 if ( ! qty ) return ;
@@ -108,36 +112,33 @@ export var PackagingQtyPickerMixin = {
108112 compute_qty : function ( newVal , oldVal ) {
109113 this . value = this . _compute_qty ( ) ;
110114 } ,
111- } ,
112- watch : {
113- value : {
114- handler : function ( newVal , oldVal ) {
115- this . $root . trigger ( "qty_edit" , this . value ) ;
116- } ,
115+ _init_editable ( ) {
116+ const self = this ;
117+ this . $watch (
118+ "qty_by_pkg" ,
119+ function ( ) {
120+ self . compute_qty ( ) ;
121+ } ,
122+ { deep : true }
123+ ) ;
124+ this . qty_by_pkg = this . product_qty_by_packaging ( ) ;
125+ this . orig_qty_by_pkg = this . qty_by_pkg ;
126+ // hooking via `v-on:change` we don't get the full event but only the qty :/
127+ // And forget about using v-text-field because it loses the full event object
128+ $ ( ".pkg-value" , this . $el ) . change ( this . on_change_pkg_qty ) ;
129+ $ ( ".pkg-value" , this . $el ) . on ( "focus click" , function ( ) {
130+ $ ( this ) . select ( ) ;
131+ } ) ;
132+ } ,
133+ _init_readonly ( ) {
134+ this . qty_by_pkg = this . product_qty_by_packaging ( ) ;
135+ this . compute_qty ( ) ;
117136 } ,
118137 } ,
119138 created : function ( ) {
120139 this . original_value = parseInt ( this . opts . init_value , 10 ) ;
121140 this . value = parseInt ( this . opts . init_value , 10 ) ;
122141 } ,
123- mounted : function ( ) {
124- const self = this ;
125- this . $watch (
126- "qty_by_pkg" ,
127- function ( ) {
128- self . compute_qty ( ) ;
129- } ,
130- { deep : true }
131- ) ;
132- this . qty_by_pkg = this . product_qty_by_packaging ( ) ;
133- this . orig_qty_by_pkg = this . qty_by_pkg ;
134- // hooking via `v-on:change` we don't get the full event but only the qty :/
135- // And forget about using v-text-field because it loses the full event object
136- $ ( ".pkg-value" , this . $el ) . change ( this . on_change_pkg_qty ) ;
137- $ ( ".pkg-value" , this . $el ) . on ( "focus click" , function ( ) {
138- $ ( this ) . select ( ) ;
139- } ) ;
140- } ,
141142 computed : {
142143 opts ( ) {
143144 const opts = _ . defaults ( { } , this . $props . options , {
@@ -180,6 +181,16 @@ export var PackagingQtyPickerMixin = {
180181
181182export var PackagingQtyPicker = Vue . component ( "packaging-qty-picker" , {
182183 mixins : [ PackagingQtyPickerMixin ] ,
184+ watch : {
185+ value : {
186+ handler : function ( newVal , oldVal ) {
187+ this . $root . trigger ( "qty_edit" , this . value ) ;
188+ } ,
189+ } ,
190+ } ,
191+ mounted : function ( ) {
192+ this . _init_editable ( ) ;
193+ } ,
183194 template : `
184195<div :class="[$options._componentTag, opts.mode ? 'mode-' + opts.mode: '']">
185196 <v-row class="unit-value">
@@ -211,12 +222,17 @@ export var PackagingQtyPicker = Vue.component("packaging-qty-picker", {
211222
212223export var PackagingQtyPickerDisplay = Vue . component ( "packaging-qty-picker-display" , {
213224 mixins : [ PackagingQtyPickerMixin ] ,
225+ mounted : function ( ) {
226+ this . _init_readonly ( ) ;
227+ } ,
214228 template : `
215229<div :class="[$options._componentTag, opts.mode ? 'mode-' + opts.mode: '', 'd-inline']">
216230 <span class="packaging" v-for="(pkg, index) in sorted_packaging">
217231 <span class="pkg-qty" v-text="qty_by_pkg[pkg.id] || 0" />
218232 <span class="pkg-name" v-text="pkg.name" /><span class="sep" v-if="index != Object.keys(sorted_packaging).length - 1">, </span>
219233 </span>
234+ <!-- TOOO: use product uom -->
235+ <span class="min-unit">({{ opts.init_value }} Units)</span>
220236</div>
221237` ,
222238} ) ;
0 commit comments