Merge branch 'master' of https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal into permits-reminder

app/Classes/General/Eloquent/Filters/WithContainersPackages.php

@@ -0,0 +1,20 @@
+<?php
+
+namespace App\Classes\General\Eloquent\Filters;
+
+
+use Illuminate\Database\Eloquent\Builder;
+
+class WithContainersPackages implements Filter
+{
+
+    /**
+     * @param Builder $builder
+     * @param $value
+     * @return mixed
+     */
+    public static function apply(Builder $builder, $value)
+    {
+        return $builder->with(['containers', 'packages']);
+    }
+}

app/Classes/Jobs/ListPackingListsJob.php

@@ -15,6 +15,8 @@ class ListPackingListsJob implements ShouldQueue
 {
     use Dispatchable, InteractsWithQueue, Queueable, SerializesModels;
 
+    public $timeout = 900;
+
     /** @var ListGenericJobObject */
     private $listGenericJobObject;
 

app/Classes/Modules/PackingLists/Processors/ListPackingListsJobProcessor.php

@@ -37,7 +37,10 @@ class ListPackingListsJobProcessor
      */
     public function execute(ListGenericJobObject $listGenericJobObject) {
 
-        $query = $this->listsPackingLists->execute($this->listsPackingLists->deserializeFilters($listGenericJobObject->getPayload()['filters']), ['page' => $listGenericJobObject->getPayload()['page']]);
+        // $query = $this->listsPackingLists->execute($this->listsPackingLists->deserializeFilters($listGenericJobObject->getPayload()['filters']), ['page' => $listGenericJobObject->getPayload()['page'], 'with_containers_packages' => true]);
+
+        $query = $this->listsPackingLists->execute(array_merge($this->listsPackingLists->deserializeFilters($listGenericJobObject->getPayload()['filters']), ['page' => $listGenericJobObject->getPayload()['page'], 'with_containers_packages' => true]));
+
         foreach ($query->items() as &$item) {
             $item['userInfo'] = $listGenericJobObject->getUserInfo();
         }

app/Classes/Modules/Transactions/Processors/CheckStorageInvoiceTransactionProcessor.php

@@ -200,6 +200,11 @@ class CheckStorageInvoiceTransactionProcessor
             $this->createStorageInvoiceTransactionDetails($storageInvoice, $destinationWarehousePackage, $cbm, $pricePerCBM, $resultNumberOfDaysExceeded);
         }
         else if($storageInvoice){
+            //Additional handling for giving selected storage invoice a waiver
+            if(isset($storageInvoice->is_waived) && $storageInvoice->is_waived){
+                $pricePerCBM = 0;
+                $price_cbm = $pricePerCBM * $cbm * $resultNumberOfDaysExceeded;
+            }
 
             //Additional handling for calculation of numberOfDaysExceeded in the event of the storage already paid
             $paymentStorageTransaction = $storageInvoice->transactions()->where('transactions.type', TransactionType::PAYMENT)->where('transactions.status', ApprovalStatus::APPROVED)->first();
@@ -216,10 +221,12 @@ class CheckStorageInvoiceTransactionProcessor
             Log::channel('storage_invoices')->info('Update $transaction->id: '.$transaction->id);
             Log::channel('storage_invoices')->info('$storageInvoice->status: '.$storageInvoice->status);
             Log::channel('storage_invoices')->info('price_cbm: '.$price_cbm."-".gettype($price_cbm));
+            Log::channel('storage_invoices')->info('amount: '.$amount);
+
+            $proceedToUpdate = false;
 
             if(abs($price_cbm - $amount) > $epsilon && $storageInvoice->status !== ApprovalStatus::COMPLETED){
                 $paymentTransactions = $storageInvoice->transactions()->where('transactions.type', TransactionType::PAYMENT)->where('transactions.status', ApprovalStatus::PENDING_SUBMISSION)->get();
-
                 if(!$isBackDoorCheck){
                     if(count($paymentTransactions) > 0){
                         $this->updatePaymentTransactionViaNonGroupPayment($paymentTransactions);
@@ -229,6 +236,11 @@ class CheckStorageInvoiceTransactionProcessor
                     }
                 }
 
+                $proceedToUpdate = true;
+            }
+
+            if($proceedToUpdate || ($pricePerCBM == 0 && $amount != 0)){
+                Log::channel('storage_invoices')->info('proceedToUpdate');
                 $storageInvoice = $this->updateStorageInvoiceTransaction($storageInvoice, $price_cbm);
                 $invoiceTransactionDetails = $storageInvoice->transactionDetails()->first();
                 $this->updateStorageInvoiceTransactionDetails($invoiceTransactionDetails, $destinationWarehousePackage, $cbm, $pricePerCBM, $resultNumberOfDaysExceeded);

app/Http/Resources/ListPackingListJobResource.php

@@ -32,10 +32,13 @@ class ListPackingListJobResource extends JsonResource
             'transport' => new TransportResource($this->transports()->first()),
             'type' => $this->type,
             'receive_packing_list' => $this->when($this->type === PackingListType::SHIPPING_PACKING_LIST, new PackingListV2Resource(PackingList::where('reference', $this->reference)->where('type', PackingListType::WAREHOUSE_RECEIVE_LIST)->first(), $this->userInfo)),
-            'packages' => PackageResource::collection($packages),
-            $this->mergeWhen($this->owner instanceof Order, [
-                'order' => New OrderResource($this->owner)
-            ]),
+            // 'packages' => PackageResource::collection($packages),
+            // $this->mergeWhen($this->owner instanceof Order, [
+            //     'order' => New OrderResource($this->owner)
+            // ]),
+            'container' => new ContainerResource($this->containers->first()),
+            'packages' => PackageWithoutOrderResource::collection($packages),
+            $this->mergeWhen($this->owner instanceof Order, [ 'order' => New OrderResource($this->owner) ]),
             'shipping_transaction' => new TransactionResource($this->transactions()->where('type', TransactionType::SHIPPING_INVOICE)->whereNotIn('status', [ApprovalStatus::SUSPENDED, ApprovalStatus::EXPIRED])->first()),
             'suspended_invoice' => new TransactionResource($this->transactions()->where('type', TransactionType::SHIPPING_INVOICE)->whereIn('status', [ApprovalStatus::SUSPENDED])->first()),
             // 'suspended_invoices' => TransactionResource::collection($this->transactions()->where('type', TransactionType::SHIPPING_INVOICE)->whereIn('status', [ApprovalStatus::SUSPENDED])->get()),

app/Http/Resources/PackageWithoutOrderResource.php

@@ -0,0 +1,38 @@
+<?php
+
+namespace App\Http\Resources;
+
+use App\Models\Order;
+use App\Models\PackingList;
+use Illuminate\Http\Resources\Json\JsonResource;
+
+class PackageWithoutOrderResource extends JsonResource
+{
+    /**
+     * Transform the resource into an array.
+     *
+     * @param  \Illuminate\Http\Request  $request
+     * @return array
+     */
+    public function toArray($request)
+    {
+        return [
+            'id' => $this->id,
+            'type' => $this->type,
+            'description' => $this->description,
+            'width' => floatval($this->width),
+            'height' => floatval($this->height),
+            'length' => floatval($this->length),
+            'weight' => $this->weight,
+            'quantity' => $this->quantity,
+            'cbm' => (($this->width / 100) * ($this->height / 100) * ($this->length / 100)) * $this->quantity,
+            'reference' => $this->packingList->reference,
+            'status' => $this->status,
+            // $this->mergeWhen($originalPackingList->owner instanceof Order, [
+            //     'order' => New OrderResource($originalPackingList->owner)
+            // ]),
+            // 'container' => new ContainerResource($originalPackingList->containers()->first()),
+            // 'transport' => new TransportResource($originalPackingList->transports()->first())
+        ];
+    }
+}

database/migrations/2024_01_23_233651_add_is_waived_to_transactions_logs_table.php

@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class AddIsWaivedToTransactionsLogsTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('transaction_logs', function (Blueprint $table) {
+            $table->boolean('is_waived')->nullable()->after('status')->default(false);
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('transaction_logs', function (Blueprint $table) {
+            $table->dropColumn('is_waived');
+        });
+    }
+}

database/migrations/2024_01_23_233651_add_is_waived_to_transactions_table.php

@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+class AddIsWaivedToTransactionsTable extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('transactions', function (Blueprint $table) {
+            $table->boolean('is_waived')->nullable()->after('status')->default(false);
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('transactions', function (Blueprint $table) {
+            $table->dropColumn('is_waived');
+        });
+    }
+}

resources/assets/vue/components/paymentsBilling/elements/AdminPaymentsBillingWithSearchComponent.vue

@@ -35,16 +35,16 @@
                 </div>
             </div>
             <!-- CIEF TODO: For easy revert to old code -->
-            <!-- <list-component :key="currentKey" :section="section" :endpoint="route('api.packing_list.list')" :options="options">
+            <list-component :key="currentKey" :section="section" :endpoint="route('api.packing_list.list')" :options="options">
                 <template slot="list" slot-scope="{data}">
                     <admin-payments-billing-component :data="data" :invoice_status="invoice_status" :section="section" ></admin-payments-billing-component>
                 </template>
-            </list-component> -->
-            <list-polling-component :key="currentKey" :section="section" :endpoint="route('api.packing_list.list.job')" :options="options">
+            </list-component>
+            <!-- <list-polling-component :key="currentKey" :section="section" :endpoint="route('api.packing_list.list.job')" :options="options">
                 <template slot="list" slot-scope="{data}">
                     <admin-payments-billing-component :data="data" :invoice_status="invoice_status" :section="section" ></admin-payments-billing-component>
                 </template>
-            </list-polling-component>
+            </list-polling-component> -->
         </div>
     </div>
 </template>

resources/assets/vue/components/paymentsBilling/elements/AdminPaymentsBillingWithSearchPollingComponent.vue

@@ -0,0 +1,90 @@
+<template>
+    <div class="row m-t-20" @keyup.enter="search">
+        <div class="col">
+            <div class="row">
+                <div class="col-12 col-md">
+                    <div class="row m-b-15">
+                        <div class="col">
+                            <div class="row">
+                                <div class="col p-r-0">
+                                    <div class="form-group no-margin form-group-default b-rad-none">
+                                        <label class="text-primary">Order Number Like</label>
+                                        <input type="text" class="form-control" v-model="marking" />
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-auto p-l-0 p-r-0">
+                            <div class="btn btn-primary b-rad-none" @click="search">
+                                <i class="fa fa-search lh-40"></i>
+                            </div>
+                        </div>
+                        <div class="col-auto p-l-0">
+                            <div class="btn btn-secondary b-rad-none" @click="reset">
+                                <i class="fa fa-remove lh-40"></i>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-12 col-md">
+                    <div class="row" v-if="with_export">
+                        <div class="col">
+                            <download-billing-with-dates-component :section="section"></download-billing-with-dates-component>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <!-- CIEF TODO: For easy revert to old code -->
+            <!-- <list-component :key="currentKey" :section="section" :endpoint="route('api.packing_list.list')" :options="options">
+                <template slot="list" slot-scope="{data}">
+                    <admin-payments-billing-component :data="data" :invoice_status="invoice_status" :section="section" ></admin-payments-billing-component>
+                </template>
+            </list-component> -->
+            <list-polling-component :key="currentKey" :section="section" :endpoint="route('api.packing_list.list.job')" :options="options">
+                <template slot="list" slot-scope="{data}">
+                    <single-admin-payments-billing-component :data="data" :invoice_status="invoice_status" :section="section" ></single-admin-payments-billing-component>
+                </template>
+            </list-polling-component>
+        </div>
+    </div>
+</template>
+<script>
+    export default {
+        props: {
+            invoice_status: {
+                type: String,
+                required: true
+            },
+            options: {
+                default () {
+                    return {}
+                }
+            },
+            section:{
+                type: String,
+                required: true
+            },
+            with_export:{
+                type: Boolean,
+                default: false
+            }
+        },
+        data(){
+            return {
+                marking: '',
+                currentKey: 1,
+            }
+        },
+        methods: {
+            search() {
+                this.options['order_marking_in'] = this.marking;
+                this.currentKey+=1;
+            },
+            reset() {
+                this.marking = '';
+                delete(this.options['order_marking_in']);
+                this.currentKey+=1;
+            },
+        },
+    }
+</script>

resources/assets/vue/components/paymentsBilling/elements/SingleAdminPaymentsBillingComponent.vue

@@ -0,0 +1,322 @@
+<template>
+    <div class="row m-b-15 m-l-5 m-r-10 parentContainer">
+        <div class="col bg-white rounded">
+            <div class="row">
+                <div class="col padding-20">
+                    <div class="row align-items-center">
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Marking</p>
+                            <div class="no-margin">
+                                <div v-if="item.order">
+                                    <a :href="route('customer.profile', item.order.company_module.marking)">{{item.order.company_module.marking}}</a>/<a :href="route('order.show', item.order.reference)">{{item.order.reference}}</a>
+                                    <p>{{item.loading_days_ago}}</p>
+                                </div>
+                                <div v-else class="text-danger">Unclaimed Packing List</div>
+                            </div>
+                        </div>
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Container</p>
+                            <div v-if="item.container"> {{item.container.container_reference}}</div>
+                        </div>
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Invoice Date</p>
+                            <div v-if="!item.shipping_transaction">n/a</div>
+                            <div v-if="item.shipping_transaction"> {{ item.shipping_transaction.updated_at }}</div>
+                        </div>
+                        <div class="col">
+                            <div v-if="item.order">
+                                <p class="no-margin fs-10 all-caps">Address</p>
+                                <div>{{ item.order.address.post_code_area}}</div>
+                                <div>{{ item.order.address.district.name +' '+item.order.address.postcode+' '+item.order.address.state.name  }}</div>
+                            </div>
+                            <div v-else class="text-danger">Unclaimed</div>
+                        </div>
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Status</p>
+                            <div class="all-caps">{{ invoice_status }}</div>
+                        </div>
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Amount</p>
+                            <div v-if="!item.shipping_transaction">n/a</div>
+                            <div v-if="item.shipping_transaction">MYR  {{ item.shipping_transaction.amount.toFixed(2) }}</div>
+                        </div>
+                        <div class="col-auto p-l-0 p-r-0" v-if="['Pending Payment', 'Paid Invoice', 'Suspended Invoice'].includes(invoice_status)">
+                            <div v-if="item.shipping_transaction">
+                                <div v-if="item.shipping_transaction.documents.length">
+                                    <div v-for="file in item.shipping_transaction.documents[0].files" v-bind:key="file.id" class="col-auto no-padding">
+                                        <document-file-viewer-component :file="file">
+                                            <template slot="button">
+                                                <div class="btn bg-grey no-border muted">
+                                                    <i class="fa fa-file-pdf-o"></i>
+                                                </div>
+                                            </template>
+                                        </document-file-viewer-component>
+                                    </div>
+                                </div>
+                                <div v-else>
+                                    <div class="btn bg-grey no-border muted invisible">
+                                        <i class="fa fa-file-pdf-o"></i>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-auto">
+                            <div class="row text-center parentContainer m-b-10" v-if="['Pending Invoice'].includes(invoice_status) && !item.receive_packing_list" >
+                                <div class="col">
+                                    <div class="requestModal pointer btn btn-primary btn-xs" data-type="addWarehouseTransport">
+                                        Add Warehouse Transport
+                                    </div>
+                                    <modal-component class="animate_animated animatefast animate_fadeIn" styleType="fill-in" type="addWarehouseTransport">
+                                        <create-warehouse-transport-form-component :packinglistId="item.id" :section="section"></create-warehouse-transport-form-component>
+                                    </modal-component>
+                                </div>
+                            </div>
+                            <div class="row">
+                                <div class="col">
+                                    <div class="btn bg-grey no-border" @click="expanded = !expanded" v-if="['Pending Approval', 'Pending Payment'].includes(invoice_status)">
+                                        <i class="fa" :class="{'fa-angle-down': !expanded, 'fa-angle-up': expanded}" ></i>
+                                    </div>
+                                    <div v-if="!item.shipping_transaction">
+                                        <div v-if="item.order">
+                                            <div v-if="!item.order.company_module.billingAddress">
+                                                <div class="btn btn-primary btn-xs pointer requestModal btn-block" data-type="billingAddressComponent">Add Billing Address</div>
+                                                <modal-component class="animate__animated animate__fast animate__fadeIn" size="extra-large" styleType="fill-in" type="billingAddressComponent">
+                                                    <address-form-component :id="item.order.company_module.id" :section="section" :type=1></address-form-component>
+                                                </modal-component>
+                                            </div>
+                                            <div class="row" v-if="item.order.company_module.billingAddress">
+                                                <div class="col">
+                                                    <div class="col-auto requestModal pointer" data-type="editBillingAddress">
+                                                        <i class="fa fa-edit pointer fa-fw m-l-5"></i> Edit billing Address
+                                                    </div>
+                                                    <modal-component class="animate__animated animate__fast animate__fadeIn" size="extra-large" styleType="fill-in" type="editBillingAddress">
+                                                        <div class="row">
+                                                            <div class="col bg-white">
+                                                                <address-form-component :id="item.order.company_module.id"  :data="item.order.company_module.billingAddress" section="editBillingAddress"></address-form-component>
+                                                            </div>
+                                                        </div>
+                                                    </modal-component>
+                                                </div>
+                                            </div>
+                                            <div v-if="!item.order.address.post_code_area">
+                                                <div class="btn btn-xs btn-primary pointer m-t-10 requestModal btn-block" data-type="defineLocation">Define Location</div>
+                                                <modal-component class="animate_animated animatefast animate_fadeIn" styleType="fill-in" type="defineLocation">
+                                                    <declare-postcode-area-form-component :data="item.order.address" :section="section"></declare-postcode-area-form-component>
+                                                </modal-component>
+                                            </div>
+                                            <div v-if="item.order.company_module.billingAddress && item.order.address.post_code_area" class="btn btn-outline-primary btn-lg pointer" @click="generateInvoice()">Generate Invoice</div>
+                                        </div>
+                                        <div v-else>
+                                            <div class="btn btn-outline-primary btn-lg pointer invisible">Generate Invoice</div>
+                                        </div>
+                                    </div>
+                                    <div class="btn bg-grey no-border muted requestModal" v-if="item.shipping_transaction && invoice_status == 'Pending Approval'" data-type="confirmInvoice">
+                                        <i class="fa fa-check fs-12"></i>
+                                    </div>
+                                    <div class="btn bg-grey no-border muted requestModal" v-if="item.shipping_transaction && invoice_status == 'Pending Approval'" data-type="deleteInoive">
+                                        <i class="fa fa-close fs-12"></i>
+                                    </div>
+                                    <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="confirmInvoice">
+                                        <approve-shipping-invoice-form-component :section="section" :data="data"></approve-shipping-invoice-form-component>
+                                    </modal-component>
+                                    <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="deleteInoive">
+                                        <delete-shipping-invoice-form-component :section="section" :data="data"></delete-shipping-invoice-form-component>
+                                    </modal-component>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="row b-t b-grey p-t-10 m-l-5 m-r-5" v-show="expanded" v-if="item.shipping_transaction && ['Pending Approval', 'Suspended Invoice'].includes(invoice_status)">
+                <div class="col p-b-10">
+                    <div class="row">
+                        <div class="col p-l-20 p-r-20 p-t-10 p-b-10">
+                            <div class="row align-items-center">
+                                <div class="col">
+                                    <p class="no-margin fs-10 all-caps">Container Reference</p>
+                                    <div v-if="item.packages.length">{{ item.container ? item.container.container_reference : 'n/a' }}</div>
+                                    <div v-else>n/a</div>
+                                </div>
+                                <div class="col">
+                                    <p class="no-margin fs-10 all-caps">Due Date</p>
+                                    <div v-if="item.packages.length">
+                                        <div v-if="item.container">
+                                            <div v-if="item.container.transport">{{ item.container.transport.drop_date == null ? item.container.transport.current_schedule.etd : item.container.transport.drop_date }}</div>
+                                            <div v-else>n/a</div>
+                                        </div>
+                                        <div v-else>n/a</div>
+                                    </div>
+                                    <div v-else>n/a</div>
+                                </div>
+                                <!-- <div class="col">
+                                    <p class="no-margin fs-10 all-caps">Paid Date</p>
+                                    <div>n/a</div>
+                                </div> -->
+                                <div class="col">
+                                    <p class="no-margin fs-10 all-caps">Total CBM</p>
+                                    <div>{{ (parseFloat(cbm) + parseFloat(overweight)).toFixed(3) }}</div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <h5 class="text-underline text-center">Invoice Details</h5>
+                    <invoice-items-form-component :data="item.shipping_transaction" :section="section"></invoice-items-form-component>
+
+                    <div class="row">
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Subtotal</p>
+                            <div>{{ item.shipping_transaction.amount -  item.shipping_transaction.service_charge - item.shipping_transaction.tax }}</div>
+                        </div>
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Service Charges</p>
+                            <div>{{ item.shipping_transaction.service_charge }}</div>
+                        </div>
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Tax</p>
+                            <div>{{ item.shipping_transaction.tax }}</div>
+                        </div>
+                        <div class="col">
+                            <p class="no-margin fs-10 all-caps">Total</p>
+                            <div>{{ item.shipping_transaction.amount }}</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="row b-t b-grey p-t-10 m-l-5 m-r-5" v-show="expanded" v-if="item.shipping_transaction && invoice_status == 'Pending Payment'">
+                <div class="col-12 col-md-7 padding-20">
+                    <div class="row bg-master-lightest h-100">
+                        <div class="col">
+                            <div class="row bg-master-lightest" v-if="item.shipping_transaction.payment_attempts.length">
+                                <div class="col">
+                                    <div class="row m-t-10 m-b-10">
+                                        <div class="col">
+                                            <div class="font-head fs-10 all-caps">Payment Attempt</div>
+                                        </div>
+                                    </div>
+                                    <div class="row">
+                                        <div class="col">
+                                            <shipping-transaction-component v-for="item in item.shipping_transaction.payment_attempts" v-bind:key="item.id" :data="item" ></shipping-transaction-component>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="row bg-master-lightest" v-if="item.shipping_transaction.payment_history.length">
+                                <div class="col">
+                                    <div class="row m-t-10 m-b-10">
+                                        <div class="col">
+                                            <div class="font-head fs-10 all-caps">Payment History</div>
+                                        </div>
+                                    </div>
+                                    <div class="row">
+                                        <div class="col">
+                                            <payment-history-component v-for="item in item.shipping_transaction.payment_history" v-bind:key="item.id" :data="item" ></payment-history-component>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-12 col-md-5 padding-20 parentContainer">
+                    <div class="row bg-master-lightest h-100">
+                        <div class="col">
+                            <div class="row padding-10">
+                                <div class="col">
+                                    <div class="row align-items-end m-b-10 text-complete">
+                                        <div class="col">
+                                            <div class="font-heading all-caps fs-12">Total Amount:</div>
+                                        </div>
+                                        <div class="col-auto text-right">
+                                            <div class="font-heading fs-12">MYR {{(Math.round((item.shipping_transaction.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
+                                        </div>
+                                    </div>
+                                    <div class="row align-items-end m-b-10 text-success hide">
+                                        <div class="col">
+                                            <div class="font-heading all-caps fs-12">Paid Total:</div>
+                                        </div>
+                                        <div class="col-auto text-right">
+                                            <!-- <div class="font-heading fs-12">MYR {{(Math.round((item.shipping_transaction.paid_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div> -->
+                                            <div class="font-heading fs-12">Paid Total</div>
+                                        </div>
+                                    </div>
+                                    <div class="row align-items-end m-b-10 hide">
+                                        <div class="col">
+                                            <div class="font-heading all-caps fs-12">Floating Amount:</div>
+                                        </div>
+                                        <div class="col-auto text-right">
+                                            <!-- <div class="font-heading fs-12">MYR {{(Math.round((item.shipping_transaction.floating_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div> -->
+                                            <div class="font-heading fs-12">Floating Amount</div>
+                                        </div>
+                                    </div>
+                                    <div class="row align-items-end bold text-danger">
+                                        <div class="col">
+                                            <div class="font-heading all-caps fs-12">OutStanding Total:</div>
+                                        </div>
+                                        <div class="col-auto text-right">
+                                            <div class="font-heading fs-12">MYR {{(Math.round((item.shipping_transaction.outstanding + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
+                                        </div>
+                                    </div>
+                                    <div class="row m-t-20" v-if="item.shipping_transaction.outstanding > 0">
+                                        <div class="col">
+                                            <div class="btn btn-sm all-caps b-rad-none btn-success btn-block requestModal" data-type="makePayment">Make Payment</div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="makePayment">
+                                <payment-form-component :data="item.shipping_transaction" :section="section"></payment-form-component>
+                            </modal-component>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script>
+    import componentHandler from '../../../general/mixins/componentHandler';
+    export default {
+        props: {
+            invoice_status: {
+                type: String,
+                required: true
+            },
+            section:{
+                type: String,
+                required: true
+            }
+        },
+        data(){
+            return {
+                parameters: {
+                    packing_list_id: null,
+                    transaction_details: [],
+                },
+                expanded: false,
+            }
+        },
+        computed: {
+            cbm () {
+                return (Math.ceil((this.item.packages.reduce((total, obj) => (obj.type === 2 ? 0 : obj.cbm) + total, 0)) * 1000) / 1000).toFixed(3)
+            },
+            overweight(){
+                return (Math.ceil((this.item.packages.reduce((total, obj) => (obj.type === 2 ? obj.cbm : 0) + total, 0)) * 1000) / 1000).toFixed(3)
+            }
+        },
+        created(){
+            this.parameters.packing_list_id = this.data.id;
+        },
+        methods: {
+            generateInvoice() {
+                this.submit(this.route('api.transaction.invoice.create'), 'post', this.section, true, true);
+            },
+            successHandler(response){
+                this.item = response.payload.data;
+                this.updateList();
+            }
+        },
+        mixins: [componentHandler]
+    }
+</script>

resources/assets/vue/components/wallets/elements/CustomerWalletTransactionComponent.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="row bg-white padding-10 m-b-10 rounded align-datas-center">
         <div class="col-3 fs-12">{{data.created_at}}</div>
-        <div class="col fs-12"><span v-html="data.description"></span> <a target=”_blank” v-if="[9,11].includes(data.type) " :href="route('transaction.credit_note.download', data.id)"><i class="fa fa-download fs-11 m-l-5 text-secondary hover-primary"></i></a></div>
+        <div class="col fs-12"><span v-html="data.description"></span> <a target=”_blank” v-if="[9,11].includes(data.type) " :href="route('transaction.credit_note.download', data.id)"><i class="fa fa-download fs-11 m-l-5 text-secondary hover-primary"></i></a><small v-if="data.bill_no && $store.getters.isAdmin"><br><br>{{ data.bill_no }}</small></div>
         <div class="col-2 text-success text-center">{{[5, 9, 15].includes(parseFloat(data.type)) ? formatValue(data.amount) : ''}}</div>
         <div class="col-2 text-danger text-center">{{[2, 11].includes(parseFloat(data.type)) ? '- ' + formatValue(data.amount, ) : ''}}</div>
         <div class="col-2 text-right">{{formatValue(data.running_balance)}}</div>

resources/views/pages/paymentAndBilling2.blade.php

@@ -0,0 +1,8 @@
+@extends('layouts.base_portal')
+@section('inner_content')
+    <div class="row">
+        <div class="col">
+            <admin-payments-billing-polling-section-component></admin-payments-billing-polling-section-component>
+        </div>
+    </div>
+@endsection

routes/web.php

@@ -1247,4 +1247,9 @@ Route::get('fix-payment-status-updated-but-failed-update-invoice', function (Upd
             echo 'done fix ' . $invoice->owner->owner->reference . '<br>';
         }
     }
-});
+});
+
+//A page to monitor Experimental solution (Vue Polling) to solve an AWS API Gateway problem limitation for Laravel Vapor in the event of a emergency rollback to Google
+Route::get('/payment-and-billing-2', function () {
+    return view('pages.paymentAndBilling2');
+})->name('admin.payment-and-billing-2');