سند نیازمندی‌های پروژه: توسعه سیستم یکپارچه فروشگاه آنلاین هایپرمارکت

۱. چکیده و اهداف پروژه

این پروژه با هدف طراحی و پیاده‌سازی یک سیستم اطلاعاتی و فروشگاه آنلاین جامع برای یک هایپرمارکت در یک شهر کوچک تعریف می‌شود. هدف اصلی، ایجاد یک پلتفرم کاربرپسند (وب‌سایت و اپلیکیشن موبایل) است که به مشتریان امکان می‌دهد محصولات را به صورت آنلاین سفارش دهند و در محل تحویل بگیرند. این سیستم شامل پنل‌های مدیریتی برای فروشنده و پیک، مدیریت انبار، گزارش‌گیری دقیق و سیستم‌های بازاریابی و وفادارسازی مشتریان خواهد بود.

۲. مخاطبان و نقش‌های سیستم (User Roles)

سیستم برای سه گروه اصلی طراحی می‌شود:

مشتری (Customer): کاربر نهایی که محصولات را مشاهده کرده و سفارش ثبت می‌کند.
مدیر/کارکنان فروشگاه (Admin/Staff): مسئولیت مدیریت محصولات، سفارشات، مشتریان و گزارش‌گیری را بر عهده دارند.
پیک/راننده (Delivery Agent): مسئول تحویل سفارشات به مشتریان است.
۳. ماژول‌ها و امکانات اصلی سیستم (Core Modules & Features)

۳.۱. پنل مشتری (وب‌سایت و اپلیکیشن اندروید)

ثبت‌نام و احراز هویت:
ثبت‌نام با شماره موبایل و ارسال کد تایید (OTP).
ورود با نام کاربری/رمز عبور و گزینه "رمز عبور را فراموش کرده‌ام".
امکان ورود از طریق شبکه‌های اجتماعی (اختیاری).
پروفایل کاربری:
مشاهده و ویرایش اطلاعات شخصی (نام، نام خانوادگی، ایمیل).
مدیریت آدرس‌ها (ثبت، ویرایش، حذف و انتخاب آدرس پیش‌فرض).
کاتالوگ محصولات:
نمایش محصولات دسته‌بندی شده (مثلا: لبنیات، پروتئینی، خشکبار).
جستجوی پیشرفته محصولات بر اساس نام و برند.
فیلتر کردن محصولات بر اساس قیمت، موجودی و تخفیف.
نمایش صفحه محصول با تصاویر، قیمت، توضیحات، موجودی و نظرات کاربران.
سبد خرید (Shopping Cart):
اضافه کردن محصول به سبد خرید.
مشاهده سبد خرید با جزئیات قیمت، تعداد و مجموع.
تغییر تعداد یا حذف محصول از سبد.
فرآیند تسویه حساب (Checkout):
انتخاب آدرس تحویل از آدرس‌های ثبت‌شده.
انتخاب بازه زمانی برای تحویل (مثلا: ۱۰-۱۲ صبح، ۴-۶ عصر).
مشاهده هزینه نهایی شامل قیمت کالاها و هزینه ارسال.
انتخاب روش پرداخت (آنلاین/در محل).
اعمال کد تخفیف.
پیگیری سفارشات:
مشاهده تاریخچه سفارشات با وضعیت‌های مختلف (ثبت شده، در حال آماده‌سازی، ارسال شده، تحویل داده شده).
سیستم وفاداری و امتیازدهی:
کسب امتیاز به ازای هر خرید.
مشاهده موجودی امتیازها.
تبدیل امتیاز به کد تخفیف.
۳.۲. پنل مدیریت فروشگاه (وب اپلیکیشن)

داشبورد مدیریتی:
نمایش آمار کلیدی: سفارشات جدید، فروش روزانه/ماهانه، محصولات پرفروش.
مدیریت محصولات:
ثبت، ویرایش و حذف محصولات (نام، قیمت، توضیحات، تصویر، بارکد).
مدیریت دسته‌بندی‌ها و برندها.
تعریف ویژگی‌های محصول (مثلا: وزن، حجم).
سیستم موجودی انبار: ثبت موجودی اولیه، کسر موجودی پس از فروش، هشدار موجودی کم.
مدیریت سفارشات:
مشاهده لیست سفارشات جدید با قابلیت فیلتر بر اساس وضعیت و تاریخ.
مشاهده جزئیات کامل سفارش (مشتری، محصولات، آدرس، زمان تحویل).
تغییر وضعیت سفارش: (جدید -> در حال آماده‌سازی -> آماده ارسال -> تحویل به پیک -> تکمیل شده).
امکان چاپ فاکتور سفارش.
مدیریت مشتریان:
مشاهده لیست مشتریان و اطلاعات تماس آن‌ها.
مشاهده تاریخچه خرید هر مشتری.
مدیریت تخفیف‌ها و کوپن‌ها:
تعریف کدهای تخفیف با شرایط مختلف (مثلا: درصدی، مبلغ ثابت، حداقل خرید سبد).
تعریف کمپین‌های تخفیف برای محصولات یا دسته‌بندی‌های خاص.
مدیریت پیک‌ها:
ثبت‌نام و مدیریت اطلاعات پیک‌ها (نام، شماره تماس، وسیله نقلیه).
مشاهده وضعیت آنلاین/آفلاین پیک‌ها.
تخصیص سفارش به پیک (دستی یا هوشمند).
گزارش‌گیری و تحلیل:
گزارش فروش (روزانه، هفتگی، ماهانه، سالانه).
گزارش فروش بر اساس محصول، دسته‌بندی و برند.
گزارش مشتریان وفادار و پرفروش‌ترین مشتریان.
گزارش عملکرد پیک‌ها.
محاسبه سودآوری (با در نظر گرفتن قیمت خرید و فروش کالا و هزینه‌های جانبی).
مدیریت محتوا:
مدیریت بنرهای صفحه اصلی (اسلایدر).
ایجاد صفحات ثابت (درباره ما، تماس با ما).
۳.۳. اپلیکیشن موبایل پیک

ثبت‌نام و ورود: با استفاده از اطلاعات تعریف‌شده توسط مدیر.
داشبورد:
نمایش وضعیت (آفلاین/در دسترس برای سفارش).
نمایش سفارشات تخصیص داده شده.
جزئیات سفارش:
مشاهده اطلاعات مشتری (نام، شماره تماس).
مشاهده آدرس دقیق تحویل.
مشاهده لیست محصولات.
ناوبری:
اتصال به نقشه (Google Maps/ویز) برای مسیریابی به سمت آدرس مشتری.
مدیریت وضعیت تحویل:
دکمه "رفتن به سمت فروشگاه" (پس از پذیرش سفارش).
دکمه "دریافت سفارش" (در فروشگاه).
دکمه "شروع تحویل" (در راه به سمت مشتری).
دکمه "تحویل موفق" با امکان امضای دیجیتال یا گرفتن عکس از مشتری (اختیاری).
۴. امکانات پیشنهادی و ارزش‌افزوده (Value-Added Features)

سیستم اشتراک (Subscription): ارائه طرح‌های ماهانه/سالیانه با پرداخت هزینه ثابت برای ارسال رایگان تمام سفارشات در طول دوره اشتراک.
سیستم پیشنهاد هوشمند: نمایش محصولات مرتبط ("مشتریانی که این را خریدند، این را نیز سفارش دادند").
لیست علاقه‌مندی‌ها (Wishlist): امکان ذخیره محصولات برای خریدهای بعدی.
امتیازدهی به محصولات: امکان ثبت امتیاز و نظر برای محصولات توسط مشتریان.
اعلان‌های هوشمند (Push Notifications): ارسال نوتیفیکیشن بر اساس علاقه مشتری (مثلا: تخفیف خوردن محصولی که در لیست علاقه‌مندی‌های اوست).
کیف پول دیجیتال: امکان شارژ حساب و پرداخت از طریق اعتبار موجود.
گزارش‌گیری پیشرفته: تحلیل روندهای فروش، پیش‌بینی تقاضا و شناسایی محصولات کم‌فروش.
۵. مشخصات فنی و زیرساخت (Technical Stack)

زبان سمت سرور (Backend): PHP (پیشنهاد: استفاده از یک فریمورک مدرن مانند Laravel یا Symfony برای ساختار بهتر، امنیت و سرعت توسعه).
پایگاه داده (Database): MySQL/MariaDB (سازگار کامل با cPanel).
زبان سمت کلاینت (Frontend - Web): HTML5, CSS3, JavaScript (پیشنهاد: استفاده از یک فریمورک جاوااسکریپتی مانند Vue.js یا React برای ایجاد یک رابط کاربری پویا و تعاملی).
اپلیکیشن موبایل:
روش پیشنهادی (Cross-Platform): استفاده از فریمورک Flutter یا React Native. این روش امکان ساخت اپلیکیشن برای اندروید و iOS با یک کدبیس را فراهم می‌کند و بسیار بهینه‌تر از توسعه نیتیو جداگانه است.
روش جایگزین (Native): Java/Kotlin برای اپلیکیشن اندروید.
ارتباطات: طراحی RESTful API برای برقراری ارتباط بین بک‌اند و اپلیکیشن‌های موبایل و وب.
هاستینگ: سرور اشتراکی یا اختصاصی با پنل مدیریت cPanel.
درگاه پرداخت: اتصال به درگاه‌های پرداخت معتبر ایرانی (مثل زرین‌پال، پرداخت ملت و...).
پیامک و نوتیفیکیشن: استفاده از سرویس‌های پیامک و پوش نوتیفیکیشن (مثل فندق، پوشه و...).
۶. جریان‌های کاری (Workflows)

۶.۱. جریان کار ثبت سفارش توسط مشتری:

مشتری وارد وب‌سایت/اپلیکیشن می‌شود.
محصولات مورد نظر را جستجو کرده و به سبد خرید اضافه می‌کند.
به صفحه تسویه حساب می‌رود.
آدرس تحویل و بازه

README.md

@@ -1,10 +1,13 @@
 ---
-title: Hypermarket Pro
-emoji: 😻
-colorFrom: indigo
-colorTo: red
+title: HyperMarket Pro - فروشگاه آنلاین هوشمند 🛒✨
+colorFrom: gray
+colorTo: blue
+emoji: 🐳
 sdk: static
 pinned: false
+tags:
+  - deepsite-v3
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# Welcome to your new DeepSite project!
+This project was created with [DeepSite](https://huggingface.co/deepsite).

index.html

@@ -1,19 +1,198 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
+<!DOCTYPE html>
+<html lang="fa" dir="rtl">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport"	content="width=device-width, initial-scale=1.0">
+    <title>HyperMarket Pro</title>
+    <link rel="stylesheet" href="style.css">
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://unpkg.com/feather-icons"></script>
+    <link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;700&display=swap" rel="stylesheet">
+    <style>
+        body {
+            font-family: 'Vazirmatn', sans-serif;
+        }
+    </style>
+</head>
+<body class="bg-gray-100">
+    <!-- Header Component -->
+    <custom-header></custom-header>
+
+    <!-- Hero Section -->
+    <section class="relative bg-gradient-to-r from-blue-600 to-purple-600 text-white py-20">
+        <div class="container mx-auto px-4 text-center">
+            <h1 class="text-4xl md:text-5xl font-bold mb-4">فروشگاه آنلاین هایپرمارکت</h1>
+            <p class="text-xl mb-8">خرید آسان، تحویل سریع، قیمت مناسب</p>
+            <a href="products.html" class="bg-white text-blue-600 px-6 py-3 rounded-full font-bold hover:bg-gray-100 transition">مشاهده محصولات</a>
+        </div>
+    </section>
+
+    <!-- Categories Section -->
+    <section class="py-12 bg-white">
+        <div class="container mx-auto px-4">
+            <h2 class="text-3xl font-bold text-center mb-10">دسته‌بندی محصولات</h2>
+            <div class="grid grid-cols-2 md:grid-cols-4 gap-6">
+                <div class="bg-gray-50 p-6 rounded-lg text-center shadow hover:shadow-lg transition">
+                    <i data-feather="package" class="w-12 h-12 mx-auto text-blue-500 mb-4"></i>
+                    <h3 class="text-xl font-semibold">لبنیات</h3>
+                </div>
+                <div class="bg-gray-50 p-6 rounded-lg text-center shadow hover:shadow-lg transition">
+                    <i data-feather="shopping-bag" class="w-12 h-12 mx-auto text-green-500 mb-4"></i>
+                    <h3 class="text-xl font-semibold">خشکبار</h3>
+                </div>
+                <div class="bg-gray-50 p-6 rounded-lg text-center shadow hover:shadow-lg transition">
+                    <i data-feather="fish" class="w-12 h-12 mx-auto text-red-500 mb-4"></i>
+                    <h3 class="text-xl font-semibold">پروتئینی</h3>
+                </div>
+                <div class="bg-gray-50 p-6 rounded-lg text-center shadow hover:shadow-lg transition">
+                    <i data-feather="coffee" class="w-12 h-12 mx-auto text-yellow-500 mb-4"></i>
+                    <h3 class="text-xl font-semibold">نوشیدنی</h3>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Featured Products -->
+    <section class="py-12 bg-gray-50">
+        <div class="container mx-auto px-4">
+            <h2 class="text-3xl font-bold text-center mb-10">محصولات پرفروش</h2>
+            <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-4 gap-6">
+                <!-- Product Card -->
+                <div class="bg-white rounded-lg shadow-md overflow-hidden">
+                    <img src="http://static.photos/food/320x240/1" alt="Product" class="w-full h-48 object-cover">
+                    <div class="p-4">
+                        <h3 class="text-lg font-semibold">شیر پاستوریزه پاک</h3>
+                        <p class="text-gray-600 mt-2">1 لیتر</p>
+                        <div class="flex justify-between items-center mt-4">
+                            <span class="text-blue-600 font-bold">25,000 تومان</span>
+                            <button class="bg-blue-500 text-white px-3 py-1 rounded hover:bg-blue-600 transition">
+                                <i data-feather="shopping-cart" class="w-4 h-4"></i>
+                            </button>
+                        </div>
+                    </div>
+                </div>
+                <!-- Repeat for other products -->
+                <div class="bg-white rounded-lg shadow-md overflow-hidden">
+                    <img src="http://static.photos/food/320x240/2" alt="Product" class="w-full h-48 object-cover">
+                    <div class="p-4">
+                        <h3 class="text-lg font-semibold">نان لواش تازه</h3>
+                        <p class="text-gray-600 mt-2">بسته 5 عددی</p>
+                        <div class="flex justify-between items-center mt-4">
+                            <span class="text-blue-600 font-bold">12,000 تومان</span>
+                            <button class="bg-blue-500 text-white px-3 py-1 rounded hover:bg-blue-600 transition">
+                                <i data-feather="shopping-cart" class="w-4 h-4"></i>
+                            </button>
+                        </div>
+                    </div>
+                </div>
+                <div class="bg-white rounded-lg shadow-md overflow-hidden">
+                    <img src="http://static.photos/food/320x240/3" alt="Product" class="w-full h-48 object-cover">
+                    <div class="p-4">
+                        <h3 class="text-lg font-semibold">تخم مرغ فرمیک</h3>
+                        <p class="text-gray-600 mt-2">بسته 10 عددی</p>
+                        <div class="flex justify-between items-center mt-4">
+                            <span class="text-blue-600 font-bold">18,000 تومان</span>
+                            <button class="bg-blue-500 text-white px-3 py-1 rounded hover:bg-blue-600 transition">
+                                <i data-feather="shopping-cart" class="w-4 h-4"></i>
+                            </button>
+                        </div>
+                    </div>
+                </div>
+                <div class="bg-white rounded-lg shadow-md overflow-hidden">
+                    <img src="http://static.photos/food/320x240/4" alt="Product" class="w-full h-48 object-cover">
+                    <div class="p-4">
+                        <h3 class="text-lg font-semibold">روغن سرخ کردنی</h3>
+                        <p class="text-gray-600 mt-2">1 لیتر</p>
+                        <div class="flex justify-between items-center mt-4">
+                            <span class="text-blue-600 font-bold">35,000 تومان</span>
+                            <button class="bg-blue-500 text-white px-3 py-1 rounded hover:bg-blue-600 transition">
+                                <i data-feather="shopping-cart" class="w-4 h-4"></i>
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Features Section -->
+    <section class="py-12 bg-white">
+        <div class="container mx-auto px-4">
+            <h2 class="text-3xl font-bold text-center mb-10">ویژگی‌های ما</h2>
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
+                <div class="text-center">
+                    <i data-feather="truck" class="w-12 h-12 mx-auto text-blue-500 mb-4"></i>
+                    <h3 class="text-xl font-semibold mb-2">تحویل سریع</h3>
+                    <p class="text-gray-600">تحویل در کمتر از 2 ساعت در منطقه شهری</p>
+                </div>
+                <div class="text-center">
+                    <i data-feather="percent" class="w-12 h-12 mx-auto text-green-500 mb-4"></i>
+                    <h3 class="text-xl font-semibold mb-2">تخفیف‌های ویژه</h3>
+                    <p class="text-gray-600">پیشنهادات شگفت‌انگیز هر هفته</p>
+                </div>
+                <div class="text-center">
+                    <i data-feather="award" class="w-12 h-12 mx-auto text-yellow-500 mb-4"></i>
+                    <h3 class="text-xl font-semibold mb-2">کیفیت تضمینی</h3>
+                    <p class="text-gray-600">تضمین کیفیت تمامی محصولات</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Subscription Banner -->
+    <section class="py-12 bg-gradient-to-r from-green-500 to-blue-500 text-white">
+        <div class="container mx-auto px-4 text-center">
+            <h2 class="text-3xl font-bold mb-4">طرح اشتراک ویژه</h2>
+            <p class="text-xl mb-8">با پرداخت ماهانه ۱۰۰,۰۰۰ تومان، از ارسال رایگان به مدت یک ماه لذت ببرید!</p>
+            <a href="subscription.html" class="bg-white text-green-600 px-6 py-3 rounded-full font-bold hover:bg-gray-100 transition">ثبت‌نام در طرح اشتراک</a>
+        </div>
+    </section>
+
+    <!-- Testimonials -->
+    <section class="py-12 bg-gray-50">
+        <div class="container mx-auto px-4">
+            <h2 class="text-3xl font-bold text-center mb-10">نظرات مشتریان</h2>
+            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
+                <div class="bg-white p-6 rounded-lg shadow">
+                    <p class="text-gray-600 mb-4">"خدمت تحویل فوق‌العاده سریع دارید. همیشه محصولات تازه و با کیفیت هستند."</p>
+                    <div class="flex items-center">
+                        <img src="http://static.photos/people/64x64/1" alt="Customer" class="w-12 h-12 rounded-full ml-4">
+                        <div>
+                            <h4 class="font-semibold">سارا محمدی</h4>
+                            <p class="text-gray-500">مشتری وفادار</p>
+                        </div>
+                    </div>
+                </div>
+                <div class="bg-white p-6 rounded-lg shadow">
+                    <p class="text-gray-600 mb-4">"تنوع محصولات و قیمت مناسب باعث شده همیشه از شما خرید کنم. پیشنهاد می‌کنم!"</p>
+                    <div class="flex items-center">
+                        <img src="http://static.photos/people/64x64/2" alt="Customer" class="w-12 h-12 rounded-full ml-4">
+                        <div>
+                            <h4 class="font-semibold">علی رضایی</h4>
+                            <p class="text-gray-500">مشتری وفادار</p>
+                        </div>
+                    </div>
+                </div>
+                <div class="bg-white p-6 rounded-lg shadow">
+                    <p class="text-gray-600 mb-4">"اپلیکیشن بسیار کاربرپسند است و سفارش دادن خیلی راحت شده. ممنون از تیم پشتیبانی خوبتان."</p>
+                    <div class="flex items-center">
+                        <img src="http://static.photos/people/64x64/3" alt="Customer" class="w-12 h-12 rounded-full ml-4">
+                        <div>
+                            <h4 class="font-semibold">مریم کریمی</h4>
+                            <p class="text-gray-500">مشتری جدید</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Footer Component -->
+    <custom-footer></custom-footer>
+
+    <script>
+        feather.replace();
+    </script>
+<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
+</body>
 </html>