add table rows selection

src/pages/Entry/EntryLatestBuys.vue

@@ -20,6 +20,7 @@ const { t } = useI18n();
 const visibleColumns = ref([]);
 const allColumnNames = ref([]);
 const rows = ref([]);
+const rowsSelected = ref([]);
 const columns = computed(() => [
     {
         label: t('entry.latestBuys.picture'),
@@ -203,6 +204,10 @@ const columns = computed(() => [
     },
 ]);
 
+const openEditRowField = () => {
+    console.log('open edit row form: ', rowsSelected.value);
+};
+
 onMounted(async () => {
     stateStore.rightDrawer = true;
     const filteredColumns = columns.value.filter((col) => col.name !== 'picture');
@@ -239,10 +244,12 @@ onMounted(async () => {
             :rows="rows"
             :columns="columns"
             hide-bottom
+            selection="multiple"
             row-key="id"
             :pagination="{ rowsPerPage: 0 }"
             class="full-width q-mt-md"
             :visible-columns="visibleColumns"
+            v-model:selected="rowsSelected"
         >
             <template #body-cell-picture="{ row }">
                 <QTd>
@@ -295,9 +302,16 @@ onMounted(async () => {
                 </QTd>
             </template>
         </QTable>
+        <QPageSticky :offset="[20, 20]">
+            <QBtn @click="openEditRowField()" color="primary" fab icon="edit" />
+            <QTooltip>
+                {{ t('Edit buy(s)') }}
+            </QTooltip>
+        </QPageSticky>
     </QPage>
 </template>
 
 <i18n>
 es:
+    Edit buy(s): Editar compra(s)
 </i18n>