Remix

Make your own version of Ibrahim ERP

Edit the prompt below and generate a customized version in seconds.

Original by waqas anwar

Describe your app

A polished Sales ERP + Purchasing Management System for Ibrahim IT Services with a premium admin dashboard, Supabase Auth roles, real-time approvals, quotation-to-invoice workflow, and professional PDF generation. Clean React + Tailwind UI with a deep navy/royal blue palette, white cards, subtle shadows, status badges, sticky sidebar, mobile card layouts, and smooth modal transitions.

Features include CRM customers/products, dynamic quotations with PKR/USD toggle, GST/SST/service charges, payment method selection, Supabase PDF storage, WhatsApp sharing, sale orders, delivery challans with webcam capture/compression, invoices with email attachment, and “Mark as Paid” flow.

Purchasing module includes admin approval queues, purchaser wallets, running ledgers, live balance updates, and transaction history. Reports include sales KPIs, Chart.js monthly trends, Excel export, pending payments, and a secure “Share Dashboard Live View” with QR code, expiry, rate limits, and branded read-only public dashboard labeled “A.D Database Storage.”

Project: Business Management System (Sales ERP + Purchasing Module)
Tech Stack
Frontend: React + Tailwind CSS + Vite

Backend: Supabase (PostgreSQL + Auth + Storage)

Libraries: jsPDF, Chart.js, SheetJS, react-webcam, EmailJS, QRCode

✅ STEP 1: Foundation + Customers + Products
Database Schema
sql
-- Customers
CREATE TABLE customers (
    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
    name TEXT NOT NULL,
    phone TEXT, email TEXT, address TEXT,
    created_at TIMESTAMP DEFAULT NOW(),
    created_by UUID REFERENCES users(id)
);

-- Products  
CREATE TABLE products (
    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
    name TEXT NOT NULL,
    price INTEGER NOT NULL,
    description TEXT,
    unit TEXT DEFAULT 'Project',
    created_by UUID REFERENCES users(id)
);
Pages Required
/customers - Add/Edit/Delete customers

/products - Add/Edit/Delete products

RLS Policies
sql
-- Both tables: authenticated users can SELECT, INSERT, UPDATE, DELETE
✅ STEP 2: Quotations Module
Tables
sql
CREATE TABLE quotations (
    id UUID PRIMARY KEY,
    number TEXT UNIQUE NOT NULL,
    customer_id UUID REFERENCES customers(id),
    total_usd INTEGER, total_pkr INTEGER,
    exchange_rate INTEGER DEFAULT 278,
    currency_type TEXT DEFAULT 'PKR',
    status TEXT DEFAULT 'Draft',
    valid_until DATE,
    project_title TEXT,
    scope_of_work TEXT,
    payment_terms TEXT,
    created_at TIMESTAMP DEFAULT NOW()
);

CREATE TABLE quotation_items (
    id UUID PRIMARY KEY,
    quotation_id UUID REFERENCES quotations(id) ON DELETE CASCADE,
    description TEXT NOT NULL,
    quantity INTEGER NOT NULL,
    unit_price_pkr INTEGER,
    total_pkr INTEGER
);

CREATE TABLE quotation_taxes (
    id UUID PRIMARY KEY,
    quotation_id UUID REFERENCES quotations(id) ON DELETE CASCADE,
    tax_type TEXT NOT NULL, -- GST, SST, Service Charges
    tax_rate DECIMAL,
    tax_amount INTEGER,
    is_enabled BOOLEAN DEFAULT false
);
Auto-numbering
sql
CREATE OR REPLACE FUNCTION next_quotation_number()
RETURNS TEXT AS $$
BEGIN
    RETURN 'ITS-2026-' || LPAD(COALESCE((SELECT MAX(CAST(SUBSTRING(number FROM '-([0-9]+)$') AS INTEGER)) FROM quotations), 0) + 1::TEXT, 3, '0');
END; $$ LANGUAGE plpgsql;
Features
Create quotation with dynamic items

PKR/USD currency toggle with exchange rate

Enable/disable taxes (GST 17%, SST 5%, Service Charges 3%)

Select payment methods (Banks, EasyPaisa, JazzCash, Credit Card)

Generate PDF with professional layout (matching image format)

WhatsApp share (manual number entry + customer number selection)

Upload PDF to Supabase Storage quotations bucket

Quotations list with status

PDF Layout (jsPDF)
Header: "IBRAHIM IT SERVICES" blue background

Quotation number, date, valid until

Customer information

Items table with totals

Taxes section (enabled only)

Grand total

Footer with contact

✅ STEP 3: Sale Orders + Delivery Challans (Camera) + Invoices
Tables
sql
CREATE TABLE sale_orders (
    id UUID PRIMARY KEY,
    number TEXT UNIQUE NOT NULL DEFAULT 'SO-' || LPAD(COALESCE((SELECT COUNT(*) FROM sale_orders) + 1, 1)::TEXT, 4, '0'),
    quotation_id UUID REFERENCES quotations(id),
    customer_id UUID REFERENCES customers(id),
    total_amount INTEGER,
    status TEXT DEFAULT 'In Process',
    created_at TIMESTAMP DEFAULT NOW()
);

CREATE TABLE delivery_challans (
    id UUID PRIMARY KEY,
    number TEXT UNIQUE NOT NULL DEFAULT 'DC-' || LPAD(COALESCE((SELECT COUNT(*) FROM delivery_challans) + 1, 1)::TEXT, 4, '0'),
    sale_order_id UUID REFERENCES sale_orders(id),
    customer_id UUID REFERENCES customers(id),
    photo_url TEXT,
    created_at TIMESTAMP DEFAULT NOW()
);

CREATE TABLE invoices (
    id UUID PRIMARY KEY,
    number TEXT UNIQUE NOT NULL DEFAULT 'INV-' || LPAD(COALESCE((SELECT COUNT(*) FROM invoices) + 1, 1)::TEXT, 4, '0'),
    delivery_challan_id UUID REFERENCES delivery_challans(id),
    sale_order_id UUID REFERENCES sale_orders(id),
    total_amount INTEGER,
    paid_amount INTEGER DEFAULT 0,
    status TEXT DEFAULT 'Unpaid',
    created_at TIMESTAMP DEFAULT NOW()
);
Features
Sale Orders:

Auto-create from accepted quotation

Status: In Process → Delivered → Invoiced

"Deliver" button opens delivery challan form

Delivery Challans with Camera:

React Webcam integration

Capture photo → preview modal with OK/Retake

Compress to max 500KB, max width 300px

Upload to Supabase bucket delivery_photos

PDF includes photo centered with border

WhatsApp share with manual number

Invoices:

Generate from delivery challan

PDF with professional layout

"Mark as Paid" button (updates status)

Email with PDF attachment (manual recipient entry)

✅ STEP 4: Purchasing Management Module
Tables
sql
CREATE TABLE payments (
    id UUID PRIMARY KEY,
    user_id UUID REFERENCES users(id),
    amount INTEGER NOT NULL,
    status TEXT DEFAULT 'pending',
    created_at TIMESTAMP DEFAULT NOW()
);

CREATE TABLE purchases (
    id UUID PRIMARY KEY,
    user_id UUID REFERENCES users(id),
    item_name TEXT NOT NULL,
    amount INTEGER NOT NULL,
    status TEXT DEFAULT 'pending',
    created_at TIMESTAMP DEFAULT NOW()
);
Admin Dashboard (/dashboard/admin)
Pending Payments table (Approve/Reject buttons)

Pending Purchases table (Approve/Reject buttons)

Purchasers list with: Total Given, Total Spent, Current Balance

Balance = SUM(approved payments) - SUM(approved purchases)

"View Full Ledger" button shows all transactions

Purchaser Dashboard (/dashboard/purchaser)
Current Balance card (real-time)

Request Payment button (modal with amount)

Request Purchase button (modal with item name + amount)

Pending approvals table

Transaction history with running balance

RLS Policies
sql
-- Purchaser: SELECT only own records, INSERT only with own user_id
-- Admin: SELECT and UPDATE all records
Real-time Updates
javascript
supabase.channel('changes')
  .on('postgres_changes', { event: '*', schema: 'public', table: 'payments' }, () => fetchData())
  .on('postgres_changes', { event: '*', schema: 'public', table: 'purchases' }, () => fetchData())
  .subscribe();
✅ STEP 5: Reports + Screen Share + Final Polish
Reports Page (/reports)
Dashboard cards: Total Sales, Total Paid, Pending Payments

Monthly sales chart (Chart.js - bar/line)

Pending payments table

Export to Excel button (SheetJS)

Screen Share
Button "📡 Share Dashboard Live View" on dashboard

Generate unique token: /share/[random_token]

Modal with: Copy Link, QR Code, Expiry selector (1/7/30 days)

Public page shows read-only dashboard + latest 5 quotations

Rate limiting: 100 views/day

Expired token shows "Link expired or invalid"

Database for Screen Share
sql
CREATE TABLE screen_shares (
    id UUID PRIMARY KEY,
    token TEXT UNIQUE NOT NULL,
    expires_at TIMESTAMP,
    is_active BOOLEAN DEFAULT true,
    view_count INTEGER DEFAULT 0
);
WhatsApp & Email
WhatsApp: https://wa.me/{manual_or_selected_number}?text={message_with_pdf_link}

Email: EmailJS with manual recipient + auto PDF attachment

Both support manual number/email entry + selection from customer

Mobile Responsive
Desktop (>768px): Table view

Mobile (<768px): Card view for all lists

Fixed Users (Seed in Supabase Auth)
text
1. Username: admin, Password: admin123, Role: admin
2. Username: user1aimsengineering, Password: user1234, Role: purchaser
3. Username: user2aimsengineering, Password: user12345, Role: purchaser
Branding Rules
NO "Lovable" text anywhere

Database label: "A.D Database Storage"

📁 Expected Folder Structure
text
src/
├── pages/
│   ├── login.jsx
│   ├── admin/
│   │   └── dashboard.jsx
│   ├── purchaser/
│   │   └── dashboard.jsx
│   ├── customers.jsx
│   ├── products.jsx
│   ├── quotations.jsx
│   ├── sale-orders.jsx
│   ├── delivery-challans.jsx
│   ├── invoices.jsx
│   ├── reports.jsx
│   └── share-view.jsx
├── components/
│   ├── camera-modal.jsx
│   ├── screen-share-modal.jsx
│   └── sidebar.jsx
├── utils/
│   ├── pdfGenerator.js
│   └── supabase.js
└── App.jsx
✅ Testing Checklist
Customer add/edit/delete works

Quotation create → PDF → WhatsApp (manual number)

Accept quotation → Sale Order created

Deliver → Take photo → Delivery Challan PDF with photo

Generate Invoice → Email with PDF attachment

Purchaser requests payment → Admin approves → Balance updates

Reports chart + Excel export

Screen share link + QR code + public page

Mobile responsive (cards on phone)

Free to use. No credit card required.