tags and new analytics new in budget

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,6 +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";
 
 const props = defineProps({
   opened: {
@@ -17,8 +18,8 @@ const props = defineProps({
     required: true
   }
 })
-const emits = defineEmits(['budget-created','close-modal'])
-const createRecurrentPayments = ref<Boolean>(true)
+const emits = defineEmits(['budget-created', 'close-modal'])
+const createRecurrentPayments = ref<Boolean>(false)
 
 const name = ref('')
 const dateFrom = ref(new Date())
@@ -29,6 +30,10 @@ const budget = ref(new Budget())
 const create = async () => {
 
   try {
+    await createBudget(budget.value, createRecurrentPayments)
+        .then((res) => {
+          budget.value = res
+        })
     emits("budget-created", budget.value, createRecurrentPayments.value);
   } catch (e) {
     console.error(e)
@@ -36,6 +41,22 @@ 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)
@@ -75,7 +96,7 @@ watch(
         try {
           // loading.value = true;
           // Если выбранный space изменился, получаем новую информацию о бюджете
-         await fetchCategories()
+          await fetchCategories()
         } catch (error) {
           console.error('Error fetching budget infos:', error);
         }
@@ -90,38 +111,34 @@ onMounted(() => {
     fetchCategories()
   }
 })
-
 </script>
 
 <template>
-  <Dialog :visible="opened" modal header="Создать новый бюджет" :style="{ width: '25rem' }" @hide="cancel" @update:visible="cancel">
-    <div class="flex flex-col gap-4 mt-1">
-      <FloatLabel variant="on" class="w-full">
-        <label for="name">Название</label>
-        <InputText v-model="budget.name" id="name" class="w-full"/>
+  <div class="flex flex-col gap-4 mt-1">
+    <FloatLabel variant="on" class="w-full">
+      <label for="name">Название</label>
+      <InputText v-model="budget.name" id="name" class="w-full"/>
+    </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 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>
-  </Dialog>
-
+    <!--    <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>
 </template>
 
 <style scoped>