mirror of
https://github.com/R0m1k3/LogiFlow.git
synced 2026-10-23 23:18:18 +02:00
Add button for admins to validate orders directly from the calendar
Adds a conditional "Validate Order" button (visible on hover to admins only) to the order cards in the calendar view, allowing for one-click status updates to 'delivered' and invalidating related data queries. Replit-Commit-Author: Agent Replit-Commit-Session-Id: a8a78c07-e900-425c-a577-5b4c5894379d Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/a8a78c07-e900-425c-a577-5b4c5894379d/3ec1Xks
This commit is contained in:
1 parent
041891baf0
commit
a8ff4c0c73
3 files changed
+117
-4
No files matched your search
@@ -0,0 +1,54 @@
|
||||
# Fonctionnalité Bouton "Valider Commande" - Calendrier
|
||||
|
||||
## Nouvelle Fonctionnalité
|
||||
|
||||
J'ai ajouté un bouton de validation directement sur les cartes des commandes dans le calendrier, avec les caractéristiques suivantes :
|
||||
|
||||
### Fonctionnement
|
||||
|
||||
- **Visibilité** : Le bouton n'est visible que pour les utilisateurs avec le rôle `admin`
|
||||
- **Apparition** : Le bouton apparaît uniquement au survol de la carte de commande (effet hover)
|
||||
- **Cible** : Seules les commandes qui ne sont pas encore en statut `delivered` affichent le bouton
|
||||
- **Action** : Un clic sur le bouton marque immédiatement la commande comme `delivered`
|
||||
|
||||
### Interface Utilisateur
|
||||
|
||||
- **Icône** : CheckCircle (cercle avec coche)
|
||||
- **Position** : À droite de la carte, avant les autres indicateurs de statut
|
||||
- **Style** : Bouton fantôme semi-transparent qui devient visible au survol
|
||||
- **Feedback** : Toast de confirmation quand la validation réussit
|
||||
|
||||
### Avantages
|
||||
|
||||
1. **Accès Direct** : Plus besoin d'ouvrir le modal de détail pour valider une commande
|
||||
2. **Interface Propre** : Le bouton n'encombre pas l'interface car il n'apparaît qu'au survol
|
||||
3. **Sécurité** : Réservé aux administrateurs uniquement
|
||||
4. **Efficacité** : Validation en un clic avec feedback immédiat
|
||||
|
||||
### Utilisation
|
||||
|
||||
1. **Connexion Admin** : Connectez-vous avec un compte administrateur
|
||||
2. **Survol** : Passez la souris sur une commande non-delivered (orange ou bleue)
|
||||
3. **Validation** : Cliquez sur l'icône de cercle avec coche qui apparaît
|
||||
4. **Confirmation** : La commande passe en gris (delivered) avec un toast de confirmation
|
||||
|
||||
### Déploiement en Production
|
||||
|
||||
Les modifications ont été apportées aux fichiers :
|
||||
- `client/src/components/CalendarGrid.tsx` : Ajout du bouton et logique de validation
|
||||
- `client/src/pages/Calendar.tsx` : Passage des props user et callback de rafraîchissement
|
||||
|
||||
Pour déployer en production :
|
||||
1. Appliquer les modifications aux fichiers mentionnés
|
||||
2. Reconstruire le frontend (`npm run build`)
|
||||
3. Redémarrer l'application
|
||||
|
||||
### Résolution du Problème CMD-55
|
||||
|
||||
Avec cette fonctionnalité, vous pouvez maintenant :
|
||||
1. Trouver CMD-55 dans le calendrier
|
||||
2. Passer la souris dessus (si elle n'est pas déjà delivered)
|
||||
3. Cliquer sur le bouton de validation
|
||||
4. CMD-55 passera automatiquement en gris (delivered)
|
||||
|
||||
Cette solution est plus simple et directe que la synchronisation manuelle précédente.
|
||||
Reference in new issue
Block a user