101 lines
4.9 KiB
Markdown
101 lines
4.9 KiB
Markdown
this is remix web app with sqlite and prisma, create a comprehensive car maintenance management system with cool, sleek, modern responsive and Mobile-friendly UI/UX . Build a complete web application with the following detailed specifications:
|
|
|
|
## Core Requirements
|
|
- **Framework**: Remix web app with SQLite database and Prisma ORM
|
|
- **Purpose**: Car maintenance management system for business owners to track vehicle visits and maintenance records
|
|
- **Language**: Primary Arabic language support with RTL (Right-to-Left) design
|
|
- **Responsiveness**: Mobile-friendly responsive design throughout
|
|
|
|
## UI/UX Requirements
|
|
1. **RTL Layout**: All components must support Arabic RTL text direction
|
|
2. **Responsive Design**: Ensure optimal viewing on desktop, tablet, and mobile devices
|
|
3. **Dashboard Layout**: Create a responsive dashboard with:
|
|
- Collapsible sidebar navigation menu (full menu, icons-only menu)
|
|
- Collapsible sidebar for mobile devices (and full browser)
|
|
- Smooth transitions and mobile-optimized interactions
|
|
|
|
## Authentication System
|
|
4. **Custom Auth Logic**: Implement custom authentication compatible with both web and mobile applications
|
|
5. **User Schema**: Users must have the following fields:
|
|
- name (string)
|
|
- username (string, unique)
|
|
- email (string, unique)
|
|
- password (hashed)
|
|
- status (enum: "active", "inactive")
|
|
- authLevel (integer: 1=superadmin, 2=admin, 3=user)
|
|
- createdDate (datetime)
|
|
- editDate (datetime)
|
|
|
|
6. **Auth Routes**: Create signin and signup routes with shared layout
|
|
- **Signup Restriction**: Signup page should only be accessible when no auth-level=2 users exist in database. and signin can be done using username or email.
|
|
- **auth-levels are**: 1 for user, 2 for admin, 3 for superadmin
|
|
- Implement proper form validation and error handling
|
|
|
|
7. **Database Seeding**: Create seed file containing:
|
|
- One superadmin account (auth-level=1)
|
|
- Essential system data for initial setup
|
|
|
|
## Access Control & User Management
|
|
8. **User Management Page**:
|
|
- Accessible only to auth-level=3 (superadmin) and auth-level=2 (admin)
|
|
- Admin users (level=2) cannot view superadmin accounts (level=3)
|
|
- Superadmin users (level=3) can view and manage all accounts
|
|
- Include user creation, editing, status management, and deleting
|
|
|
|
## Core Business Features
|
|
9. **Data Management**: Implement full CRUD operations for:
|
|
- **Vehicles**
|
|
- **Customers**
|
|
- **Maintenance Visits**
|
|
- **Expenses**
|
|
- **Income** (records are generated from maintenance visits)
|
|
|
|
10. **Vehicle Schema**: Include the following fields:
|
|
- id (integer @id @default(autoincrement()))
|
|
- plateNumber (string, unique)
|
|
- bodyType (string) - e.g., Sedan, Coupe, HatchBack, PickUp, Bus - Van..a dropdownlist
|
|
- manufacturer (string) - e.g., Toyota, Mercedes, Ford, BMW,
|
|
- model (string) - e.g., Camry, S-Class
|
|
- trim (string) optional - e.g., GLX, S 600
|
|
- year (integer)
|
|
- Transmission (string) - dropdownlist : Automatic, Manual
|
|
- Fuel (string) - dropdownlist : Gasoline, Diesel, Hybrid, Mild Hybrid, Electric
|
|
- cylinders (integer) optional
|
|
- engineDisplacement (decimal) optional
|
|
- useType (enum: "personal", "taxi", "apps", "loading", "travel")
|
|
- ownerId (foreign key to customer)
|
|
- lastVisitDate (datetime)
|
|
- suggestedNextVisitDate (datetime)
|
|
- createdDate (datetime)
|
|
- updateDate (datetime)
|
|
|
|
- **Recommended Next Visit Delay**: Dropdown selection in the Visits route with options: 1 months, 2 months, 3 months and 4 months... when a vehicle register a maintenance visit the lastVisitDate at the Vehicle table will be the current date (current maintenance visit date) and the suggestedNextVisitDate should be the current maintenance visit date + the delay in months that selected from the Dropdown list.
|
|
|
|
11. **Maintenance Visit Schema**: Include standard maintenance visit fields plus:
|
|
- Link to vehicle and customer records
|
|
- Maintenance type and description
|
|
- Cost and payment status
|
|
- Kilometers
|
|
- visitDate, createdDate and updateDate
|
|
|
|
## Technical Implementation Requirements
|
|
- Set up proper Prisma schema with relationships
|
|
- Implement proper error handling and validation
|
|
- Create reusable components for forms and data tables
|
|
- Ensure proper TypeScript typing throughout
|
|
- Implement proper session management and route protection
|
|
- Create responsive navigation with mobile hamburger menu
|
|
- Use proper Arabic fonts and ensure text rendering works correctly in RTL
|
|
|
|
## Deliverables
|
|
Provide complete implementation including:
|
|
- Database schema (Prisma)
|
|
- Authentication system
|
|
- All CRUD operations for (users, customers, Vehicle, Maintenance Visits and Expenses)
|
|
- Responsive UI components
|
|
- Seed data file
|
|
- Route protection middleware
|
|
- Mobile-optimized navigation
|
|
|
|
Focus on creating a production-ready application with clean code architecture, proper error handling, and excellent user experience across all devices.
|