[ADD] payment store definition

src/components/common/CardGrid.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
     .card-grid-wrapper
         .card-grid-loading(v-if='loading')
-            spinner
+            spinner(type='wave')
         .card-grid(v-else)
             add-card(v-if='canAdd' @onClickAdd='onClickAdd')
             card(v-for='item in items' :key='item.id' :title='item.name' :image='item.imageMedium' :isSelected='item.id === selectedId' :description='getDescription(item)' @onClick='onClickCard(item)')

src/components/common/Spinner.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-    .spinner
+    .spinner(v-if="type === 'wave'")
         .spinner-rect.spinner-rect-1
         .spinner-rect.spinner-rect-2
         .spinner-rect.spinner-rect-3
@@ -9,7 +9,10 @@
 
 <script>
     export default {
-    
+        props: {
+            type: String,
+            default: 'wave'
+        }
     }
 </script>
 

src/components/steps/PaymentAmount.vue

@@ -10,11 +10,11 @@
                 input.form-input(:value='cartTotal' readonly)
             .form-item
                 label.form-label Monto Recibido
-                input.form-input(:value='amountReceived' v-model='amountReceived' autofocus)
+                input.form-input(:value='initialPayment' v-model='amountReceived' autofocus)
             .form-item(v-show="paymentType === 'cash'")
                 hr
                 label.form-label Monto a Devolver
-                input.form-input(:value='amountResidual' readonly)
+                input.form-input(:value='paymentResidual' readonly)
             .form-item-table(v-show="paymentType === 'credit'")
                 table
                     thead
@@ -28,38 +28,40 @@
 </template>
 
 <script>
-    import { mapGetters } from 'vuex'
+    import { mapGetters, mapActions } from 'vuex'
 
     import Ticket from '@@/common/Ticket'
 
+    import { CHANGE_INITIAL_PAYMENT } from '@/constants/actionTypes'
+
     export default {
         components: {
             Ticket
         },
-        computed: mapGetters([
-            'selectedCustomer',
-            'cartItems',
-            'cartTotal',
-            'paymentType',
-            'paymentTerms'
-        ]),
-        watch: {
-            amountReceived(value) {
-                this.computeAmountResidual(value)
-            }
-        },
-        methods: {
-            computeAmountResidual(value) {
-                this.amountResidual = this.cartTotal - parseFloat(value)
-            }
+        computed: {
+            amountReceived: {
+                get() {
+                    return this.initialPayment
+                },
+                set(value) {
+                    value = parseFloat(value)
+                    this.changeInitialPayment(Number.isNaN(value) ? 0 : value)    
+                }
+            },
+            ...mapGetters([
+                'selectedCustomer',
+                'cartItems',
+                'cartTotal',
+                'paymentTerms',
+                'paymentType',
+                'paymentLines',
+                'initialPayment',
+                'paymentResidual'
+            ])
         },
-        data() {
-            return {
-                amountReceived: 0,
-                amountResidual: 0,
-                paymentLines: []
-            }
-        }
+        methods: mapActions([
+            CHANGE_INITIAL_PAYMENT
+        ])
     }
 </script>
 

src/components/steps/Product.vue

@@ -2,7 +2,7 @@
     .pos-step
         .products-selector
             searcher(:items='products' :keys="['name', 'displayName']")
-            card-grid(:items='products' :loading='loadingProducts' canAdd @onAdd='showProductForm' @onSelect='selectProduct')
+            card-grid(:items='products' :loading='loadingProducts' @onAdd='showProductForm' @onSelect='selectProduct')
             product-modal(:show='showingProductForm' @onAccept='submitProduct' @onCancel='hideProductForm')
         cart(:items='cartItems' @onTotalComputed='changeCartTotal' @onIncrementQty='addToCart' @onDecrementQty='decreaseFromCart' @onDeleteItem='removeFromCart')
 </template>

src/constants/actionTypes.js

@@ -26,6 +26,10 @@ const INIT_PAYMENT_TERMS = 'initPaymentTerms'
 
 const CHANGE_PAYMENT_TYPE = 'changePaymentType'
 
+const CHANGE_INITIAL_PAYMENT = 'changeInitialPayment'
+
+const COMPUTE_PAYMENT_LINES = 'computePaymentLines'
+
 const INIT_JOURNALS = 'initJournals' 
 
 const INIT_DATE = 'initDate'
@@ -55,32 +59,13 @@ const DECREASE_FROM_CART = 'decreaseFromCart'
 const REMOVE_FROM_CART = 'removeFromCart'
 
 export {
-    NOTIFY,
-    INIT_SALE,
-    EXPLODE_DATA,
-    CREATE_SALE,
-    INIT_USER,
-    INIT_PRODUCTS,
-    SHOW_PRODUCT_FORM,
-    HIDE_PRODUCT_FORM,
-    SUBMIT_PRODUCT,
-    CREATE_PRODUCT,
-    RECEIVE_PRODUCT,
-    SELECT_PRODUCT,
-    INIT_PAYMENT_TERMS,
-    CHANGE_PAYMENT_TYPE,
-    INIT_JOURNALS,
-    INIT_DATE,
-    INIT_CUSTOMERS,
-    SHOW_CUSTOMER_FORM,
-    HIDE_CUSTOMER_FORM,
-    SUBMIT_CUSTOMER,
-    CREATE_CUSTOMER,
-    RECEIVE_CUSTOMER,
-    SELECT_CUSTOMER,
-    INIT_CURRENCIES,
-    CHANGE_CART_TOTAL,
-    ADD_TO_CART,
-    DECREASE_FROM_CART,
-    REMOVE_FROM_CART
+    NOTIFY, INIT_SALE, EXPLODE_DATA, CREATE_SALE, // Sale
+    INIT_USER, // Users
+    INIT_PRODUCTS, SHOW_PRODUCT_FORM, HIDE_PRODUCT_FORM, SUBMIT_PRODUCT, CREATE_PRODUCT, RECEIVE_PRODUCT, SELECT_PRODUCT, // Product
+    INIT_PAYMENT_TERMS, CHANGE_PAYMENT_TYPE, CHANGE_INITIAL_PAYMENT, COMPUTE_PAYMENT_LINES, // Payment terms
+    INIT_JOURNALS, // Journals
+    INIT_DATE, // Date
+    INIT_CUSTOMERS, SHOW_CUSTOMER_FORM, HIDE_CUSTOMER_FORM, SUBMIT_CUSTOMER, CREATE_CUSTOMER, RECEIVE_CUSTOMER, SELECT_CUSTOMER, // Customer
+    INIT_CURRENCIES, // Currencies
+    CHANGE_CART_TOTAL, ADD_TO_CART, DECREASE_FROM_CART, REMOVE_FROM_CART // Cart
 }

src/constants/mutationTypes.js

@@ -18,12 +18,24 @@ const SET_PAYMENT_TERMS = 'setPaymentTerms'
 
 const SET_LOADING_PAYMENT_TERMS = 'setLoadingPaymentTerms'
 
+const AUTOSELECT_PAYMENT_TERM = 'autoSelectPaymentTerm'
+
+const SET_SELECTED_PAYMENT_TERM = 'setSelectedPaymentTerm'
+
 const SET_PAYMENT_TYPE = 'setPaymentType'
 
+const SET_INITIAL_PAYMENT = 'setInitialPayment'
+
+const SET_PAYMENT_LINES = 'setPaymentLines'
+
 const SET_JOURNALS = 'setJournals'
 
 const SET_LOADING_JOURNALS= 'setLoadingJournals'
 
+const AUTOSELECT_JOURNAL = 'autoSelectJournal'
+
+const SET_SELECTED_JOURNAL = 'setSelectedJournal'
+
 const SET_DATE = 'setDate'
 
 const SET_LOADING_DATE = 'setLoadingDate'
@@ -51,8 +63,8 @@ const SET_CART_TOTAL = 'setCartTotal'
 export {
     SET_USER, SET_LOADING_USER, // User
     SET_PRODUCTS, SET_LOADING_PRODUCTS, ADD_PRODUCT, SET_SHOW_PRODUCT_FORM, SELECT_PRODUCT, SET_PRODUCT_WITH_VARIANT, // Product
-    SET_PAYMENT_TERMS, SET_LOADING_PAYMENT_TERMS, SET_PAYMENT_TYPE, // Payment Term
-    SET_JOURNALS, SET_LOADING_JOURNALS, // Journal
+    SET_PAYMENT_TERMS, SET_LOADING_PAYMENT_TERMS, AUTOSELECT_PAYMENT_TERM, SET_SELECTED_PAYMENT_TERM, SET_PAYMENT_TYPE, SET_INITIAL_PAYMENT, SET_PAYMENT_LINES, // Payment
+    SET_JOURNALS, SET_LOADING_JOURNALS, AUTOSELECT_JOURNAL, SET_SELECTED_JOURNAL, // Journal
     SET_DATE, SET_LOADING_DATE, // Date
     SET_CUSTOMERS, SET_LOADING_CUSTOMERS, SET_SHOW_CUSTOMER_FORM, SET_SELECTED_CUSTOMER, ADD_CUSTOMER, // Customer
     SET_CURRENCIES, SET_LOADING_CURRENCIES, // Currency

src/store/modules/journal.js

@@ -1,14 +1,16 @@
-import { SET_JOURNALS, SET_LOADING_JOURNALS } from '@/constants/mutationTypes'
-import { INIT_JOURNALS } from '@/constants/actionTypes'
+import { SET_JOURNALS, SET_LOADING_JOURNALS, AUTOSELECT_JOURNAL, SET_SELECTED_JOURNAL } from '@/constants/mutationTypes'
+import { INIT_JOURNALS, SELECT_JOURNAL } from '@/constants/actionTypes'
 
 const initialState = {
     journals: [],
-    loadingJournals: false
+    loadingJournals: false,
+    selectedJournal: null
 }
 
 const state = {
     journals: initialState.journals,
-    loadingJournals: !initialState.loadingJournals
+    loadingJournals: !initialState.loadingJournals,
+    selectedJournal: initialState.selectedJournal
 }
 
 const getters = {
@@ -25,6 +27,13 @@ const getters = {
      */
     loadingJournals(state) {
         return state.loadingJournals
+    },
+    /**
+     * 
+     * @param {*} state 
+     */
+    selectedJournal(state) {
+        return state.selectedJournal
     }
 }
 
@@ -44,6 +53,22 @@ const mutations = {
      */
     [SET_LOADING_JOURNALS] (state, payload) {
         state.loadingJournals = !!payload
+    },
+    /**
+     * 
+     * @param {*} state 
+     * @param {*} payload 
+     */
+    [AUTOSELECT_JOURNAL] (state) {
+        state.selectedJournal = state.journals.find(j => j.type === 'cash')
+    },
+    /**
+     * 
+     * @param {*} state 
+     * @param {*} payload 
+     */
+    [SET_SELECTED_JOURNAL] (state, payload) {
+        state.selectedJournal = payload
     }
 }
 
@@ -55,7 +80,16 @@ const actions = {
      */
     [INIT_JOURNALS] ({ commit }, payload) {
         commit(SET_JOURNALS, payload)
+        commit(AUTOSELECT_JOURNAL)
         commit(SET_LOADING_JOURNALS)
+    },
+    /**
+     * 
+     * @param {*} param0 
+     * @param {*} payload 
+     */
+    [SELECT_JOURNAL] ({ commit }, payload) {
+        commit(SET_SELECTED_JOURNAL, payload)
     }
 }
 

src/store/modules/payment.js

@@ -1,16 +1,24 @@
-import { SET_PAYMENT_TERMS, SET_LOADING_PAYMENT_TERMS, SET_PAYMENT_TYPE } from '@/constants/mutationTypes'
-import { INIT_PAYMENT_TERMS, CHANGE_PAYMENT_TYPE } from '@/constants/actionTypes'
+import { SET_PAYMENT_TERMS, SET_LOADING_PAYMENT_TERMS, AUTOSELECT_PAYMENT_TERM, SET_SELECTED_PAYMENT_TERM, SET_PAYMENT_TYPE, SET_INITIAL_PAYMENT, SET_PAYMENT_LINES } from '@/constants/mutationTypes'
+import { INIT_PAYMENT_TERMS, SELECT_PAYMENT_TERM, CHANGE_PAYMENT_TYPE, CHANGE_INITIAL_PAYMENT, COMPUTE_PAYMENT_LINES } from '@/constants/actionTypes'
 
 const initialState = {
     paymentTerms: [],
     loadingPaymentTerms: false,
-    paymentType: 'cash'
+    selectedPaymentTerm: null,
+    paymentType: 'cash',
+    initialPayment: 0,
+    paymentResidual: 0,
+    paymentLines: []
 }
 
 const state = {
     paymentTerms: initialState.paymentTerms,
     loadingPaymentTerms: !initialState.loadingPaymentTerms,
-    paymentType: initialState.paymentType
+    selectedPaymentTerm: initialState.selectedPaymentTerm,
+    paymentType: initialState.paymentType,
+    initialPayment: initialState.initialPayment,
+    paymentResidual: initialState.paymentResidual,
+    paymentLines: initialState.paymentLines
 }
 
 const getters = {
@@ -28,12 +36,40 @@ const getters = {
     loadingPaymentTerms(state) {
         return state.loadingPaymentTerms
     },
+    /**
+     * 
+     * @param {*} state 
+     */
+    selectedPaymentTerm(state) {
+        return state.selectedPaymentTerm
+    },
     /**
      * 
      * @param {*} state 
      */
     paymentType(state) {
         return state.paymentType
+    },
+    /**
+     * 
+     * @param {*} state 
+     */
+    initialPayment(state) {
+        return state.initialPayment
+    },
+    /**
+     * 
+     * @param {*} state 
+     */
+    paymentResidual(state) {
+        return state.paymentResidual
+    },
+    /**
+     * 
+     * @param {*} state 
+     */
+    paymentLines(state) {
+        return state.paymentLines
     }
 }
 
@@ -53,6 +89,22 @@ const mutations = {
     [SET_LOADING_PAYMENT_TERMS] (state, payload) {
         state.loadingPaymentTerms = !!payload
     },
+    /**
+     * 
+     * @param {*} state 
+     * @param {*} payload 
+     */
+    [AUTOSELECT_PAYMENT_TERM] (state) {
+        state.selectedPaymentTerm = state.paymentTerms.find(t => t.lines.length === 1 && t.lines[0].days === 0) || state.paymentTerms.find(t => t.lines.length === 1 && t.lines[0].days >= 0)
+    },
+    /**
+     * 
+     * @param {*} state 
+     * @param {*} payload 
+     */
+    [SET_SELECTED_PAYMENT_TERM] (state, payload) {
+        state.selectedPaymentTerm = payload
+    },
     /**
      * 
      * @param {*} state 
@@ -60,6 +112,64 @@ const mutations = {
      */
     [SET_PAYMENT_TYPE] (state, payload) {
         state.paymentType = payload
+    },
+    /**
+     * 
+     * @param {*} state 
+     * @param {*} payload 
+     */
+    [SET_INITIAL_PAYMENT] (state, payload) {
+        state.initialPayment = payload
+    },
+    /**
+     * 
+     * @param {*} state 
+     * @param {*} payload 
+     */
+    [SET_PAYMENT_LINES] (state, payload) {
+        let percentPaid = state.initialPayment / payload.total
+        let distributedPercentage = -(percentPaid / state.selectedPaymentTerm.lines.length)
+        let totals = []
+        let residual = payload.total
+        let dueDate = null
+
+        for (let line of state.selectedPaymentTerm.lines) {
+            dueDate = moment(payload.date).add(line.days + line.days2, 'days').format('YYYY-MM-DD')
+
+            if(percentPaid && percentPaid < 1) {
+                totals.push([payload.date, percentPaid])
+                percentPaid = 0
+
+                if (dueDate === payload.date) {
+                    distributedPercentage = ((totals[0][1] - line.valueAmount) / (state.selectedPaymentTerm.lines.length - 1))
+                    continue
+                }
+            }
+
+            if (line.value !== 'balance') {
+                totals.push([dueDate, line.valueAmount + distributedPercentage])
+                continue
+            }
+
+            totals.push([dueDate, line.valueAmount])
+
+            for (let line of totals) {
+                let currentPrice = (payload.total * line[1]).toFixed(2)
+
+                if (currentPrice < 0) {
+                    continue
+                }
+
+                residual = residual - currentPrice
+
+                state.paymentLines.push({
+                    date: line[0],
+                    total: currentPrice !== parseFloat(0).toFixed(2) ? currentPrice : residual.toFixed(2)
+                })
+            }
+
+            totals = []
+        }
     }
 }
 
@@ -71,8 +181,17 @@ const actions = {
      */
     [INIT_PAYMENT_TERMS] ({ commit }, payload) {
         commit(SET_PAYMENT_TERMS, payload)
+        commit(AUTOSELECT_PAYMENT_TERM)
         commit(SET_LOADING_PAYMENT_TERMS)
     },
+    /**
+     * 
+     * @param {*} param0 
+     * @param {*} payload 
+     */
+    [SELECT_PAYMENT_TERM] ({ commit }, payload) {
+        commit(SET_SELECTED_PAYMENT_TERM, payload)
+    },
     /**
      * 
      * @param {*} param0 
@@ -80,6 +199,25 @@ const actions = {
      */
     [CHANGE_PAYMENT_TYPE] ({ commit }, payload) {
         commit(SET_PAYMENT_TYPE, payload)
+    },
+    /**
+     * 
+     * @param {*} param0 
+     * @param {*} payload 
+     */
+    [CHANGE_INITIAL_PAYMENT] ({ commit }, payload) {
+        commit(SET_INITIAL_PAYMENT, payload)
+    },
+    /**
+     * 
+     * @param {*} param0 
+     * @param {*} payload 
+     */
+    [COMPUTE_PAYMENT_LINES] ({ commit, getters }) {
+        commit(SET_PAYMENT_LINES, {
+            date: getters.date,
+            total: getters.cartTotal
+        })
     }
 }