SPIP/gamutable
SPIP/gamutable
4
0
Fork 0
Code Issues 2 Pull requests Projects Releases Wiki Activity

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

Browse source
This commit is contained in:
cy_altern 2021-10-06 11:04:00 +02:00
parent f20a4c82c0
commit e8620b29d7
2 changed files with 82 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

62
README.md
View file

@ -4,7 +4,7 @@
Choisir entre la version minifiée de vuejs (sans le debug) ou la version de dev Choisir entre la version minifiée de vuejs (sans le debug) ou la version de dev
## Utilisation ## Utilisation
1. Charger l'inclure (5 args possibles et facultatifs) - charger l'inclure (5 args possibles et facultatifs)
```html ```html
<INCLURE{fond=inclure/gamutable,env}> <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 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 ```json
"classes":{ "classes":{
"nom": "toto", "nom": "toto",
"email":"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 ```json
"filtreCol" : { "filtreCol" : {
"statut" : "select", "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 ```html
[(#SET{statut, [(#SET{statut,
#SET{args,#ID_SOUSCRIPTION|concat{-}|concat{#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 * 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 * 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 ```php
/** /**
* injection du reload de vuejs pour les crayons de l'objet souscription * 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) 1. Dans le json : ajouter un lien avec la classe mediabox ou modalbox (cf ex de json)
```html ```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)], "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(); $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>
```

62
inclure/gamutable.html
View file

@ -4,39 +4,41 @@
[(#SET{sort_desc,[(#CHEMIN{img/sprite_gamutable.svg})#sort_desc]})] [(#SET{sort_desc,[(#CHEMIN{img/sprite_gamutable.svg})#sort_desc]})]
<span class="crayon gamutable-yyyy-nn"></span> <span class="crayon gamutable-yyyy-nn"></span>
<div id="app"> <div id="app">
<div class="gamutableUn"> <div class="container_un">
[<span class="titre titreGamutableUn">(#ENV{titreGamutableUn})</span>] <div class="gamutableUn">
<mon-tableau [<span class="titre titreGamutableUn">(#ENV{titreGamutableUn})</span>]
apiuri="[(#ENV{apiuri,spip.php?page=json_gamutable.json})]" <mon-tableau
:tparpage="#ENV{tparpage, [10, 20, 50, 'Tous']}" apiuri="[(#ENV{apiuri,spip.php?page=json_gamutable.json})]"
champcsv="#ENV{champcsv,html}" :tparpage="#ENV{tparpage, [10, 20, 50, 'Tous']}"
delimitercsv="#ENV{delimitercsv,','}" champcsv="#ENV{champcsv,html}"
namecsv="#ENV{namecsv}" delimitercsv="#ENV{delimitercsv,','}"
urlvuebloc="[(#ENV{urlvuebloc})]" namecsv="#ENV{namecsv}"
url_sort_asc="#ENV{sort_asc,#GET{sort_asc}}" urlvuebloc="[(#ENV{urlvuebloc})]"
url_sort_desc="#ENV{sort_desc,#GET{sort_desc}}" url_sort_asc="#ENV{sort_asc,#GET{sort_asc}}"
filtrecolmulti="#ENV{filtrecolmulti,non}" url_sort_desc="#ENV{sort_desc,#GET{sort_desc}}"
ref="montableau" filtrecolmulti="#ENV{filtrecolmulti,non}"
></mon-tableau> ref="montableau"
></mon-tableau>
</div>
</div> </div>
<BOUCLE_deux(CONDITION){si #ENV{apiuri_deux}|oui}> <BOUCLE_deux(CONDITION){si #ENV{apiuri_deux}|oui}>
<INCLURE{fond=inclure/separateur_gamutables,env}> <INCLURE{fond=inclure/separateur_gamutables,env}>
<div class="container_deux">
<div class="gamutableDeux"> <div class="gamutableDeux">
[<span class="titre titreGamutableDeux">(#ENV{titreGamutableDeux})</span>] [<span class="titre titreGamutableDeux">(#ENV{titreGamutableDeux})</span>]
<mon-tableau <mon-tableau
apiuri="[(#ENV{apiuri_deux})]" apiuri="[(#ENV{apiuri_deux})]"
:tparpage="#ENV{tparpage_deux, [10, 20, 50, 'Tous']}" :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})]" 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" ref="montableau"
></mon-tableau> ></mon-tableau>
</div>
</div> </div>
</BOUCLE_deux> </BOUCLE_deux>
</div> </div>