Livraison d ela gestion des opérations v0.4.0

app/lib/presentation/widgets/custom_text_field.dart

@@ -2,51 +2,47 @@ import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 
 class CustomTextField extends StatelessWidget {
-  final TextEditingController controller;
+  final TextEditingController? controller;
   final String label;
   final String? hintText;
+  final String? helperText;
   final IconData? prefixIcon;
   final Widget? suffixIcon;
-  final bool obscureText;
-  final TextInputType keyboardType;
-  final String? Function(String?)? validator;
-  final List<TextInputFormatter>? inputFormatters;
-  final int? maxLines;
-  final int? minLines;
   final bool readOnly;
-  final VoidCallback? onTap;
-  final Function(String)? onChanged;
+  final bool isRequired;
   final bool autofocus;
   final FocusNode? focusNode;
-  final String? errorText;
-  final Color? fillColor;
-  final String? helperText;
+  final String? Function(String?)? validator;
+  final VoidCallback? onTap;
+  final TextInputType? keyboardType;
+  final List<TextInputFormatter>? inputFormatters;
+  final int? maxLines;
+  final int? maxLength;
+  final bool obscureText;
+  final Function(String)? onChanged;
   final Function(String)? onFieldSubmitted;
-  final bool isRequired;
 
   const CustomTextField({
     super.key,
-    required this.controller,
+    this.controller,
     required this.label,
     this.hintText,
+    this.helperText,
     this.prefixIcon,
     this.suffixIcon,
-    this.obscureText = false,
-    this.keyboardType = TextInputType.text,
-    this.validator,
-    this.inputFormatters,
-    this.maxLines = 1,
-    this.minLines,
     this.readOnly = false,
-    this.onTap,
-    this.onChanged,
+    this.isRequired = false,
     this.autofocus = false,
     this.focusNode,
-    this.errorText,
-    this.fillColor,
-    this.helperText,
+    this.validator,
+    this.onTap,
+    this.keyboardType,
+    this.inputFormatters,
+    this.maxLines = 1,
+    this.maxLength,
+    this.obscureText = false,
+    this.onChanged,
     this.onFieldSubmitted,
-    this.isRequired = false,
   });
 
   @override
@@ -56,124 +52,105 @@ class CustomTextField extends StatelessWidget {
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
+        // Label avec indicateur de champ requis
         if (label.isNotEmpty) ...[
-          Text(
-            label,
-            style: theme.textTheme.titleSmall?.copyWith(
-              fontWeight: FontWeight.w500,
-              color: theme.colorScheme.onBackground,
-            ),
+          Row(
+            children: [
+              Text(
+                label,
+                style: theme.textTheme.bodyMedium?.copyWith(
+                  fontWeight: FontWeight.w500,
+                  color: theme.colorScheme.onSurface,
+                ),
+              ),
+              if (isRequired) ...[
+                const SizedBox(width: 4),
+                Text(
+                  '*',
+                  style: TextStyle(
+                    color: theme.colorScheme.error,
+                    fontWeight: FontWeight.bold,
+                  ),
+                ),
+              ],
+            ],
           ),
           const SizedBox(height: 8),
         ],
-        // Ajouter un Container avec une ombre pour créer un effet d'élévation
-        Stack(
-          children: [
-            Container(
-              decoration: BoxDecoration(
-                borderRadius: BorderRadius.circular(12),
-                boxShadow: [
-                  BoxShadow(
-                    color: Colors.black.withOpacity(0.05),
-                    blurRadius: 4,
-                    offset: const Offset(0, 2),
-                  ),
-                ],
-              ),
-              child: TextFormField(
-                controller: controller,
-                obscureText: obscureText,
-                keyboardType: keyboardType,
-                validator: validator,
-                inputFormatters: inputFormatters,
-                maxLines: maxLines,
-                minLines: minLines,
-                readOnly: readOnly,
-                onTap: onTap,
-                onChanged: onChanged,
-                onFieldSubmitted: onFieldSubmitted,
-                autofocus: autofocus,
-                focusNode: focusNode,
-                style: theme.textTheme.bodyLarge?.copyWith(
-                  color: theme.colorScheme.onBackground,
-                ),
-                decoration: InputDecoration(
-                  hintText: hintText,
-                  hintStyle: theme.textTheme.bodyLarge?.copyWith(
-                    color: theme.colorScheme.onBackground.withOpacity(0.5),
-                  ),
-                  errorText: errorText,
-                  helperText: helperText,
-                  helperStyle: theme.textTheme.bodySmall?.copyWith(
-                    color: theme.colorScheme.onBackground.withOpacity(0.6),
-                  ),
-                  prefixIcon: prefixIcon != null
-                      ? Icon(prefixIcon, color: theme.colorScheme.primary)
-                      : null,
-                  suffixIcon: suffixIcon,
-                  // Couleur de fond différente selon l'état (lecture seule ou éditable)
-                  fillColor: fillColor ??
-                      (readOnly
-                          ? const Color(
-                              0xFFF8F9FA) // Gris plus clair pour readOnly
-                          : const Color(
-                              0xFFECEFF1)), // Gris plus foncé pour éditable
-                  filled: true,
-                  // Ajouter une élévation avec une petite ombre
-                  border: OutlineInputBorder(
-                    borderRadius: BorderRadius.circular(12),
-                    borderSide: BorderSide.none,
-                  ),
-                  // Ajouter une ombre pour créer un effet d'élévation
-                  enabledBorder: OutlineInputBorder(
-                    borderRadius: BorderRadius.circular(12),
-                    borderSide: BorderSide.none,
-                    gapPadding: 0,
-                  ),
-                  focusedBorder: OutlineInputBorder(
-                    borderRadius: BorderRadius.circular(12),
-                    borderSide: BorderSide(
-                      color: theme.colorScheme.primary,
-                      width: 2,
-                    ),
-                  ),
-                  errorBorder: OutlineInputBorder(
-                    borderRadius: BorderRadius.circular(12),
-                    borderSide: BorderSide(
-                      color: theme.colorScheme.error,
-                      width: 2,
-                    ),
-                  ),
-                  focusedErrorBorder: OutlineInputBorder(
-                    borderRadius: BorderRadius.circular(12),
-                    borderSide: BorderSide(
-                      color: theme.colorScheme.error,
-                      width: 2,
-                    ),
-                  ),
-                  contentPadding: const EdgeInsets.symmetric(
-                    horizontal: 16,
-                    vertical: 16,
-                  ),
-                ),
+
+        // Champ de texte
+        TextFormField(
+          controller: controller,
+          focusNode: focusNode,
+          readOnly: readOnly,
+          autofocus: autofocus,
+          onTap: onTap,
+          validator: validator,
+          keyboardType: keyboardType,
+          inputFormatters: inputFormatters,
+          maxLines: maxLines,
+          maxLength: maxLength,
+          obscureText: obscureText,
+          onChanged: onChanged,
+          onFieldSubmitted: onFieldSubmitted,
+          decoration: InputDecoration(
+            hintText: hintText,
+            helperText: helperText,
+            prefixIcon: prefixIcon != null ? Icon(prefixIcon) : null,
+            suffixIcon: suffixIcon,
+            border: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(8),
+              borderSide: BorderSide(
+                color: theme.colorScheme.outline,
               ),
             ),
-            // Point rouge en haut à droite pour indiquer que le champ est obligatoire
-            if (isRequired)
-              Positioned(
-                top: 0,
-                right: 0,
-                child: Container(
-                  width: 10,
-                  height: 10,
-                  margin: const EdgeInsets.only(top: 8, right: 8),
-                  decoration: const BoxDecoration(
-                    color: Colors.red,
-                    shape: BoxShape.circle,
-                  ),
-                ),
+            enabledBorder: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(8),
+              borderSide: BorderSide(
+                color: theme.colorScheme.outline.withOpacity(0.5),
               ),
-          ],
+            ),
+            focusedBorder: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(8),
+              borderSide: BorderSide(
+                color: theme.colorScheme.primary,
+                width: 2,
+              ),
+            ),
+            errorBorder: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(8),
+              borderSide: BorderSide(
+                color: theme.colorScheme.error,
+                width: 2,
+              ),
+            ),
+            focusedErrorBorder: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(8),
+              borderSide: BorderSide(
+                color: theme.colorScheme.error,
+                width: 2,
+              ),
+            ),
+            filled: true,
+            fillColor: readOnly ? theme.colorScheme.surfaceContainerHighest.withOpacity(0.3) : theme.colorScheme.surface,
+            contentPadding: const EdgeInsets.symmetric(
+              horizontal: 16,
+              vertical: 12,
+            ),
+          ),
+          buildCounter: maxLength != null
+              ? (context, {required currentLength, required isFocused, maxLength}) {
+                  return Padding(
+                    padding: const EdgeInsets.only(top: 4),
+                    child: Text(
+                      '$currentLength/${maxLength ?? 0}',
+                      style: theme.textTheme.bodySmall?.copyWith(
+                        color: currentLength > (maxLength ?? 0) * 0.8 ? theme.colorScheme.error : theme.colorScheme.onSurface.withOpacity(0.6),
+                      ),
+                    ),
+                  );
+                }
+              : null,
         ),
       ],
     );