nts-ng2-components/src/components/ui/datagrid/header/header.component.html

Paquete de componentes para Angular2 desarrollado por NITSNETS.

<nts-row
    [class.selected]="datagrid.selected.length && datagrid.deletingSelection !== true"
    [class.deleting]="datagrid.selected.length && datagrid.deletingSelection === true"
    [class.all-selected]="datagrid.allSelected()"
>
    <nts-datagrid-cell *ngIf="datagrid.selectable" [width]="0" [highlight]="true">
        <nts-checkbox
            [partial]="datagrid.selected.length > 0"
            [ntsModel]="datagrid.allSelected()"
            (ntsModelChange)="datagrid.onSelectAll($event)"
        ></nts-checkbox>
    </nts-datagrid-cell>

    <ng-container *ngIf="!datagrid.selected.length">
        <nts-datagrid-cell
            *ngFor="let column of datagrid.columns"
            [ngClass]="{
                'sortable': column.isSortable(datagrid.sortable),
                'sort-asc': datagrid.sort?.field && datagrid.sort?.field === column?.field && datagrid.sort.dir === false,
                'sort-desc': datagrid.sort?.field && datagrid.sort?.field === column?.field && datagrid.sort.dir === true
            }"
            [width]="column.width || 1"
            [highlight]="column.isSortable(datagrid.sortable) ? true : false"
            (click)="datagrid.onSortBy(column)"
        >
            <span [innerHtml]="column.title"></span>
        </nts-datagrid-cell>
    </ng-container>
    <ng-container *ngIf="datagrid.selected.length && datagrid.deletingSelection !== true">
        <nts-datagrid-cell>
            <span>{{datagrid.selected.length}} item(s) selected</span>
        </nts-datagrid-cell>
    </ng-container>

    <ng-container *ngIf="datagrid.selected.length && datagrid.deletingSelection === true">
        <nts-datagrid-cell class="deleting">
            <span>Are you sure you want to delete {{datagrid.selected.length}} item(s)?</span>
            <nts-button label="Delete" color="error" (click)="datagrid.onDeleteSelection()"></nts-button>
            <nts-button label="Cancel" color="default" (click)="datagrid.deletingSelection = false"></nts-button>
        </nts-datagrid-cell>
    </ng-container>

    <nts-datagrid-cell
        class="delete-cell"
        width="0"
        *ngIf="datagrid.deletable"
        [highlight]="true"
    >
        <nts-button icon="delete" (click)="onDeleteAttempt()"></nts-button>
    </nts-datagrid-cell>

</nts-row>

<nts-separator [class.selected]="datagrid.selected.length"></nts-separator>