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

View File

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

View File

@@ -1,7 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import { PhArrowBendDoubleUpLeft, PhCalendarX, PhCircleNotch } from "@phosphor-icons/vue"; import { PhArrowBendDoubleUpLeft, PhCalendarX, PhCircleNotch } from "@phosphor-icons/vue";
import type { Calendar } from "~/models/CalendarConfig"; import type { Calendar } from "~/models/CalendarConfig";
import type { Category } from "~/models/Category";
definePageMeta({ definePageMeta({
middleware: ["auth-guard"] middleware: ["auth-guard"]
@@ -32,18 +31,12 @@ const {
} }
) )
const { const isLoading = computed(() => calendarStatus.value === "pending")
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 { setActiveCalendar } = useCalendar() const { setActiveCalendar } = useCalendar()
watch([calendar, categories], () => { watch([calendar], () => {
if (calendar.value?.data && categories.value?.data) { if (calendar.value?.data) {
setActiveCalendar(calendar.value?.data, categories.value.data) setActiveCalendar(calendar.value?.data)
} }
}, { immediate: true }) }, { immediate: true })
</script> </script>
@@ -62,7 +55,7 @@ watch([calendar, categories], () => {
</div> </div>
</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> <Head>
<Title>{{ calendar.data.name }}</Title> <Title>{{ calendar.data.name }}</Title>
</Head> </Head>

View File

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

View File

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

View File

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