Skip to content

Commit

Permalink
Merge pull request #1564 from alexed1/Datatable-Remove-&-Select
Browse files Browse the repository at this point in the history 
Datatable remove & select
  • Loading branch information
@alexed1
alexed1 authored Sep 21, 2024
2 parents 6381aa1 + 8448b9d commit c2920ca
Show file tree
Hide file tree
Showing 7 changed files with 146 additions and 43 deletions.
14 changes: 11 additions & 3 deletions flow_screen_components/datatable/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,8 +51,8 @@ https://unofficialsf.com/flow-action-and-screen-component-basepacks/

---
**Install Datatable**
[Version 4.2.1 (Production or Developer)](https://login.salesforce.com/packaging/installPackage.apexp?p0=04t5G000004fz7wQAA)
[Version 4.2.1 (Sandbox)](https://test.salesforce.com/packaging/installPackage.apexp?p0=04t5G000004fz7wQAA)
[Version 4.3.0 (Production or Developer)](https://login.salesforce.com/packaging/installPackage.apexp?p0=04t5G000004fz81QAA)
[Version 4.3.0 (Sandbox)](https://test.salesforce.com/packaging/installPackage.apexp?p0=04t5G000004fz81QAA)

---
**Starting with the Winter '21 Release, Salesforce requires that a User's Profile or Permission Set is given specific permission to access any @AuraEnabled Apex Method.**
Expand All @@ -71,7 +71,15 @@ A Permission Set (**USF Flow Screen Component - Datatable**) is included with th

---
# Release Notes


## 07/22/24 - Eric Smith - Version 4.3.0
**Updates:**
- Added additional output attributes for Apex Defined records (outputRemovedRowsString & outputRemainingRowsString)
- Added an option to display the number of selected records in the table header
-
**Bug Fixes:**
- Fixed bug where first column reference was off if the remove row action was on the left
-
## 07/09/24 - Eric Smith - Version 4.2.1
**Updates:**
- New Feature: Add a Remove Row action as the first or last column in a Datatable.
Expand Down
133 changes: 100 additions & 33 deletions flow_screen_components/datatable/force-app/main/default/lwc/datatable/datatable.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,15 @@ export default class Datatable extends LightningElement {

// Component Input & Output Attributes
//@api tableData = []; see new version below
@api columnFields = '';
@api
get columnFields() {
return (this.isEmptyUserDefinedObject) ? this.keyField : this._columnFields;
}
set columnFields(value) {
this._columnFields = value;
}
_columnFields;

@api columnAlignments = [];
@api columnCellAttribs = [];
@api columnEdits = '';
Expand Down Expand Up @@ -116,6 +124,10 @@ export default class Datatable extends LightningElement {
get isRemoveRowAction() {
return (this.cb_isRemoveRowAction == CB_TRUE) ? true : false;
}
set isRemoveRowAction(value) {
this._isRemoveRowAction = value;
}
_isRemoveRowAction;
@api cb_isRemoveRowAction;
// Console Log differentiation
Expand Down Expand Up @@ -167,6 +179,10 @@ export default class Datatable extends LightningElement {
get hideCheckboxColumn() {
return (this.cb_hideCheckboxColumn == CB_TRUE) ? true : false;
}
set hideCheckboxColumn(value) {
this._hideCheckboxColumn = value;
}
_hideCheckboxColumn;
@api cb_hideCheckboxColumn;
@api
Expand All @@ -185,6 +201,10 @@ export default class Datatable extends LightningElement {
get showRowNumbers() {
return (this.cb_showRowNumbers == CB_TRUE) ? true : false;
}
set showRowNumbers(value) {
this._showRowNumbers = value;
}
_showRowNumbers;
@api cb_showRowNumbers;
@api
Expand Down Expand Up @@ -219,10 +239,24 @@ export default class Datatable extends LightningElement {
_showRecordCount;
@api cb_showRecordCount;
@api
get showSelectedCount() {
return (this.cb_showSelectedCount == CB_TRUE) ? true : false;
}
set showSelectedCount(value) {
this._showSelectedCount = value;
}
_showSelectedCount;
@api cb_showSelectedCount;
@api
get singleRowSelection() {
return (this.cb_singleRowSelection == CB_TRUE) ? true : false;
}
set singleRowSelection(value) {
this._singleRowSelection = value;
}
_singleRowSelection;
@api cb_singleRowSelection;
@api
Expand Down Expand Up @@ -304,6 +338,10 @@ export default class Datatable extends LightningElement {
get isUserDefinedObject() {
return (this.cb_isUserDefinedObject == CB_TRUE) ? true : false;
}
set isUserDefinedObject(value) {
this._isUserDefinedObject = value;
}
_isUserDefinedObject;
@api cb_isUserDefinedObject;
@api get serializedRecordData() {
Expand Down Expand Up @@ -389,9 +427,27 @@ export default class Datatable extends LightningElement {
@api outputSelectedRowsString = '';
@api outputEditedRowsString = '';
@api outputEditedSerializedRows = '';
@api outputRemovedRowsString = '';
@api outputRemainingRowsString = '';
@api
get columnScales() {
return (this.isEmptyUserDefinedObject) ? [] : this._columnScales;
}
set columnScales(value) {
this._columnScales = value;
}
_columnScales = [];
@api
get columnTypes() {
return (this.isEmptyUserDefinedObject) ? [] : this._columnTypes;
}
set columnTypes(value) {
this._columnTypes = value;
}
_columnTypes = [];
@api columnScales = [];
@api columnTypes = [];
@api scaleAttrib = [];
@api typeAttrib = [];
Expand Down Expand Up @@ -441,9 +497,6 @@ export default class Datatable extends LightningElement {
@track showClearButton = false;
@track showClearFilterButton = false;
@track tableHeightAttribute = 'height:';
// @track tableBorderStyle = 'border-left: var(--lwc-borderWidthThin,1px) solid var(--lwc-colorBorder,rgb(229, 229, 229));'
// +' border-top: var(--lwc-borderWidthThin,1px) solid var(--lwc-colorBorder,rgb(229, 229, 229));'
// + ' border-right: var(--lwc-borderWidthThin,1px) solid var(--lwc-colorBorder,rgb(229, 229, 229)); margin: -1px;';

// Handle Selected Rows retention
@api allSelectedRows; // Obsolete - No longer used but can't be removed
Expand Down Expand Up @@ -549,6 +602,10 @@ export default class Datatable extends LightningElement {
@track columnEditParameter;
@track columnFilterParameter;

get isEmptyUserDefinedObject() {
return this.isUserDefinedObject && (!this._tableDataString || this._tableDataString?.length == 0);
}

get collectionSize() {
let max = Math.min(CONSTANTS.MAXROWCOUNT, this.maxNumberOfRows);
return Math.min(this._tableData.length, max);
Expand Down Expand Up @@ -654,7 +711,7 @@ export default class Datatable extends LightningElement {
}
_paginatedData;

@api paginatedSelectedRows = []; //TODO: Figure out how to retain selected rows when paginating, sorting, filtering, searching
@api paginatedSelectedRows = [];
// End pagination Attributes

// Pagination Methods
Expand Down Expand Up @@ -722,7 +779,8 @@ export default class Datatable extends LightningElement {

get formattedTableLabel() {
let filteredCount = (this.filteredRecordCount != this.tableRecordCount) ? `${this.filteredRecordCount} of ` : '';
return (this.showRecordCount) ? `${this._tableLabel} (${filteredCount}${this.tableRecordCount})` : this._tableLabel;
let selectedCount = (this.showSelectedCount) ? ` • ${this.numberOfRowsSelected} selected` : '';
return (this.showRecordCount) ? `${this._tableLabel} (${filteredCount}${this.tableRecordCount}${selectedCount})` : this._tableLabel;
}

get tableRecordCount() {
Expand All @@ -735,7 +793,6 @@ export default class Datatable extends LightningElement {

get isShowTable() {
return this._mydata.length > 0 || this.isFiltered;
// return this._tableData.length > 0;
}

get haveRecords() {
Expand Down Expand Up @@ -1086,9 +1143,6 @@ export default class Datatable extends LightningElement {
console.log(this.consoleLogPrefix+'tableDataString - ',(SHOW_DEBUG_INFO) ? this._tableDataString : '***');
if (!this._tableDataString || this._tableDataString?.length == 0) {
this._tableDataString = '[{"'+this.keyField+'":"(empty table)"}]';
this.columnFields = this.keyField;
this.columnTypes = [];
this.columnScales = [];
}
this._tableData = JSON.parse(this._tableDataString);
console.log(this.consoleLogPrefix+'tableData - ',(SHOW_DEBUG_INFO) ? this._tableData : '***');
Expand Down Expand Up @@ -1142,7 +1196,8 @@ export default class Datatable extends LightningElement {
// Custom column processing
this.updateColumns();

if(this.cols[0]?.fieldName.endsWith('_lookup')) {
const firstCol = (this.isRemoveRowAction && this.removeRowLeftOrRight == "Left") ? 1 : 0;
if(this.cols[firstCol]?.fieldName.endsWith('_lookup')) {
this.sortedBy = this.cols[0].fieldName;
this.doSort(this.sortedBy, 'asc');
}
Expand Down Expand Up @@ -1329,13 +1384,15 @@ export default class Datatable extends LightningElement {
});

// Handle Lookup for the SObject's "Name" Field
record[this.objectLinkField + '_name'] = record[this.objectLinkField];
if (ISCOMMUNITY) {
record[this.objectLinkField + '_lookup'] = MYDOMAIN + 'detail/' + record['Id'];
} else if (ISFLOWBUILDER) {
record[this.objectLinkField + '_lookup'] = MYDOMAIN + '/' + record['Id'];
} else {
record[this.objectLinkField + '_lookup'] = MYDOMAIN + '.lightning.force.com/lightning/r/' + this.objectNameLookup + '/' + record['Id'] + '/view';
if (!this.isUserDefinedObject || this.isConfigMode) {
record[this.objectLinkField + '_name'] = record[this.objectLinkField];
if (ISCOMMUNITY) {
record[this.objectLinkField + '_lookup'] = MYDOMAIN + 'detail/' + record['Id'];
} else if (ISFLOWBUILDER) {
record[this.objectLinkField + '_lookup'] = MYDOMAIN + '/' + record['Id'];
} else {
record[this.objectLinkField + '_lookup'] = MYDOMAIN + '.lightning.force.com/lightning/r/' + this.objectNameLookup + '/' + record['Id'] + '/view';
}
}

// Handle replacement of Picklist API Names with Labels
Expand Down Expand Up @@ -1815,6 +1872,8 @@ export default class Datatable extends LightningElement {
this.dispatchEvent(new FlowAttributeChangeEvent('outputRemovedRows', this.outputRemovedRows));
this.dispatchEvent(new FlowAttributeChangeEvent('numberOfRowsRemoved', this.numberOfRowsRemoved));
this.dispatchEvent(new FlowAttributeChangeEvent('outputRemainingRows', this.outputRemainingRows));

this.dispatchOutputs();

// remove record from collection
this.mydata = removeRowFromCollection(this, this._mydata, keyValue);
Expand Down Expand Up @@ -2796,6 +2855,26 @@ export default class Datatable extends LightningElement {
this.isAllFilter = allSelected;
}

dispatchOutputs() {
if (this.isUserDefinedObject) {
this.outputSelectedRowsString = JSON.stringify(this.outputSelectedRows); //JSON Version
this.outputEditedRowsString = JSON.stringify(this.outputEditedRows);
this.outputEditedSerializedRows = JSON.stringify(this.outputEditedRows); //JSON Version
this.outputRemovedRowsString = JSON.stringify(this.outputRemovedRows);
this.outputRemainingRowsString = JSON.stringify(this.outputRemainingRows);
this.dispatchEvent(new FlowAttributeChangeEvent('outputSelectedRowsString', this.outputSelectedRowsString));
this.dispatchEvent(new FlowAttributeChangeEvent('outputEditedRowsString', this.outputEditedRowsString));
this.dispatchEvent(new FlowAttributeChangeEvent('outputEditedSerializedRows', this.outputEditedSerializedRows));
this.dispatchEvent(new FlowAttributeChangeEvent('outputRemovedRowsString', this.outputRemovedRowsString));
this.dispatchEvent(new FlowAttributeChangeEvent('outputRemainingRowsString', this.outputRemainingRowsString));
}

if(this.isSerializedRecordData) {
this.outputEditedSerializedRows = JSON.stringify(this.outputEditedRows);
this.dispatchEvent(new FlowAttributeChangeEvent('outputEditedSerializedRows', this.outputEditedSerializedRows));
}
}

@api
validate() {
console.log(this.consoleLogPrefix+"validate and exit");
Expand Down Expand Up @@ -2833,19 +2912,7 @@ export default class Datatable extends LightningElement {
};
} */

if (this.isUserDefinedObject) {
this.outputSelectedRowsString = JSON.stringify(this.outputSelectedRows); //JSON Version
this.outputEditedRowsString = JSON.stringify(this.outputEditedRows);
this.outputEditedSerializedRows = JSON.stringify(this.outputEditedRows); //JSON Version
this.dispatchEvent(new FlowAttributeChangeEvent('outputSelectedRowsString', this.outputSelectedRowsString));
this.dispatchEvent(new FlowAttributeChangeEvent('outputEditedRowsString', this.outputEditedRowsString));
this.dispatchEvent(new FlowAttributeChangeEvent('outputEditedSerializedRows', this.outputEditedSerializedRows));
}

if(this.isSerializedRecordData) {
this.outputEditedSerializedRows = JSON.stringify(this.outputEditedRows);
this.dispatchEvent(new FlowAttributeChangeEvent('outputEditedSerializedRows', this.outputEditedSerializedRows));
}
this.dispatchOutputs();

console.log(this.consoleLogPrefix+'outputSelectedRows', this.outputSelectedRows.length, (SHOW_DEBUG_INFO) ? this.outputSelectedRows : '***');
console.log(this.consoleLogPrefix+'outputEditedRows', this.outputEditedRows.length, (SHOW_DEBUG_INFO) ? this.outputEditedRows : '***');
Expand Down
5 changes: 4 additions & 1 deletion flow_screen_components/datatable/force-app/main/default/lwc/datatable/datatable.js-meta.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,8 @@
<property name="outputSelectedRowsString" label="Output Selected Rows (User Defined)" type="String" role="outputOnly" description="Object Collection string variable to contain only the records that were selected in the datatable.
-- NOTE: These records may not contain all of the edited values."/>
<property name="outputEditedRowsString" label="Output Edited Rows (User Defined)" type="String" role="outputOnly" description="Object Collection string variable to contain only the records that were edited in the datatable."/>

<property name="outputRemovedRowsString" label="Output Removed Rows (User Defined)" type="String" role="outputOnly" description="Object Collection string variable to contain only the records that were removed from the datatable."/>
<property name="outputRemainingRowsString" label="Output Remaining Rows (User Defined)" type="String" role="outputOnly" description="Object Collection string variable to contain all the original records that were not removed from the datatable."/>
<!-- ============================================================================================================================- -->

<!-- Additional Output Parameters -->
Expand Down Expand Up @@ -108,6 +109,8 @@
<property name="cb_showRowNumbers" type="String" role="inputOnly"/>
<property name="showRecordCount" label="Show Record Count in Header" type="Boolean" default="false" role="inputOnly" description="Display the number of records in the table header. This will match what is shown in a List View header."/>
<property name="cb_showRecordCount" type="String" role="inputOnly"/>
<property name="showSelectedCount" label="Show Selected Record Count in Header" type="Boolean" default="false" role="inputOnly" description="Display the number of selected records in the table header."/>
<property name="cb_showSelectedCount" type="String" role="inputOnly"/>
<property name="keyField" label="Key Field" type="String" default="Id" role="inputOnly" description="This is normally the Id field, but you can specify a different field if all field values are unique."/>
<property name="matchCaseOnFilters" label="Match Case on Column Filters?" type="Boolean" default="false" role="inputOnly" description="Set to True is you want to force an exact match on case for column filter values."/>
<property name="cb_matchCaseOnFilters" type="String" role="inputOnly"/>
Expand Down
9 changes: 9 additions & 0 deletions ...en_components/datatable/force-app/main/default/lwc/ers_datatableCPE/ers_datatableCPE.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -224,6 +224,15 @@
oncheckboxchanged={handleCheckboxChange}
></c-fsc_flow-checkbox>

<c-fsc_flow-checkbox
disabled={disableSelectCountSelection}
name="select_showSelectedCount"
label={inputValues.showSelectedCount.label}
checked={inputValues.cb_showSelectedCount.value}
field-level-help={inputValues.showSelectedCount.helpText}
oncheckboxchanged={handleCheckboxChange}
></c-fsc_flow-checkbox>

<c-fsc_flow-checkbox
disabled={disableSearchBarSelection}
name="select_isShowSearchBar"
Expand Down
19 changes: 17 additions & 2 deletions ...reen_components/datatable/force-app/main/default/lwc/ers_datatableCPE/ers_datatableCPE.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -288,6 +288,10 @@ export default class ers_datatableCPE extends LightningElement {
return !this.inputValues.isDisplayHeader.value;
}

get disableSelectCountSelection() {
return this.inputValues.hideCheckboxColumn.value;
}

@api
get wiz_columnFields() {
return this._wiz_columnFields;
Expand Down Expand Up @@ -546,7 +550,10 @@ export default class ers_datatableCPE extends LightningElement {
cb_showRowNumbers: {value: null, valueDataType: null, isCollection: false, label: ''},
showRecordCount: {value: null, valueDataType: null, isCollection: false, label: 'Show Record Count in Header',
helpText: 'Display the number of records in the table header. This will match what is shown in a List View header.'},
cb_showRecordCount: {value: null, valueDataType: null, isCollection: false, label: ''},
cb_showRecordCount: {value: null, valueDataType: null, isCollection: false, label: ''},
showSelectedCount: {value: null, valueDataType: null, isCollection: false, label: 'Show Selected Count in Header',
helpText: 'Display the number of selected records in the table header.'},
cb_showSelectedCount: {value: null, valueDataType: null, isCollection: false, label: ''},
isRequired: {value: null, valueDataType: null, isCollection: false, label: 'Require',
helpText: 'When this option is selected, the user will not be able to advance to the next Flow screen unless at least one row is selected in the datatable.'},
cb_isRequired: {value: null, valueDataType: null, isCollection: false, label: ''},
Expand Down Expand Up @@ -657,6 +664,7 @@ export default class ers_datatableCPE extends LightningElement {
{name: 'showFirstLastButtons'},
{name: 'showRowNumbers'},
{name: 'showRecordCount'},
{name: 'showSelectedCount'},
{name: 'isShowSearchBar'},
{name: 'tableBorder'},
{name: defaults.customHelpDefinition,
Expand Down Expand Up @@ -1096,7 +1104,14 @@ export default class ers_datatableCPE extends LightningElement {
if (this.isDisableSuppressBottomBar) {
this.updateCheckboxValue('suppressBottomBar', false);
}
}
}

// Clear Show Selected Count if Disallow Row Relection is selected
if (changedAttribute == 'hideCheckboxColumn') {
if (event.detail.newValue) {
this.updateCheckboxValue('showSelectedCount', false);
}
}

}

Expand Down
Loading

0 comments on commit c2920ca

Please sign in to comment.