chet novoe

src/components/budgets/TransactionEditDrawer.vue

@@ -5,7 +5,7 @@ import DatePicker from "primevue/datepicker";
 import FloatLabel from "primevue/floatlabel";
 import InputNumber from "primevue/inputnumber";
 import Button from "primevue/button";
-import {ref, onMounted, computed} from 'vue';
+import {ref, onMounted, computed, onBeforeUnmount} from 'vue';
 import {Transaction, TransactionType} from "@/models/Transaction";
 import {CategoryType} from "@/models/Category";
 import SelectButton from "primevue/selectbutton";
@@ -176,13 +176,27 @@ const dateErrorMessage = computed(() => {
 
 // Закрытие окна
 const closeDrawer = () => emit('close-drawer');
-
+const keyboardOpen = ref(false);
 // Мониторинг при монтировании
 onMounted(async () => {
   loading.value = true;
   await fetchCategoriesAndTypes();
   prepareData();
   loading.value = false;
+
+  // Сохранение изначальной высоты окна
+  const initialHeight = window.innerHeight;
+
+  // Добавляем слушателя на событие изменения размера окна
+  window.addEventListener('resize', () => {
+    keyboardOpen.value = window.innerHeight < initialHeight;
+  });
+});
+
+onBeforeUnmount(() => {
+  // Удаляем слушателя при уничтожении компонента
+  window.removeEventListener('resize', () => {
+  });
 });
 </script>
 
@@ -308,7 +322,8 @@ onMounted(async () => {
 
 
         <!-- Buttons -->
-        <div class="fixed  col-12 bottom-6 flex justify-content-end gap-4">
+        {{keyboardOpen}}
+        <div class="fixed  col-12 bottom-6 flex justify-content-end gap-4" :class="keyboardOpen ? 'bottom-16' :''">
 
           <Button label="Save" icon="pi pi-check" class="p-button-success"
                   @click="isEditing ? updateTransaction() : createTransaction()"/>