diff --git a/src/pages/Item/Card/ItemDiary.vue b/src/pages/Item/Card/ItemDiary.vue
index a3ac6645ef..0f27d3a941 100644
--- a/src/pages/Item/Card/ItemDiary.vue
+++ b/src/pages/Item/Card/ItemDiary.vue
@@ -19,13 +19,14 @@ import { date } from 'quasar';
 import { useState } from 'src/composables/useState';
 import { useArrayData } from 'src/composables/useArrayData';
 import axios from 'axios';
+import VnSubToolbar from 'components/ui/VnSubToolbar.vue';
 
 const { t } = useI18n();
 const route = useRoute();
 const router = useRouter();
 const stateStore = useStateStore();
 const state = useState();
-
+debugger;
 const user = state.getUser();
 const today = ref(Date.vnNew());
 const warehousesOptions = ref([]);
@@ -205,8 +206,8 @@ async function updateWarehouse(warehouseFk) {
         auto-load
         @on-fetch="(data) => (warehousesOptions = data)"
     />
-    <template v-if="stateStore.isHeaderMounted()">
-        <Teleport to="#st-data">
+    <VnSubToolbar class="q-mb-md">
+        <template #st-data>
             <div class="row">
                 <VnSelect
                     :label="t('itemDiary.warehouse')"
@@ -235,9 +236,9 @@ async function updateWarehouse(warehouseFk) {
                     @update:model-value="fetchItemBalances"
                 />
             </div>
-        </Teleport>
-        <Teleport to="#st-actions"> </Teleport>
-    </template>
+        </template>
+        <template #st-actions></template
+    ></VnSubToolbar>
     <QPage class="column items-center q-pa-md">
         <QTable
             :rows="itemBalances"