Implemented: Added a button to the empty state. On click, it shows completed TOs (#673)

src/locales/en.json

@@ -317,6 +317,7 @@
   "No orders are currently able to be shipped due to missing tracking codes.": "No orders are currently able to be shipped due to missing tracking codes.",
   "No payments found": "No payments found",
   "No reason": "No reason",
+  "No results found for .": "No results found for { searchedQuery }.",
   "No results found for . Try searching Open or Completed tab instead. If you still can't find what you're looking for, try switching stores.": "No results found for { searchedQuery }. Try searching Open or Completed tab instead.{ lineBreak } If you still can't find what you're looking for, try switching stores.",
   "No results found for . Try searching In Progress or Open tab instead. If you still can't find what you're looking for, try switching stores.": "No results found for { searchedQuery }. Try searching In Progress or Open tab instead.{ lineBreak } If you still can't find what you're looking for, try switching stores.",
   "No results found for . Try searching In Progress or Completed tab instead. If you still can't find what you're looking for, try switching stores.": "No results found for { searchedQuery }. Try searching In Progress or Completed tab instead.{ lineBreak } If you still can't find what you're looking for, try switching stores.",

src/locales/es.json

@@ -312,6 +312,7 @@
   "No orders found.": "No se encontraron pedidos.",
   "No payments found": "No se encontraron pagos",
   "No reason": "Sin motivo",
+  "No results found for .": "No results found for { searchedQuery }.",
   "No results found for . Try searching Open or Completed tab instead. If you still can't find what you're looking for, try switching stores.": "No se encontraron resultados para { searchedQuery }. Intenta buscar en la pestaña 'Abierto' o 'Completado' en su lugar.{ lineBreak } Si aún no puedes encontrar lo que buscas, prueba cambiando de tiendas.",
   "No results found for . Try searching In Progress or Open tab instead. If you still can't find what you're looking for, try switching stores.": "No se encontraron resultados para { searchedQuery }. Intenta buscar en la pestaña 'En Curso' o 'Abierto' en su lugar.{ lineBreak } Si aún no puedes encontrar lo que buscas, prueba cambiando de tiendas.",
   "No results found for . Try searching In Progress or Completed tab instead. If you still can't find what you're looking for, try switching stores.": "No se encontraron resultados para { searchedQuery }. Intenta buscar en la pestaña 'En Curso' o 'Completado' en su lugar.{ lineBreak } Si aún no puedes encontrar lo que buscas, prueba cambiando de tiendas.",

src/locales/ja.json

@@ -316,6 +316,7 @@
   "No orders are currently able to be shipped due to missing tracking codes.": "追跡コードがないため、現在出荷可能な注文はありません。",
   "No payments found": "支払いが見つかりません",
   "No reason": "理由なし",
+  "No results found for .": "No results found for { searchedQuery }.",
   "No results found for . Try searching Open or Completed tab instead. If you still can't find what you're looking for, try switching stores.": "{ searchedQuery }の結果は見つかりませんでした。代わりに「オープン」または「完了」タブで検索してみてください。 { lineBreak } それでも見つからない場合は、ストアを切り替えてみてください。",
   "No results found for . Try searching In Progress or Open tab instead. If you still can't find what you're looking for, try switching stores.": "{ searchedQuery }の結果は見つかりませんでした。代わりに「進行中」または「オープン」タブで検索してみてください。 { lineBreak } それでも見つからない場合は、ストアを切り替えてみてください。",
   "No results found for . Try searching In Progress or Completed tab instead. If you still can't find what you're looking for, try switching stores.": "{ searchedQuery }の結果は見つかりませんでした。代わりに「進行中」または「完了」タブで検索してみてください。 { lineBreak } それでも見つからない場合は、ストアを切り替えてみてください。",

src/views/TransferOrders.vue

@@ -8,7 +8,7 @@
         <ion-title v-if="!transferOrders.total">{{ transferOrders.total }} {{ translate('orders') }}</ion-title>
         <ion-title v-else>{{ transferOrders.list.length }} {{ translate('of') }} {{ transferOrders.total }} {{ translate('orders') }}</ion-title>
         <ion-buttons slot="end">
-          <ion-menu-button menu="transfer-order-filters">
+          <ion-menu-button menu="transfer-order-filters" :disabled="!transferOrders.total">
             <ion-icon :icon="optionsOutline" />
           </ion-menu-button>
         </ion-buttons>
@@ -45,6 +45,9 @@
       </div>
       <div v-else class="empty-state">
         <p v-html="getErrorMessage()"></p>
+        <ion-button v-if="!transferOrders.query.queryString" size="small" fill="outline" color="medium" @click="showCompletedTransferOrders">
+          <ion-icon slot="end" :icon="checkmarkDoneOutline"/>{{ translate("Show completed transfer orders") }}
+        </ion-button>
       </div>
     </ion-content>
   </ion-page>
@@ -53,6 +56,7 @@
 <script lang="ts">
 import { 
   IonBadge,
+  IonButton,
   IonButtons,
   IonIcon,
   IonContent, 
@@ -69,7 +73,7 @@ import {
   IonToolbar, 
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { caretDownOutline, cubeOutline, optionsOutline, pricetagOutline, printOutline,} from 'ionicons/icons';
+import { caretDownOutline, checkmarkDoneOutline, cubeOutline, optionsOutline, pricetagOutline, printOutline,} from 'ionicons/icons';
 import { mapGetters, useStore } from 'vuex';
 import { useRouter } from 'vue-router';
 import { translate } from '@hotwax/dxp-components';
@@ -80,6 +84,7 @@ export default defineComponent({
   name: 'TransferOrders',
   components: {
     IonBadge,
+    IonButton,
     IonButtons,
     IonIcon,  
     IonContent,
@@ -143,6 +148,13 @@ export default defineComponent({
     isTransferOrdersScrollable() {
       return this.transferOrders.list?.length > 0 && this.transferOrders.list?.length < this.transferOrders.total
     },
+    async showCompletedTransferOrders() {
+      const transferOrdersQuery = JSON.parse(JSON.stringify(this.transferOrders.query))
+      transferOrdersQuery.viewIndex = 0 // If the size changes, list index should be reintialised
+      transferOrdersQuery.viewSize = process.env.VUE_APP_VIEW_SIZE
+      transferOrdersQuery.selectedStatuses = ["ORDER_COMPLETED"]
+      await this.store.dispatch('transferorder/updateTransferOrderQuery', { ...transferOrdersQuery })
+    },
     async updateQueryString(queryString: string) {
       const transferOrdersQuery = JSON.parse(JSON.stringify(this.transferOrders.query))
 
@@ -177,6 +189,7 @@ export default defineComponent({
     return{
       Actions,
       caretDownOutline,
+      checkmarkDoneOutline,
       cubeOutline,
       optionsOutline,
       pricetagOutline,