diff --git a/app/composables/useDirectusFiles.ts b/app/composables/useDirectusFiles.ts new file mode 100644 index 0000000..38af82b --- /dev/null +++ b/app/composables/useDirectusFiles.ts @@ -0,0 +1,22 @@ +export const useDirectusFiles = () => { + const config = useRuntimeConfig(); + const baseUrl = config.public.directus.url; + + const getFileUrl = ( + id?: string | null, + options?: Record + ): string => { + if (!id) return ''; + const query = options + ? '?' + + new URLSearchParams( + Object.entries(options).map(([key, value]) => [key, String(value)]) + ).toString() + : ''; + return `${baseUrl}/assets/${id}${query}`; + }; + + return { + getFileUrl, + }; +}; diff --git a/app/composables/useDirectusImage.ts b/app/composables/useDirectusImage.ts new file mode 100644 index 0000000..08215d6 --- /dev/null +++ b/app/composables/useDirectusImage.ts @@ -0,0 +1,32 @@ +export const useDirectusImage = () => { + const config = useRuntimeConfig(); + const baseUrl = config.public.directus.url; + const token = config.public.directus.token; + + type DirectusAssetParams = { + width?: number; + height?: number; + fit?: 'cover' | 'contain' | 'inside' | 'outside'; + quality?: number; + format?: 'webp' | 'jpg' | 'png' | 'auto'; + } & Record; + + const getImageUrl = (id?: string | null, options?: DirectusAssetParams) => { + if (!id) return ''; + const queryToken = token ? 'access_token=' + token : ''; + const queryOptions = options + ? new URLSearchParams( + Object.fromEntries( + Object.entries(options).map(([key, value]) => [key, String(value)]) + ) + ).toString + : ''; + const query = + queryToken || queryOptions + ? `?${[queryToken, queryOptions].filter(Boolean).join('&')}` + : ''; + return `${baseUrl}/assets/${id}${query}`; + }; + + return { getImageUrl }; +}; diff --git a/app/plugins/directus.ts b/app/plugins/directus.ts new file mode 100644 index 0000000..a68bc1b --- /dev/null +++ b/app/plugins/directus.ts @@ -0,0 +1,12 @@ +import { createDirectus, rest, staticToken } from '@directus/sdk'; + +export default defineNuxtPlugin(() => { + const config = useRuntimeConfig(); + + const directus = createDirectus(config.public.directus.url) + .with(rest()) + .with(staticToken(config.public.directus.token || '')); + return { + provide: { directus }, + }; +}); diff --git a/nuxt.config.ts b/nuxt.config.ts index 45c1ad9..639a4ca 100644 --- a/nuxt.config.ts +++ b/nuxt.config.ts @@ -118,7 +118,7 @@ export default defineNuxtConfig({ }, imports: { - dirs: ['types/**'], + dirs: ['types/**', 'models/**'], }, modules: [ @@ -133,6 +133,5 @@ export default defineNuxtConfig({ '@element-plus/nuxt', '@nuxtjs/i18n', '@nuxtjs/strapi', - 'nuxt-directus', ], });