A comprehensive vehicle inspection management system built with Next.js and Prisma.
Work Tracker is a web application designed to streamline the process of daily vehicle inspections. It allows staff members to complete and submit inspection checklists for vehicles or equipment, with the ability to attach proof photos. Administrators can review submissions, manage staff accounts, and generate reports.
- Complete daily vehicle inspection checklists
- Attach proof photos to inspection items
- View and edit submission history
- Track inspection status (pending, approved, rejected)
- Review and approve/reject staff submissions
- Manage staff accounts (create, edit, deactivate)
- View comprehensive task records with filtering options
- Generate reports and export data
- Frontend: Next.js 15, React 19, TypeScript, Tailwind CSS
- Backend: Next.js API Routes
- Database: PostgreSQL with Prisma ORM
- Authentication: NextAuth.js
- UI Components: Radix UI, Lucide React icons
- Form Handling: React Hook Form, Zod validation
- Data Export: XLSX, jsPDF
- Data Visualization: Recharts
- Node.js 18+ and npm
- PostgreSQL database
-
Clone the repository:
git clone https://github.com/yourusername/work-tracker.git cd work-tracker
-
Install dependencies:
npm install
-
Set up environment variables: Create a
.env.local
file in the root directory with the following variables:DATABASE_URL="postgresql://username:password@localhost:5432/work_tracker" NEXTAUTH_SECRET="your-secret-key" NEXTAUTH_URL="http://localhost:3000"
-
Set up the database:
npx prisma migrate dev npx prisma db seed
-
Start the development server:
npm run dev
-
Open http://localhost:3000 in your browser to see the application.
work-tracker/
├── app/ # Next.js app directory
│ ├── admin/ # Admin portal pages
│ ├── api/ # API routes
│ ├── staff/ # Staff portal pages
│ └── page.tsx # Landing page
├── components/ # React components
│ ├── admin/ # Admin-specific components
│ ├── landing/ # Landing page components
│ ├── staff/ # Staff-specific components
│ └── ui/ # Reusable UI components
├── hooks/ # Custom React hooks
├── lib/ # Utility functions and libraries
├── prisma/ # Prisma schema and migrations
│ └── schema.prisma # Database schema
├── public/ # Static assets
└── types/ # TypeScript type definitions
- Log in to the staff portal
- Navigate to the "Daily Workcheck" tab
- Select a vehicle/unit to inspect
- Complete the inspection checklist
- Attach required proof photos
- Submit the inspection
- View submission history and status in the "My History" tab
- Log in to the admin portal
- Review pending submissions in the "Task Records" tab
- Approve or reject submissions with comments
- Manage staff accounts in the "Staff Management" tab
- Generate reports and export data as needed
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out the Next.js deployment documentation for more details.
This project is licensed under the MIT License - see the LICENSE file for details.