Files
orion/static/admin/js/subscription-tiers.js
Samir Boulahtit d2daf34c90 feat: add admin frontend for subscription and billing management
Add admin pages for managing subscription tiers, vendor subscriptions,
and billing history:

- Subscription Tiers page: Create, edit, activate/deactivate tiers
- Vendor Subscriptions page: View/edit subscriptions, custom limits
- Billing History page: View invoices with filters and PDF links
- Stats dashboard with MRR/ARR calculations

Also includes:
- Pydantic schemas for billing operations (models/schema/billing.py)
- Admin subscription service layer for database operations
- Security validation fixes (SEC-001, SEC-021, SEC-022)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-25 21:45:26 +01:00

203 lines
6.9 KiB
JavaScript

// static/admin/js/subscription-tiers.js
// noqa: JS-003 - Uses ...baseData which is data() with safety check
const tiersLog = window.LogConfig?.loggers?.subscriptionTiers || console;
function adminSubscriptionTiers() {
// Get base data with safety check for standalone usage
const baseData = typeof data === 'function' ? data() : {};
return {
// Inherit base layout functionality from init-alpine.js
...baseData,
// Page-specific state
currentPage: 'subscription-tiers',
loading: true,
error: null,
successMessage: null,
saving: false,
// Data
tiers: [],
stats: null,
includeInactive: false,
// Sorting
sortBy: 'display_order',
sortOrder: 'asc',
// Modal state
showModal: false,
editingTier: null,
formData: {
code: '',
name: '',
description: '',
price_monthly_cents: 0,
price_annual_cents: null,
orders_per_month: null,
products_limit: null,
team_members: null,
display_order: 0,
stripe_product_id: '',
stripe_price_monthly_id: '',
features: [],
is_active: true,
is_public: true
},
async init() {
// Guard against multiple initialization
if (window._adminSubscriptionTiersInitialized) {
tiersLog.warn('Already initialized, skipping');
return;
}
window._adminSubscriptionTiersInitialized = true;
tiersLog.info('=== SUBSCRIPTION TIERS PAGE INITIALIZING ===');
await this.loadTiers();
await this.loadStats();
},
async refresh() {
this.error = null;
this.successMessage = null;
await this.loadTiers();
await this.loadStats();
},
async loadTiers() {
this.loading = true;
this.error = null;
try {
const params = new URLSearchParams();
params.append('include_inactive', this.includeInactive);
const data = await apiClient.get(`/admin/subscriptions/tiers?${params}`);
this.tiers = data.tiers || [];
tiersLog.info(`Loaded ${this.tiers.length} tiers`);
} catch (error) {
tiersLog.error('Failed to load tiers:', error);
this.error = error.message || 'Failed to load subscription tiers';
} finally {
this.loading = false;
}
},
async loadStats() {
try {
const data = await apiClient.get('/admin/subscriptions/stats');
this.stats = data;
tiersLog.info('Loaded subscription stats');
} catch (error) {
tiersLog.error('Failed to load stats:', error);
// Non-critical, don't show error
}
},
openCreateModal() {
this.editingTier = null;
this.formData = {
code: '',
name: '',
description: '',
price_monthly_cents: 0,
price_annual_cents: null,
orders_per_month: null,
products_limit: null,
team_members: null,
display_order: this.tiers.length,
stripe_product_id: '',
stripe_price_monthly_id: '',
features: [],
is_active: true,
is_public: true
};
this.showModal = true;
},
openEditModal(tier) {
this.editingTier = tier;
this.formData = {
code: tier.code,
name: tier.name,
description: tier.description || '',
price_monthly_cents: tier.price_monthly_cents,
price_annual_cents: tier.price_annual_cents,
orders_per_month: tier.orders_per_month,
products_limit: tier.products_limit,
team_members: tier.team_members,
display_order: tier.display_order,
stripe_product_id: tier.stripe_product_id || '',
stripe_price_monthly_id: tier.stripe_price_monthly_id || '',
features: tier.features || [],
is_active: tier.is_active,
is_public: tier.is_public
};
this.showModal = true;
},
closeModal() {
this.showModal = false;
this.editingTier = null;
},
async saveTier() {
this.saving = true;
this.error = null;
try {
// Clean up null values for empty strings
const payload = { ...this.formData };
if (payload.price_annual_cents === '') payload.price_annual_cents = null;
if (payload.orders_per_month === '') payload.orders_per_month = null;
if (payload.products_limit === '') payload.products_limit = null;
if (payload.team_members === '') payload.team_members = null;
if (this.editingTier) {
// Update existing tier
await apiClient.patch(`/admin/subscriptions/tiers/${this.editingTier.code}`, payload);
this.successMessage = `Tier "${payload.name}" updated successfully`;
} else {
// Create new tier
await apiClient.post('/admin/subscriptions/tiers', payload);
this.successMessage = `Tier "${payload.name}" created successfully`;
}
this.closeModal();
await this.loadTiers();
} catch (error) {
tiersLog.error('Failed to save tier:', error);
this.error = error.message || 'Failed to save tier';
} finally {
this.saving = false;
}
},
async toggleTierStatus(tier, activate) {
try {
await apiClient.patch(`/admin/subscriptions/tiers/${tier.code}`, {
is_active: activate
});
this.successMessage = `Tier "${tier.name}" ${activate ? 'activated' : 'deactivated'}`;
await this.loadTiers();
} catch (error) {
tiersLog.error('Failed to toggle tier status:', error);
this.error = error.message || 'Failed to update tier';
}
},
formatCurrency(cents) {
if (cents === null || cents === undefined) return '-';
return new Intl.NumberFormat('de-LU', {
style: 'currency',
currency: 'EUR'
}).format(cents / 100);
}
};
}
tiersLog.info('Subscription tiers module loaded');