From 5c5f154c3e91e0a52786233e534fb7c0d76ed094 Mon Sep 17 00:00:00 2001
From: Javier Segarra <jsegarra@verdnatura.es>
Date: Wed, 8 Nov 2023 02:58:45 +0100
Subject: [PATCH] approach to use i18n for each module

---
 src/pages/InvoiceIn/Card/InvoiceInCard.vue    | 12 +++---------
 src/pages/InvoiceIn/Card/InvoiceInSummary.vue |  8 ++------
 src/pages/InvoiceIn/InvoiceInList.vue         | 11 +++--------
 src/pages/InvoiceIn/i18n.json                 |  8 ++++++++
 src/pages/InvoiceIn/i18n/en.json              |  3 +++
 src/pages/InvoiceIn/i18n/es.json              |  3 +++
 src/pages/InvoiceIn/in18n.js                  | 19 +++++++++++++++++++
 7 files changed, 41 insertions(+), 23 deletions(-)
 create mode 100644 src/pages/InvoiceIn/i18n.json
 create mode 100644 src/pages/InvoiceIn/i18n/en.json
 create mode 100644 src/pages/InvoiceIn/i18n/es.json
 create mode 100644 src/pages/InvoiceIn/in18n.js

diff --git a/src/pages/InvoiceIn/Card/InvoiceInCard.vue b/src/pages/InvoiceIn/Card/InvoiceInCard.vue
index 4d06cb41e..ef3bafe59 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInCard.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInCard.vue
@@ -7,9 +7,9 @@ import VnSearchbar from 'components/ui/VnSearchbar.vue';
 import { useArrayData } from 'src/composables/useArrayData';
 import { onMounted, watch } from 'vue';
 import { useRoute } from 'vue-router';
-
 const stateStore = useStateStore();
-const { t } = useI18n();
+import in18n from '../in18n';
+const { t } = useI18n(in18n);
 const route = useRoute();
 
 const filter = {
@@ -61,7 +61,7 @@ onMounted(async () => {
         <VnSearchbar
             data-key="InvoiceInList"
             url="InvoiceIns/filter"
-            :label="t('Search invoice')"
+            :label="t('searchInvoice')"
             :info="t('You can search by invoice reference')"
         />
     </Teleport>
@@ -83,9 +83,3 @@ onMounted(async () => {
         </QPage>
     </QPageContainer>
 </template>
-
-<i18n>
-    es:
-        Search invoice: Buscar factura emitida
-        You can search by invoice reference: Puedes buscar por referencia de la factura
-    </i18n>
diff --git a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
index 6c3f0838c..370dc786d 100644
--- a/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
+++ b/src/pages/InvoiceIn/Card/InvoiceInSummary.vue
@@ -8,6 +8,7 @@ import { downloadFile } from 'src/composables/downloadFile';
 
 import CardSummary from 'components/ui/CardSummary.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
+import in18n from '../in18n';
 
 onMounted(async () => {
     salixUrl.value = await getUrl('');
@@ -15,7 +16,7 @@ onMounted(async () => {
 });
 
 const route = useRoute();
-const { t } = useI18n();
+const { t } = useI18n(in18n);
 
 const $props = defineProps({
     id: {
@@ -453,8 +454,3 @@ function setData(entity) {
     width: 16em;
 }
 </style>
-<i18n>
-    es:
-        Search invoice: Buscar factura emitida
-        You can search by invoice reference: Puedes buscar por referencia de la factura
-</i18n>
diff --git a/src/pages/InvoiceIn/InvoiceInList.vue b/src/pages/InvoiceIn/InvoiceInList.vue
index 692251bff..78b94ba81 100644
--- a/src/pages/InvoiceIn/InvoiceInList.vue
+++ b/src/pages/InvoiceIn/InvoiceInList.vue
@@ -13,12 +13,13 @@ import CardList from 'src/components/ui/CardList.vue';
 import InvoiceInFilter from './InvoiceInFilter.vue';
 import InvoiceInSummaryDialog from './Card/InvoiceInSummaryDialog.vue';
 import { getUrl } from 'src/composables/getUrl';
+import in18n from './in18n';
 
 const stateStore = useStateStore();
 const router = useRouter();
 const quasar = useQuasar();
 let url = ref();
-const { t } = useI18n();
+const { t } = useI18n(in18n);
 
 onMounted(async () => {
     stateStore.rightDrawer = true;
@@ -45,7 +46,7 @@ function viewSummary(id) {
         <Teleport to="#searchbar">
             <VnSearchbar
                 data-key="InvoiceInList"
-                :label="t('Search invoice')"
+                :label="t('searchInvoice')"
                 :info="t('You can search by invoice reference')"
             />
         </Teleport>
@@ -171,9 +172,3 @@ function viewSummary(id) {
     max-width: 60em;
 }
 </style>
-
-<i18n>
-es:
-    Search invoice: Buscar factura emitida
-    You can search by invoice reference: Puedes buscar por referencia de la factura
-</i18n>
diff --git a/src/pages/InvoiceIn/i18n.json b/src/pages/InvoiceIn/i18n.json
new file mode 100644
index 000000000..eceaca723
--- /dev/null
+++ b/src/pages/InvoiceIn/i18n.json
@@ -0,0 +1,8 @@
+{
+    "es": {
+        "searchInvoice": "Buscar factura emitida"
+    },
+    "en": {
+        "searchInvoice": "Seaasdrch invoice"
+    }
+}
diff --git a/src/pages/InvoiceIn/i18n/en.json b/src/pages/InvoiceIn/i18n/en.json
new file mode 100644
index 000000000..c45940398
--- /dev/null
+++ b/src/pages/InvoiceIn/i18n/en.json
@@ -0,0 +1,3 @@
+{
+    "searchInvoice": "Seaasdrch invoice"
+}
diff --git a/src/pages/InvoiceIn/i18n/es.json b/src/pages/InvoiceIn/i18n/es.json
new file mode 100644
index 000000000..82e3a8890
--- /dev/null
+++ b/src/pages/InvoiceIn/i18n/es.json
@@ -0,0 +1,3 @@
+{
+    "searchInvoice": "Buasdscar factura emitida"
+}
diff --git a/src/pages/InvoiceIn/in18n.js b/src/pages/InvoiceIn/in18n.js
new file mode 100644
index 000000000..ea48a6a3e
--- /dev/null
+++ b/src/pages/InvoiceIn/in18n.js
@@ -0,0 +1,19 @@
+// OPTION 1
+import en from './i18n/en.json';
+import es from './i18n/es.json';
+
+// OPTION 2
+import _messages from './i18n.json';
+
+// OPTION 3
+const messages = {
+    en: {
+        searchInvoice: 'Search invoice',
+    },
+    es: {
+        searchInvoice: 'Buscar factura emitida',
+    },
+};
+export default {
+    messages: _messages,
+};