refs #6111 onMounted

src/pages/Route/RouteList.vue

@@ -29,13 +29,6 @@ const { validate } = useValidator();
 const quasar = useQuasar();
 const session = useSession();
 const { viewSummary } = useSummaryDialog();
-const router = useRouter();
-onMounted(async () => {
-    stateStore.rightDrawer = true;
-    allColumnNames.value = columns.value.map((col) => col.name);
-    await arrayData.fetch({ append: false });
-});
-onUnmounted(() => (stateStore.rightDrawer = false));
 
 const selectedRows = ref([]);
 const columns = computed(() => [
@@ -46,7 +39,7 @@ const columns = computed(() => [
         sortable: true,
         align: 'center',
         columnFilter: {
-            component: VnInput,
+            component: 'VnInput',
             type: 'text',
             filterValue: null,
             event: getInputEvents,
@@ -62,7 +55,7 @@ const columns = computed(() => [
         sortable: true,
         align: 'left',
         columnFilter: {
-            component: VnSelectFilter,
+            component: 'VnSelectFilter',
             type: 'select',
             filterValue: null,
             event: getInputEvents,
@@ -81,7 +74,7 @@ const columns = computed(() => [
         sortable: true,
         align: 'left',
         columnFilter: {
-            component: VnSelectFilter,
+            component: 'VnSelectFilter',
             type: 'select',
             filterValue: null,
             event: getInputEvents,
@@ -100,7 +93,7 @@ const columns = computed(() => [
         sortable: true,
         align: 'left',
         columnFilter: {
-            component: VnSelectFilter,
+            component: 'VnSelectFilter',
             type: 'select',
             filterValue: null,
             event: getInputEvents,
@@ -119,7 +112,7 @@ const columns = computed(() => [
         sortable: true,
         align: 'left',
         columnFilter: {
-            component: VnInputDate,
+            component: 'VnInputDate',
             type: 'select',
             filterValue: null,
             event: getInputEvents,
@@ -139,7 +132,7 @@ const columns = computed(() => [
         sortable: true,
         align: 'left',
         columnFilter: {
-            component: VnInput,
+            component: 'VnInput',
             type: 'select',
             filterValue: null,
             event: getInputEvents,
@@ -152,7 +145,7 @@ const columns = computed(() => [
         sortable: true,
         align: 'left',
         columnFilter: {
-            component: VnInputTime,
+            component: 'VnInputTime',
             type: 'select',
             filterValue: null,
             event: getInputEvents,
@@ -165,7 +158,7 @@ const columns = computed(() => [
         sortable: true,
         align: 'left',
         columnFilter: {
-            component: VnInputDate,
+            component: 'VnInputDate',
             type: 'select',
             filterValue: null,
             event: getInputEvents,
@@ -197,9 +190,6 @@ const updateRoute = async (route) => {
 const allColumnNames = ref([]);
 const confirmationDialog = ref(false);
 const startingDate = ref(null);
-const store = arrayData.store;
-const rows = computed(() => store.data);
-const rowsSelected = ref([]);
 
 const getInputEvents = (col) => {
     return col.columnFilter.type === 'select'
@@ -267,6 +257,14 @@ const openTicketsDialog = (id) => {
         })
         .onOk(() => refreshKey.value++);
 };
+
+onMounted(async () => {
+    stateStore.rightDrawer = true;
+    allColumnNames.value = columns.value.map((col) => col.name);
+    console.log('les columnes', allColumnNames.value);
+    await arrayData.fetch({ append: false });
+});
+onUnmounted(() => (stateStore.rightDrawer = false));
 </script>
 
 <template>
@@ -330,6 +328,7 @@ const openTicketsDialog = (id) => {
                     class="LeftIcon"
                     :all-columns="allColumnNames"
                     table-code="routesList"
+                    labels-traductions-path="route.list"
                     @on-config-saved="visibleColumns = [...$event]"
                 />
             </template>
@@ -386,6 +385,25 @@ const openTicketsDialog = (id) => {
                             hide-pagination
                             :no-data-label="t('globals.noResults')"
                         >
+                            <template #top-row="{ cols }">
+                                <QTr>
+                                    <QTd />
+                                    <QTd
+                                        v-for="(col, index) in cols"
+                                        :key="index"
+                                        style="max-width: 100px"
+                                    >
+                                        <component
+                                            :is="col.columnFilter.component"
+                                            v-if="col.name !== 'picture'"
+                                            v-model="col.columnFilter.filterValue"
+                                            v-bind="col.columnFilter.attrs"
+                                            v-on="col.columnFilter.event(col)"
+                                            dense
+                                        />
+                                    </QTd>
+                                </QTr>
+                            </template>
                             <template #body-cell-worker="{ row }">
                                 <QTd>
                                     <VnSelectFilter