A comprehensive multi-user parking management system built with Vue.js and Flask. Manages multiple parking lots, real-time spot availability, and user reservations for 4-wheeler parking.
- Parking Lot Discovery - Browse available parking locations
- Quick Booking - One-click reservation system
- Reservation Management - Track active and historical bookings
- Automatic Billing - Cost calculation based on parking duration
- Data Export - Download parking history as CSV
- Lot Management - Create, update, and delete parking facilities
- User Management - View and manage registered users
- Analytics Dashboard - Revenue and utilization insights
- Advanced Search - Query system by various criteria
- Real-time Monitoring - Live parking spot status
- Secure Authentication - JWT-based user authentication
- Responsive Design - Works on desktop and mobile
- Real-time Updates - Live data without page refresh
- Background Tasks - Automated reminders and reports
- Data Visualization - Charts and analytics
- Python 3.x - Core programming language
- Flask 2.x - Web framework for API development
- SQLAlchemy - Database ORM
- JWT - Authentication system
- Celery - Background task processing
- SQLite - Database (development)
- Vue.js 3.2.x - SPA JavaScript framework
- Bootstrap 5.3.x - CSS framework
- Chart.js 4.5.x - Data visualization
- Axios - HTTP client for API calls
- FontAwesome - Icon library
- Vue CLI - Frontend build tools
- Flask-SQLAlchemy - Database operations
- Flask-JWT-Extended - JWT implementation
- Flask-Mail - Email functionality
- Python 3.7+
- Node.js 14+
- npm or yarn
-
Clone the repository
git clone https://github.com/dotcomaki/parking-app.git cd parking-app -
Use the setup scripts
# Make scripts executable chmod +x start.sh start_demo.sh # For full setup ./start_demo.sh # For demonstration mode ./start.sh
-
Access the application
- Frontend: http://localhost:8080
- Backend API: http://localhost:5000
parkingapp/
├── 📁 backend/ # Flask API server
│ ├── 📄 app.py # Main Flask application
│ ├── 📄 models.py # Database models
│ ├── 📄 config.py # Configuration settings
│ ├── 📄 tasks.py # Celery background tasks
│ ├── 📄 requirements.txt # Python dependencies
│ └── 📁 routes/ # API route definitions
│ ├── 📄 auth.py # Authentication routes
│ ├── 📄 user.py # User routes
│ └── 📄 admin.py # Admin routes
├── 📁 frontend/ # Vue.js client application
│ ├── 📄 package.json # Node.js dependencies
│ ├── 📁 src/ # Source code
│ │ ├── 📄 App.vue # Main Vue component
│ │ ├── 📄 main.js # Application entry point
│ │ └── 📁 components/ # Vue components
│ └── 📁 public/ # Static assets
├── 📄 start.sh # Production startup script
├── 📄 start_demo.sh # Demo startup script
├── 📄 run_daily_reminder.py # Daily notification script
├── 📄 run_monthly_report.py # Monthly report script
└── 📄 README.md # This file
Create a .env file in the backend directory:
SECRET_KEY=your-secret-key
DATABASE_URL=sqlite:///app.db
MAIL_SERVER=smtp.gmail.com
MAIL_USERNAME=your-email@gmail.com
MAIL_PASSWORD=your-app-password
GOOGLE_CHAT_WEBHOOK_URL=your-webhook-url- Development: SQLite (default)
- Production: PostgreSQL (recommended)
- Backend: Add routes in
backend/routes/ - Frontend: Add components in
frontend/src/components/ - Database: Update models in
backend/models.py
# Backend tests
cd backend
python -m pytest
# Frontend tests
cd frontend
npm run testThis project is licensed under the MIT License - see the LICENSE file for details.
Akif M
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
If you encounter any issues:
- Check the Issues page
- Create a new issue with detailed information
- Include error logs and steps to reproduce