Views: - Login/Registrierung - Dashboard mit Stats - Aufträge (Liste + Detail) - Mitarbeiterverwaltung - Verfügbarkeitskalender - Stundenzettel - Einstellungen - Module (Dev-Panel) Features: - Vue 3 + Composition API - TailwindCSS mit Dark Mode - Pinia State Management - JWT Auth mit Refresh - Responsive Design - Rollen-basierte Navigation
91 lines
1.9 KiB
Markdown
91 lines
1.9 KiB
Markdown
# SeCu Frontend
|
|
|
|
Vue 3 + TailwindCSS Frontend für die SeCu Mitarbeiterverwaltung.
|
|
|
|
## Tech Stack
|
|
|
|
- **Framework:** Vue 3 (Composition API)
|
|
- **Build:** Vite
|
|
- **Styling:** TailwindCSS
|
|
- **State:** Pinia
|
|
- **Routing:** Vue Router
|
|
|
|
## Setup
|
|
|
|
```bash
|
|
# Dependencies installieren
|
|
npm install
|
|
|
|
# Development Server starten
|
|
npm run dev
|
|
|
|
# Production Build
|
|
npm run build
|
|
```
|
|
|
|
## Umgebungsvariablen
|
|
|
|
Erstelle `.env.local`:
|
|
|
|
```
|
|
VITE_API_URL=http://localhost:8004/api
|
|
```
|
|
|
|
Für Production:
|
|
```
|
|
VITE_API_URL=https://api.secu.kronos-soulution.de/api
|
|
```
|
|
|
|
## Struktur
|
|
|
|
```
|
|
src/
|
|
├── api/ # API Client
|
|
├── assets/ # CSS & statische Dateien
|
|
├── components/
|
|
│ ├── common/ # Wiederverwendbare Komponenten
|
|
│ └── layout/ # Layout-Komponenten (Sidebar, Header)
|
|
├── composables/ # Vue Composables
|
|
├── router/ # Vue Router Konfiguration
|
|
├── stores/ # Pinia Stores
|
|
│ └── auth.ts # Authentifizierung
|
|
└── views/ # Seiten
|
|
├── LoginView.vue
|
|
├── DashboardView.vue
|
|
├── OrdersView.vue
|
|
├── OrderDetailView.vue
|
|
├── UsersView.vue
|
|
├── AvailabilityView.vue
|
|
├── TimesheetsView.vue
|
|
├── SettingsView.vue
|
|
└── ModulesView.vue
|
|
```
|
|
|
|
## Features
|
|
|
|
- 🔐 **Login/Registrierung** mit JWT Auth
|
|
- 📊 **Dashboard** mit Statistiken
|
|
- 📋 **Aufträge** erstellen, bearbeiten, zuweisen
|
|
- 👥 **Mitarbeiter** verwalten (Chef/Disponent)
|
|
- 📅 **Verfügbarkeit** im Kalender melden
|
|
- ⏱️ **Stundenzettel** einreichen & genehmigen
|
|
- ⚙️ **Module** aktivieren/deaktivieren (Chef)
|
|
- 🌙 **Dark Mode** Support
|
|
- 📱 **Responsive** Design
|
|
|
|
## Rollen
|
|
|
|
| Rolle | Zugriff |
|
|
|-------|---------|
|
|
| Chef | Vollzugriff + Module verwalten |
|
|
| Disponent | Mitarbeiter + Aufträge + Stundenzettel |
|
|
| Mitarbeiter | Eigene Aufträge, Verfügbarkeit, Stundenzettel |
|
|
|
|
## Port
|
|
|
|
Development: `3006`
|
|
|
|
---
|
|
|
|
*SeCu Frontend v1.0.0*
|