
<associate-container *ngIf="content">

<!-- Added by Sonam K on 30-JUL-19 [To add close button] START -->
	<closePanel-button >
		<div class="assc-closePanel-icon" (click)="close();">x</div>
	</closePanel-button>

	<back-button (click)="close();">
		<span class="vision-ui-arrow_left" style="color:#00caff; font-size: 20px;"></span>
		<span class="assc-close-title" style="color:#00caff;font-size: medium; line-height: 22px; " >Back</span>
	</back-button>
	<page-title>Associate Objects</page-title>
	<page-subtitle>{{content.shDescr}}</page-subtitle>

	<page-content>
		<div class="assc-loader-container" *ngIf="status == 'loading'">
<!-- 	 		<mat-spinner class="clm-loader"></mat-spinner> -->
	 		<img class="clm-loader" src="dashboard/assets/images/svg/loading.svg" /> 
		</div>

		<div *ngIf="status == 'loaded'">
			<div *ngFor="let object of objList" (click)="selectObject(object);">
				<associate-feed>
					<feed-icon>
						<img  [src]="hostUrl+objIconUrl+object.icon_path" class="assocobj-icon" (error)="onError($event, object.descr);" >
						<img [src]="filetype_icon_url" class="assocobj-filetype-icon">
					</feed-icon>
					<feed-title>{{object.descr}}</feed-title>
					<feed-subtitle>{{object.comments}}</feed-subtitle>
					<feed-info>
						<span class="assc-count-circle">{{object.ref_ser_count ? object.ref_ser_count : 0}}</span>
						<span class="assc-arrow-right-cont" >
							<span class="vision-ui-arrow_right" style=" font-size: 22px; color: black;  vertical-align: -6px;"> </span>
						</span>
					</feed-info>
				</associate-feed>
			</div>
		</div>

		<div class="detail-container" *ngIf="status == 'nodata'">
			<span class="no-data-msg">No data found</span>
		</div>

		<div class="detail-container" *ngIf="status == 'failed'">
			<span class="failed-msg">Failed to load</span>
		</div>
	</page-content>

</associate-container>
