src/app/modules/content-search/components/no-result/no-result.component.ts
OnInit
| selector | app-no-result-found |
| styleUrls | ./no-result.component.scss |
| templateUrl | ./no-result.component.html |
Properties |
|
Methods |
Inputs |
Outputs |
constructor(router: Router, resourceService: ResourceService, UtilService: UtilService, ConnectionService: ConnectionService, activatedRoute: ActivatedRoute, formService: FormService, userService: UserService, ToasterService: ToasterService)
|
|||||||||||||||||||||||||||
|
Parameters :
|
| buttonText | |
Type : string
|
|
| filters | |
Type : any
|
|
| showExploreContentButton | |
Type : boolean
|
|
| subTitle | |
Type : string
|
|
| telemetryInteractEdataObject | |
Type : any
|
|
| title | |
Type : string
|
|
| exploreMoreContent | |
Type : EventEmitter
|
|
| formData |
formData()
|
|
Returns :
void
|
| handleEvent |
handleEvent()
|
|
Returns :
void
|
| ngOnInit |
ngOnInit()
|
|
Returns :
void
|
| Public activatedRoute |
Type : ActivatedRoute
|
| Public ConnectionService |
Type : ConnectionService
|
| currentPage |
| exploreMoreContentEdata |
Type : IInteractEventEdata
|
| Public formService |
Type : FormService
|
| instance |
Type : string
|
| isConnected |
Default value : true
|
| isDesktopApp |
Default value : false
|
| Public resourceService |
Type : ResourceService
|
| Public router |
Type : Router
|
| Public ToasterService |
Type : ToasterService
|
| Public unsubscribe$ |
Default value : new Subject<void>()
|
| url |
| Public userService |
Type : UserService
|
| Public UtilService |
Type : UtilService
|
import { FormService, UserService } from '@sunbird/core';
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { ResourceService, UtilService, ConnectionService, ToasterService } from '@sunbird/shared';
import * as _ from 'lodash-es';
import { IInteractEventEdata } from '@sunbird/telemetry';
import { takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs';
@Component({
selector: 'app-no-result-found',
templateUrl: './no-result.component.html',
styleUrls: ['./no-result.component.scss']
})
export class NoResultComponent implements OnInit {
@Input() title: string;
@Input() subTitle: string;
@Input() buttonText: string;
@Input() showExploreContentButton: boolean;
@Input() filters;
@Input() telemetryInteractEdataObject;
@Output() exploreMoreContent = new EventEmitter();
instance: string;
exploreMoreContentEdata: IInteractEventEdata;
currentPage;
url;
isConnected = true;
public unsubscribe$ = new Subject<void>();
isDesktopApp = false;
constructor( public router: Router, public resourceService: ResourceService, public UtilService: UtilService,
public ConnectionService: ConnectionService, public activatedRoute: ActivatedRoute,
public formService: FormService, public userService: UserService, public ToasterService: ToasterService) { }
ngOnInit() {
this.instance = _.upperCase(this.resourceService.instance);
this.exploreMoreContentEdata = {
...this.telemetryInteractEdataObject,
extra : {
...this.filters
}
};
this.ConnectionService.monitor().pipe(takeUntil(this.unsubscribe$)).subscribe(isConnected => {
this.isConnected = isConnected;
});
this.isDesktopApp = this.UtilService.isDesktopApp;
this.formData();
if (this.isDesktopApp && !this.isConnected) {
this.ToasterService.info(_.get(this.resourceService, 'messages.stmsg.desktop.offlineNoMatch'));
}
}
formData() {
const formServiceInputParams = {
formType: 'contentcategory',
formAction: 'menubar',
contentType: 'global'
};
this.formService.getFormConfig(formServiceInputParams).subscribe((data: any) => {
_.forEach(data, (value, key) => {
if ('all' === value.contentType) {
this.currentPage = value;
}
});
});
}
handleEvent() {
// this.exploreMoreContent.emit();
this.url = '/explore';
if (this.userService.loggedIn) {
this.url = _.get(this.currentPage, 'loggedInUserRoute.route');
} else {
this.url = _.get(this.currentPage, 'anonumousUserRoute.route');
}
this.router.navigate([this.url], { queryParams: { selectedTab: 'all' } });
}
}
<div class="no-content-container d-flex flex-jc-center relative9">
<div class="my-48 p-16 w-100">
<div class="d-flex flex-dc flex-jc-center flex-ai-center text-center">
<div>
<img alt="{{title}}" src="./assets/images/group.svg" width="90px" height="90px">
</div>
<div tabindex="0" class="fmedium board-title pt-24 font-weight-bold">{{title}}</div>
<!-- <p class="fs-0-92 mt-8 text-center board-text"></p> -->
<div tabindex="0" *ngIf="showExploreContentButton && subTitle" class="fs-0-785 sub-title py-24">{{subTitle | interpolate:'{instance}': instance}}</div>
<button tabindex="0" appTelemetryInteract [telemetryInteractEdata]="exploreMoreContentEdata" *ngIf="showExploreContentButton" type="button" id="browse" class="sb-btn sb-btn-primary sb-btn-normal mb-8" (click)="handleEvent()">
{{buttonText}}
</button>
</div>
</div>
</div>
./no-result.component.scss
.no-content-container{
width: 100%;
height: 100%;
.board-title{
color: var(--gray-400);
}
.board-text{
color: var(--gray-300);
}
.sub-title{
color: var(--gray-400);
}
}