+ Start a Discussion
Raghavendra M 13Raghavendra M 13 

Opportunities totals by owner displaying owner records while click on owner name using lightning component?

Best Answer chosen by Raghavendra M 13
sfdcMonkey.comsfdcMonkey.com
HI Raghavendra, i have simmler sample for your requirement try this one :

apex class :
public class OpportunitybyOwnerbasedontotal{
    
    @AuraEnabled
    public static List<wrapper> getopps() {
        map<string,wrapper> mapOwnerWiseWrapper = new map<string,wrapper>();
        List<wrapper> lstWrapper = new List<wrapper>();
        List<opportunity> oppList = [select id,Name,Amount,owner.Id,owner.Name from opportunity LIMIT 100];
        
        
        for(opportunity opp : oppList){
             wrapper oWrap = new wrapper();
              if(mapOwnerWiseWrapper.containsKey(opp.owner.Id)){
                oWrap = mapOwnerWiseWrapper.get(opp.owner.Id);
              }
                       
              integer oppSize = 0;
               if(oWrap.oppTotal != null){
                 oppSize += oWrap.oppTotal;    
               }
            
              decimal oppAmountTotal = 0;
               if(oWrap.amountTotal != null){
                oppAmountTotal += oWrap.amountTotal;    
               }
            
              if(opp.Amount != null){
                oppAmountTotal += opp.Amount;  
              }   
           
              oppSize ++;
            
            List<opportunity> lstOppWithOwner = new List<opportunity>();
             if(oWrap.lstOpp != null){
                lstOppWithOwner = oWrap.lstOpp;
             }
              
             lstOppWithOwner.add(opp);
            
             oWrap.ownerName = opp.owner.Name;
             oWrap.oppTotal = oppSize;
             oWrap.amountTotal = oppAmountTotal;
             oWrap.lstOpp = lstOppWithOwner;
            
            //lstWrapper.add(oWrap);
            mapOwnerWiseWrapper.put(opp.owner.Id, oWrap);
        }
        
        return  mapOwnerWiseWrapper.values(); 
    }
    
    public class wrapper{
        @AuraEnabled public List<Opportunity> lstOpp{get;set;}
        @AuraEnabled public String ownerName{get;set;}
        @AuraEnabled public String ownerId{get;set;}
        @AuraEnabled public decimal amountTotal{get;set;}
        @AuraEnabled public Integer oppTotal{get;set;}
    }
    
}
LC :
<aura:component controller="OpportunitybyOwnerbasedontotal" implements="flexipage:availableForAllPageTypes,force:appHostable" access="global">
    <aura:handler name="init" value="{!this}" action="{!c.myAction}"/>
    <aura:attribute name="opportunities" type="Opportunity[]"/>
    <aura:attribute name="opportunitiesbByowner" type="Opportunity[]"/>
    
    <aura:attribute name="wraperOpportunitiesbByowner" type="List"/>
    
    <div class="slds-box" style="background:rgb(0, 161, 223);font-weight:bold;font-size:15pt;">
        <p>Opportunities Totals by Owner</p>
    </div><br/>
    
    
    <table class="slds-table slds-table--bordered slds-table--striped slds-table--cell-buffer slds-table--fixed-layout">
        <thead>
            <tr>
                <th scope="col">
                    <div class="slds-truncate" title="Owner" style="font-weight:bold;font-size:12pt;">
                        Owner
                    </div>
                </th>
                <th scope="col">
                    <div class="slds-truncate" title="Number of Opportunities" style="font-weight:bold;font-size:12pt;text-align:center;">
                        Number of Opportunities
                    </div>
                </th>
                <th scope="col">
                    <div class="slds-truncate" title="Opportunity Total by Owner" style="font-weight:bold;font-size:12pt;text-align:center;">
                        Opportunity Total by Owner
                    </div>
                </th>
            </tr>
        </thead>
        <tbody> 
            <aura:iteration items="{!v.wraperOpportunitiesbByowner}" var="oWrapper">
                <tr>
                    <td><div class="slds-truncate" title="{!oWrapper.ownerName}"><a><ui:outputText click="{!c.Clicked}" title="{!oWrapper.ownerName}" value="{!oWrapper.ownerName}" /></a></div></td>
                    <td style="text-align:center"><div class="slds-truncate" title="{!oWrapper.oppTotal}">{!oWrapper.oppTotal}</div></td>
                    <td style="text-align:center"><div class="slds-truncate" title="{!oWrapper.amountTotal}"><ui:outputNumber value="{!oWrapper.amountTotal}" format='$###,###,###.00'/></div></td>  
                </tr>
                <tr>      
                    <table style="width:300%" class="slds-table slds-table--bordered slds-table--striped slds-table--cell-buffer slds-table--fixed-layout">
                        <thead >  
                            <tr style="background-color:red">
                                <th scope="col" style="background-color: #E6E6FA">
                                    <div class="slds-truncate" title="Name" style="font-weight:bold;font-size:12pt;text-align:center;">
                                        Name
                                    </div>
                                </th>
                                <th scope="col" style="background-color: #E6E6FA">
                                    <div class="slds-truncate" title="Stage" style="font-weight:bold;font-size:12pt;text-align:center;">
                                        Stage
                                    </div>
                                </th>
                                <th scope="col" style="background-color: #E6E6FA">
                                    <div class="slds-truncate" title="Amount" style="font-weight:bold;font-size:12pt;text-align:center;">
                                        Amount
                                    </div>
                                </th>
                                <th scope="col" style="background-color: #E6E6FA">
                                    <div class="slds-truncate" title="Closed Date" style="font-weight:bold;font-size:12pt;text-align:center;">
                                        Closed Date
                                    </div>
                                </th>
                                
                            </tr>
                            
                        </thead>
                        <tbody>
                            <aura:iteration items="{!oWrapper.lstOpp}" var="opp">
                                <tr>
                                    <td><div class="slds-truncate">{!opp.Name}</div></td>
                                    <td style="text-align:center"><div class="slds-truncate" title="{!opp.StageName}">{!opp.StageName}</div></td>
                                    <td style="text-align:center"><div class="slds-truncate" title="{!opp.Amount}">{!opp.Amount}</div></td>
                                    <td style="text-align:center"><div class="slds-truncate" title="{!opp.CloseDate}">{!opp.CloseDate}</div></td>
                                </tr>
                            </aura:iteration>
                        </tbody>
                    </table>
                </tr>
            </aura:iteration>   
        </tbody>
    </table>
    
    <div>
        
    </div> 
</aura:component>
javaScript controller :
({
	myAction : function(component, event, helper) {
		var action = component.get("c.getopps");
        console.log('The action value is: '+action);
         action.setCallback(this, function(a){ 
             
            component.set("v.wraperOpportunitiesbByowner", a.getReturnValue());
            console.log('The opps are :'+JSON.stringify(a.getReturnValue()));
          
        });
        $A.enqueueAction(action);
	},
    Clicked : function(component, event, helper){
        var ctarget = event.getSource().get("v.title");
        console.log(ctarget);
        var action = component.get("c.getOpportunityRecords");
         action.setParams({ ownerId :  ctarget});
         action.setCallback(this, function(response) {
            var state = response.getState(); //Checking response status
            console.log("opportunities... "+JSON.stringify(response.getReturnValue()));
            if (component.isValid() && state === "SUCCESS")
                component.set("v.opportunitiesbByowner", response.getReturnValue());  // Adding values in Aura attribute variable.   
        });
        $A.enqueueAction(action);
    }
})
Hopes it will helps you, let us know if it helps you
Thanks
http://sfdcmonkey.com