@stratio/egeo
Version:
91 lines (90 loc) • 3.48 kB
TypeScript
import { EventEmitter, OnInit } from '@angular/core';
import { Order } from './shared/order';
import { StTableHeader } from './shared/table-header.interface';
/**
* @description {Component} [Table]
*
* The table component has been designed to display any content like images, text, graphs, etc.
*
* @example
*
* {html}
*
* ```
* <st-table [fields]="fields" [sortable]="true" (changeOrder)="yourFunctionToOrder($event)">
* <tr st-table-row *ngFor="let userData of data">
* <td st-table-cell st-table-row-content>
* <label >{{userData.id}}</label>
* </td>
* <td st-table-cell st-table-row-content>
* <label >{{userData.name}}</label>
* </td>
* <td st-table-cell st-table-row-content>
* <label >{{userData.lastName}}</label>
* </td>
* <td st-table-cell st-table-row-content>
* <label >{{userData.phone}}</label>
* </td>
* <td st-table-cell st-table-row-content>
* <label >{{userData.company}}</label>
* </td>
* <td st-table-cell st-table-row-content>
* <label >{{userData.completedProfile}}</label>
* </td>
* <td st-table-row-hover>
* <i class="icon icon-arrow2_right"></i>
* </td>
* </tr>
* </st-table>
* ```
*
*/
export declare class StTableComponent implements OnInit {
/** @Input {StTableHeader[]} [fields=''] List of field displayed in the header */
fields: StTableHeader[];
/** @Input {string} [qaTag=''] Prefix used to generate the id values for qa tests */
qaTag: string;
/** @Input {boolean} [header=true] Boolean to show or hide the header */
header: boolean;
/**
* @Input {boolean} [sortable=true] Boolean to make sortable the table, To enable sorting of columns use
* the new "sortable" field inside stTableHeader model
*/
sortable: boolean;
/**
* @Input {boolean} [selectableAll=false] Boolean to show or hide a checkbox in the header to select or
* deselect all rows
*/
selectableAll: boolean;
/** @Input {Order} [currentOrder=''] It specifies what is the current order applied to the table */
currentOrder: Order;
/** @Input {string} [customClasses=] Classes for adding styles to table tag from outside. These can be: separated-rows */
customClasses: string;
/** @Input {boolean} [fixedHeader=false] Boolean to fix the table header */
fixedHeader: boolean;
/** @Input {boolean} [selectedAll=false] It specifies if all rows are selected */
selectedAll: boolean;
/** @Input {boolean} [hasHoverMenu=false] It specifies if a menu has to be displayed when user puts the mouse over
* the rows. Remember to add a cell with the selector st-table-row-hover for adding content to the menu
*/
hasHoverMenu: boolean;
/** @Output {Order} [changeOrder=''] Event emitted with the new order which has to be applied to the table rows */
changeOrder: EventEmitter<Order>;
/** @Output {boolean} [selectAll=''] Event emitted when user interacts with the checkbox to select or deselect
* all rows
*/
selectAll: EventEmitter<boolean>;
tableClass: any;
orderTypes: any;
private _selectedAll;
private _hasHoverMenu;
ngOnInit(): void;
onChangeOrder(field: StTableHeader): void;
getClasses(): any;
isSortable(field: StTableHeader): boolean;
onSelectAll(event: any): void;
getHeaderItemClass(field: StTableHeader): string;
isSortedByField(field: StTableHeader): boolean;
private isSortedByFieldAndDirection;
private changeOrderDirection;
}