Browse Source

[ADD] Selecion de Facturas

adrielso 7 năm trước cách đây
mục cha
commit
90c040b6cf

+ 2 - 2
src/components/invoice/InvoiceStep.vue

@@ -5,8 +5,8 @@
 </template>
 
 <script>
-    import InvoiceContainer from '@/components/invoice/InvoiceContainer'
-    import MoveContainer from '@/components/invoice/MoveContainer'
+    import InvoiceContainer from '@/components/invoice/invoiceContainer/InvoiceContainer'
+    import MoveContainer from '@/components/invoice/moveContainer/MoveContainer'
 
     export default {
         components: {

+ 32 - 5
src/components/invoice/InvoiceCard.vue → src/components/invoice/invoiceContainer/InvoiceCard.vue

@@ -1,13 +1,36 @@
 <template lang="pug">
-    .invoice-card
-        h2.invoice-date 21/07/2017
-        h2.invoice-title Factura: venta/2017/0024
-        h2.invoice-total Total  1.000.000
-        h2.invoice-saldo  Saldo  980.000
+    .invoice-card(@click="selectInvoice(item)" v-bind:class="{ 'selected-invoice': isSelectedInvoice() }")
+        h2.invoice-date {{ item.date_invoice}}
+        h2.invoice-title Factura: {{ item.number}}
+        h2.invoice-total Total  {{ item.amount_total}}
+        h2.invoice-saldo  Saldo {{ item.residual}}
 </template>
 
 <script>
+
+    import { mapGetters, mapActions } from 'vuex'
+
     export default {
+        props:  {
+            item: {
+                type: Object,
+                default: () => {
+                    return {}
+                }
+            }
+        },
+        computed: mapGetters([
+            'selectedInvoices',
+            'haSelectedInvoices'
+        ]),
+        methods: {
+            isSelectedInvoice() {
+                return this.haSelectedInvoices ? this.item.id === this.selectedInvoices.id : false
+            },
+            ...mapActions([
+                'selectInvoice'
+            ])
+        }
     }
 </script>
 
@@ -20,6 +43,10 @@
         display: inline-block
         position: relative
 
+        &.selected-invoice
+            transition-duration: 0.3s
+            border-bottom: 3px solid #7c7bad
+
         &:hover
             cursor: pointer
 

+ 2 - 2
src/components/invoice/InvoiceContainer.vue → src/components/invoice/invoiceContainer/InvoiceContainer.vue

@@ -5,8 +5,8 @@
 </template>
 
 <script>
-    import InvoiceSearcher from '@/components/invoice/InvoiceSearcher'
-    import InvoiceGrid from '@/components/invoice/InvoiceGrid'
+    import InvoiceSearcher from '@/components/invoice/invoiceContainer/InvoiceSearcher'
+    import InvoiceGrid from '@/components/invoice/invoiceContainer/InvoiceGrid'
 
     export default {
         components: {

+ 7 - 14
src/components/invoice/InvoiceGrid.vue → src/components/invoice/invoiceContainer/InvoiceGrid.vue

@@ -1,28 +1,21 @@
 <template lang="pug">
     .invoice-container
         .invoice-grid
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
-            invoice-card
+            invoice-card(v-for="invoice in invoices" :key="invoice" :item="invoice")
 </template>
 
 <script>
-    import InvoiceCard from '@/components/invoice/InvoiceCard'
+    import { mapGetters } from 'vuex'
+    import InvoiceCard from '@/components/invoice/invoiceContainer/InvoiceCard'
 
     export default {
 
         components: {
             InvoiceCard
-        }
+        },
+        computed: mapGetters([
+            'invoices'
+        ])
     }
 </script>
 

+ 0 - 0
src/components/invoice/InvoiceSearcher.vue → src/components/invoice/invoiceContainer/InvoiceSearcher.vue


+ 0 - 0
src/components/invoice/MoveContainer.vue → src/components/invoice/moveContainer/MoveContainer.vue


+ 0 - 1
src/index.js

@@ -2,7 +2,6 @@ import Vue from 'vue'
 import Payments from '@/Payments'
 import VModal from 'vue-js-modal'
 import store from '@/store'
-console.log(store);
 // vue.use
 Vue.use(VModal)
 // Vue.config.

+ 2 - 0
src/store/index.js

@@ -7,6 +7,7 @@ import actions from '@/store/actions'
 import mutations from '@/store/mutations'
 // Modules
 import partners from '@/store/modules/partners'
+import invoices from '@/store/modules/invoices'
 import loader from '@/store/modules/loader'
 
 Vue.use(Vuex)
@@ -18,6 +19,7 @@ const Store = new Vuex.Store({
     actions,
     modules:{
         partners,
+        invoices,
         loader
     }
 })

+ 46 - 0
src/store/modules/invoices.js

@@ -0,0 +1,46 @@
+const state = {
+    invoices: [],
+    filteredInvoices: [],
+    selectedInvoices: null
+}
+
+const getters = {
+    invoices (state) {
+        return state.filteredInvoices.length === 0 ? state.invoices : state.filteredInvoices
+    },
+    selectedInvoices(state) {
+        return state.selectedInvoices
+    },
+    haSelectedInvoices(state) {
+        return !!state.selectedInvoices
+    }
+}
+
+const mutations = {
+    pushInvoices(state, payload) {
+        state.invoices = payload.invoices
+    },
+    selectInvoice (state, payload){
+        state.selectedInvoices = payload.invoice
+    }
+}
+
+const actions = {
+    pushInvoices ({commit, dispatch }, payload){
+        commit('pushInvoices', {
+            invoices: payload.invoices
+        })
+    },
+    selectInvoice ({ commit, dispatch}, payload) {
+        commit('selectInvoice',{
+            invoice: payload
+        })
+    }
+
+}
+export default {
+    state,
+    getters,
+    mutations,
+    actions
+}

+ 7 - 5
src/store/modules/partners.js

@@ -9,16 +9,16 @@ const getters ={
     partners(state){
         return state.filtered.length === 0 ? state.partners : state.filtered
     },
-    hasSelectedPartner(state){
+    hasSelectedPartner(state) {
         return !!state.selectedPartner
     },
-    selectedPartner(state){
+    selectedPartner(state) {
         return state.selectedPartner
     },
-    partnerInvoices(state){
+    partnerInvoices(state) {
         return state.selectedPartnerInvoices
     },
-    partnerMoveLine(state){
+    partnerMoveLine(state) {
         let moveline= []
         state.selectedPartnerInvoices.forEach(item =>{
             moveline.push(item.movelines);
@@ -63,11 +63,13 @@ const actions ={
             })
         })
     },
-    selectPartner({ commit }, payload){
+    selectPartner({ commit, dispatch }, payload){
         commit('selectPartner',{
             partner: payload
         })
         commit('selectPartnerInvoices')
+
+        dispatch('pushInvoices',payload)
     },
     filterCustomers({ commit },payload){
         commit('applyPartnersFilter', payload)