src/pages/Entry/Card/EntryCard.vue

@@ -1,21 +1,11 @@
 <script setup>
-import VnCard from 'components/common/VnCard.vue';
+import VnCardBeta from 'components/common/VnCardBeta.vue';
 import EntryDescriptor from './EntryDescriptor.vue';
-import EntryFilter from '../EntryFilter.vue';
-import filter from './EntryFilter.js';
 </script>
 <template>
-    <VnCard
+    <VnCardBeta
         data-key="Entry"
         base-url="Entries"
-        :filter="filter"
         :descriptor="EntryDescriptor"
-        :filter-panel="EntryFilter"
-        search-data-key="EntryList"
-        :searchbar-props="{
-            url: 'Entries/filter',
-            label: 'Search entries',
-            info: 'You can search by entry reference',
-        }"
     />
 </template>

src/pages/Entry/EntryList.vue

@@ -2,19 +2,19 @@
 import { onMounted, ref, computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 import EntryFilter from './EntryFilter.vue';
-import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
 import { useStateStore } from 'stores/useStateStore';
 import VnTable from 'components/VnTable/VnTable.vue';
-import RightMenu from 'src/components/common/RightMenu.vue';
 import { toDate } from 'src/filters';
 import { useSummaryDialog } from 'src/composables/useSummaryDialog';
 import EntrySummary from './Card/EntrySummary.vue';
 import SupplierDescriptorProxy from 'src/pages/Supplier/Card/SupplierDescriptorProxy.vue';
 import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue';
+import VnSection from 'src/components/common/VnSection.vue';
 
 const stateStore = useStateStore();
 const { t } = useI18n();
 const tableRef = ref();
+const dataKey = 'EntryList';
 
 const { viewSummary } = useSummaryDialog();
 const entryFilter = {
@@ -180,67 +180,71 @@ const columns = computed(() => [
     },
 ]);
 </script>
+
 <template>
-    <VnSearchbar
+    <VnSection
-        data-key="EntryList"
+        :data-key="dataKey"
+        :columns="columns"
+        prefix="entry"
         url="Entries/filter"
-        :label="t('Search entries')"
+        :array-data-props="{
-        :info="t('You can search by entry reference')"
+            url: 'Entries/filter',
-    />
+            order: 'id DESC',
-    <RightMenu>
+            exprBuilder,
-        <template #right-panel>
+        }"
+    >
+        <template #rightMenu>
             <EntryFilter data-key="EntryList" />
         </template>
-    </RightMenu>
+        <template #body>
-    <VnTable
+            <VnTable
-        ref="tableRef"
+                ref="tableRef"
-        data-key="EntryList"
+                :data-key="dataKey"
-        url="Entries/filter"
+                :create="{
-        :filter="entryFilter"
+                    urlCreate: 'Entries',
-        :create="{
+                    title: t('Create entry'),
-            urlCreate: 'Entries',
+                    onDataSaved: ({ id }) => tableRef.redirect(id),
-            title: t('Create entry'),
+                    formInitialData: {},
-            onDataSaved: ({ id }) => tableRef.redirect(id),
+                }"
-            formInitialData: {},
+                :columns="columns"
-        }"
+                redirect="entry"
-        order="id DESC"
+                :right-search="false"
-        :columns="columns"
+            >
-        redirect="entry"
+                <template #column-status="{ row }">
-        :right-search="false"
+                    <div class="row q-gutter-xs">
-    >
+                        <QIcon
-        <template #column-status="{ row }">
+                            v-if="!!row.isExcludedFromAvailable"
-            <div class="row q-gutter-xs">
+                            name="vn:inventory"
-                <QIcon
+                            color="primary"
-                    v-if="!!row.isExcludedFromAvailable"
+                        >
-                    name="vn:inventory"
+                            <QTooltip>{{
-                    color="primary"
+                                t('entry.list.tableVisibleColumns.isExcludedFromAvailable')
-                >
+                            }}</QTooltip>
-                    <QTooltip>{{
+                        </QIcon>
-                        t('entry.list.tableVisibleColumns.isExcludedFromAvailable')
+                        <QIcon v-if="!!row.isRaid" name="vn:net" color="primary">
-                    }}</QTooltip>
+                            <QTooltip>
-                </QIcon>
+                                {{
-                <QIcon v-if="!!row.isRaid" name="vn:net" color="primary">
+                                    t('globals.raid', { daysInForward: row.daysInForward })
-                    <QTooltip>
+                                }}</QTooltip
-                        {{
+                            >
-                            t('globals.raid', { daysInForward: row.daysInForward })
+                        </QIcon>
-                        }}</QTooltip
+                    </div>
-                    >
+                </template>
-                </QIcon>
+                <template #column-supplierFk="{ row }">
-            </div>
+                    <span class="link" @click.stop>
-        </template>
+                        {{ row.supplierName }}
-        <template #column-supplierFk="{ row }">
+                        <SupplierDescriptorProxy :id="row.supplierFk" />
-            <span class="link" @click.stop>
+                    </span>
-                {{ row.supplierName }}
+                </template>
-                <SupplierDescriptorProxy :id="row.supplierFk" />
+                <template #column-travelFk="{ row }">
-            </span>
+                    <span class="link" @click.stop>
-        </template>
+                        {{ row.travelRef }}
-        <template #column-travelFk="{ row }">
+                        <TravelDescriptorProxy :id="row.travelFk" />
-            <span class="link" @click.stop>
+                    </span>
-                {{ row.travelRef }}
+                </template>
-                <TravelDescriptorProxy :id="row.travelFk" />
+            </VnTable>
-            </span>
+        </template> 
-        </template>
+    </VnSection>
-    </VnTable>
 </template>
 
 <i18n>

src/pages/Entry/locale/en.yml

@@ -1,3 +1,6 @@
+entry:
+    search: Search entries
+    searchInfo: You can search by entry reference
 entryList:
     list:
         inventoryEntry: Inventory entry

src/pages/Entry/locale/es.yml

@@ -1,6 +1,6 @@
-Search entries: Buscar entradas
+entry:
-You can search by entry reference: Puedes buscar por referencia de la entrada
+    search: Buscar entradas
-
+    searchInfo: Puedes buscar por referencia de entrada
 entryList:
     list:
         inventoryEntry: Es inventario

src/router/modules/entry.js

@@ -1,50 +1,123 @@
 import { RouterView } from 'vue-router';
 
+const entryCard = {
+    name: 'EntryCard',
+    path: ':id',
+    component: () => import('src/pages/Entry/Card/EntryCard.vue'),
+    redirect: { name: 'EntrySummary' },
+    meta: {
+        menu: [
+            'EntryBasicData',
+            'EntryBuys',
+            'EntryNotes',
+            'EntryDms',
+            'EntryLog',
+        ],
+    },
+    children: [
+        {
+            path: 'summary',
+            name: 'EntrySummary',
+            meta: {
+                title: 'summary',
+                icon: 'launch',
+            },
+            component: () => import('src/pages/Entry/Card/EntrySummary.vue'),
+        },
+        {
+            path: 'basic-data',
+            name: 'EntryBasicData',
+            meta: {
+                title: 'basicData',
+                icon: 'vn:settings',
+            },
+            component: () => import('src/pages/Entry/Card/EntryBasicData.vue'),
+        },
+        {
+            path: 'buys',
+            name: 'EntryBuys',
+            meta: {
+                title: 'buys',
+                icon: 'vn:lines',
+            },
+            component: () => import('src/pages/Entry/Card/EntryBuys.vue'),
+        },
+        {
+            path: 'buys/import',
+            name: 'EntryBuysImport',
+            component: () => import('src/pages/Entry/Card/EntryBuysImport.vue'),
+        },
+        {
+            path: 'notes',
+            name: 'EntryNotes',
+            meta: {
+                title: 'notes',
+                icon: 'vn:notes',
+            },
+            component: () => import('src/pages/Entry/Card/EntryNotes.vue'),
+        },
+        {
+            path: 'dms',
+            name: 'EntryDms',
+            meta: {
+                title: 'dms',
+                icon: 'smb_share',
+            },
+            component: () => import('src/pages/Entry/Card/EntryDms.vue'),
+        },
+        {
+            path: 'log',
+            name: 'EntryLog',
+            meta: {
+                title: 'log',
+                icon: 'vn:History',
+            },
+            component: () => import('src/pages/Entry/Card/EntryLog.vue'),
+        },
+    ],
+};
+
 export default {
-    path: '/entry',
     name: 'Entry',
+    path: '/entry',
     meta: {
         title: 'entries',
         icon: 'vn:entry',
         moduleName: 'Entry',
         keyBinding: 'e',
-    },
+        menu: [
-    component: RouterView,
-    redirect: { name: 'EntryMain' },
-    menus: {
-        main: [
             'EntryList',
             'MyEntries',
             'EntryLatestBuys',
             'EntryStockBought',
             'EntryWasteRecalc',
-        ],
+        ]
-        card: ['EntryBasicData', 'EntryBuys', 'EntryNotes', 'EntryDms', 'EntryLog'],
     },
+    component: RouterView,
+    redirect: { name: 'EntryMain' },
     children: [
         {
-            path: '',
             name: 'EntryMain',
+            path: '',
             component: () => import('src/components/common/VnModule.vue'),
-            redirect: { name: 'EntryList' },
+            redirect: { name: 'EntryIndexMain' },
             children: [
                 {
-                    path: 'list',
+                    path:'',
-                    name: 'EntryList',
+                    name: 'EntryIndexMain',
-                    meta: {
+                    redirect: { name: 'EntryList' },
-                        title: 'list',
-                        icon: 'view_list',
-                    },
                     component: () => import('src/pages/Entry/EntryList.vue'),
-                },
+                    children: [
-                {
+                        {
-                    path: 'my',
+                            name: 'EntryList',
-                    name: 'MyEntries',
+                            path: 'list',
-                    meta: {
+                            meta: {
-                        title: 'labeler',
+                                title: 'list',
-                        icon: 'sell',
+                                icon: 'view_list',
-                    },
+                            },
-                    component: () => import('src/pages/Entry/MyEntries.vue'),
+                        },
+                        entryCard,
+                    ],
                 },
                 {
                     path: 'create',
@@ -54,6 +127,15 @@ export default {
                         icon: 'add',
                     },
                     component: () => import('src/pages/Entry/EntryCreate.vue'),
+                },                
+                {
+                    path: 'my',
+                    name: 'MyEntries',
+                    meta: {
+                        title: 'labeler',
+                        icon: 'sell',
+                    },
+                    component: () => import('src/pages/Entry/MyEntries.vue'),
                 },
                 {
                     path: 'latest-buys',
@@ -84,72 +166,5 @@ export default {
                 },
             ],
         },
-        {
-            name: 'EntryCard',
-            path: ':id',
-            component: () => import('src/pages/Entry/Card/EntryCard.vue'),
-            redirect: { name: 'EntrySummary' },
-            children: [
-                {
-                    name: 'EntrySummary',
-                    path: 'summary',
-                    meta: {
-                        title: 'summary',
-                        icon: 'launch',
-                    },
-                    component: () => import('src/pages/Entry/Card/EntrySummary.vue'),
-                },
-                {
-                    path: 'basic-data',
-                    name: 'EntryBasicData',
-                    meta: {
-                        title: 'basicData',
-                        icon: 'vn:settings',
-                    },
-                    component: () => import('src/pages/Entry/Card/EntryBasicData.vue'),
-                },
-                {
-                    path: 'buys',
-                    name: 'EntryBuys',
-                    meta: {
-                        title: 'buys',
-                        icon: 'vn:lines',
-                    },
-                    component: () => import('src/pages/Entry/Card/EntryBuys.vue'),
-                },
-                {
-                    path: 'buys/import',
-                    name: 'EntryBuysImport',
-                    component: () => import('src/pages/Entry/Card/EntryBuysImport.vue'),
-                },
-                {
-                    path: 'notes',
-                    name: 'EntryNotes',
-                    meta: {
-                        title: 'notes',
-                        icon: 'vn:notes',
-                    },
-                    component: () => import('src/pages/Entry/Card/EntryNotes.vue'),
-                },
-                {
-                    path: 'dms',
-                    name: 'EntryDms',
-                    meta: {
-                        title: 'dms',
-                        icon: 'smb_share',
-                    },
-                    component: () => import('src/pages/Entry/Card/EntryDms.vue'),
-                },
-                {
-                    path: 'log',
-                    name: 'EntryLog',
-                    meta: {
-                        title: 'log',
-                        icon: 'vn:History',
-                    },
-                    component: () => import('src/pages/Entry/Card/EntryLog.vue'),
-                },
-            ],
-        },
     ],
-};
+};