add network

This commit is contained in:
xds
2025-10-31 15:22:44 +03:00
parent 6ab7a490c9
commit 5b56eb17fd
33 changed files with 1435 additions and 342 deletions

View File

@@ -8,6 +8,7 @@ import {Category} from "@/models/category";
import {useToolbarStore} from "@/stores/toolbar-store";
import {useRouter} from "vue-router";
import {useCategoriesStore} from "@/stores/categories-store";
import {CategoryType, CategoryTypeName} from "@/models/enums";
const toast = useToast()
const spaceStore = useSpaceStore()
@@ -20,7 +21,7 @@ const categories = ref<Category[]>([])
const fetchData = async () => {
try {
if (spaceStore.selectedSpaceId !== null) {
if (spaceStore.selectedSpaceId !== undefined) {
let spaceId = spaceStore.selectedSpaceId!!
await categoryStore.fetchCategories(spaceId)
categories.value = categoryStore.categories
@@ -50,21 +51,56 @@ onMounted(async () => {
<template>
<div class="flex flex-col w-full !pb-10 gap-6">
<div class="flex flex-col">
<span>Income categories</span>
<div class="flex card flex-col ">
<div class="card">
<div v-for="key in categories.keys()" :key="categories[key].id"
@click="router.push(`/categories/${categories[key].id}/edit`)"
class="flex flex-col w-full gap-0 pl-5 items-start justify-items-center font-bold ">
<div class="flex-row w-full items-center justify-between">
<div class="flex-row items-center gap-2 ">
<span class="text-3xl"> {{ categories[key].icon }}</span>
<div class="flex-col !font-bold "> {{ categories[key].name }}
<div class="flex flex-row text-sm">{{ categories[key].description }}</div>
<span v-if="categories.filter(i => i.type == CategoryType.INCOME).length ==0 ">It looks like you haven't create any income category yet. <router-link
to="/categories/create" class="!text-blue-400">Try to create some first.</router-link></span>
<div v-else v-for="key in categories.filter(i => i.type == CategoryType.INCOME).keys()"
:key="categories[key].id"
@click="router.push(`/categories/${categories[key].id}/edit`)"
class="flex flex-col w-full gap-0 pl-5 items-start justify-items-center font-bold ">
<div class="flex flex-row w-full items-center justify-between">
<div class="flex flex-row items-center gap-2 ">
<span class="text-3xl"> {{ categories[key].icon }}</span>
<div class="flex flex-col !font-bold "> {{ categories[key].name }}
<div class="flex flex-row text-sm">{{ categories[key].description }} |
{{ CategoryTypeName[categories[key].type] }}
</div>
</div>
</div>
<i class="pi pi-angle-right !font-extralight"/>
</div>
<Divider v-if="key+1 !== categories.length" class="!m-0 !py-3"/>
</div>
</div>
</div>
<div class="flex flex-col">
<span>Expense categories</span>
<div class="flex card ">
<span v-if="categories.filter(i => i.type == CategoryType.EXPENSE).length ==0 ">It looks like you haven't create any expense category yet. <router-link
to="/categories/create" class="!text-blue-400">Try to create some first.</router-link></span>
<div v-else v-for="key in categories.filter(i => i.type == CategoryType.EXPENSE).keys()"
:key="categories[key].id"
@click="router.push(`/categories/${categories[key].id}/edit`)"
class="flex flex-col w-full gap-0 pl-5 items-start justify-items-center font-bold ">
<div class="flex flex-row w-full items-center justify-between">
<div class="flex flex-row items-center gap-2 ">
<span class="text-3xl"> {{ categories[key].icon }}</span>
<div class="flex flex-col !font-bold "> {{ categories[key].name }}
<div class="flex flex-row text-sm">{{ categories[key].description }} |
{{ CategoryTypeName[categories[key].type] }}
</div>
</div>
</div>
<i class="pi pi-angle-right !font-extralight"/>
</div>
<Divider v-if="key+1 !== categories.length" class="!m-0 !py-3"/>
</div>
<i class="pi pi-angle-right !font-extralight"/>
</div>
<Divider v-if="key+1 !== categories.length" class="!m-0 !py-3"/>
</div>
</div>
</template>