[IMP] discount apply dialog

src/components/cart/ProductDiscount.vue

@@ -13,7 +13,10 @@
             hr
             .discount-item
                 label.discount-label Precio aplicado
-                input.discount-input(:value="discount" v-model="discount" autofocus)
+                input.discount-input(:value="priceApply" v-model="priceApply" autofocus)
+            .discount-item
+                label.discount-label Descuento
+                input.discount-input(:value="formatDiscount()" readonly)
         .discount-options
             button.discount-button(@click="applyDiscount({ apply: true })") Aceptar
             button.discount-button(@click="applyDiscount({ apply: false })") Cancelar
@@ -23,6 +26,11 @@
     import { mapGetters, mapActions } from 'vuex'
 
     export default {
+        data() {
+            return {
+                discount: 0
+            }
+        },
         computed: {
             price() {
                 return this.productToDiscount ? this.productToDiscount.list_price : 0
@@ -33,7 +41,7 @@
             maximumPrice() {
                 return this.productToDiscount ? this.productToDiscount.maximum_price : 0
             },
-            discount: {
+            priceApply: {
                 get() {
                     let value = this.productToDiscount ? this.productToDiscount.discount : this.minimumPrice
                     return accounting.formatMoney(value, this.currencySymbol, 0, '.', ',')
@@ -41,6 +49,7 @@
                 set(value) {
                     value = accounting.unformat(value, ',')
 
+                    this.discount = this.price - value
                     this.productToDiscount.discount = value
                 }
             },
@@ -68,6 +77,9 @@
             formatMaxPrice() {
                 return accounting.formatMoney(this.maximumPrice, this.currencySymbol, 0, '.', ',')
             },
+            formatDiscount() {
+                return accounting.formatMoney(this.discount, this.currencySymbol, 0, '.', ',')
+            },
             beforeClose(e) {
                 if (this.productToDiscount) {
                     e.stop()
@@ -83,15 +95,20 @@
 
 <style lang="sass">
     .product-discount
+        width: 600px
+        height: 340px !important
         .discount-form
             width: 100%
-            height: 250px
+            height: 290px
             padding: 15px
             .discount-item
                 width: 100%
                 height: 45px
                 margin-bottom: 10px
-                &:nth-child(2), &:nth-child(3)
+                &:nth-child(1)
+                    .discount-input
+                        border: none
+                &:nth-child(2), &:nth-child(3), &:nth-child(6) 
                     height: 35px
                     margin-bottom: 5px
                     .discount-label
@@ -104,7 +121,7 @@
                         height: 35px
                         font-size: 18pt
                         text-align: right
-                        border-radius: 0
+                        border: none
                 .discount-label
                     width: 30%
                     height: 45px

src/store/modules/cart.js

@@ -89,12 +89,10 @@ const actions = {
         commit('discountFromCart', payload)
     },
     applyDiscount({ getters, commit, dispatch  }, payload) {
-        console.log(payload, getters.productToDiscount)
-
         if(payload.apply) {
             let product = getters.productToDiscount
 
-            if (product.discount < product.minimum_price || product.discount > product.maximum_price) {
+            if (product.priceApply < product.minimum_price || product.priceApply > product.maximum_price) {
                 dispatch('notify', 'No se puede aplicar este descuento')
                 return
             }