feat: ajout une nouvelle cle : header_top qui permet d'ajouter un th>tr pour des entetes de groupe de colonne via des colspan

```
"header_top":{
"Mais c'est qui ?": {"class":"descriptif text-center", "colspan" :5},
"Choix": {"class":"choix text-center", "colspan" :2}
}
```
This commit is contained in:
Christophe 2024-12-12 13:56:26 +01:00
parent 9807a18038
commit ab1b666aae
2 changed files with 17 additions and 0 deletions

View file

@ -1,6 +1,10 @@
#HTTP_HEADER{Content-Type: application/json; charset=#CHARSET} #HTTP_HEADER{Content-Type: application/json; charset=#CHARSET}
[(#ENV{id}|setenv{id_article})] [(#ENV{id}|setenv{id_article})]
[{ [{
"header_top":{
"Mais c'est qui ?": {"class":"descriptif text-center", "colspan" :5},
"Choix": {"class":"choix text-center", "colspan" :2}
},
"header":{ "header":{
"id": "_", "id": "_",
"titre": "titre", "titre": "titre",

View file

@ -64,8 +64,15 @@
<div class="vueBlocs-unbloc" v-for="ligne in tableau" :key="ligne.id" v-html="replaceBloc(ligne.html)"> <div class="vueBlocs-unbloc" v-for="ligne in tableau" :key="ligne.id" v-html="replaceBloc(ligne.html)">
</div> </div>
</div> </div>
<table class="table table--zebra" v-if="quelleVue === 'tableau'"> <table class="table table--zebra" v-if="quelleVue === 'tableau'">
<thead> <thead>
<tr v-if="Object.keys(header_top).length">
<th v-for="(d, nom_colonne, i) in header_top" :key="'header_top_' + i" :colspan="d.colspan" :class="d.class">
<span v-html="nom_colonne"></span>
</th>
</tr>
<tr> <tr>
<th v-for="(label, head, i) in header" :key="'head_' + i" :class="[head, classes[head]]"> <th v-for="(label, head, i) in header" :key="'head_' + i" :class="[head, classes[head]]">
<span class="gt_labels"> <span class="gt_labels">
@ -252,6 +259,7 @@ const props = defineProps({
}, },
}); });
let table = ref([]); let table = ref([]);
let header_top = ref({});
let header = ref([]); let header = ref([]);
let crayons = ref([]); let crayons = ref([]);
let classes = ref([]); let classes = ref([]);
@ -481,6 +489,9 @@ watch(
//~~~~~~~~~~~~~~~~~~~~~~~~~ //~~~~~~~~~~~~~~~~~~~~~~~~~
function gererConfig(config) { function gererConfig(config) {
header.value = config.header; header.value = config.header;
if (config.header_top !== undefined) {
header_top.value = config.header_top;
}
if (config.crayons !== undefined) { if (config.crayons !== undefined) {
crayons.value = config.crayons; crayons.value = config.crayons;
} }
@ -728,6 +739,7 @@ function chargerJson(id) {
function saveHeader() { function saveHeader() {
let $header = { let $header = {
header: header.value, header: header.value,
header_top: header_top.value,
crayons: crayons.value, crayons: crayons.value,
classes: classes.value, classes: classes.value,
filtreCol: filtreColType.value, filtreCol: filtreColType.value,
@ -834,6 +846,7 @@ function genererPDF(quoi = "tableau") {
langpdf: props.langpdf, langpdf: props.langpdf,
namepdf: props.namepdf, namepdf: props.namepdf,
header: header.value, header: header.value,
header_top: header_top.value,
arg: props.argpdf, arg: props.argpdf,
Tdata: $tableau, Tdata: $tableau,
}; };