feat: on fait fonctionner le chargement de 2 tableaux pour ca il faut :

1.  avoir le meme type de stockage (fonctionne bien en indexedbb)
2.  si on veut recharger dans le deuxieme tableau, il faut appeler la
    fonction gamutable_fermer_modalbox avec un deuxieme parametre ex
    'deux'

gamutable_fonctions.php

@@ -14,21 +14,23 @@ if (!defined("_ECRIRE_INC_VERSION")) {
 }
 include_spip("inc/vite");
 
-function gamutable_fermer_modalbox($id_objet = 9999999999)
+function gamutable_fermer_modalbox($id_objet = 9999999999, $num = null) {
-{
+	if ($num) {
+		$num = '_deux';
+	}
 	$html = <<<EOJS
 		<script type="text/javascript">
 			id = "$id_objet";
 			id = parseInt(id);
 			if (id > 0 && id < 9999999999) {
 				if (typeof app !== 'undefined') {
-					app.rechargerJson(id);
+					app$num.rechargerJson(id);
 				}
 				$.modalboxclose();
 			}
 			if (id === 9999999999) {
 				if (typeof app !== 'undefined') {
-					app.rechargerJson();
+					app$num.rechargerJson();
 				}
 				$.modalboxclose();
 			}
@@ -38,20 +40,22 @@ EOJS;
 	return $html;
 }
 
-function gamutable_recharger_tableau($id_objet = 9999999999)
+function gamutable_recharger_tableau($id_objet = 9999999999, $num = null) {
-{
+	if ($num) {
+		$num = '_deux';
+	}
 	$html = <<<EOJS
 		<script type="text/javascript">
 			id = "$id_objet";
 			id = parseInt(id);
 			if (id > 0 && id < 9999999999) {
 				if (typeof app !== 'undefined') {
-					app.rechargerJson(id);
+					app$num.rechargerJson(id);
 				}
 			}
 			if (id === 9999999999) {
 				if (typeof app !== 'undefined') {
-					app.rechargerJson();
+					app$num.rechargerJson();
 				}
 			}
 			delete id;

inclure/gamutable.html

@@ -21,14 +21,13 @@
 [(#SET{pdfuri,#VAL{pdf_gamutable}|generer_url_action{"", 1}})]
 <span class="crayon gamutable-yyyy-nn"></span>
 
-[(#ENV{apiuri,spip.php?page=json_gamutable.json})]
 <div id="vueGamutable">
+	<BOUCLE_un(CONDITION){si #ENV{apiuri}|oui}>
 		<div class="container_un">
-		<div class="gamutableUn" [ id="(#ENV{id_gamutable})" ]>
 			[<span class="h2-like titregamutable">(#ENV{titregamutable})</span>]
-			<div id="vue-gamutable">
+			<div class="gamutableUn vue-gamutable" [ id="(#ENV{id_gamutable})" ]>
 				<gamu-table
-					apiuri="[(#ENV{apiuri,spip.php?page=json_gamutable.json})]"
+					apiuri="[(#ENV{apiuri})]"
 					pdfuri="#GET{pdfuri}"
 					:tparpage="#ENV{tparpage, [10, 20, 50, 'Tous']}"
 					champcsv="#ENV{champcsv,html}"
@@ -51,8 +50,39 @@
 				></gamu-table>
 			</div>
 		</div>
+	</BOUCLE_un>
+
+	<BOUCLE_deux(CONDITION){si #ENV{apiuri_deux}|oui}>
+		<INCLURE{fond=inclure/separateur_gamutables,env}>
+		<div class="container_deux">
+			[<span class="h2-like titregamutable_deux">(#ENV{titregamutable_deux})</span>]
+			<div class="gamutableDeux vue-gamutable"[ id="(#ENV{id_gamutable_deux})"]>
+				<gamu-table
+					apiuri="[(#ENV{apiuri_deux})]"
+					pdfuri="#GET{pdfuri}"
+					:tparpage="#ENV{tparpage_deux, #ENV{tparpage, [10, 20, 50, 'Tous']}}"
+					champcsv="[(#ENV{champcsv_deux, #ENV{champcsv,html}})]"
+					delimitercsv="[(#ENV{delimitercsv_deux, #ENV{delimitercsv,','}})]"
+					namecsv="[(#ENV{namecsv_deux, #ENV{namecsv}})]"
+					namepdf="#ENV{namepdf_deux}"
+					argpdf="#ENV{argpdf_deux}"
+					fichierpdf="[(#ENV{fichierpdf_deux, #ENV{fichierpdf}})]"
+					urlvuebloc="[(#ENV{urlvuebloc_deux})]"
+					url_sort_asc="[(#ENV{sort_asc_deux, #ENV{sort_asc,#GET{sort_asc}}})]"
+					url_sort_desc="[(#ENV{sort_desc_deux, #ENV{sort_desc,#GET{sort_desc}}})]"
+					filtrecolmulti="[(#ENV{filtrecolmulti_deux, #ENV{filtrecolmulti,oui}})]"
+					nomblocajaxreload="#ENV{nomblocajaxreload}"
+					stockage="#ENV{stockage,localstorage}"
+					includespip="#ENV{includespip}"
+					ref="montableau_deux"
+					filtrer="#ENV{filtrer}"
+					_id="#ENV{_id}"
+					filtreselect="[(#ENV{filtrerselect_deux})]"
+				></gamu-table>
 			</div>
 		</div>
+	</BOUCLE_deux>
+</div>
 
 [(#REM) si dans l'env il y a un parametre _id=xxx, il sera récupéré pour
 selectionner cette ligne dans le gamutable ajout de la classe: select sur le tr
@@ -60,48 +90,4 @@ selectionner cette ligne dans le gamutable ajout de la classe: select sur le tr
 <script type="text/javascript">
 	var nomBlocAjaxReload = "";
 </script>
-<script
+<script src="[(#CHEMIN{js/localforage.js}|timestamp)]" type="text/javascript"></script>
-	src="[(#CHEMIN{js/localforage.js}|timestamp)]"
-	type="text/javascript"
-></script>
-
-[(#REM) [(#CONFIG{gamutable/version_js}|=={dev}|?{
-<script src="[(#CHEMIN{js/vue.js}|timestamp)]" type="text/javascript"></script>
-<script
-	src="[(#CHEMIN{js/localforage.js}|timestamp)]"
-	type="text/javascript"
-></script>
-<script
-	src="[(#CHEMIN{js/papaparse.js}|timestamp)]"
-	type="text/javascript"
-></script>
-<script
-	src="[(#CHEMIN{js/vue-next-select.js}|timestamp)]"
-	type="text/javascript"
-></script>
-<script
-	src="[(#CHEMIN{js/gamutable.js}|timestamp)]"
-	type="text/javascript"
-></script>
-,
-<script
-	src="[(#CHEMIN{js/vue.min.js}|timestamp)]"
-	type="text/javascript"
-></script>
-<script
-	src="[(#CHEMIN{js/localforage.min.js}|timestamp)]"
-	type="text/javascript"
-></script>
-<script
-	src="[(#CHEMIN{js/papaparse.min.js}|timestamp)]"
-	type="text/javascript"
-></script>
-<script
-	src="[(#CHEMIN{js/vue-next-select.min.js}|timestamp)]"
-	type="text/javascript"
-></script>
-<script
-	src="[(#CHEMIN{js/gamutable.js}|compacte|timestamp)]"
-	type="text/javascript"
-></script>
-})] ]

src/components/gamuTable.vue

@@ -342,19 +342,8 @@
 </template>
 
 <script setup>
-import {
+import { watch, ref, onMounted, computed, nextTick, inject } from "vue";
-	defineExpose,
-	watch,
-	ref,
-	onMounted,
-	computed,
-	nextTick,
-	inject,
-} from "vue";
-// import titi from "./titi";
 import VueSelect from "vue-next-select";
-// const a = titi();
-// console.log("gamuTable vue a = ", a);
 const $papa = inject("$papa");
 const props = defineProps({
 	tparpage: {
@@ -1101,12 +1090,15 @@ function trouver_index(table, id) {
 	});
 	return i;
 }
-const montableau = ref();
 function rechargerJson(id, ajaxCrayons = true) {
 	ajaxCrayons = ajaxCrayons;
 	chargerJson(id);
 }
-defineExpose({ rechargerJson });
+function rechargerJson_deux(id, ajaxCrayons = true) {
+	ajaxCrayons = ajaxCrayons;
+	chargerJson(id);
+}
+defineExpose({ rechargerJson, rechargerJson_deux });
 </script>
 
 <style scoped>

src/gamutable.js

@@ -12,6 +12,9 @@ const components = {
 	GamuTable,
 };
 
+let i = 1;
+for (const el of document.getElementsByClassName("vue-gamutable")) {
+	if (i === 1) {
 		window.app = createApp({
 			components,
 			mounted() {
@@ -20,4 +23,18 @@ window.app = createApp({
 		});
 		app.use(VuePapaParse);
 		app.provide("$papa", app.config.globalProperties.$papa);
-app.mount("#vue-gamutable");
+		app.mount(el);
+	} else if (i === 2) {
+		window.app_deux = createApp({
+			components,
+			mounted() {
+				app_deux.rechargerJson =
+					this.$refs.montableau_deux.rechargerJson;
+			},
+		});
+		app_deux.use(VuePapaParse);
+		app_deux.provide("$papa", app_deux.config.globalProperties.$papa);
+		app_deux.mount(el);
+	}
+	i++;
+}