پروژه فروشگاه اینترنتی با جاوااسکریپت - پنل مدیریت
🎯 اهداف این بخش
- آشنایی با ساختار پنل مدیریت فروشگاه
- پیاده سازی سیستم احراز هویت برای مدیران
- مدیریت محصولات، دستهبندیها و کاربران
- نمایش آمار و گزارشات فروش
📌 ساختار پنل مدیریت
پنل مدیریت شامل بخشهای اصلی زیر است:
javascript
// ساختار اصلی پنل مدیریتconst adminPanel = { auth: {...}, // سیستم احراز هویت products: {...}, // مدیریت محصولات categories: {...}, // مدیریت دستهبندیها users: {...}, // مدیریت کاربران orders: {...}, // مدیریت سفارشات reports: {...} // گزارشات و آمار};
ویژگیهای کلیدی پنل مدیریت:
- سیستم احراز هویت امن: ورود دو مرحلهای و مدیریت سطح دسترسی
- مدیریت محتوا: افزودن، ویرایش و حذف محصولات و دستهبندیها
- پنل گزارشدهی: نمایش آمار فروش و تراکنشها
📌 پیاده سازی سیستم احراز هویت
javascript
// تابع ورود به پنل مدیریتasync function adminLogin(username, password) { try { // ارسال درخواست به سرور const response = await fetch('/api/admin/login', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({username, password}) }); if (!response.ok) throw new Error('خطا در ورود'); const data = await response.json(); localStorage.setItem('adminToken', data.token); return data; } catch (error) { console.error('خطا در ورود:', error); throw error; }}
امنیت در احراز هویت:
- توکنهای JWT: برای احراز هویت امن
- رمزنگاری: استفاده از HTTPS و hash کردن پسوردها
- مدیریت نشست: زمان انقضا برای توکنها
- اعتبارسنجی: بررسی اعتبار توکن در هر درخواست
📌 مدیریت محصولات
سیستم CRUD برای مدیریت محصولات:
javascript
// افزودن محصول جدیدasync function addProduct(productData) { const token = localStorage.getItem('adminToken'); const response = await fetch('/api/admin/products', { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${token}` }, body: JSON.stringify(productData) }); if (!response.ok) throw new Error('خطا در افزودن محصول'); return await response.json();}
ویژگیهای مدیریت محصولات:
- افزودن محصول: با تصاویر، توضیحات و مشخصات فنی
- ویرایش محصول: بهروزرسانی اطلاعات و موجودی
- حذف محصول: حذف منطقی یا فیزیکی
- جستجو و فیلتر: بر اساس دستهبندی، قیمت و ...
📌 پنل گزارشدهی و آمار
نمایش آمار فروش و تراکنشها:
javascript
// دریافت آمار فروش ماهانهasync function getMonthlySales(year, month) { const token = localStorage.getItem('adminToken'); const response = await fetch(`/api/admin/reports/sales?year=${year}&month=${month}`, { headers: { 'Authorization': `Bearer ${token}` } }); if (!response.ok) throw new Error('خطا در دریافت آمار'); return await response.json();}
گزارشهای قابل ارائه:
گزارش | توضیحات |
---|---|
فروش روزانه/هفتگی/ماهانه | میزان فروش بر اساس بازه زمانی |
محصولات پرفروش | لیست محصولات بر اساس تعداد فروش |
تراکنشهای مالی | لیست کامل پرداختهای موفق |
آمار کاربران | ثبتنامها و فعالیت کاربران |
📌 تمرین عملی
تابع مدیریت سفارشات را تکمیل کنید:
javascript
async function updateOrderStatus(orderId, newStatus) { // کد اینجا نوشته شود}
راهنمای تمرین:
- ارسال درخواست PUT به سرور برای بهروزرسانی وضعیت سفارش
- استفاده از توکن احراز هویت در هدر درخواست
- مدیریت خطاهای احتمالی
- بررسی وضعیتهای مجاز برای سفارش
📌 قدم بعدی
در بخش بعدی با بهینهسازی و امنیت فروشگاه آشنا خواهیم شد!