Files
orion/static/vendor/js/profile.js
Samir Boulahtit 463e1b67d5 feat: complete vendor frontend parity with admin
Phase 1 - Sidebar Refactor:
- Refactor sidebar to use collapsible sections with Alpine.js
- Add localStorage persistence for section states
- Reorganize navigation into logical groups

Phase 2 - Core JS Files:
- Add products.js: product CRUD, search, filtering, toggle active/featured
- Add orders.js: order list, status management, filtering
- Add inventory.js: stock tracking, adjust/set quantity modals
- Add customers.js: customer list, order history, messaging
- Add team.js: member invite, role management, remove members
- Add profile.js: profile editing with form validation
- Add settings.js: tabbed settings (general, marketplace, notifications)

Templates updated from placeholders to full functional UIs.
Vendor frontend now at ~90% parity with admin.

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

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-01 15:34:38 +01:00

191 lines
5.5 KiB
JavaScript

// static/vendor/js/profile.js
/**
* Vendor profile management page logic
* Edit vendor business profile and contact information
*/
const vendorProfileLog = window.LogConfig.loggers.vendorProfile ||
window.LogConfig.createLogger('vendorProfile', false);
vendorProfileLog.info('Loading...');
function vendorProfile() {
vendorProfileLog.info('vendorProfile() called');
return {
// Inherit base layout state
...data(),
// Set page identifier
currentPage: 'profile',
// Loading states
loading: true,
error: '',
saving: false,
// Profile data
profile: null,
// Edit form
form: {
name: '',
contact_email: '',
contact_phone: '',
website: '',
business_address: '',
tax_number: '',
description: ''
},
// Form validation
errors: {},
// Track if form has changes
hasChanges: false,
async init() {
vendorProfileLog.info('Profile init() called');
// Guard against multiple initialization
if (window._vendorProfileInitialized) {
vendorProfileLog.warn('Already initialized, skipping');
return;
}
window._vendorProfileInitialized = true;
try {
await this.loadProfile();
} catch (error) {
vendorProfileLog.error('Init failed:', error);
this.error = 'Failed to initialize profile page';
}
vendorProfileLog.info('Profile initialization complete');
},
/**
* Load vendor profile
*/
async loadProfile() {
this.loading = true;
this.error = '';
try {
const response = await apiClient.get(`/vendor/${this.vendorCode}/profile`);
this.profile = response;
this.form = {
name: response.name || '',
contact_email: response.contact_email || '',
contact_phone: response.contact_phone || '',
website: response.website || '',
business_address: response.business_address || '',
tax_number: response.tax_number || '',
description: response.description || ''
};
this.hasChanges = false;
vendorProfileLog.info('Loaded profile:', this.profile.vendor_code);
} catch (error) {
vendorProfileLog.error('Failed to load profile:', error);
this.error = error.message || 'Failed to load profile';
} finally {
this.loading = false;
}
},
/**
* Mark form as changed
*/
markChanged() {
this.hasChanges = true;
},
/**
* Validate form
*/
validateForm() {
this.errors = {};
if (!this.form.name?.trim()) {
this.errors.name = 'Business name is required';
}
if (this.form.contact_email && !this.isValidEmail(this.form.contact_email)) {
this.errors.contact_email = 'Invalid email address';
}
if (this.form.website && !this.isValidUrl(this.form.website)) {
this.errors.website = 'Invalid URL format';
}
return Object.keys(this.errors).length === 0;
},
/**
* Check if email is valid
*/
isValidEmail(email) {
return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
},
/**
* Check if URL is valid
*/
isValidUrl(url) {
try {
new URL(url);
return true;
} catch {
return url.match(/^(https?:\/\/)?[\w-]+(\.[\w-]+)+/) !== null;
}
},
/**
* Save profile changes
*/
async saveProfile() {
if (!this.validateForm()) {
Utils.showToast('Please fix the errors before saving', 'error');
return;
}
this.saving = true;
try {
await apiClient.put(`/vendor/${this.vendorCode}/profile`, this.form);
Utils.showToast('Profile updated successfully', 'success');
vendorProfileLog.info('Profile updated');
this.hasChanges = false;
await this.loadProfile();
} catch (error) {
vendorProfileLog.error('Failed to save profile:', error);
Utils.showToast(error.message || 'Failed to save profile', 'error');
} finally {
this.saving = false;
}
},
/**
* Reset form to original values
*/
resetForm() {
if (this.profile) {
this.form = {
name: this.profile.name || '',
contact_email: this.profile.contact_email || '',
contact_phone: this.profile.contact_phone || '',
website: this.profile.website || '',
business_address: this.profile.business_address || '',
tax_number: this.profile.tax_number || '',
description: this.profile.description || ''
};
}
this.hasChanges = false;
this.errors = {};
}
};
}