Changing order table options (#862)

* corrections of errors in post services

* fix order line

* change option in table

* minimal changes

* minimal changes

* remove commnet

Co-authored-by: elsiosanchez <elsiossanches@gmail.com>

src/components/ADempiere/Form/VPOS/Order/index.vue

@@ -87,7 +87,7 @@
                 :key="key"
                 :column-key="valueOrder.columnName"
                 :label="valueOrder.label"
-                :width="valueOrder.isNumeric ? 'auto' : '380'"
+                :width="!valueOrder.isNumeric ? valueOrder.size : valueOrder.size"
                 :align="valueOrder.isNumeric ? 'right' : 'left'"
               >
                 <template slot-scope="scope">
@@ -97,31 +97,18 @@
                 </template>
               </el-table-column>
               <el-table-column
-                label=""
+                :label="$t('form.pos.tableProduct.options')"
-                width="120"
+                width="180"
               >
                 <template slot-scope="scope">
-                  <el-dropdown trigger="click" @command="changeLine">
-                    <span class="el-dropdown-link">
-                      {{ $t('form.pos.tableProduct.options') }}
-                      <i class="el-icon-arrow-down el-icon--right" />
-                    </span>
-                    <el-dropdown-menu slot="dropdown" style="padding-bottom: 0px;">
-                      <el-dropdown-item
-                        :command="{
-                          ...scope.row,
-                          option: $t('form.productInfo.productInformation')
-                        }"
-                      >
                   <el-popover
-                          v-if="!isEmptyValue(currentLineOrder)"
+                    v-if="!isEmptyValue(listOrderLine)"
                     placement="right"
                     trigger="click"
                     :title="$t('form.productInfo.productInformation')"
                   >
                     <el-form
                       label-position="top"
-                            label-width="60px"
                       style="float: right; display: flex; line-height: 30px;"
                     >
                       <el-row :gutter="24">
@@ -137,35 +124,26 @@
                           </div>
                         </el-col>
                         <el-col :span="10">
-                                {{ $t('form.productInfo.code') }}: <b>{{ currentLineOrder.product.value }}</b><br>
+                          {{ $t('form.productInfo.code') }}: <b>{{ scope.row.product.value }}</b><br>
-                                {{ $t('form.productInfo.name') }}: <b>{{ currentLineOrder.product.name }}</b><br>
+                          {{ $t('form.productInfo.name') }}: <b>{{ scope.row.product.name }}</b><br>
-                                {{ $t('form.productInfo.description') }}: <b>{{ currentLineOrder.product.description }}</b><br>
+                          {{ $t('form.productInfo.description') }}: <b>{{ scope.row.product.description }}</b><br>
                         </el-col>
                         <el-col :span="10">
                           <div style="float: right">
                             {{ $t('form.productInfo.price') }}:
-                                  <b>{{ formatPrice(currentLineOrder.product.priceStandard, pointOfSalesCurrency.iSOCode) }}</b>
+                            <b>{{ formatPrice(scope.row.product.priceStandard, pointOfSalesCurrency.iSOCode) }}</b>
                             <br>
                             {{ $t('form.productInfo.taxAmount') }}:
-                                  <b>{{ currentLineOrder.taxIndicator }}</b>
+                            <b>{{ scope.row.taxIndicator }}</b>
                             <br>
                             {{ $t('form.productInfo.quantityAvailable') }}:
-                                  <b>{{ formatQuantity(currentLineOrder.quantityOrdered) }}</b>
+                            <b>{{ formatQuantity(scope.row.quantityOrdered) }}</b>
                           </div>
                         </el-col>
                       </el-row>
                     </el-form>
-                          <el-button slot="reference" type="text" style="display: flex;width: 110%;padding-bottom: 5%;padding-top: 5%;">
+                    <el-button slot="reference" type="primary" icon="el-icon-info" size="mini" style="margin-right: 3%;" />
-                            <i class="el-icon-info" /> {{ $t('form.productInfo.productInformation') }}
-                          </el-button>
                   </el-popover>
-                      </el-dropdown-item>
-                      <el-dropdown-item
-                        :command="{
-                          ...scope.row,
-                          option: $t('form.pos.tableProduct.editQuantities')
-                        }"
-                      >
                   <el-popover
                     placement="right"
                     trigger="click"
@@ -176,23 +154,11 @@
                     <field-line
                       :data-line="scope.row"
                       :show-field="showFieldLine"
-                            :current-line="currentOrderLine"
+                      :current-line="currentLineOrder"
                     />
-                          <el-button
+                    <el-button slot="reference" type="success" icon="el-icon-edit" size="mini" style="margin-right: 3%;" @click="showEditLine(scope.row)" />
-                            slot="reference"
-                            type="text"
-                            :disabled="isDisabled"
-                            @click="showFieldLine = !showFieldLine"
-                          >
-                            <i class="el-icon-edit" /> {{ $t('form.pos.tableProduct.editQuantities') }}
-                          </el-button>
                   </el-popover>
-                      </el-dropdown-item>
+                  <el-button type="danger" icon="el-icon-delete" size="mini" @click="deleteOrderLine(scope.row)" />
-                      <el-button type="danger" icon="el-icon-delete" class="delete-buttom" :disabled="isDisabled" plain @click="deleteOrderLine(scope.row)">
-                        {{ $t('form.pos.tableProduct.remove') }}
-                      </el-button>
-                    </el-dropdown-menu>
-                  </el-dropdown>
                 </template>
               </el-table-column>
             </el-table>
@@ -465,8 +431,8 @@ export default {
       return this.currentOrder.lineOrder
     },
     currentLineOrder() {
-      console.log(this.$store.state['pointOfSales/orderLine/index'].line)
+      const line = this.$store.state['pointOfSales/orderLine/index'].line
-      return this.$store.state['pointOfSales/orderLine/index'].line
+      return line
     }
   },
   mounted() {
@@ -557,6 +523,10 @@ export default {
         this.currentOrderLine = this.listOrderLine[this.currentTable]
       }
     },
+    showEditLine(line) {
+      this.$store.commit('setLine', line)
+      this.showFieldLine = !this.showFieldLine
+    },
     arrowBottom() {
       const top = this.listOrderLine.length - 1
       if (this.currentTable < top) {

src/components/ADempiere/Form/VPOS/Order/line/index.vue

@@ -153,8 +153,7 @@ export default {
   },
   watch: {
     showField(value) {
-      if (value && this.isEmptyValue(this.metadataList) && (this.dataLine.uuid === this.currentLine.uuid)) {
+      if (value && this.isEmptyValue(this.metadataList) && (this.dataLine.uuid === this.$store.state['pointOfSales/orderLine/index'].line.uuid)) {
-        this.setFieldsList()
         this.metadataList = this.setFieldsList()
         this.isLoadedField = true
       }

src/components/ADempiere/Form/VPOS/Order/orderLineMixin.js

@@ -29,27 +29,32 @@ export default {
         lineDescription: {
           columnName: 'LineDescription',
           label: this.$t('form.pos.tableProduct.product'),
-          isNumeric: false
+          isNumeric: false,
+          size: '380'
         },
         currentPrice: {
           columnName: 'CurrentPrice',
           label: this.$t('form.productInfo.price'),
-          isNumeric: true
+          isNumeric: true,
+          size: 'auto'
         },
         quantityOrdered: {
           columnName: 'QtyOrdered',
           label: this.$t('form.pos.tableProduct.quantity'),
-          isNumeric: true
+          isNumeric: true,
+          size: '100px'
         },
         discount: {
           columnName: 'Discount',
           label: '% ' + this.$t('form.pos.order.discount'),
-          isNumeric: true
+          isNumeric: true,
+          size: '110px'
         },
         grandTotal: {
           columnName: 'GrandTotal',
           label: 'Total',
-          isNumeric: true
+          isNumeric: true,
+          size: 'auto'
         }
       },
       currentOrderLine: {
@@ -119,12 +124,7 @@ export default {
       }
     },
     updateOrderLine(line) {
-      let {
+      let quantity, price, discountRate
-        currentPrice: price,
-        discount: discountRate,
-        quantityOrdered: quantity
-      } = this.currentOrderLine
-
       switch (line.columnName) {
         case 'QtyEntered':
           quantity = line.value
@@ -155,7 +155,8 @@ export default {
             discount: response.discountRate
           })
           this.fillOrderLine(response)
-          this.reloadOrder(true)
+          this.$store.dispatch('reloadOrder', { orderUuid: this.$store.getters.posAttributes.currentPointOfSales.currentOrder.uuid })
+          this.$store.dispatch('currentLine', response)
         })
         .catch(error => {
           console.error(error.message)
@@ -167,11 +168,12 @@ export default {
         })
     },
     deleteOrderLine(lineSelection) {
+      console
       requestDeleteOrderLine({
         orderLineUuid: lineSelection.uuid
       })
         .then(() => {
-          this.reloadOrder(true)
+          this.$store.dispatch('reloadOrder', { orderUuid: this.$store.getters.posAttributes.currentPointOfSales.currentOrder.uuid })
         })
         .catch(error => {
           console.error(error.message)
@@ -203,6 +205,9 @@ export default {
         return this.formatPrice(row.grandTotal, currency)
       }
     },
+    productPrice(price, discount) {
+      return price / discount * 100
+    },
     handleCurrentLineChange(rowLine) {
       this.$store.dispatch('currentLine', rowLine)
       if (!this.isEmptyValue(rowLine)) {