From 0884bcf47aaa40ef1030c94d518d490902fcd652 Mon Sep 17 00:00:00 2001
From: omair saleh <uldvstar@gmail.com>
Date: Sun, 12 Sep 2021 17:12:59 +0800
Subject: [PATCH] fix long reload issue for container on packing list status
 update

---
 .../elements/ContainerComponent.vue           | 22 ++++++++++++++-----
 1 file changed, 16 insertions(+), 6 deletions(-)

diff --git a/resources/assets/vue/components/containers/elements/ContainerComponent.vue b/resources/assets/vue/components/containers/elements/ContainerComponent.vue
index 4ed82551..75b5305c 100644
--- a/resources/assets/vue/components/containers/elements/ContainerComponent.vue
+++ b/resources/assets/vue/components/containers/elements/ContainerComponent.vue
@@ -51,15 +51,15 @@
                         <div class="col">
                             <div class="row">
                                 <div class="col">
-                                    <div class="row align-items-center p-t-10 p-b-10 b-t b-grey" v-for="packingList in item.packing_lists">
+                                    <div class="row align-items-center p-t-10 p-b-10 b-t b-grey" v-for="(packingList, index) in item.packing_lists">
                                         <div class="col-2"><a :href="route('customer.profile', packingList.order.company_module.marking)">{{packingList.order.company_module.marking}}</a>/<a :href="route('order.show', packingList.order.reference)">{{packingList.order.reference}}</a></div>
                                         <div class="col-1 text-center">{{packingList.packages.reduce((total, obj) => obj.quantity + total, 0)}}</div>
                                         <div class="col-1">{{(Math.ceil((packingList.packages.reduce((total, obj) => obj.cbm + total, 0)) * 10000) / 10000).toFixed(3)}}</div>
                                         <div class="col-1 bold text-center" :class="{'text-danger': packingList.status === 5, 'text-success': packingList.status !== 5}">{{packingList.status === 5 ? 'On Hold' : 'Release'}}</div>
                                         <div class="col">{{packingList.order.address.street_one+' '+(packingList.order.address.street_two ? packingList.order.address.street_two : '')+', '+ packingList.order.address.district.name+', '+packingList.order.address.post_code+' '+packingList.order.address.state.name+', '+packingList.order.address.country.name}}</div>
                                         <div class="col-auto" v-if="!packingList.transport">
-                                            <div class="btn btn-xs btn-success pointer" v-if="packingList.status === 5" @click="submit(route('api.packing_list.status.update', packingList.id, item.status === 1 ? 1 : 2), 'put', 'containerListSection', true, true)"><i class="fa fa-check m-r-5"></i>Release</div>
-                                            <div class="btn btn-xs btn-danger pointer" v-if="packingList.status !== 5" @click="submit(route('api.packing_list.status.update', packingList.id, 5), 'put', 'containerListSection', true, true)"><i class="fa fa-hand-paper-o m-r-5"></i>Hold</div>
+                                            <div class="btn btn-xs btn-success pointer" v-if="packingList.status === 5" @click="updateStatus(index, item.status === 1 ? 1 : 2)"><i class="fa fa-check m-r-5"></i>Release</div>
+                                            <div class="btn btn-xs btn-danger pointer" v-if="packingList.status !== 5" @click="updateStatus(index, 5)"><i class="fa fa-hand-paper-o m-r-5"></i>Hold</div>
                                         </div>
                                     </div>
                                 </div>
@@ -76,12 +76,22 @@
     export default {
         data(){
             return {
-                expanded: false
+                expanded: false,
+                index: null,
             }
         },
         methods: {
-            successHandler(){
-                this.$store.dispatch('reloadList', {'name': 'containerListSection'});
+            updateStatus(index, status){
+                this.index = index;
+                this.submit(this.route('api.packing_list.status.update', this.item.packing_lists[index].id, status), 'put', 'containerListSection', true, true)
+            },
+            successHandler(response){
+                this.item.packing_lists[this.index] = response.payload.data;
+                this.$forceUpdate();
+                this.index = null;
+            },
+            errorHandler(){
+                this.index = null;
             }
         },
         mixins: [componentHandler]