function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Thiago Barbosa 1Thiago Barbosa 1 

How to migrate report in lightning component?

I want to transform the indexVar for to pass inside div. 

<apex:outputPanel id="reportResults" layout="block">
      <apex:outputText value=" Executando..." rendered="{!reportIsRunning}"/>
      <apex:outputPanel rendered="{!NOT(reportIsRunning)}">
		<div class="slds-scrollable--x">
          <table class="slds-table slds-table--bordered slds-table--cell-buffer">
           <thead>
               <tr class="slds-text-title--caps">
                   <apex:repeat value="{!reportResults.reportMetadata.detailColumns}" var="colName">
                        <th scope="col">
                            <div class="slds-truncate">{!UPPER(reportResults.reportExtendedMetadata.detailColumnInfo[colName].label)}</div>
                        </th>
                   </apex:repeat>
               </tr>
           </thead>

           <tbody>
               <apex:repeat value="{!reportResults.factMap['T!T'].rows}" var="row">
                   <tr>
                       <apex:repeat value="{!row.dataCells}" var="cell">
                           <td><div class="slds-truncate">{!cell.label}</div></td>
                       </apex:repeat>
                   </tr>
               </apex:repeat>
           </tbody>
         </table>
      	</div>
      </apex:outputPanel>
  </apex:outputPanel>

In lightning
 
<aura:component implements="force:appHostable,flexipage:availableForRecordHome,force:hasRecordId" controller="GeolocationActivityReportController" access="global" >
    
    <aura:handler event="aura:waiting" action="{!c.showSpinner}"/>
    <aura:handler event="aura:doneWaiting" action="{!c.hideSpinner}"/>
    
    <aura:attribute name="report" type="Boolean" />
    
    <aura:attribute name="reportMetadata" type="List" />
        
    <aura:attribute name="dataCells" type="List"/>
    
    <aura:attribute name="spinner" type="Boolean" />
    
    <aura:attribute name="lgtWrapper" type="GeolocationLgtWrapper"/>
    <aura:attribute name="cliente" type="String"/>
    
    <aura:if isTrue="{!v.spinner}">
        <div aura:id="spinnerId" class="slds-spinner_container">
            <div class="slds-spinner--brand  slds-spinner slds-spinner--large slds-is-relative" role="alert">
                <span class="slds-assistive-text">Executando...</span>
                <div class="slds-spinner__dot-a"></div>
                <div class="slds-spinner__dot-b"></div>
            </div>
        </div>
    </aura:if>
    
    <div class="slds-grid slds-gutters">
        
        <div class="slds-col slds-size_1-of-3" style="z-index:90">
            
            <div class="slds-box slds-box_small">
                <lightning:formattedText linkify="true" value="{!v.cliente}" />
                
                <lightning:button aura:id="btnRelatorio"
                                  title="Ver relatorio"
                                  label="Ver relatorio"
                                  variant="neutral"
                                  onclick="{!c.openReport}"/>
                <lightning:button aura:id="fecharModal"
                                  title="Voltar"
                                  label="Voltar"
                                  variant="neutral"
                                  onclick="{!c.onExit}"/>
                
            </div>
        </div>
        
        <div class="slds-col slds-size_2-of-3" style="z-index:90">
            <aura:if isTrue="{!v.report}">
                <div class="slds-scrollable_x">
                    <table class="slds-table slds-table_bordered slds-table_cell-buffer">
                        <thead>
                            
                            <tr class="slds-text-title_caps">
                                <aura:iteration items="{!v.lgtWrapper.reportResults.reportMetadata.detailColumns}" var="colName" indexVar="colName">
                                    	<th scope="col">
                            			<div class="slds-truncate">{!v.lgtWrapper.reportResults.reportExtendedMetadata.detailColumnInfo[colName].label}</div>
                     
                                    </th>
                                </aura:iteration>
                            </tr>
                        </thead>
                        <tbody>
                            <aura:iteration items="{!v.reportResult}" var="row" >
                                <tr>
                                    <aura:iteration items="{!v.row.dataCells}" var="cell">
                                        <td data-label="Account Name">
                                            <div class="slds-truncate">{!cell.label}</div>
                                        </td>
                                    </aura:iteration>
                                </tr>
                            </aura:iteration>
                        </tbody>
                    </table>
                </div>
            </aura:if>
            
        </div>
        
    </div>
    
</aura:component>