intégration de tous les paramètres _deux pour le 2ème gamutable (si absent c'est celui du gamutable_un qui est utilisé). README pour l'utilisation de 2 gamutables

README.md

@@ -4,7 +4,7 @@
 Choisir entre la version minifiée de vuejs (sans le debug) ou la version de dev
 
 ## Utilisation
-1. Charger l'inclure (5 args possibles et facultatifs)
+- charger l'inclure (5 args possibles et facultatifs)
 ```html
 <INCLURE{fond=inclure/gamutable,env}>
 
@@ -23,20 +23,21 @@ Choisir entre la version minifiée de vuejs (sans le debug) ou la version de dev
 	env
 }>
 ```
->url_sort_asc et url_sort_desc => surcharge possible des icones de tri de colonnes
+- **url_sort_asc** et **url_sort_desc** => surcharge possible des icones de tri de colonnes
 
-1. Surcharger `json_gamutable.json.html` en suivant son modele
+
-* pour le header c'est de la forme : "champ":"label"
+## Personnalisation du contenu : surcharger `json_gamutable.json.html` en suivant son modele
-* **IMPORTANT** pour le content du json, il que le cle de la  KEY de la table soit "id" et non pas "id_souscription"
+- pour le header c'est de la forme : "champ":"label"
-* pour les champs date, pour avoir l'ordre de la col, il faut le format : dd/mm/yyyy ou dd/mm/yy
+- **IMPORTANT** pour le content du json, il que le cle de la  KEY de la table soit "id" et non pas "id_souscription"
-* on peut ajouter une clé classes pour ajouter des classes spécifiques à certaines colonnes
+- pour les champs date, pour avoir l'ordre de la col, il faut le format : dd/mm/yyyy ou dd/mm/yy
+- on peut ajouter une clé classes pour ajouter des classes spécifiques à certaines colonnes
 ```json
 "classes":{
 	"nom": "toto",
 	"email":"toto"
 }
 ```
-* On peut ajouter des tris par colonne soit avec un select soit avec un input
+- On peut ajouter des tris par colonne soit avec un select soit avec un input
 ```json
 "filtreCol" : {
 	"statut" : "select",
@@ -45,7 +46,8 @@ Choisir entre la version minifiée de vuejs (sans le debug) ou la version de dev
 }
 ```
 
-1. Pour utiliser **les actions** :
+
+## Utiliser les actions : 
 ```html
 [(#SET{statut,
 	#SET{args,#ID_SOUSCRIPTION|concat{-}|concat{#STATUT}}
@@ -64,7 +66,9 @@ Choisir entre la version minifiée de vuejs (sans le debug) ou la version de dev
 * il faut ajouter data-id="" si on veut recharger que cette ligne
 * si une variable du nom de `nomBlocAjaxReload` est définie, alors, un ajaxReload de ce bloc sera joué dans la fonctione de callback de l'action
 
-1. Pour utiliser **les crayons**, il faut utiliser le pipeline `crayons_vue_affichage_final`
+
+## Utiliser les crayons :
+- il faut utiliser le pipeline `crayons_vue_affichage_final`
 ```php
 /**
  * injection du reload de vuejs pour les crayons de l'objet souscription
@@ -110,7 +114,8 @@ function autoriser_meta_modifier($faire, $type, $id, $qui, $opt) {
 ```
 
 
-1. Pour utiliser une **mediabox** ou **modalbox** et rechargement total/partiel de la page: on peut demander à vuejs de recharger tout le json ou simplement une ligne dans le cas d'une modification
+## Utiliser une mediabox ou modalbox :
+- pour rechargement total/partiel de la page: on peut demander à vuejs de recharger tout le json ou simplement une ligne dans le cas d'une modification
 	1. Dans le json : ajouter un lien avec la classe mediabox ou modalbox (cf ex de json)
 	```html
 	"modif" : [(#VAL{<a class="modalbox" href="[(#URL_PAGE{souscrire}|parametre_url{id_souscription,#ID_SOUSCRIPTION}|parametre_url{redirect,gamutable})]"><i class="fa fa-pencil"></i></a>}|json_encode)],
@@ -126,4 +131,37 @@ function autoriser_meta_modifier($faire, $type, $id, $qui, $opt) {
 		$res['message_ok'] = gamutable_fermer_modalbox();
 	}
 	```
-	*il faut ajouter data-confirm="Confirmez vous ..." si on veut ajouter une popin de confirmation*
+- Ajouter `data-confirm="Confirmez vous ..."` si on veut ajouter une popin de confirmation
+
+
+## Utiliser deux Gamutables dans la même page :
+- créer les 2 apiuri dans l'#ENV : **apiuri** et **apiuri_deux**
+- tous les paramètres envoyés a inclure/gamutable peuvent êtres "dédoublés" avec le suffixe **_deux**
+- pour personnaliser le contenu entre les 2 gamutables on peut surcharger `inclure/separateur_gamutables`
+- Exemple :
+```html
+<div class="tableau_resas">
+	#SET{s,#VAL{spip.php?page=json_resas.json}}
+	[(#ENV{statut}|oui)
+		[(#SET{s,#GET{s}|concat{&statut=}|concat{#ENV{statut}}})]
+	]
+	#SET{t,#VAL{spip.php?page=json_totaux.json}}
+	[(#SET{t,#GET{t}|concat{&saison=}|concat{#ENV{saison,#DATE|affdate{Y}}}})]
+	<INCLURE{fond=inclure/gamutable,
+		titreGamutableUn="Le premier gamutable",
+		titreGamutableDeux="Le deuxieme gamutable",
+		apiuri=#GET{s},
+		apiuri_deux=#GET{t},
+		tparpage=[15,25,50,'Tous'],
+		tparpage_deux=[20,50,'Tous'],
+		champcsv="search",
+		champcsv_deux="search",
+		delimitercsv=";",
+		delimitercsv_deux=";",
+		namecsv="premier.csv",
+		namecsv_deux="deuxieme.csv",
+		env
+	}>
+</div>
+```
+

inclure/gamutable.html

@@ -4,6 +4,7 @@
 [(#SET{sort_desc,[(#CHEMIN{img/sprite_gamutable.svg})#sort_desc]})]
 <span class="crayon gamutable-yyyy-nn"></span>
 <div id="app">
+	<div class="container_un">
 		<div class="gamutableUn">
 			[<span class="titre titreGamutableUn">(#ENV{titreGamutableUn})</span>]
 			<mon-tableau
@@ -19,25 +20,26 @@
 				ref="montableau"
 			></mon-tableau>
 		</div>
-
+	</div>
 	<BOUCLE_deux(CONDITION){si #ENV{apiuri_deux}|oui}>
 		<INCLURE{fond=inclure/separateur_gamutables,env}>
-		
+		<div class="container_deux">
 			<div class="gamutableDeux">
 				[<span class="titre titreGamutableDeux">(#ENV{titreGamutableDeux})</span>]
 				<mon-tableau
 					apiuri="[(#ENV{apiuri_deux})]"
 					:tparpage="#ENV{tparpage_deux, [10, 20, 50, 'Tous']}"
-				champcsv="[(#ENV{champcsv,html})]"
+					champcsv="[(#ENV{champcsv_deux, #ENV{champcsv,html}})]"
-				delimitercsv="[(#ENV{delimitercsv,','})]"
+					delimitercsv="[(#ENV{delimitercsv_deux, #ENV{delimitercsv,','}})]"
-				namecsv="[(#ENV{namecsv_deux})]"
+					namecsv="[(#ENV{namecsv_deux, #ENV{namecsv}})]"
 					urlvuebloc="[(#ENV{urlvuebloc_deux})]"
-				url_sort_asc="[(#ENV{sort_asc,#GET{sort_asc}})]"
+					url_sort_asc="[(#ENV{sort_asc_deux, #ENV{sort_asc,#GET{sort_asc}}})]"
-				url_sort_desc="[(#ENV{sort_desc,#GET{sort_desc}})]"
+					url_sort_desc="[(#ENV{sort_desc_deux, #ENV{sort_desc,#GET{sort_desc}}})]"
-				filtrecolmulti="[(#ENV{filtrecolmulti,non})]"
+					filtrecolmulti="[(#ENV{filtrecolmulti_deux, #ENV{filtrecolmulti,non}})]"
 					ref="montableau"
 					></mon-tableau>
 			</div>
+		</div>
 	</BOUCLE_deux>
 </div>