diff --git a/app/Classes/Modules/Orders/ControllersLogic/ListOrdersV2Logic.php b/app/Classes/Modules/Orders/ControllersLogic/ListOrdersV2Logic.php
new file mode 100644
index 00000000..c563051d
--- /dev/null
+++ b/app/Classes/Modules/Orders/ControllersLogic/ListOrdersV2Logic.php
@@ -0,0 +1,56 @@
+<?php
+
+
+namespace App\Classes\Modules\Orders\ControllersLogic;
+
+use App\Classes\General\Abstracts\AbstractControllerLogic;
+use App\Classes\Modules\Orders\Services\ListsOrders;
+use App\Classes\Modules\Orders\Standards\Rules\CanListOrders;
+use App\Classes\ValueObjects\Constants\OrderType;
+use App\Http\Resources\OrderV2Resource;
+use ErrorException;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+
+class ListOrdersV2Logic extends AbstractControllerLogic
+{
+    /**
+     * @return array
+     */
+    protected function notification():array {
+        return [
+            'title' => 'Retrieved Orders',
+            'message' => 'You have successfully retrieved a list of Orders'
+        ];
+    }
+
+    /** @var CanListOrders */
+    private $canListOrders;
+
+    /** @var ListsOrders */
+    private $listsOrders;
+
+    /**
+     * ListOrdersLogic constructor.
+     * @param CanListOrders $canListOrders
+     * @param ListsOrders $listsOrders
+     */
+    public function __construct(CanListOrders $canListOrders, ListsOrders $listsOrders)
+    {
+        $this->canListOrders = $canListOrders;
+        $this->listsOrders = $listsOrders;
+    }
+
+    public function logic(Request $request) : JsonResponse
+    {
+        $this->canListOrders->passes();
+
+        $query = $this->listsOrders->execute(array_merge($this->listsOrders->deserializeFilters($request->input('filters')), ['with_parcels' => true, 'type_in' => [OrderType::SHARED_CONTAINER, OrderType::DEDICATED_CONTAINER]]));
+
+        return $this->collectionResponse(OrderV2Resource::collection($query));
+
+    }
+
+
+
+}
diff --git a/app/Http/Controllers/Orders/ListOrdersV2Controller.php b/app/Http/Controllers/Orders/ListOrdersV2Controller.php
new file mode 100644
index 00000000..f52d206d
--- /dev/null
+++ b/app/Http/Controllers/Orders/ListOrdersV2Controller.php
@@ -0,0 +1,22 @@
+<?php
+
+
+namespace App\Http\Controllers\Orders;
+
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+use App\Classes\Modules\Orders\ControllersLogic\ListOrdersV2Logic;
+
+
+class ListOrdersV2Controller
+{
+    /**
+     * @param Request $request
+     * @param ListOrdersV2Logic $logic
+     * @return JsonResponse
+     */
+
+    public function list(Request $request, ListOrdersV2Logic $logic) : JsonResponse {
+        return $logic->execute($request);
+    }
+}
diff --git a/resources/assets/vue/components/orders/elements/ListOrderComponent.vue b/resources/assets/vue/components/orders/elements/ListOrderComponent.vue
new file mode 100644
index 00000000..b7c82ede
--- /dev/null
+++ b/resources/assets/vue/components/orders/elements/ListOrderComponent.vue
@@ -0,0 +1,124 @@
+<template>
+    <transition-component group enter-class="animate__animated animate__fadeInRight animate__delay-1 animate__faster p-r-30" leave-class="animate__animated animate__fadeOutLeft animate__faster p-r-30" style="min-height: 300px;width:100%">
+        <loading-component style="height: 200px; top: 0;" key="1" color="success" v-show="isLoading"></loading-component>
+        <div class="row" key="2" v-show="!isLoading">
+            <div class="col">
+                <div class="row">
+                    <div class="col">
+                        <div class="row align-items-center justify-content-center p-t-50 p-b-50"  v-show="!$store.getters.getListData(section).length && !$store.getters.isLoading(section) && emptyListSection">
+                            <div class="col-10">
+                                <div class="row align-items-center justify-content-center  hint-text">
+                                    <div class="col-4 hint-text"><img src="/images/not-found-illustration.png" class="w-100 hint-text"/></div>
+                                </div>
+                                <div class="row text-center">
+                                    <div class="col">
+                                        <div class="row m-t-20">
+                                            <div class="col">
+                                                <p class="all-caps no-margin fs-11" style="letter-spacing: 2px;">Nothing To Show Here</p>
+                                            </div>
+                                        </div>
+                                        <div class="row m-t-5 align-items-center justify-content-center hide">
+                                            <div class="col">
+                                                <small class="fs-9 muted all-caps font-lato" style="letter-spacing: 2px">There is no results found, Try adjusting your filters to find what you are looking for.</small>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col">
+                                <div class="list disable-text-selection" data-check-all="checkAll">
+                                    <div class="row" v-for="group in Math.ceil($store.getters.getListData(section).length / columns)">
+                                        <div class="col-12" :class="'col-md-'+(12/columns)" v-for="item in $store.getters.getListData(section).slice((group - 1) * columns, group * columns)" v-bind:key="item.id" :data="item">
+                                            <slot name="list" :data="item"></slot>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="row">
+                            <div class="col">
+                                <pagination-component :section="section" class="mb-5" ref="pagination"></pagination-component>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </transition-component>
+</template>
+
+<script>
+    export default {
+        props: {
+            section:{
+                type: String,
+                required: true
+            },
+            endpoint: {
+                type: String,
+                default: route('api.order.v2.list'),
+            },
+            options: {
+                default () {
+                    return {}
+                }
+            },
+            emptyListSection: {
+                type: Boolean,
+                default: true
+            },
+            columns: {
+                type: Number,
+                validator: (prop) => [1, 2, 3, 4, 6, 12].includes(prop),
+                default: 1
+            }
+        },
+        data(){
+            return {
+                filters: this.options,
+                api_count: 0,
+                isLoading: true,
+            }
+        },
+        created(){
+            this.setDecoratorDefault();
+            this.$store.dispatch('updateListQueue', {'name': this.section, 'page': 1, 'filters': this.filters});
+        },
+        computed: {
+            pendingList () {
+                return this.$store.getters.isInCompleteQueue(this.section);
+            }
+        },
+        watch: {
+            pendingList(inComplete){
+                if(inComplete){
+                    this.fetchList();
+                }
+            }
+        },
+        methods: {
+            fetchList(){
+                let listDecorators = this.$store.getters.getListDetails(this.section);
+                this.submit(this.endpoint + '?page=' + listDecorators.page + '&filters=' + JSON.stringify(listDecorators.filters), 'get', this.section, false, false)
+            },
+            updateFilters(filters){
+                this.filters = filters;
+                this.setDecoratorDefault();
+                this.submit(this.endpoint + '?page=1&filters=' + JSON.stringify(this.filters), 'get', this.section, false, false)
+            },
+            successHandler(response){
+                this.$store.dispatch('completeList', {'name': this.section, 'data': response.payload.data});
+                this.$refs.pagination.makePagination(response.payload.meta, response.payload.links);
+                this.api_count += 1;
+                this.isLoading = false;
+
+                if (this.endpoint === route('api.order.v2.list') && this.api_count === 1) {
+                    let listDecorators = this.$store.getters.getListDetails(this.section);
+                    this.submit(this.route('api.order.list') + '?page=' + listDecorators.page + '&filters=' + JSON.stringify(listDecorators.filters), 'get', this.section, false, false)
+                }
+            },
+        }
+    }
+</script>
diff --git a/resources/assets/vue/components/orders/elements/OrderComponent.vue b/resources/assets/vue/components/orders/elements/OrderComponent.vue
index da21cef8..a744f38a 100644
--- a/resources/assets/vue/components/orders/elements/OrderComponent.vue
+++ b/resources/assets/vue/components/orders/elements/OrderComponent.vue
@@ -62,15 +62,18 @@
                     <div class="row text-center">
                         <div class="col b-r b-grey text-info p-t-5 p-b-10">
                             <small class="fs-10 all-caps bold">Received</small>
-                            <h6 class="bold no-margin text-info">{{item.parcels.received_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
+                            <h6 class="bold no-margin text-info" v-if="item.parcels" >{{item.parcels.received_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
+                            <h6 class="bold no-margin text-info" v-else > - </h6>
                         </div>
                         <div class="col b-r b-grey text-primary p-t-5 p-b-10">
                             <small class="fs-10 all-caps bold">In Transit</small>
-                            <h6 class="bold no-margin text-primary">{{item.parcels.in_transit_packages.flatMap(packing_list => packing_list.packages).concat(item.parcels.destination_warehouse_packages.flatMap(packing_list => packing_list.packages)).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
+                            <h6 class="bold no-margin text-primary" v-if="item.parcels" >{{item.parcels.in_transit_packages.flatMap(packing_list => packing_list.packages).concat(item.parcels.destination_warehouse_packages.flatMap(packing_list => packing_list.packages)).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
+                            <h6 class="bold no-margin text-info" v-else > - </h6>
                         </div>
                         <div class="col text-success p-t-5 p-b-10">
                             <small class="fs-10 all-caps bold">Delivered</small>
-                            <h6 class="bold no-margin text-success">{{item.parcels.delivered_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
+                            <h6 class="bold no-margin text-success" v-if="item.parcels" >{{item.parcels.delivered_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.quantity + total, 0)}}</h6>
+                            <h6 class="bold no-margin text-info" v-else > - </h6>
                         </div>
                     </div>
                 </div>
@@ -90,7 +93,8 @@
                         </div>
                         <div class="col-auto text-right">
                             <small class="fs-10 all-caps muted">Total CBM</small>
-                            <h6 class="no-margin semi-bold">{{(Math.ceil((item.parcels.origin_warehouse_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.in_transit_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.destination_warehouse_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.delivered_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0)) * 10000) / 10000).toFixed(3)}}</h6>
+                            <h6 class="no-margin semi-bold" v-if="item.parcels">{{(Math.ceil((item.parcels.origin_warehouse_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.in_transit_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.destination_warehouse_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0) + item.parcels.delivered_packages.flatMap(packing_list => packing_list.packages).reduce((total, obj) => obj.cbm + total, 0)) * 10000) / 10000).toFixed(3)}}</h6>
+                            <h6 class="bold no-margin text-info" v-else > - </h6>
                         </div>
                     </div>
                 </div>
diff --git a/resources/assets/vue/components/orders/sections/OrderSectionComponent.vue b/resources/assets/vue/components/orders/sections/OrderSectionComponent.vue
index 319ba7ca..c5beecc7 100644
--- a/resources/assets/vue/components/orders/sections/OrderSectionComponent.vue
+++ b/resources/assets/vue/components/orders/sections/OrderSectionComponent.vue
@@ -162,11 +162,11 @@
                                 <div class="col">
                                     <div class="row">
                                         <div class="col">
-                                            <list-component v-show="!$store.getters.isShowing('createOrderForm')" section="pendingOrderListSection" :endpoint="route('api.order.list')" :options="item ? {per_page: 12, status_in: [1], company_module_id: item.company_module.id, with_packing_lists: true} : {per_page: 30, status_in: [1], with_packing_lists: true}" :columns=3>
+                                            <list-order-component v-show="!$store.getters.isShowing('createOrderForm')" section="pendingOrderListSection" :options="item ? {per_page: 12, status_in: [1], company_module_id: item.company_module.id, with_packing_lists: true} : {per_page: 30, status_in: [1], with_packing_lists: true}" :columns=3>
                                                 <template slot="list" slot-scope="{data}">
                                                     <order-component :data="data"></order-component>
                                                 </template>
-                                            </list-component>
+                                            </list-order-component>
                                         </div>
                                     </div>
                                 </div>
@@ -179,11 +179,11 @@
                                 <div class="col">
                                     <div class="row">
                                         <div class="col">
-                                            <list-component v-show="!$store.getters.isShowing('createOrderForm')" section="activeOrderListSection" :endpoint="route('api.order.list')" :options="item ? {per_page: 12, order_by: {column: 'created_at', DESC: true}, status_in: [2], company_module_id: item.company_module.id, with_packing_lists: true} : {per_page: 30, order_by: {column: 'created_at', DESC: true}, status_in: [2], with_packing_lists: true}" :columns=3>
+                                            <list-order-component v-show="!$store.getters.isShowing('createOrderForm')" section="activeOrderListSection" :options="item ? {per_page: 12, order_by: {column: 'created_at', DESC: true}, status_in: [2], company_module_id: item.company_module.id, with_packing_lists: true} : {per_page: 30, order_by: {column: 'created_at', DESC: true}, status_in: [2], with_packing_lists: true}" :columns=3>
                                                 <template slot="list" slot-scope="{data}">
                                                     <order-component :data="data"></order-component>
                                                 </template>
-                                            </list-component>
+                                            </list-order-component>
                                         </div>
                                     </div>
                                 </div>
@@ -196,11 +196,11 @@
                                 <div class="col">
                                     <div class="row">
                                         <div class="col">
-                                            <list-component v-show="!$store.getters.isShowing('createOrderForm')" section="completeOrderListSection" :endpoint="route('api.order.list')" :options="item ? {per_page: 12, status_in: [3], company_module_id: item.company_module.id, with_packing_lists: true} : {per_page: 30, status_in: [3], with_packing_lists: true}" :columns=3>
+                                            <list-order-component v-show="!$store.getters.isShowing('createOrderForm')" section="completeOrderListSection" :options="item ? {per_page: 12, status_in: [3], company_module_id: item.company_module.id, with_packing_lists: true} : {per_page: 30, status_in: [3], with_packing_lists: true}" :columns=3>
                                                 <template slot="list" slot-scope="{data}">
                                                     <order-component :data="data"></order-component>
                                                 </template>
-                                            </list-component>
+                                            </list-order-component>
                                         </div>
                                     </div>
                                 </div>
@@ -213,11 +213,11 @@
                                 <div class="col">
                                     <div class="row">
                                         <div class="col">
-                                            <list-component v-show="!$store.getters.isShowing('createOrderForm')" section="cancelledOrderListSection" :endpoint="route('api.order.list')" :options="item ? {per_page: 12, status_in: [4, 5, 6], company_module_id: item.company_module.id, with_packing_lists: true} : {per_page: 30, status_in: [4, 5, 6], with_packing_lists: true}" :columns=3>
+                                            <list-order-component v-show="!$store.getters.isShowing('createOrderForm')" section="cancelledOrderListSection" :options="item ? {per_page: 12, status_in: [4, 5, 6], company_module_id: item.company_module.id, with_packing_lists: true} : {per_page: 30, status_in: [4, 5, 6], with_packing_lists: true}" :columns=3>
                                                 <template slot="list" slot-scope="{data}">
                                                     <order-component :data="data"></order-component>
                                                 </template>
-                                            </list-component>
+                                            </list-order-component>
                                         </div>
                                     </div>
                                 </div>
diff --git a/routes/order.php b/routes/order.php
index 507b489f..73369dba 100644
--- a/routes/order.php
+++ b/routes/order.php
@@ -6,6 +6,7 @@ Route::group(['prefix' => 'order', 'as' => 'order.', 'namespace' => 'Orders'], f
     Route::get('/show/{id}', 'FetchOrderController@fetch')->name('show');
     Route::get('/v2/show/{id}', 'FetchOrderV2Controller@fetch')->name('v2.show');
     Route::get('/list', 'ListOrdersController@list')->name('list');
+    Route::get('/v2/list', 'ListOrdersV2Controller@list')->name('v2.list');
     Route::post('/create', 'CreateOrderController@create')->name('create');
     Route::put('/confirm/{id}', 'ConfirmOrderController@confirm')->name('confirm');
     Route::put('/cancel/{id}', 'CancelOrderController@cancel')->name('cancel');