Spaces:
Sleeping
Sleeping
| // ======================================== | |
| // 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); | |
| }); | |
| } | |