MULTI-CONTRACTS | Project

Overview

MULTI-CONTRACTS is a CRM (Customer Relationship Management) system developed by Axalize Incorporated, specialized for managing contracts, customers, inventory, and business revenue. The system features a powerful Custom Dashboard, built on a ReactJS SPA architecture, integrating realtime chat via Pusher and utilizing Redux / Redux-Saga for state management, with Laravel on the backend.

URL: app.multicontracts.com.sg
Development Unit: Axalize Incorporated
Product Type: CRM System – Multi-channel Contract Management
Target Users: Enterprises, sales teams, managers

Technical Information

Attribute	Details
Frontend	ReactJS (SPA)
State Management	Redux, Redux-Saga
Realtime	Pusher (WebSocket)
Data Visualization	ChartJS
API	RESTful API
Backend	Laravel (PHP)
HTTP Client	Axios
Styling	CSS3, SASS, Bootstrap
Version Control	Git
Design Tool	Figma

Key Features

📊 Dashboard & Reporting

Feature	Description
Overview Dashboard	Displays KPIs, revenue, and key metrics on a single screen
Visual Charts	ChartJS – bar, line, pie, and area charts
Revenue Reports	Revenue statistics by time period, customer, and product
Inventory Reports	Track stock quantities, stock-in/stock-out
Filter & Export Data	Filter by time range, export reports

📝 Contract Management

Feature	Description
Create & Manage Contracts	Full CRUD for contracts with detailed information
Multi-contracts	Supports managing multiple contracts within a single system
Status Tracking	Contract pipeline: Draft → Active → Completed → Expired
Contract History	Records all changes and updates to contracts
Contract Expiry Alerts	Automatic notifications when a contract is about to expire

👥 Customer Management

Feature	Description
Customer Profiles	Store detailed customer information
Customer Classification	Group, tag, and classify by criteria
Transaction History	Track all purchase and contract history
Contract Linking	1 customer – multiple contracts (1:N relationship)

💬 Realtime Chat

Feature	Description
Realtime Messaging	Internal communication between members via Pusher WebSocket
Instant Notifications	Push notifications for new messages
Chat History	Store and search conversation history

📦 Inventory Management

Feature	Description
Product Management	Product list, quantities, and prices
Stock In/Out	Record stock receipt and dispatch vouchers
Inventory Tracking	Low stock alerts, inventory reports
Contract Linking	Attach products to corresponding contracts

💰 Revenue Management

Feature	Description
Revenue Tracking	Revenue statistics by day/week/month/year
Revenue Charts	Visualization using ChartJS
Performance Analysis	Compare revenue by period, by employee, by customer
Payment Management	Track outstanding debts, payments, and invoices

System Architecture

┌──────────────────────────────────────────────────┐
│                   Frontend (ReactJS)             │
│  ┌───────────┐ ┌───────────┐ ┌────────────────┐ │
│  │  Redux    │ │  Redux    │ │   ChartJS      │ │
│  │  Store    │ │  Saga     │ │   Dashboard    │ │
│  └───────────┘ └───────────┘ └────────────────┘ │
│  ┌───────────────────────────────────────────┐   │
│  │            Axios HTTP Client              │   │
│  └───────────────────────────────────────────┘   │
└──────────────────────┬───────────────────────────┘
                       │ RESTful API
┌──────────────────────▼───────────────────────────┐
│                Backend (Laravel)                  │
│  ┌───────────┐ ┌───────────┐ ┌────────────────┐ │
│  │  API      │ │  Auth     │ │   Pusher       │ │
│  │  Routes   │ │  System   │ │   Broadcast    │ │
│  └───────────┘ └───────────┘ └────────────────┘ │
│  ┌───────────────────────────────────────────┐   │
│  │              Database (MySQL)             │   │
│  └───────────────────────────────────────────┘   │
└──────────────────────────────────────────────────┘

Role in the Project

Role	Description
Position	Main Frontend Developer
Primary Responsibility	Lead all Frontend development
Specific Tasks	Convert Figma → Production UI, API integration, state management with Redux/Redux-Saga, Pusher realtime chat integration, ChartJS dashboard development, performance & UX optimization

Project Gallery