Skip to content

Repository files navigation

🛠️ Quotation Interior — Quotation Builder & WhatsApp Tool

A modern, responsive Interior Quotation Management web & mobile application built with React, TypeScript, Tailwind CSS, and Capacitor. It allows interior designers and contractors to create professional itemized quotations with fraction dimension inputs (e.g. 4½ x 7), auto-calculate square footage, generate formatted PDF quotations, and share quotes directly to WhatsApp with automated customer messages.


🚀 Features

  • Dynamic Dimension Input: Fractional height/width input (e.g., 7 x 7, 4½ x 2½) with auto-calculation of total SqFt and item amount.
  • Smart History Suggestions: Remembers previously used item descriptions across your quotes without hardcoded clutter.
  • Indian Numbering Format: Currency formatting (e.g. ₹2,93,150) and full amount in words in Indian numbering system (Lakhs, Crores).
  • A4 PDF Engine: Generates clean, printable A4 PDF quotation sheets with custom company header, materials specification, and authorized signature.
  • WhatsApp Integration: Single-tap sharing of formatted quote breakdown directly to customer WhatsApp chats.
  • Android Native File Saving: Directly saves PDF files into the Android public Downloads directory and triggers system download notifications.
  • Offline & Local: Stores quotations securely in browser/device localStorage with JSON export & import backup capabilities. No cloud login required.
  • Configurable Branding: All company details, address, contact numbers, and headers are easily customizable in src/app-details.json.

📋 Prerequisites

Ensure you have the following installed on your development machine:

  1. Node.js: Version 18.x or 20.x+ (Check with node -v)
  2. Java Development Kit (JDK): JDK 17 or JDK 21 (Recommended for Android builds, e.g., Eclipse Adoptium / Temurin JDK 21)
  3. Android SDK / Command Line Tools (Required only for building native Android APKs)

💻 Step-by-Step Terminal Commands

1. Clone & Install Dependencies

# Clone the repository
git clone <YOUR_REPOSITORY_URL>
cd quotation-interior

# Install project dependencies
npm install

2. Run Local Development Server

# Run local Vite dev server
npm run dev

Open your browser at http://localhost:5173.

📱 Test on Mobile Device via Wi-Fi:

npm run dev -- --host

Then open the network URL (e.g. http://192.168.1.X:5173) in your mobile browser.


3. Customize Company & Branding Details

All branding details are separated from the code. Open src/app-details.json and customize:

{
  "appName": "Quotation Interior",
  "companyName": "YOUR COMPANY NAME",
  "proprietorName": "Proprietor / Contact Person",
  "companyAddress": "Your Office / Factory Address, City, State – Pincode",
  "companyPhone": "98765 43210",
  "footerTitle": "Quotation & WhatsApp Manager",
  "whatsappSignature": "YOUR COMPANY NAME (Cell: 98765 43210)"
}

To customize visual headers and logos, simply replace:

  • public/m_logo.png — 512x512 PNG app icon / logo.
  • public/profile.png — 1200x170 PNG banner image used in PDF and preview header.

4. Build Web Application

npm run build

This compiles TypeScript and outputs production-ready web assets into the dist/ folder.


5. Generate & Configure Android Platform (First Time Only)

Because android/ is excluded from git to keep the repository lightweight, initialize and configure Android with these two commands:

# 1. Generate the Android platform folder
npx cap add android

# 2. Automatically inject custom Android download & notification plugin and permissions
npm run setup:android

6. Sync Web Assets to Android

Whenever you make changes to React/TypeScript code:

npm run build
npx cap sync android

7. Build Android APK via Terminal

On Windows (PowerShell / Command Prompt):

# 1. Set JAVA_HOME (ensure path points to JDK 17 or 21)
$env:JAVA_HOME = "C:\Program Files\Eclipse Adoptium\jdk-21.0.12.101-hotspot"

# 2. Navigate to the android directory
cd android

# 3. Assemble Debug APK with Gradle wrapper
.\gradlew.bat assembleDebug

# 4. Return to root folder
cd ..

On macOS / Linux:

# 1. Set JAVA_HOME
export JAVA_HOME=$(/usr/libexec/java_home -v 21)

# 2. Navigate to android directory and build
cd android
./gradlew assembleDebug
cd ..

📦 Output APK Location:

After compilation, the generated APK file is located at:

android/app/build/outputs/apk/debug/app-debug.apk

⚡ One-Click Windows Build Script (build-apk.ps1)

For rapid iterative development on Windows, simply run:

.\build-apk.ps1

This single script automatically:

  1. Runs npm run build
  2. Checks if android/ exists (runs npx cap add android and npm run setup:android if missing, or npx cap sync android if present)
  3. Runs Gradle assembleDebug using Java 21
  4. Copies the output APK directly to QuotationInterior.apk in your project folder.

🔒 Git & Repository Guidelines

The repository is pre-configured with .gitignore to exclude the 4 non-essential folders (node_modules/, dist/, .netlify/, and android/). See GIT_IGNORE_GUIDE.txt for details.


📄 License

This project is licensed under the MIT License.

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages