@amsom-habitat/amsom-table 4.3.13 → 4.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -8,7 +8,110 @@ Il regroupe les packages :
8
8
 
9
9
  ## Nouvelles fonctionnalités
10
10
 
11
- ### Menu contextuel (v2.x)
11
+ ### Formatage des données (v4.5.x)
12
+
13
+ Le composant `AmsomTableDraggable` supporte maintenant le formatage automatique et personnalisé des valeurs :
14
+
15
+ #### Formatter personnalisé
16
+
17
+ Définissez une fonction de formatage pour chaque colonne :
18
+
19
+ ```javascript
20
+ const columns = [
21
+ {
22
+ id: 'price',
23
+ libelle: 'Prix',
24
+ show: true,
25
+ formatter: (value, item) => {
26
+ // Formater le prix en euros
27
+ return value ? `${value.toFixed(2)} €` : '-'
28
+ }
29
+ },
30
+ {
31
+ id: 'fullName',
32
+ libelle: 'Nom complet',
33
+ show: true,
34
+ formatter: (value, item) => {
35
+ // Combiner plusieurs champs
36
+ return `${item.firstName} ${item.lastName}`.toUpperCase()
37
+ }
38
+ }
39
+ ]
40
+ ```
41
+
42
+ **Paramètres du formatter :**
43
+
44
+ - `value` : La valeur brute de la cellule (item[columnId])
45
+ - `item` : L'objet complet de la ligne (pour accéder à d'autres propriétés)
46
+
47
+ #### Type de données prédéfini
48
+
49
+ Utilisez `type` pour appliquer automatiquement un formatage standard :
50
+
51
+ ```javascript
52
+ const columns = [
53
+ {
54
+ id: 'createdAt',
55
+ libelle: 'Date de création',
56
+ show: true,
57
+ type: 'unixDate' // Formate timestamp Unix en DD/MM/YYYY
58
+ },
59
+ {
60
+ id: 'lastUpdate',
61
+ libelle: 'Dernière modification',
62
+ show: true,
63
+ type: 'unixDateTime' // Formate en DD/MM/YYYY HH:mm
64
+ },
65
+ {
66
+ id: 'amount',
67
+ libelle: 'Montant',
68
+ show: true,
69
+ type: 'currency' // Formate en euros (1234.56 → 1 234,56 €)
70
+ }
71
+ ]
72
+ ```
73
+
74
+ **Types disponibles :**
75
+
76
+ - `unixDate` : Timestamp Unix → format date (DD/MM/YYYY)
77
+ - `unixDateTime` : Timestamp Unix → format date et heure (DD/MM/YYYY HH:mm)
78
+ - `currency` : Nombre → format devise euro (1 234,56 €)
79
+
80
+ **Ordre de priorité :** Si `formatter` et `type` sont définis, `formatter` est prioritaire.
81
+
82
+ **Note :** Le formatage s'applique à l'affichage ET à la recherche (sauf si `customSearch` est défini).
83
+
84
+ ### Custom Search (v4.4.x)
85
+
86
+ Le composant `AmsomTableDraggable` supporte maintenant les fonctions de recherche personnalisées par colonne :
87
+
88
+ - **Recherche flexible** : Définissez votre propre logique de filtrage par colonne
89
+ - **Cas d'usage** : Filtrer par libellé quand la colonne affiche un ID
90
+ - **Compatible avec recherche standard** : Le customSearch complète la recherche par défaut
91
+
92
+ ```vue
93
+ <amsom-table-draggable :default-columns="columns" :td-items-list="data" :search="searchTerm">
94
+ <!-- vos templates -->
95
+ </amsom-table-draggable>
96
+ ```
97
+
98
+ **Exemple de configuration :**
99
+
100
+ ```javascript
101
+ const columns = [
102
+ {
103
+ id: 'userId',
104
+ libelle: 'Utilisateur',
105
+ show: true,
106
+ customSearch: (item, searchTerm) => {
107
+ // Filtrer par le libellé de l'utilisateur au lieu de l'ID
108
+ return normalize(item.userLibelle).includes(normalize(searchTerm))
109
+ }
110
+ }
111
+ ]
112
+ ```
113
+
114
+ ### Menu contextuel (v4.3.x)
12
115
 
13
116
  Le composant `AmsomTableDraggable` supporte maintenant les menus contextuels :
14
117