Merge pull request #1065 from dnum-mi/fix/#1038-dsfr-data-table-pagination

fix(DsfrDataTable): 🐛 corrige l’incohérence des id des cases cochées

Author: laruiss

src/components/DsfrDataTable/DsfrDataTable.vue

@@ -104,19 +104,20 @@ const sortedRows = computed(() => {
   }
   return _sortedRows
 })
-const finalRows = computed(() => {
-  const rowKeys = props.headersRow.map((header) => {
-    if (typeof header !== 'object') {
-      return header
-    }
-    return header.key
-  })
+const rowKeys = computed(() => props.headersRow.map((header) => {
+  if (typeof header !== 'object') {
+    return header
+  }
+  return header.key
+}))
+const rowKeyIndex = computed(() => rowKeys.value.findIndex(key => key === props.rowKey))
 
+const finalRows = computed(() => {
   const rows = sortedRows.value.map((row) => {
     if (Array.isArray(row)) {
       return row
     }
-    return rowKeys.map(key => typeof row !== 'object' ? row : row[key] ?? row)
+    return rowKeys.value.map(key => typeof row !== 'object' ? row : row[key] ?? row)
   })
 
   if (props.pagination) {
@@ -225,11 +226,10 @@ function copyToClipboard (text: string) {
                   role="columnheader"
                 >
                   <div class="fr-checkbox-group fr-checkbox-group--sm">
-                    <!-- @vue-expect-error TS2538 -->
                     <input
                       :id="`row-select-${id}-${idx}`"
                       v-model="selection"
-                      :value="rows[idx][rowKey] ?? `row-${idx}`"
+                      :value="row[rowKeyIndex] ?? `row-${idx}`"
                       type="checkbox"
                     >
                     <label