[ADD] all views implemented

controllers/main.py

@@ -262,4 +262,12 @@ class Sales(http.Controller):
                 'price': variant.list_price,
                 'discount': 0,
             } for variant in product.product_variant_ids if variant.active]
-        }
+        }
+
+      
+    '''
+        Create sale
+    '''
+    @http.route('/eiru_sales/create_sale', type='json', auth='user', methods=['POST'], cors='*')
+    def create_sale(self, **kw):
+        print(kw)

src/App.vue

@@ -7,6 +7,8 @@
                 customer-step
             tab-content(title="Cómo quieres pagar?")
                 payment-method-step
+            tab-content(title="")
+                payment-amount-step
 </template>
 
 <script>
@@ -18,6 +20,7 @@
     import ProductStep from '@@/steps/Product'
     import CustomerStep from '@@/steps/Customer'
     import PaymentMethodStep from '@@/steps/PaymentMethod'
+    import PaymentAmountStep from '@@/steps/PaymentAmount'
 
     export default {
         components: {
@@ -25,7 +28,8 @@
             TabContent,
             ProductStep,
             CustomerStep,
-            PaymentMethodStep
+            PaymentMethodStep,
+            PaymentAmountStep
         },
         methods: mapActions([
             'initSale',

src/components/common/Ticket.vue

@@ -17,7 +17,7 @@
                             td {{ item.name || 'no data' }}
                             td {{ item.price || 'no data' }}
                             td {{ item.quantity || 'no data' }}
-                            td {{ ((item.price || 0) * (item.quatity || 0)) || 'no data'  }}
+                            td {{ ((item.price || 0) * (item.quantity || 0)) || 'no data'  }}
             .ticket-summary-footer
                 table
                     tbody

src/components/common/index.js

@@ -1,15 +1,9 @@
-import AddCard from './AddCard'
-import Card from './Card'
 import CardGrid from './CardGrid'
 import Cart from './Cart'
 import Searcher from './Searcher'
-import Spinner from './Spinner'
 
 export {
-    AddCard,
-    Card,
     CardGrid,
     Cart,
-    Searcher,
-    Spinner
+    Searcher
 }

src/components/steps/PaymentAmount.vue

@@ -0,0 +1,125 @@
+<template lang="pug">
+    .pos-step
+        ticket(:customerName='selectedCustomer && selectedCustomer.name' :total='cartTotal' :items='cartItems')
+        form.payment-amount
+            .form-separator
+                h3 Detalles del Pago
+                hr
+            .form-item(v-show="paymentType === 'cash'")
+                label.form-label Monto a Pagar
+                input.form-input(:value='cartTotal' readonly)
+            .form-item
+                label.form-label Monto Recibido
+                input.form-input(:value='amountReceived' v-model='amountReceived' autofocus)
+            .form-item(v-show="paymentType === 'cash'")
+                hr
+                label.form-label Monto a Devolver
+                input.form-input(:value='amountResidual' readonly)
+            .form-item-table(v-show="paymentType === 'credit'")
+                table
+                    thead
+                        tr
+                            th Monto a Pagar
+                            th Fecha de Pago
+                    tbody
+                        tr(v-for='line in paymentLines')
+                            td {{ line.total }}
+                            td {{ line.date }}
+</template>
+
+<script>
+    import { mapGetters } from 'vuex'
+
+    import Ticket from '@@/common/Ticket'
+
+    export default {
+        components: {
+            Ticket
+        },
+        computed: mapGetters([
+            'selectedCustomer',
+            'cartItems',
+            'cartTotal',
+            'paymentType',
+            'paymentTerms'
+        ]),
+        watch: {
+            amountReceived(value) {
+                console.log(value)
+            }
+        },
+        methods: {
+            computeAmountResidual() {
+
+            }
+        },
+        data() {
+            return {
+                amountReceived: 0,
+                amountResidual: 0,
+                paymentLines: []
+            }
+        }
+    }
+</script>
+
+<style lang="sass">
+    @import '../../assets/variables'
+    .pos-step
+        width: 100%
+        height: calc(100% - 50px)
+        padding-bottom: 50px
+        display: flex
+        .payment-amount
+            width: calc(100% - 450px)
+            height: 100%
+            margin-right: 50px
+            padding: 35px
+            background: $app-light-color
+            .form-separator
+                h3
+                    color: $app-separator-color
+                    font-size: 8pt
+                    margin: 0
+                hr
+                    margin-top: 15px
+            .form-item
+                width: 100%px
+                height: 45px
+                margin-bottom: 15px
+                .form-label
+                    width: 250px
+                    height: 45px
+                    font-size: 14pt
+                .form-input
+                    width: 350px
+                    height: 45px
+                    font-size: 14pt
+                    border-radius: 0
+                    &.input-only
+                        margin-left: 250px
+                        margin-bottom: 15px
+            .form-item-table
+                width: 100%
+                height: 250px
+                border: 1px solid $app-border-color
+                table
+                    width: 100%
+                    thead
+                        th
+                            line-height: 35px
+                            padding-left: 10px
+                        th:nth-child(1)
+                            width: 200px
+                        th:nth-child(2)
+                            width: 200px
+                    tbody
+                        td
+                            height: 35px
+                            padding-left: 10px
+
+                        td:nth-child(1)
+                            width: 200px
+                        td:nth-child(2)
+                            width: 200px
+</style>

src/components/steps/PaymentMethod.vue

@@ -7,27 +7,30 @@
                 hr
             .form-item
                 label.form-label Cliente
-                input.form-input(readonly)
+                input.form-input(:value='selectedCustomer && selectedCustomer.name' readonly)
             transition(name='fade')
-                .form-item
+                .form-item(v-if="payment === 'credit'")
                     label.form-label Crédito
-                    input.form-input(readonly)
+                    input.form-input(:value='customerCredit' readonly)
             .form-separator
                 h3 Detalles del Pago
                 hr
             .form-item
                 label.form-label Forma de Pago
                 .form-item-option
-                    input.form-input(type='radio' id='cash')
+                    input.form-input(type='radio' id='cash' value='cash' v-model='payment')
                     label(for='cash') Contado
                 .form-item-option
-                    input.form-input(type='radio' id='credit')
-                    label(for='cash') Crédito
-            .form-item
-                select.form-input.input-only
-            .form-item
-                label.form-label Método de Pago
-                select.form-input
+                    input.form-input(type='radio' id='credit' value='credit' v-model='payment')
+                    label(for='credit') Crédito
+            transition(name='fade')
+                .form-item(v-if="payment === 'credit'")
+                    select.form-input.input-only
+                        option(v-for='term in paymentTerms' :value='term' v-if="term.lines.length > 0 && (term.lines[0].days !== 0 || term.lines[0].value !==  'balance')") {{ term.displayName }}
+                .form-item(v-else)
+                    label.form-label Método de Pago
+                    select.form-input
+                        option(v-for='journal in journals') {{ journal.displayName }}
 </template>
 
 <script>
@@ -35,15 +38,33 @@
 
     import Ticket from '@@/common/Ticket'
 
+    import { CHANGE_PAYMENT_TYPE } from '@/constants/actionTypes'
+
     export default {
         components: {
             Ticket
         },
+        watch: {
+            payment(value) {
+                this.changePaymentType(value)
+            }
+        },
         computed: mapGetters([
             'selectedCustomer',
             'cartItems',
             'cartTotal',
-        ])
+            'customerCredit',
+            'paymentTerms',
+            'journals'
+        ]),
+        methods: mapActions([
+            CHANGE_PAYMENT_TYPE
+        ]),
+        data() {
+            return {
+                payment: 'cash'
+            }
+        }
     }
 </script>
 
@@ -64,8 +85,9 @@
                 h3
                     color: $app-separator-color
                     font-size: 8pt
+                    margin: 0
                 hr
-                    margin-top: 50px
+                    margin-top: 15px
             .form-item
                 width: 100%px
                 height: 45px

src/constants/actionTypes.js

@@ -24,6 +24,8 @@ const SELECT_PRODUCT = 'selectProduct'
 
 const INIT_PAYMENT_TERMS = 'initPaymentTerms'
 
+const CHANGE_PAYMENT_TYPE = 'changePaymentType'
+
 const INIT_JOURNALS = 'initJournals' 
 
 const INIT_DATE = 'initDate'
@@ -66,6 +68,7 @@ export {
     RECEIVE_PRODUCT,
     SELECT_PRODUCT,
     INIT_PAYMENT_TERMS,
+    CHANGE_PAYMENT_TYPE,
     INIT_JOURNALS,
     INIT_DATE,
     INIT_CUSTOMERS,

src/constants/mutationTypes.js

@@ -18,6 +18,8 @@ const SET_PAYMENT_TERMS = 'setPaymentTerms'
 
 const SET_LOADING_PAYMENT_TERMS = 'setLoadingPaymentTerms'
 
+const SET_PAYMENT_TYPE = 'setPaymentType'
+
 const SET_JOURNALS = 'setJournals'
 
 const SET_LOADING_JOURNALS= 'setLoadingJournals'
@@ -49,7 +51,7 @@ 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, // Payment Term
+    SET_PAYMENT_TERMS, SET_LOADING_PAYMENT_TERMS, SET_PAYMENT_TYPE, // Payment Term
     SET_JOURNALS, SET_LOADING_JOURNALS, // Journal
     SET_DATE, SET_LOADING_DATE, // Date
     SET_CUSTOMERS, SET_LOADING_CUSTOMERS, SET_SHOW_CUSTOMER_FORM, SET_SELECTED_CUSTOMER, ADD_CUSTOMER, // Customer

src/store/modules/customer.js

@@ -43,6 +43,13 @@ const getters = {
      */
     selectedCustomer(state) {
         return state.selectedCustomer
+    },
+    /**
+     * 
+     * @param {*} state 
+     */
+    customerCredit(state) {
+        return state.selectedCustomer && state.selectedCustomer.creditLimit >= state.selectedCustomer.credit ? state.selectedCustomer.creditLimit - state.credit : 0
     }
 }
 

src/store/modules/payment.js

@@ -1,14 +1,16 @@
-import { SET_PAYMENT_TERMS, SET_LOADING_PAYMENT_TERMS } from '@/constants/mutationTypes'
-import { INIT_PAYMENT_TERMS } from '@/constants/actionTypes'
+import { SET_PAYMENT_TERMS, SET_LOADING_PAYMENT_TERMS, SET_PAYMENT_TYPE } from '@/constants/mutationTypes'
+import { INIT_PAYMENT_TERMS, CHANGE_PAYMENT_TYPE } from '@/constants/actionTypes'
 
 const initialState = {
     paymentTerms: [],
-    loadingPaymentTerms: false
+    loadingPaymentTerms: false,
+    paymentType: 'cash'
 }
 
 const state = {
     paymentTerms: initialState.paymentTerms,
-    loadingPaymentTerms: !initialState.loadingPaymentTerms
+    loadingPaymentTerms: !initialState.loadingPaymentTerms,
+    paymentType: initialState.paymentType
 }
 
 const getters = {
@@ -25,6 +27,13 @@ const getters = {
      */
     loadingPaymentTerms(state) {
         return state.loadingPaymentTerms
+    },
+    /**
+     * 
+     * @param {*} state 
+     */
+    paymentType(state) {
+        return state.paymentType
     }
 }
 
@@ -43,6 +52,14 @@ const mutations = {
      */
     [SET_LOADING_PAYMENT_TERMS] (state, payload) {
         state.loadingPaymentTerms = !!payload
+    },
+    /**
+     * 
+     * @param {*} state 
+     * @param {*} payload 
+     */
+    [SET_PAYMENT_TYPE] (state, payload) {
+        state.paymentType = payload
     }
 }
 
@@ -55,6 +72,14 @@ const actions = {
     [INIT_PAYMENT_TERMS] ({ commit }, payload) {
         commit(SET_PAYMENT_TERMS, payload)
         commit(SET_LOADING_PAYMENT_TERMS)
+    },
+    /**
+     * 
+     * @param {*} param0 
+     * @param {*} payload 
+     */
+    [CHANGE_PAYMENT_TYPE] ({ commit }, payload) {
+        commit(SET_PAYMENT_TYPE, payload)
     }
 }