refactor(js): migrate JavaScript files to module directories
Move 47 JS files from static/{admin,vendor,shared}/js/ to their
respective module directories app/modules/*/static/*/js/:
- Orders: orders.js, order-detail.js
- Catalog: products.js (renamed from vendor-products.js), product-*.js
- Inventory: inventory.js (admin & vendor)
- Customers: customers.js, users.js, user-*.js
- Billing: billing-history.js, subscriptions.js, subscription-tiers.js,
billing.js, invoices.js, feature-store.js, upgrade-prompts.js
- Messaging: messages.js, notifications.js, email-templates.js
- Marketplace: marketplace*.js, letzshop*.js, onboarding.js
- Monitoring: monitoring.js, background-tasks.js, imports.js, logs.js
- Dev Tools: testing-*.js, code-quality-*.js
Update 39 templates to reference new module static paths using
url_for('{module}_static', path='...') pattern.
Files staying in static/ (platform core):
- admin: dashboard, login, platforms, vendors, companies, admin-users,
settings, components, init-alpine, module-config
- vendor: dashboard, login, profile, settings, team, media, init-alpine
- shared: api-client, utils, money, icons, log-config, vendor-selector,
media-picker
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,204 @@
|
||||
// app/modules/marketplace/static/admin/js/letzshop-vendor-directory.js
|
||||
/**
|
||||
* Admin Letzshop Vendor Directory page logic
|
||||
* Browse and import vendors from Letzshop marketplace
|
||||
*/
|
||||
|
||||
const letzshopVendorDirectoryLog = window.LogConfig.loggers.letzshopVendorDirectory ||
|
||||
window.LogConfig.createLogger('letzshopVendorDirectory', false);
|
||||
|
||||
letzshopVendorDirectoryLog.info('Loading...');
|
||||
|
||||
function letzshopVendorDirectory() {
|
||||
letzshopVendorDirectoryLog.info('letzshopVendorDirectory() called');
|
||||
|
||||
return {
|
||||
// Inherit base layout state
|
||||
...data(),
|
||||
|
||||
// Set page identifier for sidebar highlighting
|
||||
currentPage: 'letzshop-vendor-directory',
|
||||
|
||||
// Data
|
||||
vendors: [],
|
||||
stats: {},
|
||||
companies: [],
|
||||
total: 0,
|
||||
page: 1,
|
||||
limit: 20,
|
||||
hasMore: false,
|
||||
|
||||
// State
|
||||
loading: true,
|
||||
syncing: false,
|
||||
creating: false,
|
||||
error: '',
|
||||
successMessage: '',
|
||||
|
||||
// Filters
|
||||
filters: {
|
||||
search: '',
|
||||
city: '',
|
||||
category: '',
|
||||
only_unclaimed: false,
|
||||
},
|
||||
|
||||
// Modals
|
||||
showDetailModal: false,
|
||||
showCreateModal: false,
|
||||
selectedVendor: null,
|
||||
createVendorData: {
|
||||
slug: '',
|
||||
name: '',
|
||||
company_id: '',
|
||||
},
|
||||
createError: '',
|
||||
|
||||
// Init
|
||||
async init() {
|
||||
// Guard against multiple initialization
|
||||
if (window._letzshopVendorDirectoryInitialized) return;
|
||||
window._letzshopVendorDirectoryInitialized = true;
|
||||
|
||||
letzshopVendorDirectoryLog.info('init() called');
|
||||
await Promise.all([
|
||||
this.loadStats(),
|
||||
this.loadVendors(),
|
||||
this.loadCompanies(),
|
||||
]);
|
||||
},
|
||||
|
||||
// API calls
|
||||
async loadStats() {
|
||||
try {
|
||||
const data = await apiClient.get('/admin/letzshop/vendor-directory/stats');
|
||||
if (data.success) {
|
||||
this.stats = data.stats;
|
||||
}
|
||||
} catch (e) {
|
||||
letzshopVendorDirectoryLog.error('Failed to load stats:', e);
|
||||
}
|
||||
},
|
||||
|
||||
async loadVendors() {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const params = new URLSearchParams({
|
||||
page: this.page,
|
||||
limit: this.limit,
|
||||
});
|
||||
|
||||
if (this.filters.search) params.append('search', this.filters.search);
|
||||
if (this.filters.city) params.append('city', this.filters.city);
|
||||
if (this.filters.category) params.append('category', this.filters.category);
|
||||
if (this.filters.only_unclaimed) params.append('only_unclaimed', 'true');
|
||||
|
||||
const data = await apiClient.get(`/admin/letzshop/vendor-directory/vendors?${params}`);
|
||||
|
||||
if (data.success) {
|
||||
this.vendors = data.vendors;
|
||||
this.total = data.total;
|
||||
this.hasMore = data.has_more;
|
||||
} else {
|
||||
this.error = data.detail || 'Failed to load vendors';
|
||||
}
|
||||
} catch (e) {
|
||||
this.error = 'Failed to load vendors';
|
||||
letzshopVendorDirectoryLog.error('Failed to load vendors:', e);
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
async loadCompanies() {
|
||||
try {
|
||||
const data = await apiClient.get('/admin/companies?limit=100');
|
||||
if (data.companies) {
|
||||
this.companies = data.companies;
|
||||
}
|
||||
} catch (e) {
|
||||
letzshopVendorDirectoryLog.error('Failed to load companies:', e);
|
||||
}
|
||||
},
|
||||
|
||||
async triggerSync() {
|
||||
this.syncing = true;
|
||||
this.error = '';
|
||||
this.successMessage = '';
|
||||
|
||||
try {
|
||||
const data = await apiClient.post('/admin/letzshop/vendor-directory/sync');
|
||||
|
||||
if (data.success) {
|
||||
this.successMessage = data.message + (data.mode === 'celery' ? ` (Task ID: ${data.task_id})` : '');
|
||||
// Reload data after a delay to allow sync to complete
|
||||
setTimeout(() => {
|
||||
this.loadStats();
|
||||
this.loadVendors();
|
||||
}, 3000);
|
||||
} else {
|
||||
this.error = data.detail || 'Failed to trigger sync';
|
||||
}
|
||||
} catch (e) {
|
||||
this.error = 'Failed to trigger sync';
|
||||
letzshopVendorDirectoryLog.error('Failed to trigger sync:', e);
|
||||
} finally {
|
||||
this.syncing = false;
|
||||
}
|
||||
},
|
||||
|
||||
async createVendor() {
|
||||
if (!this.createVendorData.company_id || !this.createVendorData.slug) return;
|
||||
|
||||
this.creating = true;
|
||||
this.createError = '';
|
||||
|
||||
try {
|
||||
const data = await apiClient.post(
|
||||
`/admin/letzshop/vendor-directory/vendors/${this.createVendorData.slug}/create-vendor?company_id=${this.createVendorData.company_id}`
|
||||
);
|
||||
|
||||
if (data.success) {
|
||||
this.showCreateModal = false;
|
||||
this.successMessage = data.message;
|
||||
this.loadVendors();
|
||||
this.loadStats();
|
||||
} else {
|
||||
this.createError = data.detail || 'Failed to create vendor';
|
||||
}
|
||||
} catch (e) {
|
||||
this.createError = 'Failed to create vendor';
|
||||
letzshopVendorDirectoryLog.error('Failed to create vendor:', e);
|
||||
} finally {
|
||||
this.creating = false;
|
||||
}
|
||||
},
|
||||
|
||||
// Modal handlers
|
||||
showVendorDetail(vendor) {
|
||||
this.selectedVendor = vendor;
|
||||
this.showDetailModal = true;
|
||||
},
|
||||
|
||||
openCreateVendorModal(vendor) {
|
||||
this.createVendorData = {
|
||||
slug: vendor.slug,
|
||||
name: vendor.name,
|
||||
company_id: '',
|
||||
};
|
||||
this.createError = '';
|
||||
this.showCreateModal = true;
|
||||
},
|
||||
|
||||
// Utilities
|
||||
formatDate(dateStr) {
|
||||
if (!dateStr) return '-';
|
||||
const date = new Date(dateStr);
|
||||
return date.toLocaleDateString() + ' ' + date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
letzshopVendorDirectoryLog.info('Loaded');
|
||||
281
app/modules/marketplace/static/admin/js/letzshop.js
Normal file
281
app/modules/marketplace/static/admin/js/letzshop.js
Normal file
@@ -0,0 +1,281 @@
|
||||
// app/modules/marketplace/static/admin/js/letzshop.js
|
||||
/**
|
||||
* Admin Letzshop management page logic
|
||||
*/
|
||||
|
||||
// Use centralized logger (with fallback)
|
||||
const letzshopLog = window.LogConfig?.createLogger?.('letzshop') ||
|
||||
window.LogConfig?.loggers?.letzshop ||
|
||||
{ info: () => {}, warn: () => {}, error: () => {}, debug: () => {} };
|
||||
|
||||
letzshopLog.info('Loading...');
|
||||
|
||||
function adminLetzshop() {
|
||||
letzshopLog.info('adminLetzshop() called');
|
||||
|
||||
return {
|
||||
// Inherit base layout state
|
||||
...data(),
|
||||
|
||||
// Set page identifier
|
||||
currentPage: 'letzshop',
|
||||
|
||||
// Loading states
|
||||
loading: false,
|
||||
savingConfig: false,
|
||||
loadingOrders: false,
|
||||
|
||||
// Messages
|
||||
error: '',
|
||||
successMessage: '',
|
||||
|
||||
// Vendors data
|
||||
vendors: [],
|
||||
totalVendors: 0,
|
||||
page: 1,
|
||||
limit: 50,
|
||||
|
||||
// Filters
|
||||
filters: {
|
||||
configuredOnly: false
|
||||
},
|
||||
|
||||
// Stats
|
||||
stats: {
|
||||
total: 0,
|
||||
configured: 0,
|
||||
autoSync: 0,
|
||||
pendingOrders: 0
|
||||
},
|
||||
|
||||
// Configuration modal
|
||||
showConfigModal: false,
|
||||
selectedVendor: null,
|
||||
vendorCredentials: null,
|
||||
configForm: {
|
||||
api_key: '',
|
||||
auto_sync_enabled: false,
|
||||
sync_interval_minutes: 15
|
||||
},
|
||||
showApiKey: false,
|
||||
|
||||
// Orders modal
|
||||
showOrdersModal: false,
|
||||
vendorOrders: [],
|
||||
|
||||
async init() {
|
||||
// Guard against multiple initialization
|
||||
if (window._adminLetzshopInitialized) {
|
||||
return;
|
||||
}
|
||||
window._adminLetzshopInitialized = true;
|
||||
|
||||
letzshopLog.info('Initializing...');
|
||||
await this.loadVendors();
|
||||
},
|
||||
|
||||
/**
|
||||
* Load vendors with Letzshop status
|
||||
*/
|
||||
async loadVendors() {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const params = new URLSearchParams({
|
||||
skip: ((this.page - 1) * this.limit).toString(),
|
||||
limit: this.limit.toString(),
|
||||
configured_only: this.filters.configuredOnly.toString()
|
||||
});
|
||||
|
||||
const response = await apiClient.get(`/admin/letzshop/vendors?${params}`);
|
||||
this.vendors = response.vendors || [];
|
||||
this.totalVendors = response.total || 0;
|
||||
|
||||
// Calculate stats
|
||||
this.stats.total = this.totalVendors;
|
||||
this.stats.configured = this.vendors.filter(v => v.is_configured).length;
|
||||
this.stats.autoSync = this.vendors.filter(v => v.auto_sync_enabled).length;
|
||||
this.stats.pendingOrders = this.vendors.reduce((sum, v) => sum + (v.pending_orders || 0), 0);
|
||||
|
||||
letzshopLog.info('Loaded vendors:', this.vendors.length);
|
||||
} catch (error) {
|
||||
letzshopLog.error('Failed to load vendors:', error);
|
||||
this.error = error.message || 'Failed to load vendors';
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Refresh all data
|
||||
*/
|
||||
async refreshData() {
|
||||
await this.loadVendors();
|
||||
this.successMessage = 'Data refreshed';
|
||||
setTimeout(() => this.successMessage = '', 3000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Open configuration modal for a vendor
|
||||
*/
|
||||
async openConfigModal(vendor) {
|
||||
this.selectedVendor = vendor;
|
||||
this.vendorCredentials = null;
|
||||
this.configForm = {
|
||||
api_key: '',
|
||||
auto_sync_enabled: vendor.auto_sync_enabled || false,
|
||||
sync_interval_minutes: 15
|
||||
};
|
||||
this.showApiKey = false;
|
||||
this.showConfigModal = true;
|
||||
|
||||
// Load existing credentials if configured
|
||||
if (vendor.is_configured) {
|
||||
try {
|
||||
const response = await apiClient.get(`/admin/letzshop/vendors/${vendor.vendor_id}/credentials`);
|
||||
this.vendorCredentials = response;
|
||||
this.configForm.auto_sync_enabled = response.auto_sync_enabled;
|
||||
this.configForm.sync_interval_minutes = response.sync_interval_minutes || 15;
|
||||
} catch (error) {
|
||||
if (error.status !== 404) {
|
||||
letzshopLog.error('Failed to load credentials:', error);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Save vendor configuration
|
||||
*/
|
||||
async saveVendorConfig() {
|
||||
if (!this.configForm.api_key && !this.vendorCredentials) {
|
||||
this.error = 'Please enter an API key';
|
||||
return;
|
||||
}
|
||||
|
||||
this.savingConfig = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const payload = {
|
||||
auto_sync_enabled: this.configForm.auto_sync_enabled,
|
||||
sync_interval_minutes: parseInt(this.configForm.sync_interval_minutes)
|
||||
};
|
||||
|
||||
if (this.configForm.api_key) {
|
||||
payload.api_key = this.configForm.api_key;
|
||||
}
|
||||
|
||||
await apiClient.post(
|
||||
`/admin/letzshop/vendors/${this.selectedVendor.vendor_id}/credentials`,
|
||||
payload
|
||||
);
|
||||
|
||||
this.showConfigModal = false;
|
||||
this.successMessage = 'Configuration saved successfully';
|
||||
await this.loadVendors();
|
||||
} catch (error) {
|
||||
letzshopLog.error('Failed to save config:', error);
|
||||
this.error = error.message || 'Failed to save configuration';
|
||||
} finally {
|
||||
this.savingConfig = false;
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Delete vendor configuration
|
||||
*/
|
||||
async deleteVendorConfig() {
|
||||
if (!confirm('Are you sure you want to remove Letzshop configuration for this vendor?')) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await apiClient.delete(`/admin/letzshop/vendors/${this.selectedVendor.vendor_id}/credentials`);
|
||||
this.showConfigModal = false;
|
||||
this.successMessage = 'Configuration removed';
|
||||
await this.loadVendors();
|
||||
} catch (error) {
|
||||
letzshopLog.error('Failed to delete config:', error);
|
||||
this.error = error.message || 'Failed to remove configuration';
|
||||
}
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Test connection for a vendor
|
||||
*/
|
||||
async testConnection(vendor) {
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const response = await apiClient.post(`/admin/letzshop/vendors/${vendor.vendor_id}/test`);
|
||||
|
||||
if (response.success) {
|
||||
this.successMessage = `Connection successful for ${vendor.vendor_name} (${response.response_time_ms?.toFixed(0)}ms)`;
|
||||
} else {
|
||||
this.error = response.error_details || 'Connection failed';
|
||||
}
|
||||
} catch (error) {
|
||||
letzshopLog.error('Connection test failed:', error);
|
||||
this.error = error.message || 'Connection test failed';
|
||||
}
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Trigger sync for a vendor
|
||||
*/
|
||||
async triggerSync(vendor) {
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const response = await apiClient.post(`/admin/letzshop/vendors/${vendor.vendor_id}/sync`);
|
||||
|
||||
if (response.success) {
|
||||
this.successMessage = response.message || 'Sync completed';
|
||||
await this.loadVendors();
|
||||
} else {
|
||||
this.error = response.message || 'Sync failed';
|
||||
}
|
||||
} catch (error) {
|
||||
letzshopLog.error('Sync failed:', error);
|
||||
this.error = error.message || 'Sync failed';
|
||||
}
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
},
|
||||
|
||||
/**
|
||||
* View orders for a vendor
|
||||
*/
|
||||
async viewOrders(vendor) {
|
||||
this.selectedVendor = vendor;
|
||||
this.vendorOrders = [];
|
||||
this.loadingOrders = true;
|
||||
this.showOrdersModal = true;
|
||||
|
||||
try {
|
||||
const response = await apiClient.get(`/admin/letzshop/vendors/${vendor.vendor_id}/orders?limit=100`);
|
||||
this.vendorOrders = response.orders || [];
|
||||
} catch (error) {
|
||||
letzshopLog.error('Failed to load orders:', error);
|
||||
this.error = error.message || 'Failed to load orders';
|
||||
} finally {
|
||||
this.loadingOrders = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Format date for display
|
||||
*/
|
||||
formatDate(dateStr) {
|
||||
if (!dateStr) return 'N/A';
|
||||
const date = new Date(dateStr);
|
||||
return date.toLocaleDateString() + ' ' + date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
letzshopLog.info('Module loaded');
|
||||
1604
app/modules/marketplace/static/admin/js/marketplace-letzshop.js
Normal file
1604
app/modules/marketplace/static/admin/js/marketplace-letzshop.js
Normal file
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,229 @@
|
||||
// noqa: js-006 - async init pattern is safe, loadData has try/catch
|
||||
// static/admin/js/marketplace-product-detail.js
|
||||
/**
|
||||
* Admin marketplace product detail page logic
|
||||
* View and manage individual marketplace products
|
||||
*/
|
||||
|
||||
const adminMarketplaceProductDetailLog = window.LogConfig.loggers.adminMarketplaceProductDetail ||
|
||||
window.LogConfig.createLogger('adminMarketplaceProductDetail', false);
|
||||
|
||||
adminMarketplaceProductDetailLog.info('Loading...');
|
||||
|
||||
function adminMarketplaceProductDetail() {
|
||||
adminMarketplaceProductDetailLog.info('adminMarketplaceProductDetail() called');
|
||||
|
||||
// Extract product ID from URL
|
||||
const pathParts = window.location.pathname.split('/');
|
||||
const productId = parseInt(pathParts[pathParts.length - 1]);
|
||||
|
||||
return {
|
||||
// Inherit base layout state
|
||||
...data(),
|
||||
|
||||
// Set page identifier
|
||||
currentPage: 'marketplace-products',
|
||||
|
||||
// Product ID from URL
|
||||
productId: productId,
|
||||
|
||||
// Loading states
|
||||
loading: true,
|
||||
error: '',
|
||||
|
||||
// Product data
|
||||
product: null,
|
||||
|
||||
// Copy to vendor modal state
|
||||
showCopyModal: false,
|
||||
copying: false,
|
||||
copyForm: {
|
||||
vendor_id: '',
|
||||
skip_existing: true
|
||||
},
|
||||
targetVendors: [],
|
||||
|
||||
async init() {
|
||||
adminMarketplaceProductDetailLog.info('Marketplace Product Detail init() called, ID:', this.productId);
|
||||
|
||||
// Guard against multiple initialization
|
||||
if (window._adminMarketplaceProductDetailInitialized) {
|
||||
adminMarketplaceProductDetailLog.warn('Already initialized, skipping');
|
||||
return;
|
||||
}
|
||||
window._adminMarketplaceProductDetailInitialized = true;
|
||||
|
||||
// Load data in parallel
|
||||
await Promise.all([
|
||||
this.loadProduct(),
|
||||
this.loadTargetVendors()
|
||||
]);
|
||||
|
||||
adminMarketplaceProductDetailLog.info('Marketplace Product Detail initialization complete');
|
||||
},
|
||||
|
||||
/**
|
||||
* Load product details
|
||||
*/
|
||||
async loadProduct() {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const response = await apiClient.get(`/admin/products/${this.productId}`);
|
||||
this.product = response;
|
||||
adminMarketplaceProductDetailLog.info('Loaded product:', this.product.marketplace_product_id);
|
||||
} catch (error) {
|
||||
adminMarketplaceProductDetailLog.error('Failed to load product:', error);
|
||||
this.error = error.message || 'Failed to load product details';
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load target vendors for copy functionality
|
||||
*/
|
||||
async loadTargetVendors() {
|
||||
try {
|
||||
const response = await apiClient.get('/admin/vendors?is_active=true&limit=500');
|
||||
this.targetVendors = response.vendors || [];
|
||||
adminMarketplaceProductDetailLog.info('Loaded target vendors:', this.targetVendors.length);
|
||||
} catch (error) {
|
||||
adminMarketplaceProductDetailLog.error('Failed to load target vendors:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Open copy modal
|
||||
*/
|
||||
openCopyModal() {
|
||||
this.copyForm.vendor_id = '';
|
||||
this.showCopyModal = true;
|
||||
adminMarketplaceProductDetailLog.info('Opening copy modal for product:', this.productId);
|
||||
},
|
||||
|
||||
/**
|
||||
* Execute copy to vendor catalog
|
||||
*/
|
||||
async executeCopyToVendor() {
|
||||
if (!this.copyForm.vendor_id) {
|
||||
this.error = 'Please select a target vendor';
|
||||
return;
|
||||
}
|
||||
|
||||
this.copying = true;
|
||||
try {
|
||||
const response = await apiClient.post('/admin/products/copy-to-vendor', {
|
||||
marketplace_product_ids: [this.productId],
|
||||
vendor_id: parseInt(this.copyForm.vendor_id),
|
||||
skip_existing: this.copyForm.skip_existing
|
||||
});
|
||||
|
||||
adminMarketplaceProductDetailLog.info('Copy result:', response);
|
||||
|
||||
// Show success message
|
||||
const copied = response.copied || 0;
|
||||
const skipped = response.skipped || 0;
|
||||
const failed = response.failed || 0;
|
||||
|
||||
let message;
|
||||
if (copied > 0) {
|
||||
message = 'Product successfully copied to vendor catalog.';
|
||||
} else if (skipped > 0) {
|
||||
message = 'Product already exists in the vendor catalog.';
|
||||
} else {
|
||||
message = 'Failed to copy product.';
|
||||
}
|
||||
|
||||
// Close modal
|
||||
this.showCopyModal = false;
|
||||
|
||||
// Show notification
|
||||
Utils.showToast(message, copied > 0 ? 'success' : 'warning');
|
||||
} catch (error) {
|
||||
adminMarketplaceProductDetailLog.error('Failed to copy product:', error);
|
||||
this.error = error.message || 'Failed to copy product to vendor catalog';
|
||||
} finally {
|
||||
this.copying = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Format price for display
|
||||
*/
|
||||
formatPrice(price, currency = 'EUR') {
|
||||
if (price === null || price === undefined) return '-';
|
||||
return new Intl.NumberFormat('en-US', {
|
||||
style: 'currency',
|
||||
currency: currency || 'EUR'
|
||||
}).format(price);
|
||||
},
|
||||
|
||||
/**
|
||||
* Format date for display
|
||||
*/
|
||||
formatDate(dateString) {
|
||||
if (!dateString) return '-';
|
||||
try {
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleDateString('en-US', {
|
||||
year: 'numeric',
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
});
|
||||
} catch (e) {
|
||||
return dateString;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Get full language name from ISO code (native names for Luxembourg languages)
|
||||
*/
|
||||
getLanguageName(code) {
|
||||
const languages = {
|
||||
'en': 'English',
|
||||
'de': 'Deutsch',
|
||||
'fr': 'Français',
|
||||
'lb': 'Lëtzebuergesch',
|
||||
'es': 'Español',
|
||||
'it': 'Italiano',
|
||||
'nl': 'Nederlands',
|
||||
'pt': 'Português',
|
||||
'pl': 'Polski',
|
||||
'cs': 'Čeština',
|
||||
'da': 'Dansk',
|
||||
'sv': 'Svenska',
|
||||
'fi': 'Suomi',
|
||||
'no': 'Norsk',
|
||||
'hu': 'Hungarian',
|
||||
'ro': 'Romanian',
|
||||
'bg': 'Bulgarian',
|
||||
'el': 'Greek',
|
||||
'sk': 'Slovak',
|
||||
'sl': 'Slovenian',
|
||||
'hr': 'Croatian',
|
||||
'lt': 'Lithuanian',
|
||||
'lv': 'Latvian',
|
||||
'et': 'Estonian'
|
||||
};
|
||||
return languages[code?.toLowerCase()] || '';
|
||||
},
|
||||
|
||||
/**
|
||||
* Copy text to clipboard
|
||||
*/
|
||||
async copyToClipboard(text) {
|
||||
if (!text) return;
|
||||
try {
|
||||
await navigator.clipboard.writeText(text);
|
||||
Utils.showToast('Copied to clipboard', 'success');
|
||||
} catch (err) {
|
||||
adminMarketplaceProductDetailLog.error('Failed to copy to clipboard:', err);
|
||||
Utils.showToast('Failed to copy to clipboard', 'error');
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
554
app/modules/marketplace/static/admin/js/marketplace-products.js
Normal file
554
app/modules/marketplace/static/admin/js/marketplace-products.js
Normal file
@@ -0,0 +1,554 @@
|
||||
// noqa: js-006 - async init pattern is safe, loadData has try/catch
|
||||
// static/admin/js/marketplace-products.js
|
||||
/**
|
||||
* Admin marketplace products page logic
|
||||
* Browse the master product repository (imported from external sources)
|
||||
*/
|
||||
|
||||
const adminMarketplaceProductsLog = window.LogConfig.loggers.adminMarketplaceProducts ||
|
||||
window.LogConfig.createLogger('adminMarketplaceProducts', false);
|
||||
|
||||
adminMarketplaceProductsLog.info('Loading...');
|
||||
|
||||
function adminMarketplaceProducts() {
|
||||
adminMarketplaceProductsLog.info('adminMarketplaceProducts() called');
|
||||
|
||||
return {
|
||||
// Inherit base layout state
|
||||
...data(),
|
||||
|
||||
// Set page identifier
|
||||
currentPage: 'marketplace-products',
|
||||
|
||||
// Loading states
|
||||
loading: true,
|
||||
error: '',
|
||||
|
||||
// Products data
|
||||
products: [],
|
||||
stats: {
|
||||
total: 0,
|
||||
active: 0,
|
||||
inactive: 0,
|
||||
digital: 0,
|
||||
physical: 0,
|
||||
by_marketplace: {}
|
||||
},
|
||||
|
||||
// Filters
|
||||
filters: {
|
||||
search: '',
|
||||
marketplace: '',
|
||||
vendor_name: '',
|
||||
is_active: '',
|
||||
is_digital: ''
|
||||
},
|
||||
|
||||
// Selected vendor (for prominent display and filtering)
|
||||
selectedVendor: null,
|
||||
|
||||
// Tom Select instance
|
||||
vendorSelectInstance: null,
|
||||
|
||||
// Available marketplaces for filter dropdown
|
||||
marketplaces: [],
|
||||
|
||||
// Pagination
|
||||
pagination: {
|
||||
page: 1,
|
||||
per_page: 20,
|
||||
total: 0,
|
||||
pages: 0
|
||||
},
|
||||
|
||||
// Selection state
|
||||
selectedProducts: [],
|
||||
|
||||
// Copy to vendor modal state
|
||||
showCopyModal: false,
|
||||
copying: false,
|
||||
copyForm: {
|
||||
vendor_id: '',
|
||||
skip_existing: true
|
||||
},
|
||||
targetVendors: [],
|
||||
|
||||
// Debounce timer
|
||||
searchTimeout: null,
|
||||
|
||||
// Computed: Total pages
|
||||
get totalPages() {
|
||||
return this.pagination.pages;
|
||||
},
|
||||
|
||||
// Computed: Start index for pagination display
|
||||
get startIndex() {
|
||||
if (this.pagination.total === 0) return 0;
|
||||
return (this.pagination.page - 1) * this.pagination.per_page + 1;
|
||||
},
|
||||
|
||||
// Computed: End index for pagination display
|
||||
get endIndex() {
|
||||
const end = this.pagination.page * this.pagination.per_page;
|
||||
return end > this.pagination.total ? this.pagination.total : end;
|
||||
},
|
||||
|
||||
// Computed: Page numbers for pagination
|
||||
get pageNumbers() {
|
||||
const pages = [];
|
||||
const totalPages = this.totalPages;
|
||||
const current = this.pagination.page;
|
||||
|
||||
if (totalPages <= 7) {
|
||||
for (let i = 1; i <= totalPages; i++) {
|
||||
pages.push(i);
|
||||
}
|
||||
} else {
|
||||
pages.push(1);
|
||||
if (current > 3) {
|
||||
pages.push('...');
|
||||
}
|
||||
const start = Math.max(2, current - 1);
|
||||
const end = Math.min(totalPages - 1, current + 1);
|
||||
for (let i = start; i <= end; i++) {
|
||||
pages.push(i);
|
||||
}
|
||||
if (current < totalPages - 2) {
|
||||
pages.push('...');
|
||||
}
|
||||
pages.push(totalPages);
|
||||
}
|
||||
return pages;
|
||||
},
|
||||
|
||||
async init() {
|
||||
adminMarketplaceProductsLog.info('Marketplace Products init() called');
|
||||
|
||||
// Guard against multiple initialization
|
||||
if (window._adminMarketplaceProductsInitialized) {
|
||||
adminMarketplaceProductsLog.warn('Already initialized, skipping');
|
||||
return;
|
||||
}
|
||||
window._adminMarketplaceProductsInitialized = true;
|
||||
|
||||
// Load platform settings for rows per page
|
||||
if (window.PlatformSettings) {
|
||||
this.pagination.per_page = await window.PlatformSettings.getRowsPerPage();
|
||||
}
|
||||
|
||||
// Initialize Tom Select for vendor filter
|
||||
this.initVendorSelect();
|
||||
|
||||
// Check localStorage for saved vendor
|
||||
const savedVendorId = localStorage.getItem('marketplace_products_selected_vendor_id');
|
||||
if (savedVendorId) {
|
||||
adminMarketplaceProductsLog.info('Restoring saved vendor:', savedVendorId);
|
||||
// Restore vendor after a short delay to ensure TomSelect is ready
|
||||
setTimeout(async () => {
|
||||
await this.restoreSavedVendor(parseInt(savedVendorId));
|
||||
}, 200);
|
||||
// Load other data but not products (restoreSavedVendor will do that)
|
||||
await Promise.all([
|
||||
this.loadStats(),
|
||||
this.loadMarketplaces(),
|
||||
this.loadTargetVendors()
|
||||
]);
|
||||
} else {
|
||||
// No saved vendor - load all data including unfiltered products
|
||||
await Promise.all([
|
||||
this.loadStats(),
|
||||
this.loadMarketplaces(),
|
||||
this.loadTargetVendors(),
|
||||
this.loadProducts()
|
||||
]);
|
||||
}
|
||||
|
||||
adminMarketplaceProductsLog.info('Marketplace Products initialization complete');
|
||||
},
|
||||
|
||||
/**
|
||||
* Restore saved vendor from localStorage
|
||||
*/
|
||||
async restoreSavedVendor(vendorId) {
|
||||
try {
|
||||
const vendor = await apiClient.get(`/admin/vendors/${vendorId}`);
|
||||
if (this.vendorSelectInstance && vendor) {
|
||||
// Add the vendor as an option and select it
|
||||
this.vendorSelectInstance.addOption({
|
||||
id: vendor.id,
|
||||
name: vendor.name,
|
||||
vendor_code: vendor.vendor_code
|
||||
});
|
||||
this.vendorSelectInstance.setValue(vendor.id, true);
|
||||
|
||||
// Set the filter state
|
||||
this.selectedVendor = vendor;
|
||||
this.filters.vendor_name = vendor.name;
|
||||
|
||||
adminMarketplaceProductsLog.info('Restored vendor:', vendor.name);
|
||||
|
||||
// Load products with the vendor filter applied
|
||||
await this.loadProducts();
|
||||
}
|
||||
} catch (error) {
|
||||
adminMarketplaceProductsLog.warn('Failed to restore saved vendor, clearing localStorage:', error);
|
||||
localStorage.removeItem('marketplace_products_selected_vendor_id');
|
||||
// Load unfiltered products as fallback
|
||||
await this.loadProducts();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Initialize Tom Select for vendor autocomplete
|
||||
*/
|
||||
initVendorSelect() {
|
||||
const selectEl = this.$refs.vendorSelect;
|
||||
if (!selectEl) {
|
||||
adminMarketplaceProductsLog.warn('Vendor select element not found');
|
||||
return;
|
||||
}
|
||||
|
||||
// Wait for Tom Select to be available
|
||||
if (typeof TomSelect === 'undefined') {
|
||||
adminMarketplaceProductsLog.warn('TomSelect not loaded, retrying in 100ms');
|
||||
setTimeout(() => this.initVendorSelect(), 100);
|
||||
return;
|
||||
}
|
||||
|
||||
this.vendorSelectInstance = new TomSelect(selectEl, {
|
||||
valueField: 'id',
|
||||
labelField: 'name',
|
||||
searchField: ['name', 'vendor_code'],
|
||||
placeholder: 'Filter by vendor...',
|
||||
allowEmptyOption: true,
|
||||
load: async (query, callback) => {
|
||||
try {
|
||||
const response = await apiClient.get('/admin/vendors', {
|
||||
search: query,
|
||||
limit: 50
|
||||
});
|
||||
callback(response.vendors || []);
|
||||
} catch (error) {
|
||||
adminMarketplaceProductsLog.error('Failed to search vendors:', error);
|
||||
callback([]);
|
||||
}
|
||||
},
|
||||
render: {
|
||||
option: (data, escape) => {
|
||||
return `<div class="flex items-center justify-between py-1">
|
||||
<span>${escape(data.name)}</span>
|
||||
<span class="text-xs text-gray-400 font-mono">${escape(data.vendor_code || '')}</span>
|
||||
</div>`;
|
||||
},
|
||||
item: (data, escape) => {
|
||||
return `<div>${escape(data.name)}</div>`;
|
||||
}
|
||||
},
|
||||
onChange: (value) => {
|
||||
if (value) {
|
||||
const vendor = this.vendorSelectInstance.options[value];
|
||||
this.selectedVendor = vendor;
|
||||
this.filters.vendor_name = vendor.name;
|
||||
// Save to localStorage
|
||||
localStorage.setItem('marketplace_products_selected_vendor_id', value.toString());
|
||||
} else {
|
||||
this.selectedVendor = null;
|
||||
this.filters.vendor_name = '';
|
||||
// Clear from localStorage
|
||||
localStorage.removeItem('marketplace_products_selected_vendor_id');
|
||||
}
|
||||
this.pagination.page = 1;
|
||||
this.loadProducts();
|
||||
this.loadStats();
|
||||
}
|
||||
});
|
||||
|
||||
adminMarketplaceProductsLog.info('Vendor select initialized');
|
||||
},
|
||||
|
||||
/**
|
||||
* Clear vendor filter
|
||||
*/
|
||||
clearVendorFilter() {
|
||||
if (this.vendorSelectInstance) {
|
||||
this.vendorSelectInstance.clear();
|
||||
}
|
||||
this.selectedVendor = null;
|
||||
this.filters.vendor_name = '';
|
||||
// Clear from localStorage
|
||||
localStorage.removeItem('marketplace_products_selected_vendor_id');
|
||||
this.pagination.page = 1;
|
||||
this.loadProducts();
|
||||
this.loadStats();
|
||||
},
|
||||
|
||||
/**
|
||||
* Load product statistics
|
||||
*/
|
||||
async loadStats() {
|
||||
try {
|
||||
const params = new URLSearchParams();
|
||||
if (this.filters.marketplace) {
|
||||
params.append('marketplace', this.filters.marketplace);
|
||||
}
|
||||
if (this.filters.vendor_name) {
|
||||
params.append('vendor_name', this.filters.vendor_name);
|
||||
}
|
||||
const url = params.toString() ? `/admin/products/stats?${params}` : '/admin/products/stats';
|
||||
const response = await apiClient.get(url);
|
||||
this.stats = response;
|
||||
adminMarketplaceProductsLog.info('Loaded stats:', this.stats);
|
||||
} catch (error) {
|
||||
adminMarketplaceProductsLog.error('Failed to load stats:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load available marketplaces for filter
|
||||
*/
|
||||
async loadMarketplaces() {
|
||||
try {
|
||||
const response = await apiClient.get('/admin/products/marketplaces');
|
||||
this.marketplaces = response.marketplaces || [];
|
||||
adminMarketplaceProductsLog.info('Loaded marketplaces:', this.marketplaces);
|
||||
} catch (error) {
|
||||
adminMarketplaceProductsLog.error('Failed to load marketplaces:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load target vendors for copy functionality (actual vendor accounts)
|
||||
*/
|
||||
async loadTargetVendors() {
|
||||
try {
|
||||
const response = await apiClient.get('/admin/vendors?is_active=true&limit=500');
|
||||
this.targetVendors = response.vendors || [];
|
||||
adminMarketplaceProductsLog.info('Loaded target vendors:', this.targetVendors.length);
|
||||
} catch (error) {
|
||||
adminMarketplaceProductsLog.error('Failed to load target vendors:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load products with filtering and pagination
|
||||
*/
|
||||
async loadProducts() {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const params = new URLSearchParams({
|
||||
skip: (this.pagination.page - 1) * this.pagination.per_page,
|
||||
limit: this.pagination.per_page
|
||||
});
|
||||
|
||||
// Add filters
|
||||
if (this.filters.search) {
|
||||
params.append('search', this.filters.search);
|
||||
}
|
||||
if (this.filters.marketplace) {
|
||||
params.append('marketplace', this.filters.marketplace);
|
||||
}
|
||||
if (this.filters.vendor_name) {
|
||||
params.append('vendor_name', this.filters.vendor_name);
|
||||
}
|
||||
if (this.filters.is_active !== '') {
|
||||
params.append('is_active', this.filters.is_active);
|
||||
}
|
||||
if (this.filters.is_digital !== '') {
|
||||
params.append('is_digital', this.filters.is_digital);
|
||||
}
|
||||
|
||||
const response = await apiClient.get(`/admin/products?${params.toString()}`);
|
||||
|
||||
this.products = response.products || [];
|
||||
this.pagination.total = response.total || 0;
|
||||
this.pagination.pages = Math.ceil(this.pagination.total / this.pagination.per_page);
|
||||
|
||||
adminMarketplaceProductsLog.info('Loaded products:', this.products.length, 'of', this.pagination.total);
|
||||
} catch (error) {
|
||||
adminMarketplaceProductsLog.error('Failed to load products:', error);
|
||||
this.error = error.message || 'Failed to load products';
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Debounced search handler
|
||||
*/
|
||||
debouncedSearch() {
|
||||
clearTimeout(this.searchTimeout);
|
||||
this.searchTimeout = setTimeout(() => {
|
||||
this.pagination.page = 1;
|
||||
this.loadProducts();
|
||||
}, 300);
|
||||
},
|
||||
|
||||
/**
|
||||
* Refresh products list
|
||||
*/
|
||||
async refresh() {
|
||||
await Promise.all([
|
||||
this.loadStats(),
|
||||
this.loadProducts()
|
||||
]);
|
||||
},
|
||||
|
||||
// ─────────────────────────────────────────────────────────────────
|
||||
// Selection Management
|
||||
// ─────────────────────────────────────────────────────────────────
|
||||
|
||||
/**
|
||||
* Check if a product is selected
|
||||
*/
|
||||
isSelected(productId) {
|
||||
return this.selectedProducts.includes(productId);
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle selection for a single product
|
||||
*/
|
||||
toggleSelection(productId) {
|
||||
const index = this.selectedProducts.indexOf(productId);
|
||||
if (index === -1) {
|
||||
this.selectedProducts.push(productId);
|
||||
} else {
|
||||
this.selectedProducts.splice(index, 1);
|
||||
}
|
||||
adminMarketplaceProductsLog.info('Selection changed:', this.selectedProducts.length, 'selected');
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle select all products on current page
|
||||
*/
|
||||
toggleSelectAll(event) {
|
||||
if (event.target.checked) {
|
||||
// Select all on current page
|
||||
this.selectedProducts = this.products.map(p => p.id);
|
||||
} else {
|
||||
// Deselect all
|
||||
this.selectedProducts = [];
|
||||
}
|
||||
adminMarketplaceProductsLog.info('Select all toggled:', this.selectedProducts.length, 'selected');
|
||||
},
|
||||
|
||||
/**
|
||||
* Clear all selections
|
||||
*/
|
||||
clearSelection() {
|
||||
this.selectedProducts = [];
|
||||
adminMarketplaceProductsLog.info('Selection cleared');
|
||||
},
|
||||
|
||||
// ─────────────────────────────────────────────────────────────────
|
||||
// Copy to Vendor Catalog
|
||||
// ─────────────────────────────────────────────────────────────────
|
||||
|
||||
/**
|
||||
* Open copy modal for selected products
|
||||
*/
|
||||
openCopyToVendorModal() {
|
||||
if (this.selectedProducts.length === 0) {
|
||||
this.error = 'Please select at least one product to copy';
|
||||
return;
|
||||
}
|
||||
this.copyForm.vendor_id = '';
|
||||
this.showCopyModal = true;
|
||||
adminMarketplaceProductsLog.info('Opening copy modal for', this.selectedProducts.length, 'products');
|
||||
},
|
||||
|
||||
/**
|
||||
* Copy single product - convenience method for action button
|
||||
*/
|
||||
copySingleProduct(productId) {
|
||||
this.selectedProducts = [productId];
|
||||
this.openCopyToVendorModal();
|
||||
},
|
||||
|
||||
/**
|
||||
* Execute copy to vendor catalog
|
||||
*/
|
||||
async executeCopyToVendor() {
|
||||
if (!this.copyForm.vendor_id) {
|
||||
this.error = 'Please select a target vendor';
|
||||
return;
|
||||
}
|
||||
|
||||
this.copying = true;
|
||||
try {
|
||||
const response = await apiClient.post('/admin/products/copy-to-vendor', {
|
||||
marketplace_product_ids: this.selectedProducts,
|
||||
vendor_id: parseInt(this.copyForm.vendor_id),
|
||||
skip_existing: this.copyForm.skip_existing
|
||||
});
|
||||
|
||||
adminMarketplaceProductsLog.info('Copy result:', response);
|
||||
|
||||
// Show success message
|
||||
const copied = response.copied || 0;
|
||||
const skipped = response.skipped || 0;
|
||||
const failed = response.failed || 0;
|
||||
|
||||
let message = `Successfully copied ${copied} product(s) to vendor catalog.`;
|
||||
if (skipped > 0) message += ` ${skipped} already existed.`;
|
||||
if (failed > 0) message += ` ${failed} failed.`;
|
||||
|
||||
// Close modal and clear selection
|
||||
this.showCopyModal = false;
|
||||
this.clearSelection();
|
||||
|
||||
// Show success notification
|
||||
Utils.showToast(message, 'success');
|
||||
} catch (error) {
|
||||
adminMarketplaceProductsLog.error('Failed to copy products:', error);
|
||||
const errorMsg = error.message || 'Failed to copy products to vendor catalog';
|
||||
this.error = errorMsg;
|
||||
Utils.showToast(errorMsg, 'error');
|
||||
} finally {
|
||||
this.copying = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Format price for display
|
||||
*/
|
||||
formatPrice(price, currency = 'EUR') {
|
||||
if (price === null || price === undefined) return '-';
|
||||
return new Intl.NumberFormat('en-US', {
|
||||
style: 'currency',
|
||||
currency: currency || 'EUR'
|
||||
}).format(price);
|
||||
},
|
||||
|
||||
/**
|
||||
* Pagination: Previous page
|
||||
*/
|
||||
previousPage() {
|
||||
if (this.pagination.page > 1) {
|
||||
this.pagination.page--;
|
||||
this.loadProducts();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Pagination: Next page
|
||||
*/
|
||||
nextPage() {
|
||||
if (this.pagination.page < this.totalPages) {
|
||||
this.pagination.page++;
|
||||
this.loadProducts();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Pagination: Go to specific page
|
||||
*/
|
||||
goToPage(pageNum) {
|
||||
if (pageNum !== '...' && pageNum >= 1 && pageNum <= this.totalPages) {
|
||||
this.pagination.page = pageNum;
|
||||
this.loadProducts();
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
533
app/modules/marketplace/static/admin/js/marketplace.js
Normal file
533
app/modules/marketplace/static/admin/js/marketplace.js
Normal file
@@ -0,0 +1,533 @@
|
||||
// noqa: js-006 - async init pattern is safe, loadData has try/catch
|
||||
// static/admin/js/marketplace.js
|
||||
/**
|
||||
* Admin marketplace import page logic
|
||||
*/
|
||||
|
||||
// ✅ Use centralized logger
|
||||
const adminMarketplaceLog = window.LogConfig.loggers.marketplace;
|
||||
|
||||
adminMarketplaceLog.info('Loading...');
|
||||
|
||||
function adminMarketplace() {
|
||||
adminMarketplaceLog.info('adminMarketplace() called');
|
||||
|
||||
return {
|
||||
// ✅ Inherit base layout state
|
||||
...data(),
|
||||
|
||||
// ✅ Set page identifier
|
||||
currentPage: 'marketplace',
|
||||
|
||||
// Loading states
|
||||
loading: false,
|
||||
importing: false,
|
||||
error: '',
|
||||
successMessage: '',
|
||||
|
||||
// Active import tab (marketplace selector)
|
||||
activeImportTab: 'letzshop',
|
||||
|
||||
// Vendors list
|
||||
vendors: [],
|
||||
selectedVendor: null,
|
||||
|
||||
// Import form
|
||||
importForm: {
|
||||
vendor_id: '',
|
||||
csv_url: '',
|
||||
marketplace: 'Letzshop',
|
||||
language: 'fr',
|
||||
batch_size: 1000
|
||||
},
|
||||
|
||||
// Filters
|
||||
filters: {
|
||||
vendor_id: '',
|
||||
status: '',
|
||||
marketplace: ''
|
||||
},
|
||||
|
||||
// Import jobs
|
||||
jobs: [],
|
||||
pagination: {
|
||||
page: 1,
|
||||
per_page: 20,
|
||||
total: 0,
|
||||
pages: 0
|
||||
},
|
||||
|
||||
// Modal state
|
||||
showJobModal: false,
|
||||
selectedJob: null,
|
||||
|
||||
// Auto-refresh for active jobs
|
||||
autoRefreshInterval: null,
|
||||
|
||||
// Computed: Total pages
|
||||
get totalPages() {
|
||||
return this.pagination.pages;
|
||||
},
|
||||
|
||||
// Computed: Start index for pagination display
|
||||
get startIndex() {
|
||||
if (this.pagination.total === 0) return 0;
|
||||
return (this.pagination.page - 1) * this.pagination.per_page + 1;
|
||||
},
|
||||
|
||||
// Computed: End index for pagination display
|
||||
get endIndex() {
|
||||
const end = this.pagination.page * this.pagination.per_page;
|
||||
return end > this.pagination.total ? this.pagination.total : end;
|
||||
},
|
||||
|
||||
// Computed: Page numbers for pagination
|
||||
get pageNumbers() {
|
||||
const pages = [];
|
||||
const totalPages = this.totalPages;
|
||||
const current = this.pagination.page;
|
||||
|
||||
if (totalPages <= 7) {
|
||||
for (let i = 1; i <= totalPages; i++) {
|
||||
pages.push(i);
|
||||
}
|
||||
} else {
|
||||
pages.push(1);
|
||||
if (current > 3) {
|
||||
pages.push('...');
|
||||
}
|
||||
const start = Math.max(2, current - 1);
|
||||
const end = Math.min(totalPages - 1, current + 1);
|
||||
for (let i = start; i <= end; i++) {
|
||||
pages.push(i);
|
||||
}
|
||||
if (current < totalPages - 2) {
|
||||
pages.push('...');
|
||||
}
|
||||
pages.push(totalPages);
|
||||
}
|
||||
return pages;
|
||||
},
|
||||
|
||||
async init() {
|
||||
adminMarketplaceLog.info('Marketplace init() called');
|
||||
|
||||
// Guard against multiple initialization
|
||||
if (window._adminMarketplaceInitialized) {
|
||||
adminMarketplaceLog.warn('Already initialized, skipping');
|
||||
return;
|
||||
}
|
||||
window._adminMarketplaceInitialized = true;
|
||||
|
||||
// Load platform settings for rows per page
|
||||
if (window.PlatformSettings) {
|
||||
this.pagination.per_page = await window.PlatformSettings.getRowsPerPage();
|
||||
}
|
||||
|
||||
// Ensure form defaults are set (in case spread didn't work)
|
||||
if (!this.importForm.marketplace) {
|
||||
this.importForm.marketplace = 'Letzshop';
|
||||
}
|
||||
if (!this.importForm.batch_size) {
|
||||
this.importForm.batch_size = 1000;
|
||||
}
|
||||
if (!this.importForm.language) {
|
||||
this.importForm.language = 'fr';
|
||||
}
|
||||
|
||||
adminMarketplaceLog.info('Form defaults:', this.importForm);
|
||||
|
||||
await this.loadVendors();
|
||||
await this.loadJobs();
|
||||
|
||||
// Auto-refresh active jobs every 10 seconds
|
||||
this.startAutoRefresh();
|
||||
|
||||
adminMarketplaceLog.info('Marketplace initialization complete');
|
||||
},
|
||||
|
||||
/**
|
||||
* Load all vendors for dropdown
|
||||
*/
|
||||
async loadVendors() {
|
||||
try {
|
||||
const response = await apiClient.get('/admin/vendors?limit=1000');
|
||||
this.vendors = response.vendors || [];
|
||||
adminMarketplaceLog.info('Loaded vendors:', this.vendors.length);
|
||||
} catch (error) {
|
||||
adminMarketplaceLog.error('Failed to load vendors:', error);
|
||||
this.error = 'Failed to load vendors: ' + (error.message || 'Unknown error');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Handle vendor selection change
|
||||
*/
|
||||
onVendorChange() {
|
||||
const vendorId = parseInt(this.importForm.vendor_id);
|
||||
this.selectedVendor = this.vendors.find(v => v.id === vendorId) || null;
|
||||
adminMarketplaceLog.info('Selected vendor:', this.selectedVendor);
|
||||
|
||||
// Auto-populate CSV URL if marketplace is Letzshop
|
||||
this.autoPopulateCSV();
|
||||
},
|
||||
|
||||
/**
|
||||
* Handle language selection change
|
||||
*/
|
||||
onLanguageChange() {
|
||||
// Auto-populate CSV URL if marketplace is Letzshop
|
||||
this.autoPopulateCSV();
|
||||
},
|
||||
|
||||
/**
|
||||
* Auto-populate CSV URL based on selected vendor and language
|
||||
*/
|
||||
autoPopulateCSV() {
|
||||
// Only auto-populate for Letzshop marketplace
|
||||
if (this.importForm.marketplace !== 'Letzshop') return;
|
||||
if (!this.selectedVendor) return;
|
||||
|
||||
const urlMap = {
|
||||
'fr': this.selectedVendor.letzshop_csv_url_fr,
|
||||
'en': this.selectedVendor.letzshop_csv_url_en,
|
||||
'de': this.selectedVendor.letzshop_csv_url_de
|
||||
};
|
||||
|
||||
const url = urlMap[this.importForm.language];
|
||||
if (url) {
|
||||
this.importForm.csv_url = url;
|
||||
adminMarketplaceLog.info('Auto-populated CSV URL:', this.importForm.language, url);
|
||||
} else {
|
||||
adminMarketplaceLog.info('No CSV URL configured for language:', this.importForm.language);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load import jobs (only jobs triggered by current admin user)
|
||||
*/
|
||||
async loadJobs() {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
// Build query params
|
||||
const params = new URLSearchParams({
|
||||
skip: (this.pagination.page - 1) * this.pagination.per_page,
|
||||
limit: this.pagination.per_page,
|
||||
created_by_me: 'true' // ✅ Only show jobs I triggered
|
||||
});
|
||||
|
||||
// Add filters (keep for consistency, though less needed here)
|
||||
if (this.filters.vendor_id) {
|
||||
params.append('vendor_id', this.filters.vendor_id);
|
||||
}
|
||||
if (this.filters.status) {
|
||||
params.append('status', this.filters.status);
|
||||
}
|
||||
if (this.filters.marketplace) {
|
||||
params.append('marketplace', this.filters.marketplace);
|
||||
}
|
||||
|
||||
const response = await apiClient.get(
|
||||
`/admin/marketplace-import-jobs?${params.toString()}`
|
||||
);
|
||||
|
||||
this.jobs = response.items || [];
|
||||
this.pagination.total = response.total || 0;
|
||||
this.pagination.pages = Math.ceil(this.pagination.total / this.pagination.per_page);
|
||||
|
||||
adminMarketplaceLog.info('Loaded my jobs:', this.jobs.length);
|
||||
} catch (error) {
|
||||
adminMarketplaceLog.error('Failed to load jobs:', error);
|
||||
this.error = error.message || 'Failed to load import jobs';
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Start new import for selected vendor
|
||||
*/
|
||||
async startImport() {
|
||||
if (!this.importForm.csv_url || !this.importForm.vendor_id) {
|
||||
this.error = 'Please select a vendor and enter a CSV URL';
|
||||
return;
|
||||
}
|
||||
|
||||
this.importing = true;
|
||||
this.error = '';
|
||||
this.successMessage = '';
|
||||
|
||||
try {
|
||||
const payload = {
|
||||
vendor_id: parseInt(this.importForm.vendor_id),
|
||||
source_url: this.importForm.csv_url,
|
||||
marketplace: this.importForm.marketplace,
|
||||
batch_size: this.importForm.batch_size,
|
||||
language: this.importForm.language // Include selected language
|
||||
};
|
||||
|
||||
adminMarketplaceLog.info('Starting import:', payload);
|
||||
|
||||
const response = await apiClient.post('/admin/marketplace-import-jobs', payload);
|
||||
|
||||
adminMarketplaceLog.info('Import started:', response);
|
||||
|
||||
const vendorName = this.selectedVendor?.name || 'vendor';
|
||||
this.successMessage = `Import job #${response.job_id || response.id} started successfully for ${vendorName}!`;
|
||||
|
||||
// Clear form
|
||||
this.importForm.vendor_id = '';
|
||||
this.importForm.csv_url = '';
|
||||
this.importForm.language = 'fr';
|
||||
this.importForm.batch_size = 1000;
|
||||
this.selectedVendor = null;
|
||||
|
||||
// Reload jobs to show the new import
|
||||
await this.loadJobs();
|
||||
|
||||
// Clear success message after 5 seconds
|
||||
setTimeout(() => {
|
||||
this.successMessage = '';
|
||||
}, 5000);
|
||||
} catch (error) {
|
||||
adminMarketplaceLog.error('Failed to start import:', error);
|
||||
this.error = error.message || 'Failed to start import';
|
||||
} finally {
|
||||
this.importing = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Switch marketplace tab and update form accordingly
|
||||
*/
|
||||
switchMarketplace(marketplace) {
|
||||
this.activeImportTab = marketplace;
|
||||
|
||||
// Update marketplace in form
|
||||
const marketplaceMap = {
|
||||
'letzshop': 'Letzshop',
|
||||
'codeswholesale': 'CodesWholesale'
|
||||
};
|
||||
this.importForm.marketplace = marketplaceMap[marketplace] || 'Letzshop';
|
||||
|
||||
// Reset form fields when switching tabs
|
||||
this.importForm.vendor_id = '';
|
||||
this.importForm.csv_url = '';
|
||||
this.importForm.language = 'fr';
|
||||
this.importForm.batch_size = 1000;
|
||||
this.selectedVendor = null;
|
||||
|
||||
adminMarketplaceLog.info('Switched to marketplace:', this.importForm.marketplace);
|
||||
},
|
||||
|
||||
/**
|
||||
* Quick fill form with saved CSV URL from vendor settings
|
||||
*/
|
||||
quickFill(language) {
|
||||
if (!this.selectedVendor) return;
|
||||
|
||||
const urlMap = {
|
||||
'fr': this.selectedVendor.letzshop_csv_url_fr,
|
||||
'en': this.selectedVendor.letzshop_csv_url_en,
|
||||
'de': this.selectedVendor.letzshop_csv_url_de
|
||||
};
|
||||
|
||||
const url = urlMap[language];
|
||||
if (url) {
|
||||
this.importForm.csv_url = url;
|
||||
this.importForm.language = language;
|
||||
adminMarketplaceLog.info('Quick filled:', language, url);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Clear all filters and reload
|
||||
*/
|
||||
clearFilters() {
|
||||
this.filters.vendor_id = '';
|
||||
this.filters.status = '';
|
||||
this.filters.marketplace = '';
|
||||
this.pagination.page = 1;
|
||||
this.loadJobs();
|
||||
},
|
||||
|
||||
/**
|
||||
* Refresh jobs list
|
||||
*/
|
||||
async refreshJobs() {
|
||||
await this.loadJobs();
|
||||
},
|
||||
|
||||
/**
|
||||
* Refresh single job status
|
||||
*/
|
||||
async refreshJobStatus(jobId) {
|
||||
try {
|
||||
const response = await apiClient.get(`/admin/marketplace-import-jobs/${jobId}`);
|
||||
|
||||
// Update job in list
|
||||
const index = this.jobs.findIndex(j => j.id === jobId);
|
||||
if (index !== -1) {
|
||||
this.jobs[index] = response;
|
||||
}
|
||||
|
||||
// Update selected job if modal is open
|
||||
if (this.selectedJob && this.selectedJob.id === jobId) {
|
||||
this.selectedJob = response;
|
||||
}
|
||||
|
||||
adminMarketplaceLog.info('Refreshed job:', jobId);
|
||||
} catch (error) {
|
||||
adminMarketplaceLog.error('Failed to refresh job:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* View job details in modal
|
||||
*/
|
||||
async viewJobDetails(jobId) {
|
||||
try {
|
||||
const response = await apiClient.get(`/admin/marketplace-import-jobs/${jobId}`);
|
||||
this.selectedJob = response;
|
||||
this.showJobModal = true;
|
||||
adminMarketplaceLog.info('Viewing job details:', jobId);
|
||||
} catch (error) {
|
||||
adminMarketplaceLog.error('Failed to load job details:', error);
|
||||
this.error = error.message || 'Failed to load job details';
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Close job details modal
|
||||
*/
|
||||
closeJobModal() {
|
||||
this.showJobModal = false;
|
||||
this.selectedJob = null;
|
||||
},
|
||||
|
||||
/**
|
||||
* Get vendor name by ID
|
||||
*/
|
||||
getVendorName(vendorId) {
|
||||
const vendor = this.vendors.find(v => v.id === vendorId);
|
||||
return vendor ? `${vendor.name} (${vendor.vendor_code})` : `Vendor #${vendorId}`;
|
||||
},
|
||||
|
||||
/**
|
||||
* Pagination: Previous page
|
||||
*/
|
||||
previousPage() {
|
||||
if (this.pagination.page > 1) {
|
||||
this.pagination.page--;
|
||||
this.loadJobs();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Pagination: Next page
|
||||
*/
|
||||
nextPage() {
|
||||
if (this.pagination.page < this.totalPages) {
|
||||
this.pagination.page++;
|
||||
this.loadJobs();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Pagination: Go to specific page
|
||||
*/
|
||||
goToPage(pageNum) {
|
||||
if (pageNum !== '...' && pageNum >= 1 && pageNum <= this.totalPages) {
|
||||
this.pagination.page = pageNum;
|
||||
this.loadJobs();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Format date for display
|
||||
*/
|
||||
formatDate(dateString) {
|
||||
if (!dateString) return 'N/A';
|
||||
|
||||
try {
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleString('en-US', {
|
||||
year: 'numeric',
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
});
|
||||
} catch (error) {
|
||||
return dateString;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Calculate duration between start and end
|
||||
*/
|
||||
calculateDuration(job) {
|
||||
if (!job.started_at) {
|
||||
return 'Not started';
|
||||
}
|
||||
|
||||
const start = new Date(job.started_at);
|
||||
const end = job.completed_at ? new Date(job.completed_at) : new Date();
|
||||
const durationMs = end - start;
|
||||
|
||||
// Convert to human-readable format
|
||||
const seconds = Math.floor(durationMs / 1000);
|
||||
const minutes = Math.floor(seconds / 60);
|
||||
const hours = Math.floor(minutes / 60);
|
||||
|
||||
if (hours > 0) {
|
||||
return `${hours}h ${minutes % 60}m`;
|
||||
} else if (minutes > 0) {
|
||||
return `${minutes}m ${seconds % 60}s`;
|
||||
} else {
|
||||
return `${seconds}s`;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Start auto-refresh for active jobs
|
||||
*/
|
||||
startAutoRefresh() {
|
||||
// Clear any existing interval
|
||||
if (this.autoRefreshInterval) {
|
||||
clearInterval(this.autoRefreshInterval);
|
||||
}
|
||||
|
||||
// Refresh every 10 seconds if there are active jobs
|
||||
this.autoRefreshInterval = setInterval(async () => {
|
||||
const hasActiveJobs = this.jobs.some(job =>
|
||||
job.status === 'pending' || job.status === 'processing'
|
||||
);
|
||||
|
||||
if (hasActiveJobs) {
|
||||
adminMarketplaceLog.info('Auto-refreshing active jobs...');
|
||||
await this.loadJobs();
|
||||
}
|
||||
}, 10000); // 10 seconds
|
||||
},
|
||||
|
||||
/**
|
||||
* Stop auto-refresh (cleanup)
|
||||
*/
|
||||
stopAutoRefresh() {
|
||||
if (this.autoRefreshInterval) {
|
||||
clearInterval(this.autoRefreshInterval);
|
||||
this.autoRefreshInterval = null;
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// Cleanup on page unload
|
||||
window.addEventListener('beforeunload', () => {
|
||||
if (window._adminMarketplaceInstance && window._adminMarketplaceInstance.stopAutoRefresh) {
|
||||
window._adminMarketplaceInstance.stopAutoRefresh();
|
||||
}
|
||||
});
|
||||
486
app/modules/marketplace/static/vendor/js/letzshop.js
vendored
Normal file
486
app/modules/marketplace/static/vendor/js/letzshop.js
vendored
Normal file
@@ -0,0 +1,486 @@
|
||||
// app/modules/marketplace/static/vendor/js/letzshop.js
|
||||
/**
|
||||
* Vendor Letzshop orders management page logic
|
||||
*/
|
||||
|
||||
const letzshopLog = window.LogConfig?.createLogger('LETZSHOP') || console;
|
||||
|
||||
letzshopLog.info('[VENDOR LETZSHOP] Loading...');
|
||||
|
||||
function vendorLetzshop() {
|
||||
letzshopLog.info('[VENDOR LETZSHOP] vendorLetzshop() called');
|
||||
|
||||
return {
|
||||
// Inherit base layout state
|
||||
...data(),
|
||||
|
||||
// Set page identifier
|
||||
currentPage: 'letzshop',
|
||||
|
||||
// Tab state
|
||||
activeTab: 'orders',
|
||||
|
||||
// Loading states
|
||||
loading: false,
|
||||
importing: false,
|
||||
saving: false,
|
||||
testing: false,
|
||||
submittingTracking: false,
|
||||
|
||||
// Messages
|
||||
error: '',
|
||||
successMessage: '',
|
||||
|
||||
// Integration status
|
||||
status: {
|
||||
is_configured: false,
|
||||
is_connected: false,
|
||||
auto_sync_enabled: false,
|
||||
last_sync_at: null,
|
||||
last_sync_status: null
|
||||
},
|
||||
|
||||
// Credentials
|
||||
credentials: null,
|
||||
credentialsForm: {
|
||||
api_key: '',
|
||||
auto_sync_enabled: false,
|
||||
sync_interval_minutes: 15
|
||||
},
|
||||
showApiKey: false,
|
||||
|
||||
// Orders
|
||||
orders: [],
|
||||
totalOrders: 0,
|
||||
page: 1,
|
||||
limit: 20,
|
||||
filters: {
|
||||
sync_status: ''
|
||||
},
|
||||
|
||||
// Order stats
|
||||
orderStats: {
|
||||
pending: 0,
|
||||
confirmed: 0,
|
||||
rejected: 0,
|
||||
shipped: 0
|
||||
},
|
||||
|
||||
// Modals
|
||||
showTrackingModal: false,
|
||||
showOrderModal: false,
|
||||
selectedOrder: null,
|
||||
trackingForm: {
|
||||
tracking_number: '',
|
||||
tracking_carrier: ''
|
||||
},
|
||||
|
||||
// Export
|
||||
exportLanguage: 'fr',
|
||||
exportIncludeInactive: false,
|
||||
exporting: false,
|
||||
|
||||
async init() {
|
||||
// Guard against multiple initialization
|
||||
if (window._vendorLetzshopInitialized) {
|
||||
return;
|
||||
}
|
||||
window._vendorLetzshopInitialized = true;
|
||||
|
||||
// Call parent init first to set vendorCode from URL
|
||||
const parentInit = data().init;
|
||||
if (parentInit) {
|
||||
await parentInit.call(this);
|
||||
}
|
||||
|
||||
await this.loadStatus();
|
||||
await this.loadOrders();
|
||||
},
|
||||
|
||||
/**
|
||||
* Load integration status
|
||||
*/
|
||||
async loadStatus() {
|
||||
try {
|
||||
const response = await apiClient.get('/vendor/letzshop/status');
|
||||
this.status = response;
|
||||
|
||||
if (this.status.is_configured) {
|
||||
await this.loadCredentials();
|
||||
}
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to load status:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load credentials (masked)
|
||||
*/
|
||||
async loadCredentials() {
|
||||
try {
|
||||
const response = await apiClient.get('/vendor/letzshop/credentials');
|
||||
this.credentials = response;
|
||||
this.credentialsForm.auto_sync_enabled = response.auto_sync_enabled;
|
||||
this.credentialsForm.sync_interval_minutes = response.sync_interval_minutes;
|
||||
} catch (error) {
|
||||
// 404 means not configured, which is fine
|
||||
if (error.status !== 404) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to load credentials:', error);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load orders
|
||||
*/
|
||||
async loadOrders() {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const params = new URLSearchParams({
|
||||
skip: ((this.page - 1) * this.limit).toString(),
|
||||
limit: this.limit.toString()
|
||||
});
|
||||
|
||||
if (this.filters.sync_status) {
|
||||
params.append('sync_status', this.filters.sync_status);
|
||||
}
|
||||
|
||||
const response = await apiClient.get(`/vendor/letzshop/orders?${params}`);
|
||||
this.orders = response.orders;
|
||||
this.totalOrders = response.total;
|
||||
|
||||
// Calculate stats
|
||||
await this.loadOrderStats();
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to load orders:', error);
|
||||
this.error = error.message || 'Failed to load orders';
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load order stats by fetching counts for each status
|
||||
*/
|
||||
async loadOrderStats() {
|
||||
try {
|
||||
// Get all orders without filter to calculate stats
|
||||
const allResponse = await apiClient.get('/vendor/letzshop/orders?limit=1000');
|
||||
const allOrders = allResponse.orders || [];
|
||||
|
||||
this.orderStats = {
|
||||
pending: allOrders.filter(o => o.sync_status === 'pending').length,
|
||||
confirmed: allOrders.filter(o => o.sync_status === 'confirmed').length,
|
||||
rejected: allOrders.filter(o => o.sync_status === 'rejected').length,
|
||||
shipped: allOrders.filter(o => o.sync_status === 'shipped').length
|
||||
};
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to load order stats:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Refresh all data
|
||||
*/
|
||||
async refreshData() {
|
||||
await this.loadStatus();
|
||||
await this.loadOrders();
|
||||
this.successMessage = 'Data refreshed';
|
||||
setTimeout(() => this.successMessage = '', 3000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Import orders from Letzshop
|
||||
*/
|
||||
async importOrders() {
|
||||
if (!this.status.is_configured) {
|
||||
this.error = 'Please configure your API key first';
|
||||
this.activeTab = 'settings';
|
||||
return;
|
||||
}
|
||||
|
||||
this.importing = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const response = await apiClient.post('/vendor/letzshop/orders/import', {
|
||||
operation: 'order_import'
|
||||
});
|
||||
|
||||
if (response.success) {
|
||||
this.successMessage = response.message;
|
||||
await this.loadOrders();
|
||||
} else {
|
||||
this.error = response.message || 'Import failed';
|
||||
}
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Import failed:', error);
|
||||
this.error = error.message || 'Failed to import orders';
|
||||
} finally {
|
||||
this.importing = false;
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Save credentials
|
||||
*/
|
||||
async saveCredentials() {
|
||||
if (!this.credentialsForm.api_key && !this.credentials) {
|
||||
this.error = 'Please enter an API key';
|
||||
return;
|
||||
}
|
||||
|
||||
this.saving = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const payload = {
|
||||
auto_sync_enabled: this.credentialsForm.auto_sync_enabled,
|
||||
sync_interval_minutes: parseInt(this.credentialsForm.sync_interval_minutes)
|
||||
};
|
||||
|
||||
if (this.credentialsForm.api_key) {
|
||||
payload.api_key = this.credentialsForm.api_key;
|
||||
}
|
||||
|
||||
const response = await apiClient.post('/vendor/letzshop/credentials', payload);
|
||||
this.credentials = response;
|
||||
this.credentialsForm.api_key = '';
|
||||
this.status.is_configured = true;
|
||||
this.successMessage = 'Credentials saved successfully';
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to save credentials:', error);
|
||||
this.error = error.message || 'Failed to save credentials';
|
||||
} finally {
|
||||
this.saving = false;
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Test connection
|
||||
*/
|
||||
async testConnection() {
|
||||
this.testing = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const response = await apiClient.post('/vendor/letzshop/test');
|
||||
|
||||
if (response.success) {
|
||||
this.successMessage = `Connection successful (${response.response_time_ms?.toFixed(0)}ms)`;
|
||||
} else {
|
||||
this.error = response.error_details || 'Connection failed';
|
||||
}
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Connection test failed:', error);
|
||||
this.error = error.message || 'Connection test failed';
|
||||
} finally {
|
||||
this.testing = false;
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Delete credentials
|
||||
*/
|
||||
async deleteCredentials() {
|
||||
if (!confirm('Are you sure you want to remove your Letzshop credentials?')) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await apiClient.delete('/vendor/letzshop/credentials');
|
||||
this.credentials = null;
|
||||
this.status.is_configured = false;
|
||||
this.credentialsForm = {
|
||||
api_key: '',
|
||||
auto_sync_enabled: false,
|
||||
sync_interval_minutes: 15
|
||||
};
|
||||
this.successMessage = 'Credentials removed';
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to delete credentials:', error);
|
||||
this.error = error.message || 'Failed to remove credentials';
|
||||
}
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Confirm order
|
||||
*/
|
||||
async confirmOrder(order) {
|
||||
if (!confirm('Confirm this order?')) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await apiClient.post(`/vendor/letzshop/orders/${order.id}/confirm`);
|
||||
|
||||
if (response.success) {
|
||||
this.successMessage = 'Order confirmed';
|
||||
await this.loadOrders();
|
||||
} else {
|
||||
this.error = response.message || 'Failed to confirm order';
|
||||
}
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to confirm order:', error);
|
||||
this.error = error.message || 'Failed to confirm order';
|
||||
}
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Reject order
|
||||
*/
|
||||
async rejectOrder(order) {
|
||||
if (!confirm('Reject this order? This action cannot be undone.')) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await apiClient.post(`/vendor/letzshop/orders/${order.id}/reject`);
|
||||
|
||||
if (response.success) {
|
||||
this.successMessage = 'Order rejected';
|
||||
await this.loadOrders();
|
||||
} else {
|
||||
this.error = response.message || 'Failed to reject order';
|
||||
}
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to reject order:', error);
|
||||
this.error = error.message || 'Failed to reject order';
|
||||
}
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
},
|
||||
|
||||
/**
|
||||
* Open tracking modal
|
||||
*/
|
||||
openTrackingModal(order) {
|
||||
this.selectedOrder = order;
|
||||
this.trackingForm = {
|
||||
tracking_number: order.tracking_number || '',
|
||||
tracking_carrier: order.tracking_carrier || ''
|
||||
};
|
||||
this.showTrackingModal = true;
|
||||
},
|
||||
|
||||
/**
|
||||
* Submit tracking
|
||||
*/
|
||||
async submitTracking() {
|
||||
if (!this.trackingForm.tracking_number || !this.trackingForm.tracking_carrier) {
|
||||
this.error = 'Please fill in all fields';
|
||||
return;
|
||||
}
|
||||
|
||||
this.submittingTracking = true;
|
||||
|
||||
try {
|
||||
const response = await apiClient.post(
|
||||
`/vendor/letzshop/orders/${this.selectedOrder.id}/tracking`,
|
||||
this.trackingForm
|
||||
);
|
||||
|
||||
if (response.success) {
|
||||
this.showTrackingModal = false;
|
||||
this.successMessage = 'Tracking information saved';
|
||||
await this.loadOrders();
|
||||
} else {
|
||||
this.error = response.message || 'Failed to save tracking';
|
||||
}
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Failed to set tracking:', error);
|
||||
this.error = error.message || 'Failed to save tracking';
|
||||
} finally {
|
||||
this.submittingTracking = false;
|
||||
}
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
},
|
||||
|
||||
/**
|
||||
* View order details
|
||||
*/
|
||||
viewOrderDetails(order) {
|
||||
this.selectedOrder = order;
|
||||
this.showOrderModal = true;
|
||||
},
|
||||
|
||||
/**
|
||||
* Format date for display
|
||||
*/
|
||||
formatDate(dateStr) {
|
||||
if (!dateStr) return 'N/A';
|
||||
const date = new Date(dateStr);
|
||||
const locale = window.VENDOR_CONFIG?.locale || 'en-GB';
|
||||
return date.toLocaleDateString(locale) + ' ' + date.toLocaleTimeString(locale, { hour: '2-digit', minute: '2-digit' });
|
||||
},
|
||||
|
||||
/**
|
||||
* Download product export CSV
|
||||
*/
|
||||
async downloadExport() {
|
||||
this.exporting = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const params = new URLSearchParams({
|
||||
language: this.exportLanguage,
|
||||
include_inactive: this.exportIncludeInactive.toString()
|
||||
});
|
||||
|
||||
// Get the token for authentication
|
||||
const token = localStorage.getItem('wizamart_token');
|
||||
if (!token) {
|
||||
throw new Error('Not authenticated');
|
||||
}
|
||||
|
||||
// noqa: js-008 - File download needs response headers for filename
|
||||
const response = await fetch(`/api/v1/vendor/letzshop/export?${params}`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Authorization': `Bearer ${token}`
|
||||
}
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json().catch(() => ({}));
|
||||
throw new Error(errorData.detail || 'Export failed');
|
||||
}
|
||||
|
||||
// Get filename from Content-Disposition header
|
||||
const contentDisposition = response.headers.get('Content-Disposition');
|
||||
let filename = `letzshop_export_${this.exportLanguage}.csv`;
|
||||
if (contentDisposition) {
|
||||
const match = contentDisposition.match(/filename="(.+)"/);
|
||||
if (match) {
|
||||
filename = match[1];
|
||||
}
|
||||
}
|
||||
|
||||
// Download the file
|
||||
const blob = await response.blob();
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = filename;
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
window.URL.revokeObjectURL(url);
|
||||
|
||||
this.successMessage = `Export downloaded: ${filename}`;
|
||||
} catch (error) {
|
||||
letzshopLog.error('[VENDOR LETZSHOP] Export failed:', error);
|
||||
this.error = error.message || 'Failed to export products';
|
||||
} finally {
|
||||
this.exporting = false;
|
||||
setTimeout(() => this.successMessage = '', 5000);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
343
app/modules/marketplace/static/vendor/js/marketplace.js
vendored
Normal file
343
app/modules/marketplace/static/vendor/js/marketplace.js
vendored
Normal file
@@ -0,0 +1,343 @@
|
||||
// app/modules/marketplace/static/vendor/js/marketplace.js
|
||||
/**
|
||||
* Vendor marketplace import page logic
|
||||
*/
|
||||
|
||||
// ✅ Use centralized logger (with safe fallback)
|
||||
const vendorMarketplaceLog = window.LogConfig.loggers.marketplace ||
|
||||
window.LogConfig.createLogger('marketplace', false);
|
||||
|
||||
vendorMarketplaceLog.info('Loading...');
|
||||
|
||||
function vendorMarketplace() {
|
||||
vendorMarketplaceLog.info('[VENDOR MARKETPLACE] vendorMarketplace() called');
|
||||
|
||||
return {
|
||||
// ✅ Inherit base layout state
|
||||
...data(),
|
||||
|
||||
// ✅ Set page identifier
|
||||
currentPage: 'marketplace',
|
||||
|
||||
// Loading states
|
||||
loading: false,
|
||||
importing: false,
|
||||
error: '',
|
||||
successMessage: '',
|
||||
|
||||
// Import form
|
||||
importForm: {
|
||||
csv_url: '',
|
||||
marketplace: 'Letzshop',
|
||||
language: 'fr',
|
||||
batch_size: 1000
|
||||
},
|
||||
|
||||
// Vendor settings (for quick fill)
|
||||
vendorSettings: {
|
||||
letzshop_csv_url_fr: '',
|
||||
letzshop_csv_url_en: '',
|
||||
letzshop_csv_url_de: ''
|
||||
},
|
||||
|
||||
// Import jobs
|
||||
jobs: [],
|
||||
totalJobs: 0,
|
||||
page: 1,
|
||||
limit: 10,
|
||||
|
||||
// Modal state
|
||||
showJobModal: false,
|
||||
selectedJob: null,
|
||||
|
||||
// Auto-refresh for active jobs
|
||||
autoRefreshInterval: null,
|
||||
|
||||
async init() {
|
||||
// Guard against multiple initialization
|
||||
if (window._vendorMarketplaceInitialized) {
|
||||
return;
|
||||
}
|
||||
window._vendorMarketplaceInitialized = true;
|
||||
|
||||
// IMPORTANT: Call parent init first to set vendorCode from URL
|
||||
const parentInit = data().init;
|
||||
if (parentInit) {
|
||||
await parentInit.call(this);
|
||||
}
|
||||
|
||||
await this.loadVendorSettings();
|
||||
await this.loadJobs();
|
||||
|
||||
// Auto-refresh active jobs every 10 seconds
|
||||
this.startAutoRefresh();
|
||||
},
|
||||
|
||||
/**
|
||||
* Load vendor settings (for quick fill)
|
||||
*/
|
||||
async loadVendorSettings() {
|
||||
try {
|
||||
const response = await apiClient.get('/vendor/settings');
|
||||
this.vendorSettings = {
|
||||
letzshop_csv_url_fr: response.letzshop_csv_url_fr || '',
|
||||
letzshop_csv_url_en: response.letzshop_csv_url_en || '',
|
||||
letzshop_csv_url_de: response.letzshop_csv_url_de || ''
|
||||
};
|
||||
} catch (error) {
|
||||
vendorMarketplaceLog.error('[VENDOR MARKETPLACE] Failed to load vendor settings:', error);
|
||||
// Non-critical, don't show error to user
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Load import jobs
|
||||
*/
|
||||
async loadJobs() {
|
||||
this.loading = true;
|
||||
this.error = '';
|
||||
|
||||
try {
|
||||
const response = await apiClient.get(
|
||||
`/vendor/marketplace/imports?page=${this.page}&limit=${this.limit}`
|
||||
);
|
||||
|
||||
this.jobs = response.items || [];
|
||||
this.totalJobs = response.total || 0;
|
||||
|
||||
vendorMarketplaceLog.info('[VENDOR MARKETPLACE] Loaded jobs:', this.jobs.length);
|
||||
} catch (error) {
|
||||
vendorMarketplaceLog.error('[VENDOR MARKETPLACE] Failed to load jobs:', error);
|
||||
this.error = error.message || 'Failed to load import jobs';
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Start new import
|
||||
*/
|
||||
async startImport() {
|
||||
if (!this.importForm.csv_url) {
|
||||
this.error = 'Please enter a CSV URL';
|
||||
return;
|
||||
}
|
||||
|
||||
this.importing = true;
|
||||
this.error = '';
|
||||
this.successMessage = '';
|
||||
|
||||
try {
|
||||
const payload = {
|
||||
source_url: this.importForm.csv_url,
|
||||
marketplace: this.importForm.marketplace,
|
||||
batch_size: this.importForm.batch_size
|
||||
};
|
||||
|
||||
vendorMarketplaceLog.info('[VENDOR MARKETPLACE] Starting import:', payload);
|
||||
|
||||
const response = await apiClient.post('/vendor/marketplace/import', payload);
|
||||
|
||||
vendorMarketplaceLog.info('[VENDOR MARKETPLACE] Import started:', response);
|
||||
|
||||
this.successMessage = `Import job #${response.job_id} started successfully!`;
|
||||
|
||||
// Clear form
|
||||
this.importForm.csv_url = '';
|
||||
this.importForm.language = 'fr';
|
||||
this.importForm.batch_size = 1000;
|
||||
|
||||
// Reload jobs to show the new import
|
||||
await this.loadJobs();
|
||||
|
||||
// Clear success message after 5 seconds
|
||||
setTimeout(() => {
|
||||
this.successMessage = '';
|
||||
}, 5000);
|
||||
} catch (error) {
|
||||
vendorMarketplaceLog.error('[VENDOR MARKETPLACE] Failed to start import:', error);
|
||||
this.error = error.message || 'Failed to start import';
|
||||
} finally {
|
||||
this.importing = false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Quick fill form with saved CSV URL
|
||||
*/
|
||||
quickFill(language) {
|
||||
const urlMap = {
|
||||
'fr': this.vendorSettings.letzshop_csv_url_fr,
|
||||
'en': this.vendorSettings.letzshop_csv_url_en,
|
||||
'de': this.vendorSettings.letzshop_csv_url_de
|
||||
};
|
||||
|
||||
const url = urlMap[language];
|
||||
if (url) {
|
||||
this.importForm.csv_url = url;
|
||||
this.importForm.language = language;
|
||||
vendorMarketplaceLog.info('[VENDOR MARKETPLACE] Quick filled:', language, url);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Refresh jobs list
|
||||
*/
|
||||
async refreshJobs() {
|
||||
await this.loadJobs();
|
||||
},
|
||||
|
||||
/**
|
||||
* Refresh single job status
|
||||
*/
|
||||
async refreshJobStatus(jobId) {
|
||||
try {
|
||||
const response = await apiClient.get(`/vendor/marketplace/imports/${jobId}`);
|
||||
|
||||
// Update job in list
|
||||
const index = this.jobs.findIndex(j => j.id === jobId);
|
||||
if (index !== -1) {
|
||||
this.jobs[index] = response;
|
||||
}
|
||||
|
||||
// Update selected job if modal is open
|
||||
if (this.selectedJob && this.selectedJob.id === jobId) {
|
||||
this.selectedJob = response;
|
||||
}
|
||||
|
||||
vendorMarketplaceLog.info('[VENDOR MARKETPLACE] Refreshed job:', jobId);
|
||||
} catch (error) {
|
||||
vendorMarketplaceLog.error('[VENDOR MARKETPLACE] Failed to refresh job:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* View job details in modal
|
||||
*/
|
||||
async viewJobDetails(jobId) {
|
||||
try {
|
||||
const response = await apiClient.get(`/vendor/marketplace/imports/${jobId}`);
|
||||
this.selectedJob = response;
|
||||
this.showJobModal = true;
|
||||
vendorMarketplaceLog.info('[VENDOR MARKETPLACE] Viewing job details:', jobId);
|
||||
} catch (error) {
|
||||
vendorMarketplaceLog.error('[VENDOR MARKETPLACE] Failed to load job details:', error);
|
||||
this.error = error.message || 'Failed to load job details';
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Close job details modal
|
||||
*/
|
||||
closeJobModal() {
|
||||
this.showJobModal = false;
|
||||
this.selectedJob = null;
|
||||
},
|
||||
|
||||
/**
|
||||
* Pagination: Previous page
|
||||
*/
|
||||
async previousPage() {
|
||||
if (this.page > 1) {
|
||||
this.page--;
|
||||
await this.loadJobs();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Pagination: Next page
|
||||
*/
|
||||
async nextPage() {
|
||||
if (this.page * this.limit < this.totalJobs) {
|
||||
this.page++;
|
||||
await this.loadJobs();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Format date for display
|
||||
*/
|
||||
formatDate(dateString) {
|
||||
if (!dateString) return 'N/A';
|
||||
|
||||
try {
|
||||
const date = new Date(dateString);
|
||||
const locale = window.VENDOR_CONFIG?.locale || 'en-GB';
|
||||
return date.toLocaleString(locale, {
|
||||
year: 'numeric',
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
});
|
||||
} catch (error) {
|
||||
return dateString;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Calculate duration between start and end
|
||||
*/
|
||||
calculateDuration(job) {
|
||||
if (!job.started_at) {
|
||||
return 'Not started';
|
||||
}
|
||||
|
||||
const start = new Date(job.started_at);
|
||||
const end = job.completed_at ? new Date(job.completed_at) : new Date();
|
||||
const durationMs = end - start;
|
||||
|
||||
// Convert to human-readable format
|
||||
const seconds = Math.floor(durationMs / 1000);
|
||||
const minutes = Math.floor(seconds / 60);
|
||||
const hours = Math.floor(minutes / 60);
|
||||
|
||||
if (hours > 0) {
|
||||
return `${hours}h ${minutes % 60}m`;
|
||||
} else if (minutes > 0) {
|
||||
return `${minutes}m ${seconds % 60}s`;
|
||||
} else {
|
||||
return `${seconds}s`;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Start auto-refresh for active jobs
|
||||
*/
|
||||
startAutoRefresh() {
|
||||
// Clear any existing interval
|
||||
if (this.autoRefreshInterval) {
|
||||
clearInterval(this.autoRefreshInterval);
|
||||
}
|
||||
|
||||
// Refresh every 10 seconds if there are active jobs
|
||||
this.autoRefreshInterval = setInterval(async () => {
|
||||
const hasActiveJobs = this.jobs.some(job =>
|
||||
job.status === 'pending' || job.status === 'processing'
|
||||
);
|
||||
|
||||
if (hasActiveJobs) {
|
||||
vendorMarketplaceLog.info('[VENDOR MARKETPLACE] Auto-refreshing active jobs...');
|
||||
await this.loadJobs();
|
||||
}
|
||||
}, 10000); // 10 seconds
|
||||
},
|
||||
|
||||
/**
|
||||
* Stop auto-refresh (cleanup)
|
||||
*/
|
||||
stopAutoRefresh() {
|
||||
if (this.autoRefreshInterval) {
|
||||
clearInterval(this.autoRefreshInterval);
|
||||
this.autoRefreshInterval = null;
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// Cleanup on page unload
|
||||
window.addEventListener('beforeunload', () => {
|
||||
if (window._vendorMarketplaceInstance && window._vendorMarketplaceInstance.stopAutoRefresh) {
|
||||
window._vendorMarketplaceInstance.stopAutoRefresh();
|
||||
}
|
||||
});
|
||||
649
app/modules/marketplace/static/vendor/js/onboarding.js
vendored
Normal file
649
app/modules/marketplace/static/vendor/js/onboarding.js
vendored
Normal file
@@ -0,0 +1,649 @@
|
||||
// app/modules/marketplace/static/vendor/js/onboarding.js
|
||||
// noqa: js-003 - Standalone page without vendor layout (no base.html extends)
|
||||
// noqa: js-004 - Standalone page has no currentPage sidebar highlight
|
||||
/**
|
||||
* Vendor Onboarding Wizard
|
||||
*
|
||||
* Handles the 4-step mandatory onboarding flow:
|
||||
* 1. Company Profile Setup
|
||||
* 2. Letzshop API Configuration
|
||||
* 3. Product & Order Import Configuration
|
||||
* 4. Order Sync (historical import)
|
||||
*/
|
||||
|
||||
const onboardingLog = window.LogConfig?.createLogger('ONBOARDING') || console;
|
||||
|
||||
// Onboarding translations
|
||||
const onboardingTranslations = {
|
||||
en: {
|
||||
title: 'Welcome to Wizamart',
|
||||
subtitle: 'Complete these steps to set up your store',
|
||||
steps: {
|
||||
company_profile: 'Company Profile',
|
||||
letzshop_api: 'Letzshop API',
|
||||
product_import: 'Product Import',
|
||||
order_sync: 'Order Sync',
|
||||
},
|
||||
step1: {
|
||||
title: 'Company Profile Setup',
|
||||
description: 'Tell us about your business. This information will be used for invoices and your store profile.',
|
||||
company_name: 'Company Name',
|
||||
brand_name: 'Brand Name',
|
||||
brand_name_help: 'The name customers will see',
|
||||
description_label: 'Description',
|
||||
description_placeholder: 'Brief description of your business',
|
||||
contact_email: 'Contact Email',
|
||||
contact_phone: 'Contact Phone',
|
||||
website: 'Website',
|
||||
business_address: 'Business Address',
|
||||
tax_number: 'Tax Number (VAT)',
|
||||
tax_number_placeholder: 'e.g., LU12345678',
|
||||
default_language: 'Default Shop Language',
|
||||
dashboard_language: 'Dashboard Language',
|
||||
},
|
||||
step2: {
|
||||
title: 'Letzshop API Configuration',
|
||||
description: 'Connect your Letzshop marketplace account to sync orders automatically.',
|
||||
api_key: 'Letzshop API Key',
|
||||
api_key_placeholder: 'Enter your API key',
|
||||
api_key_help: 'Get your API key from Letzshop Support team',
|
||||
shop_slug: 'Shop Slug',
|
||||
shop_slug_help: 'Enter the last part of your Letzshop vendor URL',
|
||||
test_connection: 'Test Connection',
|
||||
testing: 'Testing...',
|
||||
connection_success: 'Connection successful',
|
||||
connection_failed: 'Connection failed',
|
||||
},
|
||||
step3: {
|
||||
title: 'Product Import Configuration',
|
||||
description: 'Configure how products are imported from your CSV feeds.',
|
||||
csv_urls: 'CSV Feed URLs',
|
||||
csv_url_fr: 'French CSV URL',
|
||||
csv_url_en: 'English CSV URL',
|
||||
csv_url_de: 'German CSV URL',
|
||||
csv_url_help: 'Find your CSV URL in Letzshop Admin Panel > API > Export Products',
|
||||
default_tax_rate: 'Default Tax Rate (%)',
|
||||
delivery_method: 'Delivery Method',
|
||||
delivery_package: 'Package Delivery',
|
||||
delivery_pickup: 'Store Pickup',
|
||||
preorder_days: 'Preorder Days',
|
||||
preorder_days_help: 'Days before product is available after order',
|
||||
},
|
||||
step4: {
|
||||
title: 'Historical Order Import',
|
||||
description: 'Import your existing orders from Letzshop to start managing them in Wizamart.',
|
||||
days_back: 'Import orders from last',
|
||||
days: 'days',
|
||||
start_import: 'Start Import',
|
||||
importing: 'Importing...',
|
||||
import_complete: 'Import Complete!',
|
||||
orders_imported: 'orders imported',
|
||||
skip_step: 'Skip this step',
|
||||
},
|
||||
buttons: {
|
||||
save_continue: 'Save & Continue',
|
||||
saving: 'Saving...',
|
||||
back: 'Back',
|
||||
complete: 'Complete Setup',
|
||||
retry: 'Retry',
|
||||
},
|
||||
loading: 'Loading your setup...',
|
||||
errors: {
|
||||
load_failed: 'Failed to load onboarding status',
|
||||
save_failed: 'Failed to save. Please try again.',
|
||||
},
|
||||
},
|
||||
fr: {
|
||||
title: 'Bienvenue sur Wizamart',
|
||||
subtitle: 'Complétez ces étapes pour configurer votre boutique',
|
||||
steps: {
|
||||
company_profile: 'Profil Entreprise',
|
||||
letzshop_api: 'API Letzshop',
|
||||
product_import: 'Import Produits',
|
||||
order_sync: 'Sync Commandes',
|
||||
},
|
||||
step1: {
|
||||
title: 'Configuration du Profil Entreprise',
|
||||
description: 'Parlez-nous de votre entreprise. Ces informations seront utilisées pour les factures et le profil de votre boutique.',
|
||||
company_name: 'Nom de l\'Entreprise',
|
||||
brand_name: 'Nom de la Marque',
|
||||
brand_name_help: 'Le nom que les clients verront',
|
||||
description_label: 'Description',
|
||||
description_placeholder: 'Brève description de votre activité',
|
||||
contact_email: 'Email de Contact',
|
||||
contact_phone: 'Téléphone de Contact',
|
||||
website: 'Site Web',
|
||||
business_address: 'Adresse Professionnelle',
|
||||
tax_number: 'Numéro de TVA',
|
||||
tax_number_placeholder: 'ex: LU12345678',
|
||||
default_language: 'Langue par Défaut de la Boutique',
|
||||
dashboard_language: 'Langue du Tableau de Bord',
|
||||
},
|
||||
step2: {
|
||||
title: 'Configuration de l\'API Letzshop',
|
||||
description: 'Connectez votre compte Letzshop pour synchroniser automatiquement les commandes.',
|
||||
api_key: 'Clé API Letzshop',
|
||||
api_key_placeholder: 'Entrez votre clé API',
|
||||
api_key_help: 'Obtenez votre clé API auprès de l\'équipe Support Letzshop',
|
||||
shop_slug: 'Identifiant Boutique',
|
||||
shop_slug_help: 'Entrez la dernière partie de votre URL vendeur Letzshop',
|
||||
test_connection: 'Tester la Connexion',
|
||||
testing: 'Test en cours...',
|
||||
connection_success: 'Connexion réussie',
|
||||
connection_failed: 'Échec de la connexion',
|
||||
},
|
||||
step3: {
|
||||
title: 'Configuration Import Produits',
|
||||
description: 'Configurez comment les produits sont importés depuis vos flux CSV.',
|
||||
csv_urls: 'URLs des Flux CSV',
|
||||
csv_url_fr: 'URL CSV Français',
|
||||
csv_url_en: 'URL CSV Anglais',
|
||||
csv_url_de: 'URL CSV Allemand',
|
||||
csv_url_help: 'Trouvez votre URL CSV dans Letzshop Admin > API > Exporter Produits',
|
||||
default_tax_rate: 'Taux de TVA par Défaut (%)',
|
||||
delivery_method: 'Méthode de Livraison',
|
||||
delivery_package: 'Livraison Colis',
|
||||
delivery_pickup: 'Retrait en Magasin',
|
||||
preorder_days: 'Jours de Précommande',
|
||||
preorder_days_help: 'Jours avant disponibilité du produit après commande',
|
||||
},
|
||||
step4: {
|
||||
title: 'Import Historique des Commandes',
|
||||
description: 'Importez vos commandes existantes de Letzshop pour commencer à les gérer dans Wizamart.',
|
||||
days_back: 'Importer les commandes des derniers',
|
||||
days: 'jours',
|
||||
start_import: 'Démarrer l\'Import',
|
||||
importing: 'Import en cours...',
|
||||
import_complete: 'Import Terminé !',
|
||||
orders_imported: 'commandes importées',
|
||||
skip_step: 'Passer cette étape',
|
||||
},
|
||||
buttons: {
|
||||
save_continue: 'Enregistrer & Continuer',
|
||||
saving: 'Enregistrement...',
|
||||
back: 'Retour',
|
||||
complete: 'Terminer la Configuration',
|
||||
retry: 'Réessayer',
|
||||
},
|
||||
loading: 'Chargement de votre configuration...',
|
||||
errors: {
|
||||
load_failed: 'Échec du chargement du statut d\'onboarding',
|
||||
save_failed: 'Échec de l\'enregistrement. Veuillez réessayer.',
|
||||
},
|
||||
},
|
||||
de: {
|
||||
title: 'Willkommen bei Wizamart',
|
||||
subtitle: 'Führen Sie diese Schritte aus, um Ihren Shop einzurichten',
|
||||
steps: {
|
||||
company_profile: 'Firmenprofil',
|
||||
letzshop_api: 'Letzshop API',
|
||||
product_import: 'Produktimport',
|
||||
order_sync: 'Bestellsync',
|
||||
},
|
||||
step1: {
|
||||
title: 'Firmenprofil Einrichten',
|
||||
description: 'Erzählen Sie uns von Ihrem Unternehmen. Diese Informationen werden für Rechnungen und Ihr Shop-Profil verwendet.',
|
||||
company_name: 'Firmenname',
|
||||
brand_name: 'Markenname',
|
||||
brand_name_help: 'Der Name, den Kunden sehen werden',
|
||||
description_label: 'Beschreibung',
|
||||
description_placeholder: 'Kurze Beschreibung Ihres Unternehmens',
|
||||
contact_email: 'Kontakt-E-Mail',
|
||||
contact_phone: 'Kontakttelefon',
|
||||
website: 'Website',
|
||||
business_address: 'Geschäftsadresse',
|
||||
tax_number: 'Steuernummer (USt-IdNr.)',
|
||||
tax_number_placeholder: 'z.B. LU12345678',
|
||||
default_language: 'Standard-Shop-Sprache',
|
||||
dashboard_language: 'Dashboard-Sprache',
|
||||
},
|
||||
step2: {
|
||||
title: 'Letzshop API Konfiguration',
|
||||
description: 'Verbinden Sie Ihr Letzshop-Konto, um Bestellungen automatisch zu synchronisieren.',
|
||||
api_key: 'Letzshop API-Schlüssel',
|
||||
api_key_placeholder: 'Geben Sie Ihren API-Schlüssel ein',
|
||||
api_key_help: 'Erhalten Sie Ihren API-Schlüssel vom Letzshop Support-Team',
|
||||
shop_slug: 'Shop-Slug',
|
||||
shop_slug_help: 'Geben Sie den letzten Teil Ihrer Letzshop-Verkäufer-URL ein',
|
||||
test_connection: 'Verbindung Testen',
|
||||
testing: 'Teste...',
|
||||
connection_success: 'Verbindung erfolgreich',
|
||||
connection_failed: 'Verbindung fehlgeschlagen',
|
||||
},
|
||||
step3: {
|
||||
title: 'Produktimport Konfiguration',
|
||||
description: 'Konfigurieren Sie, wie Produkte aus Ihren CSV-Feeds importiert werden.',
|
||||
csv_urls: 'CSV-Feed-URLs',
|
||||
csv_url_fr: 'Französische CSV-URL',
|
||||
csv_url_en: 'Englische CSV-URL',
|
||||
csv_url_de: 'Deutsche CSV-URL',
|
||||
csv_url_help: 'Finden Sie Ihre CSV-URL im Letzshop Admin-Panel > API > Produkte exportieren',
|
||||
default_tax_rate: 'Standard-Steuersatz (%)',
|
||||
delivery_method: 'Liefermethode',
|
||||
delivery_package: 'Paketlieferung',
|
||||
delivery_pickup: 'Abholung im Geschäft',
|
||||
preorder_days: 'Vorbestelltage',
|
||||
preorder_days_help: 'Tage bis zur Verfügbarkeit nach Bestellung',
|
||||
},
|
||||
step4: {
|
||||
title: 'Historischer Bestellimport',
|
||||
description: 'Importieren Sie Ihre bestehenden Bestellungen von Letzshop, um sie in Wizamart zu verwalten.',
|
||||
days_back: 'Bestellungen der letzten importieren',
|
||||
days: 'Tage',
|
||||
start_import: 'Import Starten',
|
||||
importing: 'Importiere...',
|
||||
import_complete: 'Import Abgeschlossen!',
|
||||
orders_imported: 'Bestellungen importiert',
|
||||
skip_step: 'Diesen Schritt überspringen',
|
||||
},
|
||||
buttons: {
|
||||
save_continue: 'Speichern & Fortfahren',
|
||||
saving: 'Speichern...',
|
||||
back: 'Zurück',
|
||||
complete: 'Einrichtung Abschließen',
|
||||
retry: 'Erneut versuchen',
|
||||
},
|
||||
loading: 'Ihre Einrichtung wird geladen...',
|
||||
errors: {
|
||||
load_failed: 'Onboarding-Status konnte nicht geladen werden',
|
||||
save_failed: 'Speichern fehlgeschlagen. Bitte versuchen Sie es erneut.',
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
function vendorOnboarding(initialLang = 'en') {
|
||||
return {
|
||||
// Language
|
||||
lang: initialLang || localStorage.getItem('onboarding_lang') || 'en',
|
||||
availableLanguages: ['en', 'fr', 'de'],
|
||||
languageNames: { en: 'English', fr: 'Français', de: 'Deutsch' },
|
||||
languageFlags: { en: '🇬🇧', fr: '🇫🇷', de: '🇩🇪' },
|
||||
|
||||
// Translation helper
|
||||
t(key) {
|
||||
const keys = key.split('.');
|
||||
let value = onboardingTranslations[this.lang];
|
||||
for (const k of keys) {
|
||||
value = value?.[k];
|
||||
}
|
||||
return value || key;
|
||||
},
|
||||
|
||||
// Change language
|
||||
setLang(newLang) {
|
||||
this.lang = newLang;
|
||||
localStorage.setItem('onboarding_lang', newLang);
|
||||
},
|
||||
|
||||
// State
|
||||
loading: true,
|
||||
saving: false,
|
||||
testing: false,
|
||||
error: null,
|
||||
|
||||
// Steps configuration (will be populated with translated titles)
|
||||
get steps() {
|
||||
return [
|
||||
{ id: 'company_profile', title: this.t('steps.company_profile') },
|
||||
{ id: 'letzshop_api', title: this.t('steps.letzshop_api') },
|
||||
{ id: 'product_import', title: this.t('steps.product_import') },
|
||||
{ id: 'order_sync', title: this.t('steps.order_sync') },
|
||||
];
|
||||
},
|
||||
|
||||
// Current state
|
||||
currentStep: 'company_profile',
|
||||
completedSteps: 0,
|
||||
status: null,
|
||||
|
||||
// Form data
|
||||
formData: {
|
||||
// Step 1: Company Profile
|
||||
company_name: '',
|
||||
brand_name: '',
|
||||
description: '',
|
||||
contact_email: '',
|
||||
contact_phone: '',
|
||||
website: '',
|
||||
business_address: '',
|
||||
tax_number: '',
|
||||
default_language: 'fr',
|
||||
dashboard_language: 'fr',
|
||||
|
||||
// Step 2: Letzshop API
|
||||
api_key: '',
|
||||
shop_slug: '',
|
||||
|
||||
// Step 3: Product Import
|
||||
csv_url_fr: '',
|
||||
csv_url_en: '',
|
||||
csv_url_de: '',
|
||||
default_tax_rate: 17,
|
||||
delivery_method: 'package_delivery',
|
||||
preorder_days: 1,
|
||||
|
||||
// Step 4: Order Sync
|
||||
days_back: 90,
|
||||
},
|
||||
|
||||
// Letzshop connection test state
|
||||
connectionStatus: null, // null, 'success', 'failed'
|
||||
connectionError: null,
|
||||
|
||||
// Order sync state
|
||||
syncJobId: null,
|
||||
syncProgress: 0,
|
||||
syncPhase: '',
|
||||
ordersImported: 0,
|
||||
syncComplete: false,
|
||||
syncPollInterval: null,
|
||||
|
||||
// Computed
|
||||
get currentStepIndex() {
|
||||
return this.steps.findIndex(s => s.id === this.currentStep);
|
||||
},
|
||||
|
||||
// Initialize
|
||||
async init() {
|
||||
// Guard against multiple initialization
|
||||
if (window._vendorOnboardingInitialized) return;
|
||||
window._vendorOnboardingInitialized = true;
|
||||
|
||||
try {
|
||||
await this.loadStatus();
|
||||
} catch (error) {
|
||||
onboardingLog.error('Failed to initialize onboarding:', error);
|
||||
}
|
||||
},
|
||||
|
||||
// Load current onboarding status
|
||||
async loadStatus() {
|
||||
this.loading = true;
|
||||
this.error = null;
|
||||
|
||||
try {
|
||||
const response = await apiClient.get('/vendor/onboarding/status');
|
||||
this.status = response;
|
||||
this.currentStep = response.current_step;
|
||||
this.completedSteps = response.completed_steps_count;
|
||||
|
||||
// Pre-populate form data from status if available
|
||||
if (response.company_profile?.data) {
|
||||
Object.assign(this.formData, response.company_profile.data);
|
||||
}
|
||||
|
||||
// Check if we were in the middle of an order sync
|
||||
if (response.order_sync?.job_id && this.currentStep === 'order_sync') {
|
||||
this.syncJobId = response.order_sync.job_id;
|
||||
this.startSyncPolling();
|
||||
}
|
||||
|
||||
// Load step-specific data
|
||||
await this.loadStepData();
|
||||
} catch (err) {
|
||||
onboardingLog.error('Failed to load onboarding status:', err);
|
||||
this.error = err.message || 'Failed to load onboarding status';
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
// Load data for current step
|
||||
async loadStepData() {
|
||||
try {
|
||||
if (this.currentStep === 'company_profile') {
|
||||
const data = await apiClient.get('/vendor/onboarding/step/company-profile');
|
||||
if (data) {
|
||||
Object.assign(this.formData, data);
|
||||
}
|
||||
} else if (this.currentStep === 'product_import') {
|
||||
const data = await apiClient.get('/vendor/onboarding/step/product-import');
|
||||
if (data) {
|
||||
Object.assign(this.formData, {
|
||||
csv_url_fr: data.csv_url_fr || '',
|
||||
csv_url_en: data.csv_url_en || '',
|
||||
csv_url_de: data.csv_url_de || '',
|
||||
default_tax_rate: data.default_tax_rate || 17,
|
||||
delivery_method: data.delivery_method || 'package_delivery',
|
||||
preorder_days: data.preorder_days || 1,
|
||||
});
|
||||
}
|
||||
}
|
||||
} catch (err) {
|
||||
onboardingLog.warn('Failed to load step data:', err);
|
||||
}
|
||||
},
|
||||
|
||||
// Check if a step is completed
|
||||
isStepCompleted(stepId) {
|
||||
if (!this.status) return false;
|
||||
const stepData = this.status[stepId];
|
||||
return stepData?.completed === true;
|
||||
},
|
||||
|
||||
// Go to previous step
|
||||
goToPreviousStep() {
|
||||
const prevIndex = this.currentStepIndex - 1;
|
||||
if (prevIndex >= 0) {
|
||||
this.currentStep = this.steps[prevIndex].id;
|
||||
this.loadStepData();
|
||||
}
|
||||
},
|
||||
|
||||
// Test Letzshop API connection
|
||||
async testLetzshopApi() {
|
||||
this.testing = true;
|
||||
this.connectionStatus = null;
|
||||
this.connectionError = null;
|
||||
|
||||
try {
|
||||
const response = await apiClient.post('/vendor/onboarding/step/letzshop-api/test', {
|
||||
api_key: this.formData.api_key,
|
||||
shop_slug: this.formData.shop_slug,
|
||||
});
|
||||
|
||||
if (response.success) {
|
||||
this.connectionStatus = 'success';
|
||||
} else {
|
||||
this.connectionStatus = 'failed';
|
||||
this.connectionError = response.message;
|
||||
}
|
||||
} catch (err) {
|
||||
this.connectionStatus = 'failed';
|
||||
this.connectionError = err.message || 'Connection test failed';
|
||||
} finally {
|
||||
this.testing = false;
|
||||
}
|
||||
},
|
||||
|
||||
// Start order sync
|
||||
async startOrderSync() {
|
||||
this.saving = true;
|
||||
|
||||
try {
|
||||
const response = await apiClient.post('/vendor/onboarding/step/order-sync/trigger', {
|
||||
days_back: parseInt(this.formData.days_back),
|
||||
include_products: true,
|
||||
});
|
||||
|
||||
if (response.success && response.job_id) {
|
||||
this.syncJobId = response.job_id;
|
||||
this.startSyncPolling();
|
||||
} else {
|
||||
throw new Error(response.message || 'Failed to start import');
|
||||
}
|
||||
} catch (err) {
|
||||
onboardingLog.error('Failed to start order sync:', err);
|
||||
this.error = err.message || 'Failed to start import';
|
||||
} finally {
|
||||
this.saving = false;
|
||||
}
|
||||
},
|
||||
|
||||
// Start polling for sync progress
|
||||
startSyncPolling() {
|
||||
this.syncPollInterval = setInterval(async () => {
|
||||
await this.pollSyncProgress();
|
||||
}, 2000);
|
||||
},
|
||||
|
||||
// Poll sync progress
|
||||
async pollSyncProgress() {
|
||||
try {
|
||||
const response = await apiClient.get(
|
||||
`/vendor/onboarding/step/order-sync/progress/${this.syncJobId}`
|
||||
);
|
||||
|
||||
this.syncProgress = response.progress_percentage || 0;
|
||||
this.syncPhase = this.formatPhase(response.current_phase);
|
||||
this.ordersImported = response.orders_imported || 0;
|
||||
|
||||
if (response.status === 'completed' || response.status === 'failed') {
|
||||
this.stopSyncPolling();
|
||||
this.syncComplete = true;
|
||||
this.syncProgress = response.status === 'completed' ? 100 : this.syncProgress;
|
||||
}
|
||||
} catch (err) {
|
||||
onboardingLog.error('Failed to poll sync progress:', err);
|
||||
}
|
||||
},
|
||||
|
||||
// Stop sync polling
|
||||
stopSyncPolling() {
|
||||
if (this.syncPollInterval) {
|
||||
clearInterval(this.syncPollInterval);
|
||||
this.syncPollInterval = null;
|
||||
}
|
||||
},
|
||||
|
||||
// Format phase for display
|
||||
formatPhase(phase) {
|
||||
const phases = {
|
||||
fetching: 'Fetching orders from Letzshop...',
|
||||
orders: 'Processing orders...',
|
||||
products: 'Importing products...',
|
||||
finalizing: 'Finalizing import...',
|
||||
complete: 'Import complete!',
|
||||
};
|
||||
return phases[phase] || 'Processing...';
|
||||
},
|
||||
|
||||
// Save current step and continue
|
||||
async saveAndContinue() {
|
||||
this.saving = true;
|
||||
this.error = null;
|
||||
|
||||
try {
|
||||
let endpoint = '';
|
||||
let payload = {};
|
||||
|
||||
switch (this.currentStep) {
|
||||
case 'company_profile':
|
||||
endpoint = '/vendor/onboarding/step/company-profile';
|
||||
payload = {
|
||||
company_name: this.formData.company_name,
|
||||
brand_name: this.formData.brand_name,
|
||||
description: this.formData.description,
|
||||
contact_email: this.formData.contact_email,
|
||||
contact_phone: this.formData.contact_phone,
|
||||
website: this.formData.website,
|
||||
business_address: this.formData.business_address,
|
||||
tax_number: this.formData.tax_number,
|
||||
default_language: this.formData.default_language,
|
||||
dashboard_language: this.formData.dashboard_language,
|
||||
};
|
||||
break;
|
||||
|
||||
case 'letzshop_api':
|
||||
endpoint = '/vendor/onboarding/step/letzshop-api';
|
||||
payload = {
|
||||
api_key: this.formData.api_key,
|
||||
shop_slug: this.formData.shop_slug,
|
||||
};
|
||||
break;
|
||||
|
||||
case 'product_import':
|
||||
endpoint = '/vendor/onboarding/step/product-import';
|
||||
payload = {
|
||||
csv_url_fr: this.formData.csv_url_fr || null,
|
||||
csv_url_en: this.formData.csv_url_en || null,
|
||||
csv_url_de: this.formData.csv_url_de || null,
|
||||
default_tax_rate: parseInt(this.formData.default_tax_rate),
|
||||
delivery_method: this.formData.delivery_method,
|
||||
preorder_days: parseInt(this.formData.preorder_days),
|
||||
};
|
||||
break;
|
||||
|
||||
case 'order_sync':
|
||||
// Complete onboarding
|
||||
endpoint = '/vendor/onboarding/step/order-sync/complete';
|
||||
payload = {
|
||||
job_id: this.syncJobId,
|
||||
};
|
||||
break;
|
||||
}
|
||||
|
||||
const response = await apiClient.post(endpoint, payload);
|
||||
|
||||
if (!response.success) {
|
||||
throw new Error(response.message || 'Save failed');
|
||||
}
|
||||
|
||||
// Handle completion
|
||||
if (response.onboarding_completed || response.redirect_url) {
|
||||
// Redirect to dashboard
|
||||
window.location.href = response.redirect_url || window.location.pathname.replace('/onboarding', '/dashboard');
|
||||
return;
|
||||
}
|
||||
|
||||
// Move to next step
|
||||
if (response.next_step) {
|
||||
this.currentStep = response.next_step;
|
||||
this.completedSteps++;
|
||||
await this.loadStepData();
|
||||
}
|
||||
|
||||
} catch (err) {
|
||||
onboardingLog.error('Failed to save step:', err);
|
||||
this.error = err.message || 'Failed to save. Please try again.';
|
||||
} finally {
|
||||
this.saving = false;
|
||||
}
|
||||
},
|
||||
|
||||
// Logout handler
|
||||
async handleLogout() {
|
||||
onboardingLog.info('Logging out from onboarding...');
|
||||
|
||||
// Get vendor code from URL
|
||||
const path = window.location.pathname;
|
||||
const segments = path.split('/').filter(Boolean);
|
||||
const vendorCode = segments[0] === 'vendor' && segments[1] ? segments[1] : '';
|
||||
|
||||
try {
|
||||
// Call logout API
|
||||
await apiClient.post('/vendor/auth/logout');
|
||||
onboardingLog.info('Logout API called successfully');
|
||||
} catch (error) {
|
||||
onboardingLog.warn('Logout API error (continuing anyway):', error);
|
||||
} finally {
|
||||
// Clear vendor tokens only (not admin or customer tokens)
|
||||
onboardingLog.info('Clearing vendor tokens...');
|
||||
localStorage.removeItem('vendor_token');
|
||||
localStorage.removeItem('vendor_user');
|
||||
localStorage.removeItem('currentUser');
|
||||
localStorage.removeItem('vendorCode');
|
||||
// Note: Do NOT use localStorage.clear() - it would clear admin/customer tokens too
|
||||
|
||||
onboardingLog.info('Redirecting to login...');
|
||||
window.location.href = `/vendor/${vendorCode}/login`;
|
||||
}
|
||||
},
|
||||
|
||||
// Dark mode
|
||||
get dark() {
|
||||
return localStorage.getItem('dark') === 'true' ||
|
||||
(!localStorage.getItem('dark') && window.matchMedia('(prefers-color-scheme: dark)').matches);
|
||||
},
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user