fix: refs #4774 fix front table

src/i18n/en/index.js

@@ -826,7 +826,7 @@ export default {
             notifications: 'Notifications',
             workerCreate: 'New worker',
             department: 'Department',
-            TraductionsVn: 'Traductions',
+            TranslationsVn: 'Translations',
         },
         list: {
             name: 'Name',

src/i18n/es/index.js

@@ -1,4 +1,4 @@
-import TraductionsVn from 'src/pages/Worker/TraductionsVn.vue';
+import TranslationsVn from 'src/pages/Worker/TranslationsVn.vue';
 
 export default {
     globals: {
@@ -819,6 +819,10 @@ export default {
         hasToSendMail: 'Enviar fichadas por mail',
         departmentRemoved: 'Departamento eliminado',
     },
+    TranslationsVn: {
+        OriginalLanguage: 'Idioma Original',
+        SecondLanguage: 'Idioma Secundario',
+    },
     worker: {
         pageTitles: {
             workers: 'Trabajadores',
@@ -828,7 +832,7 @@ export default {
             notifications: 'Notificaciones',
             workerCreate: 'Nuevo trabajador',
             department: 'Departamentos',
-            TraductionsVn: 'Traducciones',
+            TranslationsVn: 'Traducciones',
         },
         list: {
             name: 'Nombre',
@@ -890,14 +894,7 @@ export default {
             bankEntity: 'Swift / BIC',
         },
         imageNotFound: 'No se ha encontrado la imagen',
-    },
+
-    TraductionsVn: {
-        pageTitles: {
-            TraductionsVn: 'Traducciones',
-        },
-        OriginalLanguage: 'Idioma Original',
-        SecondLanguage: 'Idioma Secundario',
-    },
     wagon: {
         pageTitles: {
             wagons: 'Vagones',

src/pages/Worker/TraductionsVn.vue

@@ -1,53 +0,0 @@
-<script setup>
-import { useStateStore } from 'src/stores/useStateStore';
-import { computed } from 'vue';
-import { useI18n } from 'vue-i18n';
-import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
-
-const { t } = useI18n();
-const columns = computed(() => [
-    {
-        name: 'originalLang',
-        label: t('OriginalLanguage'),
-        align: 'left',
-    },
-    {
-        name: 'secondLang',
-        label: t('SecondLanguage'),
-        align: 'left',
-    },
-]);
-</script>
-
-<template>
-    <QDrawer v-model="useStateStore.rightDrawer" side="right" :width="300" show-if-above>
-        <VnSelectFilter
-            class="q-mb-md q-mt-xl"
-            outlined
-            v-model="model"
-            :options="options"
-            :label="t('Table')"
-        />
-        <VnSelectFilter
-            class="q-mb-md"
-            outlined
-            v-model="model"
-            :options="options"
-            :label="t('Language')"
-        />
-        <VnSelectFilter outlined v-model="model" :options="options" :label="t('Table')" />
-    </QDrawer>
-    <QTable
-        :rows="rows"
-        :columns="columns"
-        row-key="id"
-        class="full-width q-mt-md"
-        :grid="$q.screen.lt.md"
-        :no-data-label="t('globals.noResults')"
-    >
-    </QTable>
-</template>
-
-<i18n>
-
-</i18n>

src/pages/Worker/TranslationsVn.vue

@@ -0,0 +1,104 @@
+<script setup>
+import { ref } from 'vue';
+import { useStateStore } from 'src/stores/useStateStore';
+import { computed, onMounted } from 'vue';
+import { useI18n } from 'vue-i18n';
+import VnTable from 'src/components/VnTable/VnTable.vue';
+import VnSelect from 'src/components/common/VnSelect.vue';
+import axios from 'axios';
+import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
+import FetchData from 'src/components/FetchData.vue';
+
+const { t } = useI18n();
+const columns = computed(() => [
+    {
+        align: 'left',
+        name: 'companyFk',
+        label: t('company18n'),
+        chip: {
+            condition: () => true,
+        },
+        isId: true,
+    },
+    {
+        align: 'left',
+        name: 'footnotes',
+        label: t('defaultLang(en)'),
+    },
+    {
+        align: 'left',
+        name: 'secondLang',
+        label: t('secondLang'),
+    },
+]);
+
+const tableRef = ref({});
+const langs = ref([]);
+const pk = ref('companyFk');
+const value = ref('footnotes');
+const lang = ref('es');
+const originalData = ref();
+const englishData = ref();
+// onMounted(() => {
+//     loadTable();
+// });
+
+async function loadTable() {
+    console.log('lang.value.code: ', lang.value);
+    const data = tableRef.value.CrudModelRef.formData;
+    if (!originalData.value) originalData.value = data;
+
+    const en = originalData.value.filter((d) => d.lang === 'en');
+    for (const translation of en) {
+        translation['secondLang'] = originalData.value.find(
+            (d) => d[pk.value] == translation[pk.value] && d['lang'] == lang.value
+        )?.[value.value];
+    }
+    console.log('data: ', en);
+
+    tableRef.value.CrudModelRef.formData = en;
+}
+
+function resetOriginalData() {
+    originalData.value = null;
+}
+</script>
+
+<template>
+    <FetchData url="Languages" @on-fetch="(data) => (langs = data)" auto-load />
+    <VnSubToolbar />
+    <VnTable
+        ref="tableRef"
+        data-key="translations"
+        url="CompanyI18ns"
+        :columns="columns"
+        :right-search="false"
+        :is-editable="true"
+        auto-load
+        @on-fetch="loadTable()"
+    >
+        <template #top-left>
+            <div class="row no-wrap q-gutter-x-sm">
+                <VnSelect
+                    v-model="lang"
+                    :options="langs"
+                    option-label="code"
+                    option-value="code"
+                    @update:model-value="resetOriginalData()"
+                />
+                <VnSelect
+                    :label="t('lang')"
+                    v-model="lang"
+                    :options="langs"
+                    option-label="code"
+                    option-value="code"
+                    @update:model-value="loadTable()"
+                />
+            </div>
+        </template>
+    </VnTable>
+</template>
+
+<i18n>
+
+</i18n>

src/router/modules/index.js

@@ -22,6 +22,7 @@ import Account from './account';
 import Monitor from './monitor';
 import MailAlias from './mailAlias';
 import Role from './role';
+import TranslationsVn from './translationsVn.js';
 
 export default [
     Item,
@@ -48,4 +49,5 @@ export default [
     MailAlias,
     Monitor,
     Role,
+    TranslationsVn,
 ];

src/router/modules/translationsVn.js

@@ -0,0 +1,16 @@
+import { RouterView } from 'vue-router';
+
+export default {
+    path: '/translations',
+    name: 'Translations',
+    meta: {
+        title: 'translations',
+        icon: 'history_edu',
+        moduleName: 'Translations',
+    },
+    component: RouterView,
+    menus: {
+        main: [],
+        card: [],
+    },
+};

src/router/modules/worker.js

@@ -12,7 +12,7 @@ export default {
     component: RouterView,
     redirect: { name: 'WorkerMain' },
     menus: {
-        main: ['WorkerList', 'WorkerDepartment', 'TraductionsVn'],
+        main: ['WorkerList', 'WorkerDepartment', 'TranslationsVn'],
         card: [
             'WorkerBasicData',
             'WorkerNotes',
@@ -55,13 +55,13 @@ export default {
                     component: () => import('src/pages/Worker/WorkerDepartment.vue'),
                 },
                 {
-                    path: 'traductionsVn',
+                    path: 'translations',
-                    name: 'TraductionsVn',
+                    name: 'TranslationsVn',
                     meta: {
-                        title: 'TraductionsVn',
+                        title: 'translations',
                         icon: 'history_edu',
                     },
-                    component: () => import('src/pages/Worker/TraductionsVn.vue'),
+                    component: () => import('src/pages/Worker/TranslationsVn.vue'),
                 },
                 {
                     path: 'create',

src/router/routes.js

@@ -22,6 +22,7 @@ import zone from 'src/router/modules/zone';
 import account from './modules/account';
 import monitor from 'src/router/modules/monitor';
 import mailAlias from './modules/mailAlias';
+import translationsVn from './modules/translationsVn';
 
 const routes = [
     {
@@ -97,6 +98,7 @@ const routes = [
             account,
             role,
             mailAlias,
+            translationsVn,
             {
                 path: '/:catchAll(.*)*',
                 name: 'NotFound',