supplier_central_frontend/architecture_diagram.md

Supplier Portal Architecture & Module Design

This document outlines the proposed module structure, page flows, and visual architecture for the E-Commerce Supplier Portal.

1. System Architecture & Modules

graph TD
    %% Styling
    classDef primary fill:#1A2B45,stroke:#1A2B45,color:#fff;
    classDef accent fill:#E9C46A,stroke:#E9C46A,color:#1A2B45;
    classDef container fill:#FFFFFF,stroke:#1A2B45,color:#1A2B45;
    classDef bg fill:#F5F0EA,stroke:#1A2B45,color:#1A2B45;

    %% Modules
    AuthModule["Authentication Module"]:::primary
    ProfileModule["Onboarding & Profile Module"]:::primary
    ProductModule["Product Management"]:::primary
    DashboardModule["Analytics & Dashboard"]:::primary
    FulfillmentModule["Order & Fulfillment Tracking"]:::primary
    WalletModule["Payout & Wallet"]:::primary
    NotificationModule["Notification System"]:::primary

    %% Components
    Signup["Signup Page<br/>(Email, Phone, GSTIN Init)"]:::container
    Login["Login Page<br/>(OTP / Password)"]:::container
    ProfileComplete["Profile Completion Page<br/>(Store Info, Pickup Address, GSTIN Verify)"]:::container
    ProdUpload["Single Upload / Modify Page"]:::container
    BulkUpload["Bulk Excel/CSV Upload Page"]:::container
    AnalyticsDash["Sales & Earnings Analytics<br/>(Yearly, Weekly, Daily, Custom Date Filters)"]:::container
    StockReports["Stock & Inventory Tracking"]:::container
    ReturnsDashboard["Customer Returns Center<br/>(Requests, Tracking & Quality Checks)"]:::container
    PayoutCenter["Payout / Wallet Dashboard<br/>(Outstanding Balance, Withdrawal Request)"]:::container
    ItemTracking["Item Tracking Dashboard<br/>(Individual Item Status, SKUs, Serials)"]:::container
    TransitTracking["Transit Tracking Dashboard<br/>(Courier Status, Carrier Integration)"]:::container

    %% Relations
    AuthModule --> Signup
    AuthModule --> Login
    Signup --> ProfileComplete
    ProfileComplete --> ProfileModule
    
    ProductModule --> ProdUpload
    ProductModule --> BulkUpload
    
    DashboardModule --> AnalyticsDash
    DashboardModule --> StockReports
    
    FulfillmentModule --> ItemTracking
    FulfillmentModule --> TransitTracking
    FulfillmentModule --> ReturnsDashboard
    
    WalletModule --> PayoutCenter

---

2. Detailed Page & Module Breakdown

A. Authentication & Onboarding Module

1. Signup Page
   • Business Email, Password, and Mobile Number validation.
   • Initial GSTIN input (for verification).
2. Login Page
   • Credentials or OTP-based secure login.
3. Account Profile Completion Page (Onboarding Step 2)
   • Store Details: Upload Store Logo/Profile Image, Store Display Name.
   • Pickup & Shipping: Pickup Address, contact person details.
   • Regulatory Info: Verified GSTIN, Bank Account details (for payouts).

B. Product & Inventory Management Module

1. Single Product Upload & Modification
   • Form-based creation (Images, Title, Description, SKU, Category, Price, Stock count).
   • Real-time preview of the product card matching our theme.
2. Bulk Product Upload & Modify
   • Excel/CSV upload template download.
   • Status log showing validation warnings (e.g., missing images, pricing errors).

C. Analytical Dashboard Module

Provides comprehensive reporting with dynamic period filters (Yearly, Weekly, Daily, and Custom Date Range):

1. Sales & Earnings Reports
   • Interactive charts showing Total Sales (Gross volume) vs. Total Earned (Net margin after commissions).
2. Stock & Inventory Status
   • Low-stock alerts, active listings count, and inactive listings.

D. Order & Fulfillment Tracking Module

1. Item Tracking
   • Track individual items per order (SKU details, quantity, individual packaging status).
   • Flag items: Ready to Ship, Shipped, Delivered, Cancelled.
2. Transit Tracking
   • Real-time logistic carrier updates (e.g., DHL, FedEx, Local Post tracking number integration).
   • Expected Delivery Date and transit milestones display.
3. Return Tracking & Return Requests
   • Items Requested for Return: Lists customer return requests, reason for return, and custom images uploaded by the customer (e.g., defective product, wrong size). Action to Approve or Reject return.
   • In-Transit Return Tracking: Real-time logistic progress of returning items from the customer back to the supplier hub.

E. Wallet & Financials (Payout) Module

1. Current Outstanding Balance
   • Live ready-to-withdraw funds display.
2. Withdrawal Interface
   • Payout history list with status tracking (Pending, Approved, Transferred).
   • "Withdraw Funds" action trigger.

F. Notifications & Account Settings

1. Header Notification Drawer
   • Real-time notices for new orders, low inventory, return requests, and completed payouts.
2. Profile / Account Settings Page
   • Modify existing Store Profile Image, Pickup Location details, and GSTIN certificates.