# Atlas CMMS Frontend

Enterprise-grade facilities management application built with Vue.js 3, Vuetify, and Pinia.

## Features

- **Modern Architecture**: Built with Vue 3 Composition API, Pinia for state management, and Vuetify 3 for UI components
- **Enterprise Design Patterns**: Repository pattern, separation of concerns, and modular architecture
- **Authentication**: JWT-based authentication with role-based access control
- **CMMS Functionality**: Work orders, asset management, inventory tracking, maintenance scheduling
- **Responsive Design**: Mobile-first design with Vuetify components
- **Type Safety**: Built with TypeScript support and comprehensive validation

## Tech Stack

- **Frontend Framework**: Vue.js 3
- **UI Framework**: Vuetify 3
- **State Management**: Pinia
- **Routing**: Vue Router 4
- **HTTP Client**: Axios
- **Build Tool**: Vite
- **Styling**: Material Design Icons

## Project Structure

```
src/
├── components/          # Reusable Vue components
│   ├── common/         # Common UI components
│   ├── forms/          # Form components
│   ├── layouts/        # Layout components
│   └── navigation/     # Navigation components
├── views/              # Page components
│   ├── auth/           # Authentication pages
│   ├── dashboard/      # Dashboard views
│   ├── workorders/     # Work order management
│   ├── assets/         # Asset management
│   ├── inventory/      # Inventory management
│   ├── maintenance/    # Maintenance scheduling
│   ├── reports/        # Reporting views
│   └── settings/       # Settings and configuration
├── services/           # Business logic layer
│   ├── api/            # API client configuration
│   └── repositories/   # Repository pattern implementation
├── stores/             # Pinia state stores
├── composables/        # Vue composables
├── utils/              # Utility functions
├── types/              # TypeScript type definitions
└── plugins/            # Vue plugins
```

## Getting Started

### Prerequisites

- Node.js 16 or higher
- npm or yarn
- Atlas CMMS backend server running

### Installation

1. Clone the repository
2. Install dependencies:
   ```bash
   npm install
   ```

3. Copy environment variables:
   ```bash
   cp .env.example .env
   ```

4. Update the `.env` file with your Atlas CMMS API endpoint:
   ```
   VITE_API_BASE_URL=http://your-atlas-cmms-api:8080/api
   ```

5. Start the development server:
   ```bash
   npm run dev
   ```

### Building for Production

```bash
npm run build
```

## Architecture Highlights

### Repository Pattern
All API interactions are abstracted through repository classes that extend a base repository, providing consistent CRUD operations and error handling.

### State Management
Pinia stores manage application state with composables providing reactive access to data and actions.

### Authentication
JWT-based authentication with automatic token refresh, role-based access control, and route guards.

### Component Structure
Modular component architecture with clear separation between presentation and business logic.

## Atlas CMMS API Integration

This frontend is designed to work with the Atlas CMMS backend API, supporting:

- **Authentication**: JWT-based login/logout with role management
- **Work Orders**: Full CRUD operations with status tracking and assignment
- **Assets**: Asset management with history tracking and file attachments
- **Users**: User management with team assignments and role-based permissions
- **Maintenance**: Preventive maintenance scheduling and tracking

## Development

### Scripts

- `npm run dev` - Start development server
- `npm run build` - Build for production
- `npm run preview` - Preview production build
- `npm run lint` - Run ESLint
- `npm run type-check` - Run TypeScript type checking

### Contributing

1. Follow the established code patterns and architecture
2. Use TypeScript types for all new code
3. Follow Vue 3 Composition API best practices
4. Ensure all components are responsive and accessible
5. Add appropriate error handling and validation

## License

This project is licensed under the MIT License.