diff --git a/src/pages/Item/Card/ItemDiary.vue b/src/pages/Item/Card/ItemDiary.vue
index a36b6a246..23dc6214e 100644
--- a/src/pages/Item/Card/ItemDiary.vue
+++ b/src/pages/Item/Card/ItemDiary.vue
@@ -188,7 +188,7 @@ async function updateWarehouse(warehouseFk) {
         },
     });
     await stock.fetch({});
-    stock.store.data.itemFk = route.params.id
+    stock.store.data.itemFk = route.params.id;
 }
 </script>
 
@@ -205,38 +205,39 @@ async function updateWarehouse(warehouseFk) {
         auto-load
         @on-fetch="(data) => (warehousesOptions = data)"
     />
-    <QToolbar class="justify-end">
-        <div id="st-data" class="row">
-            <VnSelect
-                :label="t('itemDiary.warehouse')"
-                :options="warehousesOptions"
-                hide-selected
-                option-label="name"
-                option-value="id"
-                dense
-                v-model="itemsBalanceFilter.where.warehouseFk"
-                @update:model-value="
-                    (value) => fetchItemBalances() && updateWarehouse(value)
-                "
-                class="q-mr-lg"
-            />
-            <QCheckbox
-                :label="t('itemDiary.showBefore')"
-                v-model="showWhatsBeforeInventory"
-                @update:model-value="fetchItemBalances"
-                class="q-mr-lg"
-            />
-            <VnInputDate
-                v-if="showWhatsBeforeInventory"
-                :label="t('itemDiary.since')"
-                dense
-                v-model="itemsBalanceFilter.where.date"
-                @update:model-value="fetchItemBalances"
-            />
-        </div>
-        <QSpace />
-        <div id="st-actions"></div>
-    </QToolbar>
+    <template v-if="stateStore.isHeaderMounted()">
+        <Teleport to="#st-data">
+            <div class="row">
+                <VnSelect
+                    :label="t('itemDiary.warehouse')"
+                    :options="warehousesOptions"
+                    hide-selected
+                    option-label="name"
+                    option-value="id"
+                    dense
+                    v-model="itemsBalanceFilter.where.warehouseFk"
+                    @update:model-value="
+                        (value) => fetchItemBalances() && updateWarehouse(value)
+                    "
+                    class="q-mr-lg"
+                />
+                <QCheckbox
+                    :label="t('itemDiary.showBefore')"
+                    v-model="showWhatsBeforeInventory"
+                    @update:model-value="fetchItemBalances"
+                    class="q-mr-lg"
+                />
+                <VnInputDate
+                    v-if="showWhatsBeforeInventory"
+                    :label="t('itemDiary.since')"
+                    dense
+                    v-model="itemsBalanceFilter.where.date"
+                    @update:model-value="fetchItemBalances"
+                />
+            </div>
+        </Teleport>
+        <Teleport to="#st-actions"> </Teleport>
+    </template>
     <QPage class="column items-center q-pa-md">
         <QTable
             :rows="itemBalances"