/** * Platform Detail - Alpine.js Component * * Displays platform overview, stats, and quick actions. */ const platformDetailLog = window.LogConfig.createLogger('PLATFORM_DETAIL'); function platformDetail() { return { // Inherit base layout functionality from init-alpine.js ...data(), // Page identification currentPage: 'platform-detail', // State platform: null, stats: null, recentPages: [], loading: true, error: null, platformCode: null, // Lifecycle async init() { platformDetailLog.info('=== PLATFORM DETAIL PAGE INITIALIZING ==='); // Duplicate initialization guard if (window._platformDetailInitialized) { platformDetailLog.warn('Platform detail page already initialized, skipping...'); return; } window._platformDetailInitialized = true; try { // Extract platform code from URL const path = window.location.pathname; const match = path.match(/\/admin\/platforms\/([^\/]+)$/); if (match) { this.platformCode = match[1]; platformDetailLog.info('Viewing platform:', this.platformCode); await Promise.all([ this.loadPlatform(), this.loadRecentPages(), ]); } else { platformDetailLog.error('No platform code in URL'); this.error = 'Platform code not found in URL'; this.loading = false; } platformDetailLog.info('=== PLATFORM DETAIL PAGE INITIALIZATION COMPLETE ==='); } catch (error) { window.LogConfig.logError(error, 'Platform Detail Init'); this.error = 'Failed to initialize page'; this.loading = false; } }, // API Methods async loadPlatform() { try { const response = await apiClient.get(`/admin/platforms/${this.platformCode}`); this.platform = response; platformDetailLog.info(`Loaded platform: ${this.platformCode}`); } catch (err) { platformDetailLog.error('Error loading platform:', err); this.error = err.message || 'Failed to load platform'; throw err; } finally { this.loading = false; } }, async loadRecentPages() { try { // Load recent content pages for this platform const response = await apiClient.get(`/admin/content-pages?platform_code=${this.platformCode}&limit=5`); this.recentPages = response.items || response || []; platformDetailLog.info(`Loaded ${this.recentPages.length} recent pages`); } catch (err) { platformDetailLog.error('Error loading recent pages:', err); // Non-fatal - don't throw this.recentPages = []; } }, // Helper Methods getPlatformIcon(code) { const icons = { main: 'home', oms: 'clipboard-list', loyalty: 'star', sitebuilder: 'template', }; return icons[code] || 'globe-alt'; }, getPageTypeLabel(page) { if (page.is_platform_page) return 'Marketing'; if (page.vendor_id) return 'Vendor Override'; return 'Vendor Default'; }, getPageTypeBadgeClass(page) { if (page.is_platform_page) { return 'bg-purple-100 text-purple-800 dark:bg-purple-900 dark:text-purple-200'; } if (page.vendor_id) { return 'bg-teal-100 text-teal-800 dark:bg-teal-900 dark:text-teal-200'; } return 'bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200'; }, formatDate(dateString) { if (!dateString) return '—'; const date = new Date(dateString); return date.toLocaleDateString('fr-LU', { year: 'numeric', month: 'short', day: 'numeric', }); }, getPlatformUrl() { if (!this.platform) return '#'; if (this.platform.domain) { return `https://${this.platform.domain}`; } // Development URL if (this.platform.code === 'main') { return '/'; } return `/platforms/${this.platform.code}/`; }, }; }