libs/rucken/todo-web/src/lib/entities/projects/projects-grid/projects-grid.component.ts
BaseEntityListComponent
changeDetection | ChangeDetectionStrategy.OnPush |
selector | projects-grid |
templateUrl | ./projects-grid.component.html |
Methods |
constructor(modalsService: ModalsService, errorsExtractor: ErrorsExtractor, translateService: TranslateService, dynamicRepository: DynamicRepository, projectsConfig: IRestProviderOptions
|
|||||||||||||||||||||
Parameters :
|
ngOnInit |
ngOnInit()
|
Returns :
void
|
onDblClick | ||||||
onDblClick(item: Project)
|
||||||
Parameters :
Returns :
void
|
import { ChangeDetectionStrategy, Component, Inject, Input, OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import {
BaseEntityListComponent,
ErrorsExtractor,
IBaseEntityModalOptions,
ModalsService,
translate,
UserPermPipe
} from '@rucken/core';
import { Project, PROJECTS_CONFIG_TOKEN } from '@rucken/todo-core';
import { DynamicRepository, IRestProviderOptions } from 'ngx-repository';
import { ProjectModalComponent } from '../project-modal/project-modal.component';
import { BindIoInner } from 'ngx-bind-io';
@BindIoInner()
@Component({
selector: 'projects-grid',
templateUrl: './projects-grid.component.html',
changeDetection: ChangeDetectionStrategy.OnPush
})
export class ProjectsGridComponent extends BaseEntityListComponent<Project> implements OnInit {
@Input()
autoload = false;
@Input()
modalItem: IBaseEntityModalOptions = {
component: ProjectModalComponent,
class: 'modal-lg'
};
@Input()
modalDelete = {
class: 'modal-md'
};
@Input()
title = translate('Projects');
constructor(
modalsService: ModalsService,
protected errorsExtractor: ErrorsExtractor,
protected translateService: TranslateService,
protected dynamicRepository: DynamicRepository,
@Inject(PROJECTS_CONFIG_TOKEN)
protected projectsConfig: IRestProviderOptions<Project>,
protected userPermPipe?: UserPermPipe
) {
super(dynamicRepository.fork<Project>(Project), modalsService, Project);
}
ngOnInit() {
if (!this.mockedItems) {
this.useRest({
apiUrl: this.apiUrl,
...this.projectsConfig,
autoload: this.autoload
});
}
if (this.mockedItems) {
this.useMock({
items: this.mockedItems,
...this.projectsConfig,
autoload: this.autoload
});
}
}
onDblClick(item: Project) {
if (this.userPermPipe.transform(item)) {
this.onUpdateClick(item);
} else {
this.onViewClick(item);
}
}
}
<entity-grid
[bindIO]
[columns]="'change_project'|perm:false:['title','users','isPublic','action']:['title','users']|async"
[translatedCells]="['isPublic']"
[enableCreate]="'add_project' | perm:false | async"
[enableUpdate]="'change_project' | perm:false | async"
[enableDelete]="'delete_project' | perm:false | async"
[gridCellActionContent]="gridCellActionContent"
#grid>
</entity-grid>
<ng-template
#gridCellActionContent
let-ctx>
<button
type="button"
class="btn btn-default btn-sm"
(click)="grid.onUpdate(ctx.item)"
*ngIf="(grid.notReadonlyAndEnableUpdate$ | async) && (ctx.item|userPerm)">
<fa-icon [icon]="['fas', 'edit']"></fa-icon>
</button>
<button
type="button"
class="btn btn-default btn-sm"
(click)="grid.onDelete(ctx.item)"
*ngIf="(grid.notReadonlyAndEnableDelete$ | async) && (ctx.item|userPerm)">
<fa-icon [icon]="['fas', 'trash']"></fa-icon>
</button>
<button
type="button"
class="btn btn-default btn-sm"
(click)="grid.onView(ctx.item)"
*ngIf="!(ctx.item|userPerm)">
<fa-icon [icon]="['fas', 'eye']"></fa-icon>
</button>
</ng-template>