igniteui-angular-sovn
Version:
Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps
173 lines (156 loc) • 4.85 kB
text/typescript
import { Component, HostBinding, Input } from '@angular/core';
import { IgxGridActionsBaseDirective } from './grid-actions-base.directive';
import { showMessage } from '../../core/utils';
import { addRow, addChild } from '@igniteui/material-icons-extended';
import { IgxGridActionButtonComponent } from './grid-action-button.component';
import { NgIf } from '@angular/common';
export class IgxGridEditingActionsComponent extends IgxGridActionsBaseDirective {
/**
* Host `class.igx-action-strip` binding.
*
* @hidden
* @internal
*/
public cssClass = 'igx-action-strip__editing-actions';
/**
* An input to enable/disable action strip row adding button
*/
public set addRow(value: boolean) {
this._addRow = value;
}
public get addRow(): boolean {
if (!this.iconsRendered) {
this.registerIcons();
this.iconsRendered = true;
}
return this._addRow;
}
/**
* An input to enable/disable action strip row editing button
*/
public editRow = true;
/**
* An input to enable/disable action strip row deleting button
*/
public deleteRow = true;
/**
* Getter if the row is disabled
*
* @hidden
* @internal
*/
public get disabled(): boolean {
if (!this.isRow(this.strip.context)) {
return;
}
return this.strip.context.disabled;
}
/**
* Getter if the row is root.
*
* @hidden
* @internal
*/
public get isRootRow(): boolean {
if (!this.isRow(this.strip.context)) {
return false;
}
return this.strip.context.isRoot;
}
public get hasChildren(): boolean {
if (!this.isRow(this.strip.context)) {
return false;
}
return this.strip.context.hasChildren;
}
/**
* An input to enable/disable action strip child row adding button
*/
public addChild = false;
private isMessageShown = false;
private _addRow = false;
private iconsRendered = false;
/**
* Enter row or cell edit mode depending the grid rowEditable option
*
* @example
* ```typescript
* this.gridEditingActions.startEdit();
* ```
*/
public startEdit(event?): void {
if (event) {
event.stopPropagation();
}
if (!this.isRow(this.strip.context)) {
return;
}
const row = this.strip.context;
const firstEditable = row.cells.filter(cell => cell.editable)[0];
const grid = row.grid;
if (!grid.hasEditableColumns) {
this.isMessageShown = showMessage(
'The grid should be editable in order to use IgxGridEditingActionsComponent',
this.isMessageShown);
return;
}
// be sure row is in view
if (grid.rowList.filter(r => r === row).length !== 0) {
grid.gridAPI.crudService.enterEditMode(firstEditable, event);
if (!grid.gridAPI.crudService.nonEditable){
firstEditable.activate(event);
}
}
this.strip.hide();
}
/** @hidden @internal **/
public deleteRowHandler(event?): void {
if (event) {
event.stopPropagation();
}
if (!this.isRow(this.strip.context)) {
return;
}
const context = this.strip.context;
const grid = context.grid;
grid.deleteRow(context.key);
this.strip.hide();
}
/** @hidden @internal **/
public addRowHandler(event?, asChild?: boolean): void {
if (event) {
event.stopPropagation();
}
if (!this.isRow(this.strip.context)) {
return;
}
const context = this.strip.context;
const grid = context.grid;
if (!grid.rowEditable) {
console.warn('The grid must use row edit mode to perform row adding! Please set rowEditable to true.');
return;
}
grid.gridAPI.crudService.enterAddRowMode(context, asChild, event);
this.strip.hide();
}
/**
* @hidden
* @internal
*/
private registerIcons() {
this.iconService.addSvgIconFromText(addRow.name, addRow.value, 'imx-icons', true,);
this.iconService.addSvgIconFromText(addChild.name, addChild.value, 'imx-icons', true);
}
}