mtextylelastedweb / js /profile.js
ibrohm's picture
Initial deploy via assistant API
7b3aac2 verified
// ========================================
// PROFILE PAGE LOGIC
// ========================================
document.addEventListener('DOMContentLoaded', () => {
// Auth Check
if (!isLoggedIn()) {
window.location.href = 'index.html';
return;
}
loadProfile();
loadOrders();
setupNavigation();
setupSaveProfile();
setupAddresses();
setupLogout();
});
function loadProfile() {
const user = getUser();
document.getElementById('pName').value = user.name || '';
document.getElementById('pPhone').value = user.phone || '';
document.getElementById('pEmail').value = user.email || '';
document.getElementById('profileName').textContent = user.name || 'Foydalanuvchi';
document.getElementById('profileEmail').textContent = user.email || user.phone || '—';
document.getElementById('profileAvatar').textContent = (user.name || 'U')[0].toUpperCase();
}
function setupSaveProfile() {
document.getElementById('saveProfileBtn').addEventListener('click', () => {
const name = document.getElementById('pName').value.trim();
const phone = document.getElementById('pPhone').value.trim();
const email = document.getElementById('pEmail').value.trim();
saveUser({ name, phone, email });
loadProfile();
showToast('Saqlandi', 'Ma\'lumotlaringiz yangilandi', 'success');
});
}
function setupNavigation() {
document.querySelectorAll('.profile-nav a').forEach(link => {
link.addEventListener('click', (e) => {
if (link.id === 'logoutBtn') return; // Handled separately
e.preventDefault();
document.querySelectorAll('.profile-nav a').forEach(l => l.classList.remove('active'));
link.classList.add('active');
const section = link.dataset.section;
document.querySelectorAll('[id^="section-"]').forEach(s => s.style.display = 'none');
document.getElementById('section-' + section).style.display = 'block';
});
});
}
function setupLogout() {
const btn = document.getElementById('logoutBtn');
if (btn) {
btn.addEventListener('click', (e) => {
e.preventDefault();
if (confirm('Tizimdan chiqmoqchimisiz?')) {
logoutUser();
window.location.href = 'index.html';
}
});
}
}
function loadOrders() {
const orders = getUserOrders();
const container = document.getElementById('ordersList');
const empty = document.getElementById('emptyOrders');
if (orders.length === 0) { empty.style.display = 'block'; return; }
empty.style.display = 'none';
const statusLabels = { 'Kutilmoqda': 'Kutilmoqda', 'Olib ketildi': 'Olib ketildi', 'Bekor qilindi': 'Bekor qilindi' };
orders.forEach(order => {
const date = new Date(order.createdAt).toLocaleDateString('uz-UZ');
const card = document.createElement('div');
card.className = 'order-card';
card.innerHTML = `
<div class="order-header">
<div>
<div class="order-id">${order.id}</div>
<div class="order-date">${date}</div>
</div>
<span class="order-status ${order.status}">${statusLabels[order.status] || order.status}</span>
</div>
<div class="order-items">
${(order.items || []).map(item => `
<div class="order-item-thumb">
<img src="${item.image || ''}" alt="${item.name || ''}">
</div>
`).join('')}
</div>
<div class="order-total">Jami: ${formatPrice(order.totals?.total || 0)}</div>
`;
container.appendChild(card);
});
}
function setupAddresses() {
const user = getUser();
const addresses = user.addresses || [];
renderAddresses(addresses);
document.getElementById('addAddressBtn').addEventListener('click', () => {
const address = prompt('Yangi manzilni kiriting:');
if (address && address.trim()) {
const u = getUser();
u.addresses = u.addresses || [];
u.addresses.push(address.trim());
saveUser(u);
renderAddresses(u.addresses);
showToast('Qo\'shildi', 'Yangi manzil saqlandi', 'success');
}
});
}
function renderAddresses(addresses) {
const container = document.getElementById('addressList');
container.innerHTML = '';
if (addresses.length === 0) {
container.innerHTML = '<p style="color:var(--clr-text-muted)">Saqlangan manzillar yo\'q</p>';
return;
}
addresses.forEach((addr, i) => {
const el = document.createElement('div');
el.style.cssText = 'padding:1rem;border:1px solid var(--clr-border);border-radius:var(--radius-md);margin-bottom:0.75rem;display:flex;justify-content:space-between;align-items:center;';
el.innerHTML = `
<div>
<div style="font-size:0.85rem;color:var(--clr-text-muted)">Manzil ${i + 1}</div>
<div>${addr}</div>
</div>
<button class="btn btn-ghost btn-sm" style="color:var(--clr-error)" data-idx="${i}">O'chirish</button>
`;
el.querySelector('button').addEventListener('click', () => {
const u = getUser();
u.addresses.splice(i, 1);
saveUser(u);
renderAddresses(u.addresses);
showToast('O\'chirildi', 'Manzil o\'chirildi', 'info');
});
container.appendChild(el);
});
}