Order #ORD-2024-001

Placed on January 15, 2024

Delivered

Order Timeline

Delivered

January 18, 2024, 2:30 PM

Package delivered to your doorstep

Out for Delivery

January 18, 2024, 10:00 AM

Package is on the way

Shipped

January 16, 2024, 5:00 PM

Package dispatched from warehouse

Processing

January 15, 2024, 3:00 PM

Order being prepared

Order Placed

January 15, 2024, 1:30 PM

Order confirmed

Order Items

Product

Premium Basmati Rice

5 Kg Pack

Qty: 2 ₹1,299
Product

Organic Turmeric Powder

200g Pack

Qty: 1 ₹249
Product

Kashmiri Saffron

1g Premium Quality

Qty: 1 ₹899
Product

Traditional Cotton Kurta

Size: L, Color: White

Qty: 1 ₹1,499

Payment Summary

Subtotal ₹3,946
Delivery Charges FREE
Tax (GST 5%) ₹197
Discount (10%) -₹395
Total ₹3,748
Paid via Credit Card •••• 4242

Shipping Address

Rajesh Kumar

Flat 301, Lotus Apartments
MG Road, Sector 14
Bangalore, Karnataka 560001
India

+91 98765 43210

Need Help?

Contact our customer support for any issues

`; } function generateInvoiceHTML(orderId) { const orderData = OrderDetailsManager.orderData; // Use API data if available, otherwise use static fallback if (orderData && orderData.items) { const itemsRows = orderData.items.map(item => `${item.product_name}${item.variant_name ? ' (' + item.variant_name + ')' : ''}${item.quantity}Rs. ${Number(item.unit_price).toFixed(2)}Rs. ${Number(item.total_amount || item.unit_price * item.quantity).toFixed(2)}` ).join(''); return ` Invoice - ${orderData.order_number}

Tax Invoice

Invoice Number: INV-${orderData.order_number}

Order Number: ${orderData.order_number}

Date: ${new Date(orderData.created_at).toLocaleDateString()}

${itemsRows}
ItemQtyPriceTotal

Subtotal: Rs. ${Number(orderData.subtotal).toFixed(2)}

Tax (GST): Rs. ${Number(orderData.tax_total).toFixed(2)}

Shipping: Rs. ${Number(orderData.shipping_total).toFixed(2)}

Discount: -Rs. ${Number(orderData.discount_total).toFixed(2)}

Grand Total: Rs. ${Number(orderData.total_amount).toFixed(2)}

`; } // Static fallback return ` Invoice - ${orderId}

Tax Invoice

Invoice Number: INV-${orderId}

Order Number: ${orderId}

Date: ${new Date().toLocaleDateString()}

Customer: Rajesh Kumar

ItemQtyPriceTotal
Premium Basmati Rice (5 Kg Pack)2Rs. 649.50Rs. 1,299
Organic Turmeric Powder (200g Pack)1Rs. 249Rs. 249
Kashmiri Saffron (1g Premium Quality)1Rs. 899Rs. 899
Traditional Cotton Kurta (Size: L)1Rs. 1,499Rs. 1,499

Subtotal: Rs. 3,946

Tax (GST 5%): Rs. 197

Discount: -Rs. 395

Grand Total: Rs. 3,748

`; } // Reorder - Add items to cart via API async function reorder() { const orderId = OrderDetailsManager.orderId || 'ORD-2024-001'; if (!confirm('Add all items from this order to your cart?')) { return; } OrderDetailsManager.showNotification('Adding items to cart...', 'info'); try { // Call reorder API endpoint - POST /orders/{order_id}/reorder const result = await authenticatedFetch(`/orders/${orderId}/reorder`, { method: 'POST' }); OrderDetailsManager.showNotification(`${result.items_added || result.itemsAdded || 'Items'} added to cart!`, 'success'); // Redirect to cart after short delay setTimeout(() => { window.location.href = '../mobile/mobile-cart.html'; }, 1500); } catch (error) { console.error('Failed to reorder via API:', error); if (error.status === 401) { OrderDetailsManager.showNotification('Please log in to reorder', 'error'); return; } if (error.status === 404) { OrderDetailsManager.showNotification('Order not found', 'error'); return; } // Fallback: Add to localStorage cart using order data if available const cartItems = JSON.parse(localStorage.getItem('cart') || '[]'); let orderItems = []; if (OrderDetailsManager.orderData && OrderDetailsManager.orderData.items) { orderItems = OrderDetailsManager.orderData.items.map(item => ({ id: item.product_id, name: item.product_name, price: Number(item.unit_price), quantity: item.quantity, variant_id: item.variant_id, variant_name: item.variant_name })); } else { // Static fallback data orderItems = [ { id: 'rice-001', name: 'Premium Basmati Rice', price: 649.50, quantity: 2 }, { id: 'spice-001', name: 'Organic Turmeric Powder', price: 249, quantity: 1 }, { id: 'spice-002', name: 'Kashmiri Saffron', price: 899, quantity: 1 }, { id: 'cloth-001', name: 'Traditional Cotton Kurta', price: 1499, quantity: 1 } ]; } orderItems.forEach(item => { const existingIndex = cartItems.findIndex(c => c.id === item.id && c.variant_id === item.variant_id); if (existingIndex >= 0) { cartItems[existingIndex].quantity += item.quantity; } else { cartItems.push(item); } }); localStorage.setItem('cart', JSON.stringify(cartItems)); OrderDetailsManager.showNotification(`${orderItems.length} items added to cart!`, 'success'); setTimeout(() => { window.location.href = '../mobile/mobile-cart.html'; }, 1500); } } // Cancel Order - Cancel order via API async function cancelOrder() { const orderId = OrderDetailsManager.orderId || 'ORD-2024-001'; if (!confirm('Are you sure you want to cancel this order? This action cannot be undone.')) { return; } OrderDetailsManager.showNotification('Cancelling order...', 'info'); try { // Call cancel API endpoint - PUT /orders/{order_id}/cancel const result = await authenticatedFetch(`/orders/${orderId}/cancel`, { method: 'PUT' }); OrderDetailsManager.showNotification('Order cancelled successfully', 'success'); // Refresh order details to show updated status await OrderDetailsManager.loadOrderDetails(); } catch (error) { console.error('Failed to cancel order:', error); if (error.status === 401) { OrderDetailsManager.showNotification('Please log in to cancel order', 'error'); } else if (error.status === 404) { OrderDetailsManager.showNotification('Order not found', 'error'); } else if (error.status === 400) { OrderDetailsManager.showNotification(error.message || 'Order cannot be cancelled at this stage', 'error'); } else { OrderDetailsManager.showNotification('Failed to cancel order. Please try again.', 'error'); } } } // Update Order - Update order notes or shipping address via API async function updateOrder(updateData) { const orderId = OrderDetailsManager.orderId || 'ORD-2024-001'; try { // Call update API endpoint - PUT /orders/{order_id} const result = await authenticatedFetch(`/orders/${orderId}`, { method: 'PUT', body: JSON.stringify(updateData) }); OrderDetailsManager.showNotification('Order updated successfully', 'success'); // Refresh order details await OrderDetailsManager.loadOrderDetails(); return result; } catch (error) { console.error('Failed to update order:', error); if (error.status === 401) { OrderDetailsManager.showNotification('Please log in to update order', 'error'); } else if (error.status === 404) { OrderDetailsManager.showNotification('Order not found', 'error'); } else if (error.status === 400) { OrderDetailsManager.showNotification(error.message || 'Order cannot be modified at this stage', 'error'); } else { OrderDetailsManager.showNotification('Failed to update order. Please try again.', 'error'); } throw error; } } // Contact Support - Open support chat/modal function contactSupport() { const orderId = OrderDetailsManager.orderId || 'ORD-2024-001'; // Create support modal const modal = document.createElement('div'); modal.id = 'support-modal'; modal.className = 'fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50'; modal.innerHTML = `

Customer Support

Order ID: #${orderId}

Email Support

Average response time: Under 5 minutes

`; document.body.appendChild(modal); // Close on backdrop click modal.addEventListener('click', (e) => { if (e.target === modal) closeSupportModal(); }); } function closeSupportModal() { const modal = document.getElementById('support-modal'); if (modal) modal.remove(); } function startLiveChat() { closeSupportModal(); OrderDetailsManager.showNotification('Connecting to live chat...', 'info'); // In production, this would open a chat widget (e.g., Intercom, Zendesk) window.open('https://indianshopping.com/support/chat', '_blank'); } function callSupportLine() { closeSupportModal(); window.location.href = 'tel:+18004634426'; } // Initialize on page load window.addEventListener('DOMContentLoaded', () => { OrderDetailsManager.init(); }); // ============================================ // API WIRING - Backend Integration // ============================================ // Load order details from backend async function loadOrderDetails(orderId) { try { const response = await fetch(`/api/orders/${orderId}`); if (!response.ok) throw new Error('Failed to load order'); return await response.json(); } catch (error) { console.error('Order details API error:', error); return null; } } // Get order tracking async function getOrderTracking(orderId) { try { const response = await fetch(`/api/orders/${orderId}/tracking`); if (!response.ok) throw new Error('Failed to get tracking'); return await response.json(); } catch (error) { console.error('Order tracking API error:', error); return null; } } // Cancel order async function cancelOrder(orderId) { try { const response = await fetch(`/api/orders/${orderId}/cancel`, { method: 'PUT' }); if (!response.ok) throw new Error('Failed to cancel order'); showNotification('Order cancelled successfully', 'success'); return await response.json(); } catch (error) { console.error('Cancel order API error:', error); showNotification('Failed to cancel order', 'error'); return null; } } // Reorder items async function reorderItems(orderId) { try { const response = await fetch(`/api/orders/${orderId}/reorder`, { method: 'POST' }); if (!response.ok) throw new Error('Failed to reorder'); showNotification('Items added to cart', 'success'); return await response.json(); } catch (error) { console.error('Reorder API error:', error); showNotification('Failed to add items to cart', 'error'); return null; } } // Initialize: load order details from URL param (function() { const urlParams = new URLSearchParams(window.location.search); const orderId = urlParams.get('id') || urlParams.get('order_id'); if (orderId) loadOrderDetails(orderId); })();