
<div *ngIf="userDetails" class="feeds-container">
	<ng-container *ngTemplateOutlet="custProfile"></ng-container>
</div>


<ng-template #custProfile>

	<div *ngFor="let feed of feedDetails" [ngClass]="(feed.type == 'user-image' ? 'cust-profile-cont' : 'cust-det-cont')" [ngSwitch]="feed.type">
		<span *ngSwitchCase="'user-image'">
			<ng-container *ngTemplateOutlet="userInfo"></ng-container>
		</span>
		<span *ngSwitchCase="'dropdown'">
			<ng-container *ngTemplateOutlet="dropDown"></ng-container>
		</span>
		<span *ngSwitchCase="'button'">
				<ng-container *ngTemplateOutlet="button"></ng-container>
		</span>
		<span *ngSwitchDefault>
			<ng-container *ngTemplateOutlet="defDetail"></ng-container>
		</span>
		
		<ng-template #userInfo>
			    <img [src]="getUserImage()" (error)="brokenImage($event)" class="cust-profile-image" />
				<div class="customer-info" *ngFor="let detail of feed.detail" [style.position]="detail.type == 'icon' ? 'initial' : 'relative'">
				  <span class="customer-name" *ngIf="detail.type == 'text'" [style.font-size]="detail.fontSize" [style.color]="detail.color">{{detail.displayVal}}</span>
				  
				  <div class="customer-class-code" *ngIf="detail.type == 'icon' && detail.displayVal">{{detail.displayVal}}</div>
				</div>
		</ng-template>
		
		<ng-template #defDetail>
				<span class="cust-det-icon"><img [src]="ASSET_IMG_URL+'/svg/'+feed.icon+'.svg'" class="feed-det-icon"></span>
		  		<span *ngFor="let detail of feed.detail" class="cust-det-info" [style.font-size]="detail.fontSize" [style.color]="detail.color">{{detail.displayVal || 'NA'}}</span>
		</ng-template>
		
		<ng-template #dropDown>	   			
	   			<mat-form-field>
		   			<mat-select [placeholder]="feed.placeholder" [ngModelOptions]="{standalone: true}" [(value)]="selReason">
		     				<mat-option *ngFor="let opt of feed.detail" [value]="opt.id">
		     					{{opt.value}}
		   					</mat-option>
		   			</mat-select>
	   			</mat-form-field>
		</ng-template>

		<ng-template #button>
				<div *ngIf="userRights.indexOf('R') > -1" class="deactive-opt-cont" (click)="deactivate();">
					<span class="deactivate-icon visionicon"></span>
					<span class="deactivate-title">{{feed.detail[0].value}}</span>
				</div>
		</ng-template>
	</div>
			 
</ng-template>




