[ui-dsfr] update vue-dsfr to version 7.0.0

Author: ppinette

vertigo-ui-dsfr/package-lock.json

@@ -9,7 +9,7 @@
   },
   "dependencies": {
     "@gouvfr/dsfr": "^1.12.1",
-    "@gouvminint/vue-dsfr": "^6.0.0",
+    "@gouvminint/vue-dsfr": "^7.0.0",
     "vue": "^3.4.29"
   },
   "devDependencies": {

vertigo-ui-dsfr/package.json

@@ -8,6 +8,7 @@ import RouterLink from "@/components/Routerlink.vue";
 import DsfrFacets from "@/components/DsfrFacets.vue";
 
 import './utils.css'
+import './surcharges.css'
 
 var DSFR = {
     install: function (vueApp, options) {

vertigo-ui-dsfr/src/components/DsfrVTable.vue

@@ -0,0 +1,3 @@
+.fr-table .fr-select {
+    max-width: min-content;
+}

vertigo-ui-dsfr/src/components/DsfrVTd.vue

@@ -1,18 +1,16 @@
 <th:block th:fragment="dsfr-column-table(list, field, name, label, align, sortable, datetimeFormat, class, td_attrs)" vu:alias="dsfr-column"
           vu:selector="${renderTableAsGrid == null || !renderTableAsGrid }"
           th:assert="${(field != null) or (name != null and label != null)}"
-          th:with="columnName=${name != null ? name : field},
+          th:with="columnName=${name != null ? name : 'col_' + field},
                    columnLabel=${label != null ? label : model.util.label(list + '.' + field)},
                    columnAlign=${model.util.smartTypeAlign(list, field, align)},
                    columnClass=${model.util.smartTypeCss(list, field, class, 'col_'+name)},
                    columnSortable=${sortable != null ? sortable : (field != null) }">
 
-    <th:block th:with="objectKey=${model.vContext['componentStates']['__${componentId}__'].addObjectToList('columns', {'key': columnName, 'field': field, 'label': columnLabel, 'align': columnAlign, 'classes':(class?:columnClass), 'headerClasses':(class?:columnClass) })}"/>
-    <th:block th:if="(modifiableTable!=null?false:columnSortable)"
-              th:with="objectKey=${model.vContext['componentStates']['__${componentId}__'].addObjectToList('sortableRows', columnName)}" />
+    <th:block th:with="objectKey=${model.vContext['componentStates']['__${componentId}__'].addObjectToList('columns', {'key': columnName, 'field': field, 'label': columnLabel, 'align': columnAlign, 'sortable': (modifiableTable!=null?false:columnSortable), 'classes':(class?:columnClass), 'headerClasses':(class?:columnClass) })}"/>
     <vu:include-data th:if="${field != null}" object="${list}" field="${field}"/>
 
     <template th:v-if="|colKey === '${columnName}'|">
-        <vu:content><th:block th:if="${field != null}">{{ props.row.[[${field}]] }}</th:block></vu:content><!--/* Default content */-->
+        <vu:content><th:block th:if="${field != null}">{{ cell.[[${field}]] }}</th:block></vu:content><!--/* Default content */-->
     </template>
 </th:block>

vertigo-ui-dsfr/src/main.js

@@ -13,7 +13,7 @@
                        objectKey=${model.vContext['componentStates'][__${componentId}__].addList('sortableRows')},
                        objectKey=${model.vContext['componentStates'][__${componentId}__].addList('selected')},
                        objectKey=${model.vContext['componentStates'][__${componentId}__][loading] = false },
-                       objectKey=${model.vContext['componentStates'][__${componentId}__].addObject('pagination', {'page': 1 , 'rowsPerPage' : myRowsPerPage, 'componentId' : componentId, 'listKey' : list})}"
+                       objectKey=${model.vContext['componentStates'][__${componentId}__].addObject('pagination', {'page': 0 , 'rowsPerPage' : myRowsPerPage, 'componentId' : componentId, 'listKey' : list})}"
               th:remove="all"/>
     <th:block th:if="${sortUrl != null}"
               th:attr="objectKey=${model.vContext['componentStates'][__${componentId}__]['pagination'].put('sortUrl', sortUrl)}"
@@ -29,10 +29,13 @@
               th:remove="all"/>
 
     <dsfr-data-table th:title="${vTitle==null?title?:'':''}" th::title="${vTitle?:''}"
-                     th::header-row="|componentStates.${componentId}.columns|"
+                     th::headers-row="|componentStates.${componentId}.columns|"
                      th::rows="|vueData.${list}|"
                      th::rows-per-page="|componentStates.${componentId}.pagination.rowsPerPage|"
-                     th::sortable-rows="|componentStates.${componentId}.sortableRows|"
+                     th::sortable-rows="|componentStates.${componentId}.columns.filter(o => o.sortable).map(o => o.key)|"
+                     th:v-model:selection="|componentStates.${componentId}.selected|"
+                     th::selectable-rows="${mySelectable ? 'true' : 'false'}"
+                     th:v-model:current-page="|componentStates.${componentId}.pagination.page|"
                      th:attr="__${table_attrs}__">
         <vu:content-slot name="table_slot" th:with="label=null, title=null, vTitle=null"/>
         <template #cell="{ colKey, cell }">