From dc2b90b9633837ff9f903e4dbe42a5b1930a7cf3 Mon Sep 17 00:00:00 2001
From: CarliPinell <carlos.pinell@processmaker.com>
Date: Wed, 2 Oct 2024 09:43:06 -0400
Subject: [PATCH 1/2] fixing pagination with radio buttons

---
 src/components/renderer/form-record-list.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/renderer/form-record-list.vue b/src/components/renderer/form-record-list.vue
index e7670bd5f..54d87ac18 100644
--- a/src/components/renderer/form-record-list.vue
+++ b/src/components/renderer/form-record-list.vue
@@ -46,7 +46,6 @@
               <b-form-checkbox 
               v-model="selectedRows" 
               :value="item"
-              :checked="selected"
               @change="onMultipleSelectionChange(index)"/>
             </template>
             <template v-if="isFiledownload(field, item)">
@@ -411,11 +410,12 @@ export default {
       this.$emit('input',  data);
     },
     onRadioChange(selectedItem, index) {
+      const globalIndex = (this.currentPage - 1) * this.perPage + index;
       if(this.source?.singleField) {
         let valueOfColumn = selectedItem[this.source.singleField];
         this.componentOutput(valueOfColumn);
       } else {
-        selectedItem = { ...selectedItem, selectedRowIndex: index};
+        selectedItem = { ...selectedItem, selectedRowIndex: globalIndex};
         this.componentOutput(selectedItem);
       }
     },

From 0c9ec72bb97e6f51d815052928487c33bcfd1f55 Mon Sep 17 00:00:00 2001
From: CarliPinell <carlos.pinell@processmaker.com>
Date: Wed, 2 Oct 2024 22:23:46 -0400
Subject: [PATCH 2/2] saving select all checkbox option working ok

---
 src/components/renderer/form-record-list.vue | 60 +++++++++++++++-----
 1 file changed, 47 insertions(+), 13 deletions(-)

diff --git a/src/components/renderer/form-record-list.vue b/src/components/renderer/form-record-list.vue
index 54d87ac18..2b230880a 100644
--- a/src/components/renderer/form-record-list.vue
+++ b/src/components/renderer/form-record-list.vue
@@ -33,21 +33,35 @@
           :current-page="currentPage"
           data-cy="table"
         >
-          <template #cell()="{ index, field, item }">
+          <!-- Slot header for checkbox (Select All) -->
+          <template #head(checkbox)="data">
+            <b-form-checkbox
+              v-model="allRowsSelected"
+              @change="selectAllRows"
+              :indeterminate="indeterminate"
+              aria-label="Select All"
+            />
+          </template>
 
-            <template v-if="field.key === 'radio'">
-              <b-form-radio
-                v-model="selectedRow"
-                :value="item"
-                @change="onRadioChange(item, index)"
-              />
-            </template>
-            <template v-if="field.key === 'checkbox'">
-              <b-form-checkbox 
+          <template #cell(checkbox)="{ index, item }">
+            <b-form-checkbox 
               v-model="selectedRows" 
               :value="item"
-              @change="onMultipleSelectionChange(index)"/>
-            </template>
+              @change="onMultipleSelectionChange(index)"
+            />
+          </template>
+
+          <template #cell(radio)="{ index, item }">
+            <b-form-radio
+              v-model="selectedRow"
+              :value="item"
+              @change="onRadioChange(item, index)"
+              
+            />
+          </template>
+
+          <template #cell()="{ index, field, item }">
+
             <template v-if="isFiledownload(field, item)">
               <span href="#" @click="downloadFile(item, field.key, index)">{{
                 mustache(field.key, item)
@@ -264,10 +278,13 @@ export default {
       selectedRows: [],
       selectedIndex: null, 
       rows: [],
-      i: 1
+      selectAll: false
     };
   },
   computed: {
+    indeterminate() {
+      return this.selectedRows.length > 0 && this.selectedRows.length < this.tableData.data.length;
+    },
     popupConfig() {
       const config = [];
       config[this.form] = this.formConfig[this.form];
@@ -406,6 +423,23 @@ export default {
     this.$root.$emit("record-list-option", this.source?.sourceOptions);
   },
   methods: {
+    selectAllRows() {
+      if (this.allRowsSelected) {
+        const updatedRows = this.tableData.data.map((item, index) => {
+          return {
+            ...item,
+            selectedRowsIndex: index
+          };
+        });
+
+        this.selectedRows = updatedRows;
+        this.collectionData = updatedRows;
+        this.onMultipleSelectionChange();
+      } else {
+        this.selectedRows = [];
+        this.onMultipleSelectionChange();
+      }
+    },
     componentOutput(data) {
       this.$emit('input',  data);
     },