src/pages/Item/Card/ItemTags.vue

@@ -109,7 +109,11 @@ const insertTag = (rows) => {
             >
                 <template #body="{ rows, validate }">
                     <QCard class="q-px-lg q-pt-md q-pb-sm">
-                        <VnRow v-for="(row, index) in rows" :key="index">
+                        <VnRow
+                            v-for="(row, index) in rows"
+                            :key="index"
+                            class="items-center"
+                        >
                             <VnSelect
                                 :label="t('itemTags.tag')"
                                 :options="tagOptions"
@@ -153,13 +157,14 @@ const insertTag = (rows) => {
                                 :required="true"
                                 :rules="validate('itemTag.priority')"
                             />
-                            <div class="row justify-center items-center" style="flex: 0">
+                            <div class="row justify-center" style="flex: 0">
                                 <QIcon
                                     @click="itemTagsRef.remove([row])"
                                     class="fill-icon-on-hover"
                                     color="primary"
                                     name="delete"
                                     size="sm"
+                                    dense
                                 >
                                     <QTooltip>
                                         {{ t('itemTags.removeTag') }}
@@ -167,22 +172,20 @@ const insertTag = (rows) => {
                                 </QIcon>
                             </div>
                         </VnRow>
-                        <VnRow class="justify-center items-center">
+                    </QCard>
+                    <QPageSticky position="bottom-right" :offset="[25, 25]">
                         <QBtn
                             @click="insertTag(rows)"
-                                class="cursor-pointer"
                             color="primary"
-                                flat
                             icon="add"
                             shortcut="+"
-                                style="flex: 0"
+                            fab
                         >
                             <QTooltip>
                                 {{ t('itemTags.addTag') }}
                             </QTooltip>
                         </QBtn>
-                        </VnRow>
+                    </QPageSticky>
-                    </QCard>
                 </template>
             </CrudModel>
         </QPage>

src/pages/Item/ItemList.vue

@@ -12,6 +12,8 @@ import ItemSummary from '../Item/Card/ItemSummary.vue';
 import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
 import ItemDescriptorProxy from './Card/ItemDescriptorProxy.vue';
 import { cloneItem } from 'src/pages/Item/composables/cloneItem';
+import RightMenu from 'src/components/common/RightMenu.vue';
+import ItemListFilter from './ItemListFilter.vue';
 
 const entityId = computed(() => route.params.id);
 const { openCloneDialog } = cloneItem();
@@ -311,6 +313,11 @@ const columns = computed(() => [
         :label="t('item.searchbar.label')"
         :info="t('You can search by id')"
     />
+    <RightMenu>
+        <template #right-panel>
+            <ItemListFilter data-key="ItemList" />
+        </template>
+    </RightMenu>
     <VnTable
         ref="tableRef"
         data-key="ItemList"
@@ -329,6 +336,7 @@ const columns = computed(() => [
         auto-load
         redirect="Item"
         :is-editable="false"
+        :right-search="false"
         :filer="itemFilter"
     >
         <template #column-id="{ row }">