@crm-market/template-shared 1.0.4 → 1.0.5

package/components/Layout/MiddleHeader.vue

@@ -185,8 +185,7 @@ export default defineComponent({
     const resolveImageUrl = (url: string) => {
       if (!url) return '';
       if (url.startsWith('http')) return url;
-      const config = useRuntimeConfig();
-      const apiBase = config.public.apiBase || 'http://localhost:3001/api';
+      const apiBase = getApiBaseUrl();
       const baseUrl = apiBase.replace('/api', '');
       return `${baseUrl}${url}`;
     };

package/components/Layout/MiddleHeaderThree.vue

@@ -167,8 +167,7 @@ export default defineComponent({
     const resolveImageUrl = (url: string) => {
       if (!url) return '';
       if (url.startsWith('http')) return url;
-      const config = useRuntimeConfig();
-      const apiBase = config.public.apiBase || 'http://localhost:3001/api';
+      const apiBase = getApiBaseUrl();
       const baseUrl = apiBase.replace('/api', '');
       return `${baseUrl}${url}`;
     };

package/components/Layout/MiddleHeaderTwo.vue

@@ -195,8 +195,7 @@ export default defineComponent({
     const resolveImageUrl = (url: string) => {
       if (!url) return '';
       if (url.startsWith('http')) return url;
-      const config = useRuntimeConfig();
-      const apiBase = config.public.apiBase || 'http://localhost:3001/api';
+      const apiBase = getApiBaseUrl();
       const baseUrl = apiBase.replace('/api', '');
       return `${baseUrl}${url}`;
     };

package/composables/useCategories.ts

@@ -1,5 +1,6 @@
 import { ref, computed } from 'vue';
 import { useRuntimeConfig } from '#imports';
+import { getApiBaseUrl } from '../utils/api';
 import { useSiteConfig } from './useSiteConfig';
 
 interface Category {
@@ -34,7 +35,7 @@ export const useCategories = () => {
       }
 
       const response = await $fetch<{ categories: Category[] }>('/site-template/public/store/categories', {
-        baseURL: config.public.apiBase || 'http://localhost:3001/api',
+        baseURL: getApiBaseUrl(),
         params: { token },
       });
 

package/composables/useCheckout.ts

@@ -65,7 +65,7 @@ export const useCheckout = () => {
 
       const response = await $fetch<{ id: string }>('/order', {
         method: 'POST',
-        baseURL: config.public.apiBase || 'http://localhost:3001/api',
+        baseURL: getApiBaseUrl(),
         body: orderData,
       });
 
@@ -88,7 +88,7 @@ export const useCheckout = () => {
 
     try {
       const response = await $fetch(`/order/${id}`, {
-        baseURL: config.public.apiBase || 'http://localhost:3001/api',
+        baseURL: getApiBaseUrl(),
       });
 
       return response;

package/composables/useProducts.ts

@@ -1,5 +1,6 @@
 import { ref, computed } from 'vue';
 import { useRuntimeConfig } from '#imports';
+import { getApiBaseUrl } from '../utils/api';
 import { useSiteConfig } from './useSiteConfig';
 
 interface Product {
@@ -52,7 +53,7 @@ export const useProducts = () => {
       };
 
       const response = await $fetch<{ products: Product[]; total: number }>('/site-template/public/store/products', {
-        baseURL: config.public.apiBase || 'http://localhost:3001/api',
+        baseURL: getApiBaseUrl(),
         params,
       });
 
@@ -79,7 +80,7 @@ export const useProducts = () => {
       }
 
       const response = await $fetch<{ product: Product }>(`/site-template/public/store/products/${productId}`, {
-        baseURL: config.public.apiBase || 'http://localhost:3001/api',
+        baseURL: getApiBaseUrl(),
         params: { token },
       });
 
@@ -106,7 +107,7 @@ export const useProducts = () => {
       };
 
       const response = await $fetch<{ products: Product[]; total: number }>('/site-template/public/store/products', {
-        baseURL: config.public.apiBase || 'http://localhost:3001/api',
+        baseURL: getApiBaseUrl(),
         params,
       });
 

package/composables/useSiteConfig.ts

@@ -1,5 +1,6 @@
 import { ref, computed } from 'vue';
 import { useRuntimeConfig, useRoute } from '#imports';
+import { getApiBaseUrl } from '../utils/api';
 
 interface ColorScheme {
   primary?: string;
@@ -89,7 +90,7 @@ export const useSiteConfig = () => {
       const response = await $fetch<SiteConfig>(
         `/site-template/public/config/subdomain/${sub}`,
         {
-          baseURL: config.public.apiBase || 'http://localhost:3001/api',
+          baseURL: getApiBaseUrl(),
         }
       );
 

package/nuxt.config.ts

@@ -21,6 +21,8 @@ export default defineNuxtConfig({
   },
 
   runtimeConfig: {
+    // SSR-only: внутрішній URL бекенду (Docker мережа або localhost)
+    apiBaseInternal: process.env.API_BASE_INTERNAL || '',
     public: {
       apiBase: process.env.API_BASE_URL || 'http://localhost:3001/api',
       templateType: process.env.TEMPLATE_TYPE || 'electronics',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crm-market/template-shared",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "type": "module",
   "description": "Shared Nuxt 3 layer for CRM Market store templates (layouts, components, composables, pages)",
   "publishConfig": {

package/utils/api.ts

@@ -0,0 +1,17 @@
+import { useRuntimeConfig } from '#imports';
+
+/**
+ * Повертає базовий URL для API-запитів.
+ * На сервері (SSR) використовує внутрішній URL Docker-мережі (якщо задано),
+ * на клієнті — завжди публічний URL.
+ */
+export const getApiBaseUrl = (): string => {
+  const config = useRuntimeConfig();
+
+  // На сервері: використовуємо внутрішній URL якщо він задано
+  if (import.meta.server && config.apiBaseInternal) {
+    return config.apiBaseInternal as string;
+  }
+
+  return (config.public.apiBase as string) || 'http://localhost:3001/api';
+};

package/utils/image.ts

@@ -1,4 +1,5 @@
 import { useRuntimeConfig } from '#imports';
+import { getApiBaseUrl } from './api';
 
 /**
  * Перетворює відносні шляхи до зображень (/media/...) у повні URL
@@ -7,8 +8,7 @@ export const resolveImageUrl = (url: string | undefined | null): string => {
   if (!url) return '';
   if (url.startsWith('http') || url.startsWith('data:') || url.startsWith('blob:')) return url;
 
-  const config = useRuntimeConfig();
-  const apiBase = (config.public.apiBase as string) || 'http://localhost:3001/api';
+  const apiBase = getApiBaseUrl();
   // Видаляємо /api з кінця, щоб отримати базовий URL сервера
   const baseUrl = apiBase.replace(/\/api\/?$/, '');
   return `${baseUrl}${url.startsWith('/') ? '' : '/'}${url}`;