SP Zone — Wholesale

Loading…

Welcome

New Registration

First Name *

Last Name *

Business / Workshop Name *

Mobile *

City

Email Address *

Password * (min 6 characters)

📎 Business Documents (Optional — speeds up invoicing)

🏢Commercial Registration (CR) 📋VAT Certificate (شهادة الضريبة) 📍National Address (العنوان الوطني)

✉ Emails sent automatically after registration

Admin Email

Password

← Back to customer login

✦ Parts for

Toyota

Hyundai

Honda

Mazda

Kia

Nissan

Ford

BMW

Mercedes

Toyota

Hyundai

Honda

Mazda

Kia

Nissan

Ford

BMW

Changan

Geely

GAC

Haval

GWM

Shell

Kixx

AMS Oil

Lucas Oil

Toyota

Hyundai

Honda

Mazda

Kia

Nissan

Ford

BMW

Mercedes

Mitsubishi

Isuzu

Suzuki

Changan

Geely

GAC

Haval

GWM

Shell

Kixx

AMS Oil

Lucas Oil

🎉

Registration Submitted!

Your account request has been received. Our team will contact you to activate your account. In the meantime, browse our catalog, add the parts you need to your cart, and submit your order request.

All Parts

📋 Bulk Order Request

Download the Excel template, fill in your part numbers and quantities, then upload it here.

Download Template

Excel file with correct format

Fill in Your Order

Part Number, Part Name, Quantity

Part NumberPart NameQuantity TY-1234Oil Filter10

Upload & Submit

Upload your filled Excel file

📁

Click or drag & drop

Excel files only (.xlsx, .xls)

🛒 Your Spare Parts Request

Order Summary

Note to supplier (optional)

📧 You will receive an email confirmation immediately.

📋 My Orders

📬

Order Request Submitted!

Your spare parts request has been received and is being reviewed by our team. You will receive an email once it is confirmed and being processed.

ORD-000000

Dashboard

Recent Orders

📋 Bulk Order Requests

All Orders

Parts Catalog

📥 Import Parts from Excel

Required Columns

• Part Number

• Description

• Brand

• Category

• Compatible Models

• Price (SAR)

• Stock Qty

• Min Order Qty

📊

Click to upload or drag & drop

.xlsx / .xls / .csv supported

Preview

Add New Part

Part Number *

Brand *

Description *

Category *

Compatible Models

Price (SAR) *

Stock Qty *

Min Order Qty

Registered Customers

#	Name	Business	Mobile	Email	City	Registered	Status	Action

`; } // 1. Email to customer after registration async function sendWelcomeEmail(customer) { const body = `

Welcome to SP Zone! 🎉

Dear ${customer.first_name} ${customer.last_name},

Thank you for registering with SP Zone Wholesale. Your account has been received and is currently under review.

Account Details:
Business: ${customer.business}
Email: ${customer.email}
Mobile: ${customer.mobile}

Our team will review your application and activate your account shortly. You will receive a confirmation email once approved.

If you have any questions, please contact us at info@spzones.com

`; await sendEmail(customer.email, 'Welcome to SP Zone - Registration Received', emailTemplate('Welcome', body)); } // 2. Email to admin when new customer registers async function sendAdminNewCustomerEmail(customer) { const body = `

New Customer Registration 👤

A new customer has registered and is awaiting approval:

Name	${customer.first_name} ${customer.last_name}
Business	${customer.business}
Email	${customer.email}
Mobile	${customer.mobile}

Please log in to the admin panel to review and approve this account.

Open Admin Panel →`; await sendEmail('spzone.online@gmail.com', '⚡ New Customer Registration - ' + customer.first_name + ' ' + customer.last_name, emailTemplate('New Customer', body)); } // 3. Email to customer after placing order async function generateQuotePDF(customer, order, items) { const { jsPDF } = window.jspdf; const doc = new jsPDF({ orientation: 'portrait', unit: 'mm', format: 'a4' }); const ref = 'ORD-' + String(order.id).padStart(6,'0'); const date = new Date().toLocaleDateString('en-GB'); const W = 210, m = 15; // Header doc.setFillColor(27, 58, 107); doc.rect(0, 0, W, 35, 'F'); doc.setTextColor(245, 184, 0); doc.setFontSize(22); doc.setFont('helvetica','bold'); doc.text('SP ZONE', m, 14); doc.setFontSize(8); doc.setFont('helvetica','normal'); doc.setTextColor(200, 215, 235); doc.text('Safe Drive Auto Parts | CR: 4650285717 | VAT: 310627914800003', m, 20); doc.text('2881 Al Madinah Al Munawwarah, KSA | spzones.com', m, 26); doc.setTextColor(255,255,255); doc.setFontSize(16); doc.setFont('helvetica','bold'); doc.text('PRICE QUOTATION', W-m, 14, {align:'right'}); doc.setFontSize(9); doc.setFont('helvetica','normal'); doc.setTextColor(245,184,0); doc.text(ref, W-m, 21, {align:'right'}); doc.setTextColor(200,215,235); doc.text(date, W-m, 27, {align:'right'}); // Gold bar doc.setFillColor(245, 184, 0); doc.rect(0, 35, W, 2, 'F'); // Bill To let y = 46; doc.setTextColor(27,58,107); doc.setFontSize(9); doc.setFont('helvetica','bold'); doc.text('BILL TO:', m, y); doc.setFont('helvetica','normal'); doc.setTextColor(50,50,50); doc.setFontSize(9); doc.text(customer.first_name + ' ' + customer.last_name, m, y+6); doc.text(customer.business || '', m, y+12); doc.text(customer.email, m, y+18); doc.text(customer.mobile || '', m, y+24); // Validity box doc.setFillColor(245,248,255); doc.rect(W-m-55, y-3, 55, 28, 'F'); doc.setTextColor(27,58,107); doc.setFont('helvetica','bold'); doc.setFontSize(8); doc.text('VALID FOR:', W-m-52, y+3); doc.setFont('helvetica','normal'); doc.setTextColor(80,80,80); doc.text('30 days from issue', W-m-52, y+9); doc.setTextColor(27,58,107); doc.setFont('helvetica','bold'); doc.text('STATUS:', W-m-52, y+17); doc.setTextColor(180,100,0); doc.setFont('helvetica','normal'); doc.text('Pending Approval', W-m-52, y+23); // Table header y = 82; doc.setFillColor(27,58,107); doc.rect(m, y, W-m*2, 8, 'F'); doc.setTextColor(255,255,255); doc.setFontSize(8); doc.setFont('helvetica','bold'); doc.text('#', m+2, y+5.5); doc.text('Part Number', m+10, y+5.5); doc.text('Description', m+42, y+5.5); doc.text('Qty', W-m-38, y+5.5, {align:'right'}); doc.text('Unit Price', W-m-20, y+5.5, {align:'right'}); doc.text('Total SAR', W-m, y+5.5, {align:'right'}); y += 8; const subtotal = items.reduce((s,i) => s+(Number(i.price)||0)*(Number(i.qty)||0), 0); items.forEach((item, idx) => { doc.setFillColor(idx%2===0 ? 245 : 255, idx%2===0 ? 248 : 255, 255); doc.rect(m, y, W-m*2, 8, 'F'); doc.setTextColor(60,60,60); doc.setFont('helvetica','normal'); doc.setFontSize(8); doc.text(String(idx+1), m+2, y+5.5); doc.setTextColor(27,58,107); doc.setFont('helvetica','bold'); doc.text(String(item.num||''), m+10, y+5.5); doc.setFont('helvetica','normal'); doc.setTextColor(60,60,60); const d = String(item.desc||''); doc.text(d.length>38 ? d.substring(0,38)+'…' : d, m+42, y+5.5); doc.text(String(item.qty||0), W-m-38, y+5.5, {align:'right'}); doc.text(Number(item.price||0).toFixed(2), W-m-20, y+5.5, {align:'right'}); doc.setFont('helvetica','bold'); doc.text(((Number(item.price)||0)*(Number(item.qty)||0)).toFixed(2), W-m, y+5.5, {align:'right'}); y += 8; }); // Border doc.setDrawColor(27,58,107); doc.setLineWidth(0.3); doc.rect(m, 82, W-m*2, y-82, 'S'); // Total y += 4; doc.setFillColor(27,58,107); doc.rect(W-m-55, y, 55, 12, 'F'); doc.setTextColor(255,255,255); doc.setFont('helvetica','bold'); doc.setFontSize(10); doc.text('TOTAL:', W-m-42, y+8); doc.setTextColor(245,184,0); doc.setFontSize(11); doc.text('SAR '+subtotal.toFixed(2), W-m-1, y+8, {align:'right'}); // Note if(order.note) { y += 18; doc.setFillColor(255,248,220); doc.rect(m, y, W-m*2, 14, 'F'); doc.setTextColor(27,58,107); doc.setFont('helvetica','bold'); doc.setFontSize(8); doc.text('NOTE:', m+3, y+6); doc.setFont('helvetica','normal'); doc.setTextColor(80,80,80); doc.text(String(order.note).substring(0,90), m+3, y+11); } // Footer doc.setFillColor(27,58,107); doc.rect(0, 275, W, 22, 'F'); doc.setFillColor(245,184,0); doc.rect(0, 275, W, 1.5, 'F'); doc.setTextColor(180,200,230); doc.setFont('helvetica','normal'); doc.setFontSize(7.5); doc.text('Safe Drive Auto Parts | CR: 4650285717 | VAT: 310627914800003 | spzones.com | info@spzones.com', W/2, 283, {align:'center'}); doc.setTextColor(255,255,255); doc.setFont('helvetica','bold'); doc.setFontSize(8.5); doc.text('Thank you for choosing SP Zone!', W/2, 290, {align:'center'}); return doc.output('datauristring').split(',')[1]; } async function sendOrderShippedEmail(customer, order) { const ref = 'ORD-' + String(order.id).padStart(6,'0'); const items = order.order_items || []; const rows = items.map((i,idx) => ` ${i.part_number||''} ${i.description||''} ${i.qty||0} SAR ${((Number(i.unit_price)||0)*(Number(i.qty)||0)).toFixed(2)} `).join(''); const html = `

SP ZONE

Safe Drive Auto Parts | spzones.com

🚚 Order Shipped

Your Order is On the Way! 🚚

Dear ${customer.first_name}, your order ${ref} has been shipped and is on its way to you.

📦 Total: SAR ${Number(order.total).toFixed(2)}

Our team will contact you to coordinate delivery.

${rows}

PART NO.

DESCRIPTION

QTY

TOTAL

For inquiries: info@spzones.com | spzones.com

Thank you for choosing SP Zone!

SP ZONE

Safe Drive Auto Parts | spzones.com

📦 Delivered

Order Delivered Successfully! 📦

Dear ${customer.first_name}, your order ${ref} has been delivered on ${date}.

DELIVERY NOTE

${ref} | ${date}

Delivered To:	${customer.first_name} ${customer.last_name}
Business:	${customer.business\|\|''}
Date:	${date}

${rows}

PART NO.

DESCRIPTION

QTY

TOTAL

Total: SAR ${Number(order.total).toFixed(2)}

Safe Drive Auto Parts | CR: 4650285717 | VAT: 310627914800003

2881 Al Madinah Al Munawwarah, KSA

Thank you for your business! For support: info@spzones.com

Thank you for choosing SP Zone!

`; try { await fetch('/.netlify/functions/send-email', { method:'POST', headers:{'Content-Type':'application/json'}, body: JSON.stringify({ to: customer.email, subject: '📦 Order ' + ref + ' Delivered — Delivery Note | SP Zone', html }) }); } catch(e) { console.error('Delivered email error:', e); } } function generateQuotePDF(customer, order, items) { const { jsPDF } = window.jspdf; const doc = new jsPDF({ unit: 'mm', format: 'a4' }); const ref = 'ORD-' + String(order.id).padStart(6,'0'); const date = new Date().toLocaleDateString('en-GB'); const subtotal = items.reduce((s,i) => s + (Number(i.price)||0)*(Number(i.qty)||0), 0); const pageW = 210; // Header background doc.setFillColor(27, 58, 107); doc.rect(0, 0, pageW, 40, 'F'); // Gold bar doc.setFillColor(245, 184, 0); doc.rect(0, 40, pageW, 2, 'F'); // SP ZONE title doc.setTextColor(245, 184, 0); doc.setFontSize(22); doc.setFont('helvetica', 'bold'); doc.text('SP ZONE', 15, 18); // Subtitle doc.setTextColor(180, 195, 220); doc.setFontSize(8); doc.setFont('helvetica', 'normal'); doc.text('Safe Drive Auto Parts | CR: 4650285717 | VAT: 310627914800003', 15, 25); doc.text('2881 Al Madinah Al Munawwarah, KSA | spzones.com | info@spzones.com', 15, 30); // PRICE QUOTATION right side doc.setTextColor(255, 255, 255); doc.setFontSize(14); doc.setFont('helvetica', 'bold'); doc.text('PRICE QUOTATION', pageW - 15, 16, { align: 'right' }); doc.setFontSize(11); doc.setTextColor(245, 184, 0); doc.text(ref, pageW - 15, 23, { align: 'right' }); doc.setFontSize(9); doc.setTextColor(180, 195, 220); doc.text(date, pageW - 15, 29, { align: 'right' }); // Bill To section doc.setTextColor(150, 150, 150); doc.setFontSize(8); doc.setFont('helvetica', 'bold'); doc.text('BILL TO', 15, 52); doc.setTextColor(27, 58, 107); doc.setFontSize(12); doc.setFont('helvetica', 'bold'); doc.text((customer.first_name||'') + ' ' + (customer.last_name||''), 15, 60); doc.setTextColor(80, 80, 80); doc.setFontSize(10); doc.setFont('helvetica', 'normal'); if (customer.business) doc.text(customer.business, 15, 66); doc.text(customer.email||'', 15, 72); doc.text(customer.mobile||'', 15, 78); // Validity box doc.setFillColor(247, 249, 255); doc.roundedRect(130, 48, 65, 32, 3, 3, 'F'); doc.setTextColor(150, 150, 150); doc.setFontSize(8); doc.setFont('helvetica', 'bold'); doc.text('VALIDITY', 135, 56); doc.setTextColor(80, 80, 80); doc.setFont('helvetica', 'normal'); doc.text('30 days from issue', 135, 62); doc.setFont('helvetica', 'bold'); doc.text('STATUS', 135, 70); doc.setFillColor(255, 243, 205); doc.roundedRect(134, 72, 40, 6, 2, 2, 'F'); doc.setTextColor(133, 100, 4); doc.setFontSize(8); doc.text('Pending Approval', 154, 76.5, { align: 'center' }); // Table header const tableTop = 88; doc.setFillColor(27, 58, 107); doc.rect(15, tableTop, pageW - 30, 9, 'F'); doc.setTextColor(255, 255, 255); doc.setFontSize(9); doc.setFont('helvetica', 'bold'); const cols = [15, 25, 52, 120, 148, 175]; doc.text('#', cols[0]+2, tableTop+6); doc.text('PART NO.', cols[1]+2, tableTop+6); doc.text('DESCRIPTION', cols[2]+2, tableTop+6); doc.text('QTY', cols[3]+8, tableTop+6); doc.text('UNIT PRICE', cols[4]+2, tableTop+6); doc.text('TOTAL', cols[5]+2, tableTop+6); // Table rows let y = tableTop + 9; doc.setFont('helvetica', 'normal'); doc.setFontSize(9); items.forEach((item, idx) => { const rowH = 9; doc.setFillColor(idx%2===0 ? 247 : 255, idx%2===0 ? 249 : 255, idx%2===0 ? 255 : 255); doc.rect(15, y, pageW-30, rowH, 'F'); doc.setDrawColor(230, 235, 245); doc.rect(15, y, pageW-30, rowH, 'S'); doc.setTextColor(80, 80, 80); doc.text(String(idx+1), cols[0]+2, y+6); doc.setTextColor(27, 58, 107); doc.setFont('helvetica', 'bold'); doc.text(String(item.num||'').substring(0,15), cols[1]+2, y+6); doc.setTextColor(80, 80, 80); doc.setFont('helvetica', 'normal'); doc.text(String(item.desc||'').substring(0,35), cols[2]+2, y+6); doc.text(String(item.qty||0), cols[3]+10, y+6); doc.text('SAR '+Number(item.price||0).toFixed(2), cols[4]+2, y+6); doc.setFont('helvetica', 'bold'); doc.setTextColor(27, 58, 107); doc.text('SAR '+((Number(item.price)||0)*(Number(item.qty)||0)).toFixed(2), cols[5]+2, y+6); doc.setFont('helvetica', 'normal'); y += rowH; }); // Total box y += 8; doc.setFillColor(27, 58, 107); doc.roundedRect(pageW-90, y, 75, 14, 3, 3, 'F'); doc.setTextColor(255, 255, 255); doc.setFontSize(10); doc.setFont('helvetica', 'normal'); doc.text('TOTAL AMOUNT:', pageW-85, y+9); doc.setTextColor(245, 184, 0); doc.setFontSize(12); doc.setFont('helvetica', 'bold'); doc.text('SAR '+subtotal.toFixed(2), pageW-18, y+9, { align: 'right' }); // Note if exists if (order.note) { y += 22; doc.setFillColor(255, 248, 225); doc.roundedRect(15, y, pageW-30, 16, 3, 3, 'F'); doc.setFillColor(245, 184, 0); doc.rect(15, y, 3, 16, 'F'); doc.setTextColor(27, 58, 107); doc.setFontSize(9); doc.setFont('helvetica', 'bold'); doc.text('NOTE:', 22, y+7); doc.setTextColor(80, 80, 80); doc.setFont('helvetica', 'normal'); doc.text(String(order.note).substring(0,80), 22, y+13); y += 16; } // Footer doc.setFillColor(27, 58, 107); doc.rect(0, 272, pageW, 25, 'F'); doc.setTextColor(150, 170, 200); doc.setFontSize(8); doc.setFont('helvetica', 'normal'); doc.text('Safe Drive Auto Parts | CR: 4650285717 | VAT: 310627914800003', pageW/2, 281, { align: 'center' }); doc.text('2881 Al Madinah Al Munawwarah, KSA | spzones.com | info@spzones.com', pageW/2, 287, { align: 'center' }); doc.setTextColor(245, 184, 0); doc.setFont('helvetica', 'bold'); doc.text('Thank you for choosing SP Zone!', pageW/2, 293, { align: 'center' }); return doc.output('datauristring').split(',')[1]; // base64 } async function sendOrderConfirmationEmail(customer, order, items) { const ref = 'ORD-' + String(order.id).padStart(6,'0'); try { // Generate PDF let pdfBase64 = null; try { pdfBase64 = generateQuotePDF(customer, order, items); } catch(e) { console.warn('PDF gen failed:', e); } const resp = await fetch('/.netlify/functions/send-email', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ to: customer.email, subject: 'Price Quotation - ' + ref + ' | SP Zone', type: 'order_confirmation', customer: customer, order: order, items: items, pdfBase64: pdfBase64, pdfFilename: ref + '_Quote_SPZone.pdf' }) }); const data = await resp.json(); console.log('Order email sent:', data); } catch(e) { console.error('Order email error:', e); } } // 4. Email to customer when order is approved async function sendOrderApprovedEmail(customer, order) { const ref = 'ORD-' + String(order.id).padStart(6,'0'); const body = `

Order Confirmed! ✅

Dear ${customer.first_name},

Great news! Your order ${ref} has been confirmed and is being processed.

Order Total: SAR ${Number(order.total).toFixed(2)}
Our team will contact you to arrange delivery.

Thank you for choosing SP Zone for your wholesale auto parts needs.

For inquiries: info@spzones.com · spzones.com

`; await sendEmail(customer.email, '✅ Order Confirmed - ' + ref + ' | SP Zone', emailTemplate('Order Confirmed', body, '#22c55e')); } document.getElementById('order-modal').addEventListener('click',function(e){if(e.target===this)closeModal();}); document.getElementById('delete-modal').addEventListener('click',function(e){if(e.target===this)closeDeleteModal();});

Welcome

Registration Submitted!

All Parts

📋 Bulk Order Request

Order Request Submitted!

Order Details

Remove Part

Welcome to SP Zone! 🎉

New Customer Registration 👤

Your Order is On the Way! 🚚

Order Delivered Successfully! 📦

Order Confirmed! ✅