tags and new analytics new in budget

src/components/analytics/AnalyticsView.vue

@@ -265,7 +265,7 @@ onMounted(async () => {
 
   <LoadingView v-if="loading"/>
 
-  <div v-else class="p-4 pb-20 lg:pb-4 bg-gray-100  flex flex-col gap-4 h-full items-center justify-items-center ">
+  <div v-else class="p-4   bg-gray-100  flex flex-col gap-4 h-full items-center justify-items-center ">
     <div v-if="!selectedSpace" class="flex w-full h-full items-center justify-center">
       <p>Сперва нужно выбрать Пространство.
         <button class="text-blue-500 hover:underline" @click="router.push('/spaces').then((res) => router.go(0))">Перейти</button>

src/components/budgets/BudgetCreationDialogView.vue

@@ -1,16 +0,0 @@
-<script setup lang="ts">
-import Dialog from "primevue/dialog";
-
-
-</script>
-
-<template>
-  <Dialog :visible="opened" modal header="Создать новый бюджет" :style="{ width: '25rem' }" @hide="cancel" @update:visible="cancel">
-
-  </Dialog>
-
-</template>
-
-<style scoped>
-
-</style>

src/components/budgets/BudgetCreationView.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-
+import Dialog from "primevue/dialog";
 import Checkbox from "primevue/checkbox";
 import Button from "primevue/button";
 import InputText from "primevue/inputtext";
@@ -10,7 +10,7 @@ import {getMonthName} from "@/utils/utils";
 import {Budget} from "@/models/Budget";
 import {getCategories} from "@/services/categoryService";
 import {useSpaceStore} from "@/stores/spaceStore";
-import {createBudget, getBudgetInfos} from "@/services/budgetsService";
+import {createBudget} from "@/services/budgetsService";
 
 const props = defineProps({
   opened: {
@@ -19,7 +19,7 @@ const props = defineProps({
   }
 })
 const emits = defineEmits(['budget-created', 'close-modal'])
-const createRecurrentPayments = ref<Boolean>(false)
+const createRecurrentPayments = ref<Boolean>(true)
 
 const name = ref('')
 const dateFrom = ref(new Date())
@@ -30,10 +30,9 @@ const budget = ref(new Budget())
 const create = async () => {
 
   try {
-    await createBudget(budget.value, createRecurrentPayments)
+    await createBudget(budget.value)
-        .then((res) => {
+        .then((res) => budget.value = res)
-          budget.value = res
+        .catch((err) => console.log(err));
-        })
     emits("budget-created", budget.value, createRecurrentPayments.value);
   } catch (e) {
     console.error(e)
@@ -41,22 +40,6 @@ const create = async () => {
   }
 
 }
-const creationSuccessShow = async (budget, createRecurrentPayments) => {
-  try {
-    await createBudget(budget, createRecurrentPayments)
-    budgetInfos.value = await getBudgetInfos()
-    toast.add({severity: 'success', summary: 'Успешно!', detail: 'Бюджет создан!', life: 3000});
-    creationOpened.value = false
-  } catch (error) {
-    console.log(error.response.data["message"])
-    toast.add({severity: "error", summary: "Бюджет не создан", detail: error.response.data["message"], life: 3000});
-  }
-  // creationSuccessModal.value = true
-  // setTimeout(() => {
-  //       creationSuccessModal.value = false
-  //     }
-  //     , 1000)
-}
 const categories = ref([])
 const fetchCategories = async () => {
   await getCategories().then(res => categories.value = res.data)
@@ -111,34 +94,39 @@ onMounted(() => {
     fetchCategories()
   }
 })
+
 </script>
 
 <template>
-  <div class="flex flex-col gap-4 mt-1">
+  <Dialog :visible="opened" modal header="Создать новый бюджет" :style="{ width: '25rem' }" @hide="cancel"
-    <FloatLabel variant="on" class="w-full">
+          @update:visible="cancel">
-      <label for="name">Название</label>
+    <div class="flex flex-col gap-4 mt-1">
-      <InputText v-model="budget.name" id="name" class="w-full"/>
+      <FloatLabel variant="on" class="w-full">
-    </FloatLabel>
+        <label for="name">Название</label>
-    <div class="flex flex-row gap-4">
+        <InputText v-model="budget.name" id="name" class="w-full"/>
-      <FloatLabel variant="on">
-        <label for="dateFrom">Дата начала</label>
-        <DatePicker v-model="budget.dateFrom" id="dateFrom" dateFormat="dd.mm.yy"/>
-      </FloatLabel>
-      <FloatLabel variant="on">
-        <label for="dateTo">Дата завершения</label>
-        <DatePicker v-model="budget.dateTo" id="dateTo" dateFormat="dd.mm.yy"/>
       </FloatLabel>
+      <div class="flex flex-row gap-4">
+        <FloatLabel variant="on">
+          <label for="dateFrom">Дата начала</label>
+          <DatePicker v-model="budget.dateFrom" id="dateFrom" dateFormat="dd.mm.yy"/>
+        </FloatLabel>
+        <FloatLabel variant="on">
+          <label for="dateTo">Дата завершения</label>
+          <DatePicker v-model="budget.dateTo" id="dateTo" dateFormat="dd.mm.yy"/>
+        </FloatLabel>
+      </div>
+<!--      <div class="flex flex-row items-center min-w-fit gap-4">-->
+<!--        <Checkbox v-model="createRecurrentPayments" binary/>-->
+<!--        Создать ежемесячные платежи?-->
+<!--      </div>-->
+      <div v-if="categories.length ==0" class="text-red-500 font-bold">Сперва лучше создать категории</div>
+      <div class="flex flex-row gap-2 justify-end items-center">
+        <Button label="Создать" severity="success" icon="pi pi-save" @click="create"/>
+        <Button label="Отмена" severity="secondary" icon="pi pi-times-circle" @click="cancel"/>
+      </div>
     </div>
-    <!--    <div class="flex flex-row items-center min-w-fit gap-4">-->
+  </Dialog>
-    <!--      <Checkbox v-model="createRecurrentPayments" binary/>-->
+
-    <!--      Создать ежемесячные платежи?-->
-    <!--    </div>-->
-    <div v-if="categories.length ==0" class="text-red-500 font-bold">Сперва лучше создать категории</div>
-    <div class="flex flex-row gap-2 justify-end items-center">
-      <Button label="Создать" severity="success" icon="pi pi-save" @click="create"/>
-      <Button label="Отмена" severity="secondary" icon="pi pi-times-circle" @click="cancel"/>
-    </div>
-  </div>
 </template>
 
 <style scoped>

src/components/budgets/BudgetList.vue

@@ -5,14 +5,16 @@
     <div class="flex flex-row gap-4 items-center">
       <h2 class="text-4xl font-bold">Бюджеты</h2>
       <Button label="+ Создать" @click="creationOpened=true" size="small"/>
-      <BudgetCreationDialogView :opened="creationOpened" @budget-created="creationSuccessShow"
+      <BudgetCreationView :opened="creationOpened" @budget-created="fetchBudgets"
                           @close-modal="creationOpened=false"/>
       <StatusView :show="creationSuccessModal" :is-error="false" :message="'Бюджет создан!'"/>
     </div>
     <!-- Плитка с бюджетами -->
     <div v-if="!selectedSpace" class="flex w-full h-full items-center justify-center">
       <p>Сперва нужно выбрать Пространство.
-        <button class="text-blue-500 hover:underline" @click="router.push('/spaces').then((res) => router.go(0))">Перейти</button>
+        <button class="text-blue-500 hover:underline" @click="router.push('/spaces').then((res) => router.go(0))">
+          Перейти
+        </button>
       </p>
     </div>
     <div v-else-if="budgetInfos.length==0" class="flex w-full h-full items-center justify-center">
@@ -58,7 +60,7 @@ import {formatDate} from "@/utils/utils";
 import LoadingView from "@/components/LoadingView.vue";
 import Button from "primevue/button";
 import ConfirmDialog from "primevue/confirmdialog";
-import BudgetCreationDialogView from "@/components/budgets/BudgetCreationDialogView.vue";
+import BudgetCreationView from "@/components/budgets/BudgetCreationView.vue";
 import StatusView from "@/components/StatusView.vue";
 import {useConfirm} from "primevue/useconfirm";
 import {useToast} from "primevue/usetoast";
@@ -74,7 +76,6 @@ const creationOpened = ref(false)
 const creationSuccessModal = ref(false)
 
 
-
 const deleteBudget = async (budget: Budget) => {
 
   confirm.require({
@@ -106,6 +107,21 @@ const deleteBudget = async (budget: Budget) => {
     }
   });
 }
+
+const fetchBudgets = async () => {
+  creationOpened.value = false;
+  await getBudgetInfos().then((result) => {
+    budgetInfos.value = result
+    loading.value = false;
+  }).catch((error) => {
+    toast.add({
+      severity: "error",
+      summary: 'Ошибка загрузки бюджетов',
+      detail: error.response.data.message,
+      life: 3000
+    });
+  })
+}
 const spaceStore = useSpaceStore()
 const selectedSpace = computed(() => spaceStore.space)
 
@@ -117,10 +133,7 @@ watch(
         try {
           loading.value = true;
           // Если выбранный space изменился, получаем новую информацию о бюджете
-          await getBudgetInfos().then((result) => {
+          await fetchBudgets()
-            budgetInfos.value = result
-            loading.value = false;
-          })
         } catch (error) {
           console.error('Error fetching budget infos:', error);
         }
@@ -131,7 +144,7 @@ watch(
 onMounted(async () => {
   if (selectedSpace.value) {
     loading.value = true;
-    budgetInfos.value = await getBudgetInfos()
+    await fetchBudgets()
     loading.value = false;
   }
 })

src/services/budgetsService.ts

@@ -93,10 +93,8 @@ export const updateBudgetCategoryRequest = async (budget_id, category: BudgetCat
 }
 
 export const createBudget = async (budget: Budget, createRecurrent: Boolean) => {
-
-
     const spaceStore = useSpaceStore()
-    console.log(budget)
+
     let budgetToCreate = JSON.parse(JSON.stringify(budget));
     budgetToCreate.dateFrom = format(budget.dateFrom, 'yyyy-MM-dd')
     budgetToCreate.dateTo = format(budget.dateTo, 'yyyy-MM-dd')
@@ -104,7 +102,7 @@ export const createBudget = async (budget: Budget, createRecurrent: Boolean) =>
         budget: budgetToCreate,
         createRecurrent: createRecurrent
     }
-    return await apiClient.post(`/spaces/${spaceStore.space?.id}/budgets`, budgetToCreate)
+    return await apiClient.post(`/spaces/${spaceStore.space?.id}/budgets`, data)
         .then(res => res.data)
         .catch(err => {
             throw err