src/app/modules/workspace/components/collaborating-on/collaborating-on.component.ts
OnInit
AfterViewInit
selector | app-collaborating-on |
templateUrl | ./collaborating-on.component.html |
Properties |
|
Methods |
constructor(searchService: SearchService, workSpaceService: WorkSpaceService, frameworkService: FrameworkService, paginationService: PaginationService, activatedRoute: ActivatedRoute, route: Router, userService: UserService, toasterService: ToasterService, resourceService: ResourceService, config: ConfigService, modalService: SuiModalService, navigationhelperService: NavigationHelperService)
|
||||||||||||||||||||||||||||||||||||||||||||||||||||
Constructor to create injected service(s) object Default method of Draft Component class
Parameters :
|
contentClick | ||||
contentClick(content)
|
||||
Parameters :
Returns :
void
|
fecthAllContent |
fecthAllContent(limit: number, pageNumber: number, bothParams)
|
This method sets the make an api call to get all collaborating with page No and offset
Returns :
void
|
inview | ||||
inview(event)
|
||||
Parameters :
Returns :
void
|
navigateToPage | ||||||||
navigateToPage(page: number)
|
||||||||
This method helps to navigate to different pages. If page number is less than 1 or page number is greater than total number of pages is less which is not possible, then it returns.
Parameters :
Example :
Returns :
undefined | void
|
ngAfterViewInit |
ngAfterViewInit()
|
Returns :
void
|
ngOnInit |
ngOnInit()
|
Returns :
void
|
Public onCloseLockInfoPopup |
onCloseLockInfoPopup()
|
Returns :
void
|
sortColumns | ||||
sortColumns(column)
|
||||
Parameters :
Returns :
void
|
trackByFn | |||||||||
trackByFn(index, item)
|
|||||||||
Used to dispaly content
Parameters :
Returns :
any
|
delete | ||||
delete(contentIds)
|
||||
Inherited from
WorkSpace
|
||||
Defined in
WorkSpace:111
|
||||
Delete Api call .
Parameters :
Returns :
any
|
getBatches | ||||
getBatches(searchParams)
|
||||
Inherited from
WorkSpace
|
||||
Defined in
WorkSpace:128
|
||||
Batchlist Api call
Parameters :
Returns :
any
|
getChannelDetails | ||||
getChannelDetails(channelId)
|
||||
Inherited from
WorkSpace
|
||||
Defined in
WorkSpace:164
|
||||
get channel Api call
Parameters :
Returns :
any
|
getLinkedCollections | ||||||
getLinkedCollections(contentId: ContentIDParam)
|
||||||
Inherited from
WorkSpace
|
||||||
Defined in
WorkSpace:157
|
||||||
search collection Api call
Parameters :
Returns :
any
|
handleContentLockError | ||||
handleContentLockError(errObj)
|
||||
Inherited from
WorkSpace
|
||||
Defined in
WorkSpace:142
|
||||
handle content lock api error
Parameters :
Returns :
string
|
lockContent | ||||
lockContent(content)
|
||||
Inherited from
WorkSpace
|
||||
Defined in
WorkSpace:97
|
||||
this call will prepare reuest object and call lock api
Parameters :
Returns :
any
|
removeContent | ||||||
removeContent(contentList, requestData)
|
||||||
Inherited from
WorkSpace
|
||||||
Defined in
WorkSpace:120
|
||||||
Method to remove content localcaly
Parameters :
Returns :
any
|
search | ||||
search(searchParams)
|
||||
Inherited from
WorkSpace
|
||||
Defined in
WorkSpace:33
|
||||
Search Api call
Parameters :
Returns :
any
|
searchContentWithLockStatus | ||||
searchContentWithLockStatus(searchParams)
|
||||
Inherited from
WorkSpace
|
||||
Defined in
WorkSpace:40
|
||||
Search Api call and returns contents with lock status of each one
Parameters :
Returns :
any
|
UserList | ||||
UserList(searchParams)
|
||||
Inherited from
WorkSpace
|
||||
Defined in
WorkSpace:135
|
||||
userList Api call
Parameters :
Returns :
any
|
Private activatedRoute |
Type : ActivatedRoute
|
To send activatedRoute.snapshot to router navigation service for redirection to draft component |
collaboratingContent |
Type : Array<IContents>
|
Default value : []
|
Contains list of published course(s) of logged-in user |
column |
Type : string
|
Default value : ''
|
column name which we want to sort |
Public config |
Type : ConfigService
|
To get url, app configs |
Public frameworkService |
Type : FrameworkService
|
inviewLogs |
Type : []
|
Default value : []
|
inviewLogs |
loaderMessage |
Type : ILoaderMessage
|
loader message |
lockPopupData |
Type : object
|
lock popup data for locked contents |
Public modalService |
Type : SuiModalService
|
Public navigationhelperService |
Type : NavigationHelperService
|
noResult |
Default value : false
|
To show / hide no result message when no result found |
noResultMessage |
Type : INoResultMessage
|
no result message |
pageLimit |
Type : number
|
Contains page limit of inbox list |
pageNumber |
Type : number
|
Default value : 1
|
Current page number of inbox list |
pager |
Type : IPagination
|
Contains returned object of the pagination service which is needed to show the pagination on all content view |
Private paginationService |
Type : PaginationService
|
For showing pagination on draft list |
query |
Type : string
|
value typed |
queryParams |
Type : any
|
route query param; |
Public resourceService |
Type : ResourceService
|
To call resource service which helps to use language constant |
reverse |
Default value : false
|
reverse |
route |
Type : Router
|
To navigate to other pages |
Public searchService |
Type : SearchService
|
Inherited from
WorkSpace
|
Defined in
WorkSpace:152
|
showError |
Default value : false
|
To show / hide error |
showLoader |
Default value : true
|
To show / hide loader |
showLockedContentModal |
Default value : false
|
To show content locked modal |
sort |
Type : object
|
sort for filter; |
sortByOption |
Type : string
|
sortingOptions ; |
sortDirection |
Type : string
|
Default value : ''
|
sortDirection |
Public sortingOptions |
Type : Array<ISort>
|
sortingOptions ; |
state |
Type : string
|
state for content editor |
status |
Type : string
|
status for content; |
telemetryImpression |
Type : IImpressionEventInput
|
telemetryImpression |
Private toasterService |
Type : ToasterService
|
To show toaster(error, success etc) after any API calls |
totalCount |
Type : Number
|
totalCount of the list |
Public workSpaceService |
Type : WorkSpaceService
|
Inherited from
WorkSpace
|
Defined in
WorkSpace:153
|
Public userService |
Type : UserService
|
Inherited from
WorkSpace
|
Defined in
WorkSpace:26
|
import {combineLatest as observableCombineLatest } from 'rxjs';
import { Component, OnInit, AfterViewInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { WorkSpace } from '../../classes/workspace';
import { SearchService, UserService, ISort, FrameworkService } from '@sunbird/core';
import {
ServerResponse, PaginationService, ConfigService, ToasterService, IPagination,
ResourceService, ILoaderMessage, INoResultMessage, IContents, NavigationHelperService
} from '@sunbird/shared';
import { WorkSpaceService } from '../../services';
import * as _ from 'lodash-es';
import { IImpressionEventInput } from '@sunbird/telemetry';
import { SuiModalService } from 'ng2-semantic-ui-v9';
@Component({
selector: 'app-collaborating-on',
templateUrl: './collaborating-on.component.html'
})
export class CollaboratingOnComponent extends WorkSpace implements OnInit, AfterViewInit {
/**
* state for content editor
*/
state: string;
/**
* To navigate to other pages
*/
route: Router;
/**
* To send activatedRoute.snapshot to router navigation
* service for redirection to draft component
*/
private activatedRoute: ActivatedRoute;
/**
* Contains list of published course(s) of logged-in user
*/
collaboratingContent: Array<IContents> = [];
/**
* To show / hide loader
*/
showLoader = true;
/**
* loader message
*/
loaderMessage: ILoaderMessage;
/**
* To show / hide no result message when no result found
*/
noResult = false;
/**
* To show content locked modal
*/
showLockedContentModal = false;
/**
* lock popup data for locked contents
*/
lockPopupData: object;
/**
* To show / hide error
*/
showError = false;
/**
* no result message
*/
noResultMessage: INoResultMessage;
/**
* For showing pagination on draft list
*/
private paginationService: PaginationService;
/**
* To get url, app configs
*/
public config: ConfigService;
/**
* Contains page limit of inbox list
*/
pageLimit: number;
/**
* Current page number of inbox list
*/
pageNumber = 1;
/**
* totalCount of the list
*/
totalCount: Number;
/**
status for content;
*/
status: string;
/**
route query param;
*/
queryParams: any;
/**
sortingOptions ;
*/
public sortingOptions: Array<ISort>;
/**
sortingOptions ;
*/
sortByOption: string;
/**
sort for filter;
*/
sort: object;
/**
* inviewLogs
*/
inviewLogs = [];
/**
* value typed
*/
query: string;
/**
* Contains returned object of the pagination service
* which is needed to show the pagination on all content view
*/
pager: IPagination;
/**
* To show toaster(error, success etc) after any API calls
*/
private toasterService: ToasterService;
/**
* telemetryImpression
*/
telemetryImpression: IImpressionEventInput;
/**
* To call resource service which helps to use language constant
*/
public resourceService: ResourceService;
/**
* column name which we want to sort
*/
column = '' ;
/**
* sortDirection
*/
sortDirection = '';
/**
*reverse
*/
reverse = false;
/**
* Constructor to create injected service(s) object
Default method of Draft Component class
* @param {SearchService} SearchService Reference of SearchService
* @param {UserService} UserService Reference of UserService
* @param {Router} route Reference of Router
* @param {PaginationService} paginationService Reference of PaginationService
* @param {ActivatedRoute} activatedRoute Reference of ActivatedRoute
* @param {ConfigService} config Reference of ConfigService
*/
constructor(public searchService: SearchService,
public workSpaceService: WorkSpaceService,
public frameworkService: FrameworkService,
paginationService: PaginationService,
activatedRoute: ActivatedRoute,
route: Router, userService: UserService,
toasterService: ToasterService, resourceService: ResourceService,
config: ConfigService, public modalService: SuiModalService,
public navigationhelperService: NavigationHelperService) {
super(searchService, workSpaceService, userService);
this.paginationService = paginationService;
this.route = route;
this.activatedRoute = activatedRoute;
this.toasterService = toasterService;
this.resourceService = resourceService;
this.config = config;
this.state = 'collaborating-on';
this.loaderMessage = {
'loaderMessage': this.resourceService.messages.stmsg.m0124,
};
this.noResultMessage = {
'messageText': 'messages.stmsg.m0123'
};
this.sortingOptions = this.config.dropDownConfig.FILTER.RESOURCES.collaboratingOnSortingOptions;
}
ngOnInit() {
observableCombineLatest(
this.activatedRoute.params,
this.activatedRoute.queryParams,
(params: any, queryParams: any) => {
return {
params: params,
queryParams: queryParams
};
})
.subscribe(bothParams => {
if (bothParams.params.pageNumber) {
this.pageNumber = Number(bothParams.params.pageNumber);
}
this.queryParams = bothParams.queryParams;
this.query = this.queryParams['query'];
this.fecthAllContent(this.config.appConfig.WORKSPACE.PAGE_LIMIT, this.pageNumber, bothParams);
});
}
/**
* This method sets the make an api call to get all collaborating with page No and offset
*/
fecthAllContent(limit: number, pageNumber: number, bothParams) {
this.showLoader = true;
if (bothParams.queryParams.sort_by) {
const sort_by = bothParams.queryParams.sort_by;
const sortType = bothParams.queryParams.sortType;
this.sort = {
[sort_by]: _.toString(sortType)
};
} else {
this.sort = { lastUpdatedOn: this.config.appConfig.WORKSPACE.lastUpdatedOn };
}
const preStatus = ['Draft', 'FlagDraft', 'Review', 'Processing', 'Live', 'Unlisted', 'FlagReview'];
const primaryCategories = _.compact(_.concat(this.frameworkService['_channelData'].contentPrimaryCategories,
this.frameworkService['_channelData'].collectionPrimaryCategories));
const searchParams = {
filters: {
status: bothParams.queryParams.status ? bothParams.queryParams.status : preStatus,
collaborators: [this.userService.userid],
primaryCategory: _.get(bothParams, 'queryParams.primaryCategory') || (!_.isEmpty(primaryCategories) ? primaryCategories :
this.config.appConfig.WORKSPACE.primaryCategory),
objectType: this.config.appConfig.WORKSPACE.objectType,
board: bothParams.queryParams.board,
subject: bothParams.queryParams.subject,
medium: bothParams.queryParams.medium,
gradeLevel: bothParams.queryParams.gradeLevel
},
limit: limit,
offset: (pageNumber - 1) * (limit),
query: _.toString(bothParams.queryParams.query),
sort_by: this.sort
};
this.searchContentWithLockStatus(searchParams).subscribe(
(data: ServerResponse) => {
if (data.result.count && !_.isEmpty(data.result.content)) {
this.collaboratingContent = data.result.content;
this.totalCount = data.result.count;
this.pager = this.paginationService.getPager(data.result.count, pageNumber, limit);
this.showLoader = false;
this.noResult = false;
} else {
this.showError = false;
this.noResult = true;
this.showLoader = false;
}
},
(err: ServerResponse) => {
this.showLoader = false;
this.noResult = false;
this.showError = true;
this.toasterService.error(this.resourceService.messages.fmsg.m0084);
}
);
}
/**
* This method helps to navigate to different pages.
* If page number is less than 1 or page number is greater than total number
* of pages is less which is not possible, then it returns.
*
* @param {number} page Variable to know which page has been clicked
*
* @example navigateToPage(1)
*/
navigateToPage(page: number): undefined | void {
if (page < 1 || page > this.pager.totalPages) {
return;
}
this.pageNumber = page;
this.route.navigate(['workspace/content/collaborating-on', this.pageNumber], { queryParams: this.queryParams });
}
contentClick(content) {
if (_.size(content.lockInfo) && this.userService.userid !== content.lockInfo.createdBy) {
this.lockPopupData = content;
this.showLockedContentModal = true;
} else {
if (content.status.toLowerCase() === 'draft') { // only draft state contents need to be locked
this.workSpaceService.navigateToContent(content, this.state);
}
}
}
public onCloseLockInfoPopup () {
this.showLockedContentModal = false;
}
inview(event) {
_.forEach(event.inview, (inview, key) => {
const obj = _.find(this.inviewLogs, (o) => {
return o.objid === inview.data.identifier;
});
if (obj === undefined) {
this.inviewLogs.push({
objid: inview.data.identifier,
objtype: inview.data.contentType,
index: inview.id
});
}
});
this.telemetryImpression.edata.visits = this.inviewLogs;
this.telemetryImpression.edata.subtype = 'pageexit';
this.telemetryImpression = Object.assign({}, this.telemetryImpression);
}
sortColumns(column) {
this.column = column;
this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';
this.reverse = !this.reverse;
}
ngAfterViewInit () {
setTimeout(() => {
this.telemetryImpression = {
context: {
env: this.activatedRoute.snapshot.data.telemetry.env
},
edata: {
type: this.activatedRoute.snapshot.data.telemetry.type,
pageid: this.activatedRoute.snapshot.data.telemetry.pageid,
subtype: this.activatedRoute.snapshot.data.telemetry.subtype,
uri: this.activatedRoute.snapshot.data.telemetry.uri + '/' + this.activatedRoute.snapshot.params.pageNumber,
visits: this.inviewLogs,
duration: this.navigationhelperService.getPageLoadTime()
}
};
this.inview({ inview: [] });
});
}
/**
* Used to dispaly content
*@param {number} index Give position for current entry
*@param {number} item Give postion
*/
trackByFn(index, item) {
return item.identifier;
}
}
<app-collaboration-content-filter></app-collaboration-content-filter>
<div class="twelve wide column mt-20" *ngIf="showLoader ">
<app-loader [data]="loaderMessage"></app-loader>
</div>
<div *ngIf="noResult && !showLoader">
<app-no-result [data]="noResultMessage"></app-no-result>
</div>
<table class="ui single line sortable upForReviewTable table" *ngIf="collaboratingContent.length > 0 && !showLoader && !noResult ">
<thead>
<tr>
<th (click)="sortColumns('name')" class="five wide UpReviewTableHeader sorted bl-0" [ngClass]="{'ascending':sortDirection === 'asc' &&
column === 'name','descending':sortDirection === 'desc' && column === 'name'}">
{{ resourceService?.frmelmnts?.lbl?.contentLabel}}
</th>
<th (click)="sortColumns('creator')" class="four wide UpReviewTableHeader sorted bl-0" [ngClass]="{'ascending':sortDirection === 'asc' &&
column === 'creator','descending':sortDirection === 'desc' && column === 'creator'}">{{ resourceService?.frmelmnts?.lbl?.creator}}
</th>
<th (click)="sortColumns('lastUpdatedOn')" class="four wide UpReviewTableHeader sorted bl-0" [ngClass]="{'ascending':sortDirection === 'asc' &&
column === 'lastUpdatedOn','descending':sortDirection === 'desc' && column === 'lastUpdatedOn'}">
{{ resourceService?.frmelmnts?.lbl?.lastupdatedCaps}}
</th>
<th (click)="sortColumns('status')" class="two wide UpReviewTableHeader sorted bl-0" [ngClass]="{'ascending':sortDirection === 'asc' &&
column === 'status','descending':sortDirection === 'desc' && column === 'status'}">
{{ resourceService?.frmelmnts?.lbl?.status}}
</th>
<th class="two wide UpReviewTableHeader sorted bl-0">{{ resourceService?.frmelmnts?.lbl?.edit}}
</th>
</tr>
</thead>
<tbody [appTelemetryImpression]="telemetryImpression" [throttle]="1000" [trigger]="collaboratingContent">
<tr class="UpForReviewListHover" *ngFor="let content of collaboratingContent; trackBy: trackByFn let i = index;"
[id]="i" [data]="content" appTelemetryInteract [telemetryInteractObject]="{id:content.identifier,type:content.contentType,ver:content.pkgVersion ? content.pkgVersion.toString(): '1.0' }"
[telemetryInteractEdata]="{id:'collaborating-on',type:'click',pageid:'CollaboratingOn'}">
<td>
<h5 class="ui image header">
<img src="{{content.appIcon || 'assets/images/default.png' | cdnprefixurl}}" class="ui tiny image UpReviewTinyImage">
<div class="content ">
<div class="UpReviewHeader" title="{{content.name}}">{{content.name | slice:0:25}}
<i *ngIf="content.name.length > 25">...</i>
</div>
<div class="UpReviewSubHeader">{{content.primaryCategory}}
</div>
</div>
</h5>
</td>
<td>
<h5 class="ui image header">
<div class="content">
<div class="UpReviewHeader">{{content.creator}}</div>
</div>
</h5>
</td>
<td>
<h5 class="ui image header">
<div class="content">
<div class="UpReviewSubHeader">{{content.lastUpdatedOn | fromNow }}
</div>
</div>
</h5>
</td>
<td class="UpForReviewStatusOrange">{{content.status}}</td>
<td *ngIf= "content.status.toLowerCase() === 'draft' && !content.lockInfo">
<i appTelemetryInteract [telemetryInteractObject]="{id:content.identifier,type:content.contentType,ver:content.pkgVersion ? content.pkgVersion.toString(): '1.0' }"
[telemetryInteractEdata]="{id:'edit',type:'click',pageid:'CollaboratingOn'}" (click)="contentClick(content)" class="edit icon cursor-pointer">
</i>
</td>
<td *ngIf="content.lockInfo">
<span matTooltip="{{resourceService?.frmelmnts?.lbl?.lockPopupTitle | interpolate:'{collaborator}':content?.lockInfo?.creatorInfo?.name | interpolate:'{contentName}':content?.name}}" [matTooltipPosition]="'left'">
<i class="lock icon large" ></i>
</span>
</td>
</tr>
</tbody>
</table>
<div class="ui grid">
<div class="two wide column"></div>
<div class="ten wide column">
<div class="pb-10" *ngIf="collaboratingContent && totalCount > config.appConfig.WORKSPACE.PAGE_LIMIT && !showLoader && !showError && !noResult">
<div class="ui pagination menu mt-10 right-floated pt-0" *ngIf="pager.pages.length ">
<a [ngClass]="{disabled:pager.currentPage===1 }" class="item " (click)="navigateToPage(1) ">First</a>
<a [ngClass]="{disabled:pager.currentPage===1 }" class="item " (click)="navigateToPage(pager.currentPage - 1)">Previous</a>
<a *ngFor="let page of pager.pages" [ngClass]="{active:pager.currentPage===page}" (click)="navigateToPage(page)" class="item">{{page}}</a>
<a [ngClass]="{disabled:pager.currentPage=== pager.totalPages}" (click)="navigateToPage(pager.currentPage + 1)" class="item">Next</a>
<a [ngClass]="{disabled:pager.currentPage=== pager.totalPages}" (click)="navigateToPage(pager.totalPages)" class="item ">Last</a>
</div>
</div>
</div>
</div>
<ng-template let-context let-modal="modal" #modalTemplate>
<div class="sb-modal sb-error">
<div class="ui modal visible active small">
<i class="icon close" (click)="modal.deny('denied')" tabindex="0"></i>
<!--Header-->
<div class="sb-modal-header">
{{resourceService?.frmelmnts?.lbl?.deletecontent}}
</div>
<!--/Header-->
<!--Content-->
<div class="sb-modal-content">
<p>{{resourceService?.frmelmnts?.lbl?.deleteconfirm}}</p>
</div>
<!--/Content-->
<!--Actions-->
<div class="sb-modal-actions">
<button
class="sb-btn sb-btn-normal sb-btn-error"
(click)="modal.approve('approved')"
autofocus
>
{{resourceService?.frmelmnts?.btn?.yes}}
</button>
<button
class="sb-btn sb-btn-normal sb-btn-outline-error"
(click)="modal.deny('denied')"
>
{{resourceService?.frmelmnts?.btn?.no}}
</button>
</div>
<!--/Actions-->
</div>
</div>
</ng-template>
<app-contentlock-info-popup [content]="lockPopupData" (closeEvent)="onCloseLockInfoPopup($event)" *ngIf="showLockedContentModal"></app-contentlock-info-popup>