I am trying to get a data table with Account hierarchy using the Lightning tree grid lwc. I have a community page and when I open an account record, there is a parent Id field on each account. I am trying to get a list of all the accounts that have same parent account as current record. I want to display the fields Name, branch location and Branch type.
currently No data is being displayed and the wire method call is returning error only. Data is coming as undefined and error as [object Object]
I am new to LWC, what am i doing wrong ?
Controller
public with sharing class AccountHeirarchySelector {
//Get all accounts that have the same parent Id as current record
@AuraEnabled(cacheable=true)
public static List<Account> findHierarchyData(String recordId){
String parentId= getParentId(recordId);
List<Account> accList = new List<Account>();
if (parentId!=null)
accList = [select id, name, ParentId,Branch_Type__c,ShippingAddress from Account where ParentId=:parentId];
System.debug('-------accList------------'+accList);
return accList;
}
//Get the Parent Id value for current Record
public static String getParentId(String recordId ){
List<Account> parentIdFromAcc= [select ParentId from Account where id=:recordId LIMIT 1];
System.debug('-------parentIdFromAcc------------'+parentIdFromAcc);
System.debug('-------parentIdFromAcc[0].ParentId------------'+parentIdFromAcc[0].ParentId);
return parentIdFromAcc[0].ParentId;
}
}
JS
import { LightningElement,wire,api,track } from 'lwc';
import findHierarchyData from '@salesforce/apex/AccountHeirarchySelector.findHierarchyData';
const COLS= [
{label : 'Account Name 1', fieldName : 'Name'},
{label : 'Branch Location 1', fieldName : 'ShippingAddress'},
{label : 'Branch Type 1', fieldName : 'Branch_Type__c'}
]
export default class branchAccountTreeGridView extends LightningElement {
@track accountsLoaded = false;
@api recordId;
@track gridData = [];
gridColumns = COLS;
@wire(findHierarchyData, { recordId: '$recordId'})
wiredAccounts({ data, error }) {
console.log('after method call')
console.log('----------fetched rec id ? -------:'+this.recordId);
console.log('----------data ? --------------------' + data);
console.log('----------error ? --------------------' + error);
if (data) {
this.accountsLoaded = true;
// Process record data
console.log('-------found data -------------'+this.recordId);
console.log('dataaaaaaaaaaaaa' + data);
var strData = JSON.parse( JSON.stringify( data ) );
strData.map((row, index) => {
if (row['Name']) {
row._children = row['Name']; //define rows with children
delete row.Cases;
}
});
this.myData = strData;
}
else if(error){
console.log('Stringified error ---- ' + JSON.parse(JSON.stringify(error)));
}
}
}
meta.xml
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="accountHeirarchy">
<apiVersion>55.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__RecordPage</target>
<target>lightning__AppPage</target>
<target>lightning__HomePage</target>
<target>lightningCommunity__Page</target>
<target>lightningCommunity__Default</target>
<target>lightning__RecordAction</target>
</targets>
<targetConfigs>
<targetConfig targets="lightning__RecordPage">
<objects>
<object>Account</object>
</objects>
</targetConfig>
<targetConfig targets="lightningCommunity__Default">
<property
name="recordId"
type="String"
label="Record Id"
description="Pass the page's record id to the component variable"
/>
</targetConfig>
</targetConfigs>
</LightningComponentBundle>`
HTML template
<template>
<template if:true={accountsLoaded}>
<lightning-tree-grid
columns={gridColumns}
data={gridData}
key-field="Id">
</lightning-tree-grid>
</template>
</template>
The result in console
branchAccountTreeGridView.js:1 ----------fetched rec id ? -------:0010w000010FnfWAAS
branchAccountTreeGridView.js:1 ----------data ? --------------------undefined
branchAccountTreeGridView.js:1 ----------error ? --------------------[object Object]
branchAccountTreeGridView.js:1 Stringified error ---- [object Object]