From 8aaab2c25cd8f69564e0c521be7a929fe2d11a25 Mon Sep 17 00:00:00 2001
From: provira <provira@verdnatura.es>
Date: Tue, 14 Jan 2025 13:12:04 +0100
Subject: [PATCH] refactor: refs #8322 changed supplier component to use
 VnSection/VnCardBeta

---
 src/i18n/locale/en.yml                   |   2 +
 src/i18n/locale/es.yml                   |   3 +
 src/pages/Supplier/Card/SupplierCard.vue |  16 +-
 src/pages/Supplier/SupplierList.vue      |  58 ++---
 src/router/modules/supplier.js           | 307 ++++++++++++-----------
 5 files changed, 196 insertions(+), 190 deletions(-)

diff --git a/src/i18n/locale/en.yml b/src/i18n/locale/en.yml
index 4a78811e6..e75d9c021 100644
--- a/src/i18n/locale/en.yml
+++ b/src/i18n/locale/en.yml
@@ -699,6 +699,8 @@ wagon:
         uncompleteTrays: There are incomplete trays
 
 supplier:
+    search: Search provider
+    searchInfo: Search provider by id or name
     list:
         payMethod: Pay method
         account: Account
diff --git a/src/i18n/locale/es.yml b/src/i18n/locale/es.yml
index 2bfe7ec4b..a5d594022 100644
--- a/src/i18n/locale/es.yml
+++ b/src/i18n/locale/es.yml
@@ -692,6 +692,8 @@ wagon:
         maxWagonHeight: 'La altura máxima del vagón es '
         uncompleteTrays: Hay bandejas sin completar
 supplier:
+    search: Buscar proveedor
+    searchInfo: Buscar proveedor por id o nombre
     list:
         payMethod: Método de pago
         account: Cuenta
@@ -699,6 +701,7 @@ supplier:
         tableVisibleColumns:
             nif: NIF/CIF
             account: Cuenta
+        
     summary:
         responsible: Responsable
         verified: Verificado
diff --git a/src/pages/Supplier/Card/SupplierCard.vue b/src/pages/Supplier/Card/SupplierCard.vue
index 594026d18..9bc8a6eca 100644
--- a/src/pages/Supplier/Card/SupplierCard.vue
+++ b/src/pages/Supplier/Card/SupplierCard.vue
@@ -1,19 +1,7 @@
 <script setup>
-import VnCard from 'components/common/VnCard.vue';
 import SupplierDescriptor from './SupplierDescriptor.vue';
-import SupplierListFilter from '../SupplierListFilter.vue';
+import VnCardBeta from 'src/components/common/VnCardBeta.vue';
 </script>
 <template>
-    <VnCard
-        data-key="Supplier"
-        base-url="Suppliers"
-        :descriptor="SupplierDescriptor"
-        :filter-panel="SupplierListFilter"
-        search-data-key="SupplierList"
-        :searchbar-props="{
-            url: 'Suppliers/filter',
-            searchUrl: 'table',
-            label: 'Search suppliers',
-        }"
-    />
+    <VnCardBeta data-key="Supplier" base-url="Suppliers" :descriptor="SupplierDescriptor" />
 </template>
diff --git a/src/pages/Supplier/SupplierList.vue b/src/pages/Supplier/SupplierList.vue
index c0748af87..a855d9fca 100644
--- a/src/pages/Supplier/SupplierList.vue
+++ b/src/pages/Supplier/SupplierList.vue
@@ -2,12 +2,12 @@
 import { computed, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import VnTable from 'components/VnTable/VnTable.vue';
-import VnSearchbar from 'components/ui/VnSearchbar.vue';
-import RightMenu from 'src/components/common/RightMenu.vue';
 import SupplierListFilter from './SupplierListFilter.vue';
+import VnSection from 'src/components/common/VnSection.vue';
 
 const { t } = useI18n();
 const tableRef = ref();
+const dataKey = 'SupplierList';
 
 const columns = computed(() => [
     {
@@ -98,34 +98,36 @@ const columns = computed(() => [
     },
 ]);
 </script>
-
 <template>
-    <VnSearchbar data-key="SuppliersList" :limit="20" :label="t('Search suppliers')" />
-    <RightMenu>
-        <template #right-panel>
-            <SupplierListFilter data-key="SuppliersList" />
-        </template>
-    </RightMenu>
-    <VnTable
-        ref="tableRef"
-        data-key="SuppliersList"
-        url="Suppliers/filter"
-        redirect="supplier"
-        :create="{
-            urlCreate: 'Suppliers/newSupplier',
-            title: t('Create Supplier'),
-            onDataSaved: ({ id }) => tableRef.redirect(id),
-            formInitialData: {},
-            mapper: (data) => {
-                data.name = data.socialName;
-                delete data.socialName;
-                return data;
-            },
-        }"
-        :right-search="false"
-        order="id ASC"
+    <VnSection
+        :data-key="dataKey"
         :columns="columns"
-    />
+        prefix="supplier"
+        :array-data-props="{
+            url: 'Suppliers/filter',
+            order: 'id ASC',
+        }"
+    >
+        <template #body>
+            <VnTable
+                ref="tableRef"
+                :data-key="dataKey"
+                :create="{
+                    urlCreate: 'Suppliers/newSupplier',
+                    title: t('Create Supplier'),
+                    onDataSaved: ({ id }) => tableRef.redirect(id),
+                    formInitialData: {},
+                    mapper: (data) => {
+                        data.name = data.socialName;
+                        delete data.socialName;
+                        return data;
+                    },
+                }"
+                :columns="columns"
+                redirect="supplier"
+            />
+        </template>
+    </VnSection>
 </template>
 
 <i18n>
diff --git a/src/router/modules/supplier.js b/src/router/modules/supplier.js
index 647f4bdd3..075b4358f 100644
--- a/src/router/modules/supplier.js
+++ b/src/router/modules/supplier.js
@@ -1,19 +1,13 @@
 import { RouterView } from 'vue-router';
 
-export default {
-    path: '/supplier',
-    name: 'Supplier',
+const supplierCard = {
+    name: 'SupplierCard',
+    path: ':id',
+    component: () => import('src/pages/Supplier/Card/SupplierCard.vue'),
+    redirect: { name: 'SupplierSummary' },
     meta: {
-        title: 'suppliers',
-        icon: 'vn:supplier',
-        moduleName: 'Supplier',
-        keyBinding: 'p',
-    },
-    component: RouterView,
-    redirect: { name: 'SupplierMain' },
-    menus: {
-        main: ['SupplierList'],
-        card: [
+        
+        menu: [
             'SupplierBasicData',
             'SupplierFiscalData',
             'SupplierBillingData',
@@ -26,21 +20,166 @@ export default {
             'SupplierDms',
         ],
     },
+    children: [
+        {
+            name: 'SupplierSummary',
+            path: 'summary',
+            meta: {
+                title: 'summary',
+                icon: 'launch',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierSummary.vue'),
+        },
+        {
+            path: 'basic-data',
+            name: 'SupplierBasicData',
+            meta: {
+                title: 'basicData',
+                icon: 'vn:settings',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierBasicData.vue'),
+        },
+        {
+            path: 'fiscal-data',
+            name: 'SupplierFiscalData',
+            meta: {
+                title: 'fiscalData',
+                icon: 'vn:dfiscales',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierFiscalData.vue'),
+        },
+        {
+            path: 'billing-data',
+            name: 'SupplierBillingData',
+            meta: {
+                title: 'billingData',
+                icon: 'vn:payment',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierBillingData.vue'),
+        },
+        {
+            path: 'log',
+            name: 'SupplierLog',
+            meta: {
+                title: 'log',
+                icon: 'vn:History',
+            },
+            component: () => import('src/pages/Supplier/Card/SupplierLog.vue'),
+        },
+        {
+            path: 'account',
+            name: 'SupplierAccounts',
+            meta: {
+                title: 'accounts',
+                icon: 'vn:credit',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierAccounts.vue'),
+        },
+        {
+            path: 'contact',
+            name: 'SupplierContacts',
+            meta: {
+                title: 'contacts',
+                icon: 'contact_phone',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierContacts.vue'),
+        },
+        {
+            path: 'address',
+            name: 'SupplierAddresses',
+            meta: {
+                title: 'addresses',
+                icon: 'vn:delivery',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierAddresses.vue'),
+        },
+        {
+            path: 'address/create',
+            name: 'SupplierAddressesCreate',
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierAddressesCreate.vue'),
+        },
+        {
+            path: 'consumption',
+            name: 'SupplierConsumption',
+            meta: {
+                title: 'consumption',
+                icon: 'show_chart',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierConsumption.vue'),
+        },
+        {
+            path: 'agency-term',
+            name: 'SupplierAgencyTerm',
+            meta: {
+                title: 'agencyTerm',
+                icon: 'vn:agency-term',
+            },
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierAgencyTerm.vue'),
+        },
+        {
+            path: 'dms',
+            name: 'SupplierDms',
+            meta: {
+                title: 'dms',
+                icon: 'smb_share',
+            },
+            component: () => import('src/pages/Supplier/Card/SupplierDms.vue'),
+        },
+        {
+            path: 'agency-term/create',
+            name: 'SupplierAgencyTermCreate',
+            component: () =>
+                import('src/pages/Supplier/Card/SupplierAgencyTermCreate.vue'),
+        },
+    ]
+};
+
+export default {
+    name: 'Supplier',
+    path: '/supplier',   
+    meta: {
+        title: 'suppliers',
+        icon: 'vn:supplier',
+        moduleName: 'Supplier',
+        keyBinding: 'p',
+        menu: ['SupplierList'],
+    },
+    component: RouterView,
+    redirect: { name: 'SupplierMain' },
     children: [
         {
             path: '',
             name: 'SupplierMain',
             component: () => import('src/components/common/VnModule.vue'),
-            redirect: { name: 'SupplierList' },
+            redirect: { name: 'SupplierIndexMain' },
             children: [
                 {
-                    path: 'list',
-                    name: 'SupplierList',
-                    meta: {
-                        title: 'list',
-                        icon: 'view_list',
-                    },
+                    path: '',
+                    name: 'SupplierIndexMain',
+                    redirect: { name: 'SupplierList' },
                     component: () => import('src/pages/Supplier/SupplierList.vue'),
+                    children: [
+                        {
+                            path: 'list',
+                            name: 'SupplierList',
+                            meta: {
+                                title: 'list',
+                                icon: 'view_list',
+                            },
+                            
+                        },
+                        supplierCard,
+                    ]
                 },
                 {
                     path: 'create',
@@ -53,133 +192,5 @@ export default {
                 },
             ],
         },
-        {
-            name: 'SupplierCard',
-            path: ':id',
-            component: () => import('src/pages/Supplier/Card/SupplierCard.vue'),
-            redirect: { name: 'SupplierSummary' },
-            children: [
-                {
-                    name: 'SupplierSummary',
-                    path: 'summary',
-                    meta: {
-                        title: 'summary',
-                        icon: 'launch',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierSummary.vue'),
-                },
-                {
-                    path: 'basic-data',
-                    name: 'SupplierBasicData',
-                    meta: {
-                        title: 'basicData',
-                        icon: 'vn:settings',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierBasicData.vue'),
-                },
-                {
-                    path: 'fiscal-data',
-                    name: 'SupplierFiscalData',
-                    meta: {
-                        title: 'fiscalData',
-                        icon: 'vn:dfiscales',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierFiscalData.vue'),
-                },
-                {
-                    path: 'billing-data',
-                    name: 'SupplierBillingData',
-                    meta: {
-                        title: 'billingData',
-                        icon: 'vn:payment',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierBillingData.vue'),
-                },
-                {
-                    path: 'log',
-                    name: 'SupplierLog',
-                    meta: {
-                        title: 'log',
-                        icon: 'vn:History',
-                    },
-                    component: () => import('src/pages/Supplier/Card/SupplierLog.vue'),
-                },
-                {
-                    path: 'account',
-                    name: 'SupplierAccounts',
-                    meta: {
-                        title: 'accounts',
-                        icon: 'vn:credit',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierAccounts.vue'),
-                },
-                {
-                    path: 'contact',
-                    name: 'SupplierContacts',
-                    meta: {
-                        title: 'contacts',
-                        icon: 'contact_phone',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierContacts.vue'),
-                },
-                {
-                    path: 'address',
-                    name: 'SupplierAddresses',
-                    meta: {
-                        title: 'addresses',
-                        icon: 'vn:delivery',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierAddresses.vue'),
-                },
-                {
-                    path: 'address/create',
-                    name: 'SupplierAddressesCreate',
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierAddressesCreate.vue'),
-                },
-                {
-                    path: 'consumption',
-                    name: 'SupplierConsumption',
-                    meta: {
-                        title: 'consumption',
-                        icon: 'show_chart',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierConsumption.vue'),
-                },
-                {
-                    path: 'agency-term',
-                    name: 'SupplierAgencyTerm',
-                    meta: {
-                        title: 'agencyTerm',
-                        icon: 'vn:agency-term',
-                    },
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierAgencyTerm.vue'),
-                },
-                {
-                    path: 'dms',
-                    name: 'SupplierDms',
-                    meta: {
-                        title: 'dms',
-                        icon: 'smb_share',
-                    },
-                    component: () => import('src/pages/Supplier/Card/SupplierDms.vue'),
-                },
-                {
-                    path: 'agency-term/create',
-                    name: 'SupplierAgencyTermCreate',
-                    component: () =>
-                        import('src/pages/Supplier/Card/SupplierAgencyTermCreate.vue'),
-                },
-            ],
-        },
     ],
 };
-- 
2.40.1