Moved categories to the same scope as calendar events

This commit is contained in:
Alexis
2025-04-16 10:49:11 +02:00
parent f1abae1cce
commit 6abf89e8db
6 changed files with 22 additions and 19 deletions

View File

@@ -26,7 +26,7 @@ import {
import SearchList from "./lists/SearchList.vue"
import type { Category } from "~/models/Category"
const { isAdvancedSearchOpen, allEvents } = storeToRefs(useCalendar())
const { isAdvancedSearchOpen, allEvents, categories } = storeToRefs(useCalendar())
const { characters } = storeToRefs(useCharacters())
const searchInput = shallowRef<HTMLInputElement>()
@@ -207,8 +207,7 @@ watch([currentPage, selectedEntity], () => {
})
// Compute categories based on current selectedEntity
const { data: resCategories } = await useFetch("/api/calendars/categories/query")
const currentCategories = ref<Category[]>(resCategories.value?.data as Category[])
const currentCategories = computed(() => categories.value)
const selectedCategories = ref<(Category)[]>([])
const categoryFilterOpened = ref<boolean>(false)

View File

@@ -5,7 +5,7 @@ import { dateSchema, type RPGDate } from "./Date"
import type { World } from "./World"
import type { ContentState } from "./Entity"
import type { RPGColor } from "./Color"
import type { Category } from "./Category"
export interface CalendarConfig {
months: CalendarMonth[]
@@ -16,7 +16,8 @@ export interface Calendar extends CalendarConfig {
id?: number
shortId?: string
name: string
events: CalendarEvent[]
events: CalendarEvent[],
categories: Category[]
eventNb?: Array<{ count: number }>
state: ContentState
color?: RPGColor

View File

@@ -1,7 +1,6 @@
<script lang="ts" setup>
import { PhArrowBendDoubleUpLeft, PhCalendarX, PhCircleNotch } from "@phosphor-icons/vue";
import type { Calendar } from "~/models/CalendarConfig";
import type { Category } from "~/models/Category";
definePageMeta({
middleware: ["auth-guard"]
@@ -32,18 +31,12 @@ const {
}
)
const {
data: categories,
status: categoriesStatus,
} = await useLazyFetch<{ data: Category[] }>("/api/calendars/categories/query",
{ key: "active-categories" }
)
const isLoading = computed(() => calendarStatus.value === "pending" || categoriesStatus.value === "pending")
const isLoading = computed(() => calendarStatus.value === "pending")
const { setActiveCalendar } = useCalendar()
watch([calendar, categories], () => {
if (calendar.value?.data && categories.value?.data) {
setActiveCalendar(calendar.value?.data, categories.value.data)
watch([calendar], () => {
if (calendar.value?.data) {
setActiveCalendar(calendar.value?.data)
}
}, { immediate: true })
</script>
@@ -62,7 +55,7 @@ watch([calendar, categories], () => {
</div>
</div>
<div v-else-if="calendar?.data && categories?.data" class="h-full w-full">
<div v-else-if="calendar?.data" class="h-full w-full">
<Head>
<Title>{{ calendar.data.name }}</Title>
</Head>

View File

@@ -4,6 +4,7 @@ import type { Category } from "~/models/Category";
const querySchema = z.object({
id: z.number({ coerce: true }).positive().int().optional(),
calendarId: z.number({ coerce: true }).positive().int()
})
export default defineEventHandler(async (event) => {
@@ -24,5 +25,9 @@ export default defineEventHandler(async (event) => {
return output.eq("id", query.id).limit(1).single<Category>()
}
if (query.calendarId) {
output.eq("calendar_id", query.calendarId)
}
return output.overrideTypes<Category[]>()
})

View File

@@ -52,6 +52,11 @@ export default defineEventHandler(async (event) => {
category:calendar_event_categories!calendar_events_category_fkey (*),
secondaryCategories:calendar_event_categories!calendar_event_categories_links (*)
),
categories:calendar_event_categories (
id,
name,
color
),
eventNb:calendar_events(count),
world:worlds (
id,

View File

@@ -60,7 +60,7 @@ export const useCalendar = defineStore("calendar", () => {
*/
const months = ref<CalendarMonth[]>([])
function setActiveCalendar(calendarData: Calendar, categoryData: Category[]) {
function setActiveCalendar(calendarData: Calendar) {
try {
if (!calendarData.id) return
@@ -88,7 +88,7 @@ export const useCalendar = defineStore("calendar", () => {
months.value = calendarData.months
baseEvents.value = calendarData.events
categories.value = categoryData
categories.value = calendarData.categories
} catch (err) {
console.log(err)
}