<!--
<div class="app-container">
	<bb-custom-card-panel *ngFor="let compObj of compObjects" [title]="compObj.title" [cards]="compObj.cards" [component]="component_config" [isSelection]="isSelection" (onDrillDown)="_onDrillDown($event)" ></bb-custom-card-panel>
</div>
-->

<div class="app-container" *ngIf='isDataAvailable' >
	<ng-container [ngSwitch]="compositeType">          
		<ng-container *ngSwitchCase="'CARD_PANEL'">      
			<!-- Changed by Pravin K on 18-MAR-20  START -->
			 <div class="Base_1">{{component_config.comp_title}}</div>
			<bb-custom-card-panel *ngFor="let compObj of compObjects" [parentData]="parentData" [title]="compObj.title" [cards]="compObj.cards" [component]="component_config" [isSelection]="isSelection" (onDrillDown)="_onDrillDown($event)" (onPerformAction)="performAction($event)" ></bb-custom-card-panel>
			<!-- Changed by Pravin K on 18-MAR-20  END-->
		</ng-container>
		<ng-container *ngSwitchCase="'TABLE_PANEL'">
			<bb-custom-table-panel [ELEMENT_DATA]="tableObjects" [parentData]="parentData" [tableConfig]="component_config" (onCustomCellAction)="performCustomCellAction($event)"></bb-custom-table-panel>
		</ng-container>
		<ng-container *ngSwitchCase="'TAB_PANEL'">
			<bb-custom-tab-panel [tabConfig]="tabConfig" [tabDataSource]="tabData" (onDrillDownClose)="closeDrillDown();" ></bb-custom-tab-panel>
		</ng-container>
		<ng-container *ngSwitchCase="'CHART_PANEL'">
			<bb-custom-chart-panel [chartConfig] ="chartConfig" [chartDetailModel] ="chartDetailModel" [chartDataSource]="chartData" [parentData]="parentData" (onDrillDown)="_onDrillDown($event)" ></bb-custom-chart-panel>
		</ng-container>
		<ng-container *ngSwitchCase="'CUSTOM_PIE_CHART'">
			<div class="custom-pie-chart">
				<div class="pie-chart-header">
					<span *ngIf="heading" class="headerDescr"> {{ heading }} </span>
					<span *ngIf="monthDescr" class="monthDescr" > {{ monthDescr }} </span>
				</div>
				<div class="pie-chart-content">
					<bb-custom-chart [chartType]= "'pie'"
						[data]= "dataArr"
						[labels]="labelsArr"
						[options]="options"
						[colors] = "chartColors"
						[parentData]="parentData"
                        (onDrillDown)="_onDrillDown($event)">
					</bb-custom-chart>
				</div>
				<div class="pie-chart-footer"> 
						<span class="totalCnt">
								<span>&#8377;</span>
								{{ totalCnt }}
						</span>
				</div>
			</div>
		</ng-container>
        <ng-container *ngSwitchCase="'SERIES_CHART_PANEL'">
            <div class = "seriesChart_">            
			    <bb-custom-series-chart-panel class="db-col-2" *ngFor="let compObj of chart_component_data" [bgColorArr]= "bgColorArr" [chartDetailModel] = "component_config" [chartDataSource]="compObj" (onDrillDown)="_onDrillDown($event)"></bb-custom-series-chart-panel>
            </div>
		</ng-container>
	</ng-container>
</div>
<div *ngIf="!isDataAvailable && compositeNoDataMessage" class= "composite-nodata" > {{compositeNoDataMessage}} </div>