57 lines
2.4 KiB
HTML
57 lines
2.4 KiB
HTML
<nb-card>
|
|
<nb-card-header>
|
|
<h4>MD2 Hero Profile Maintenance</h4>
|
|
<button class="float-right" kendoButton (click)="addHandler()" [primary]="true">
|
|
<span class="k-icon k-i-plus"></span> Add New
|
|
</button>
|
|
|
|
</nb-card-header>
|
|
<nb-card-body>
|
|
<kendo-grid #grid [data]="gridData" [loading]="isLoading" [pageSize]="gridState.take" [skip]="gridState.skip"
|
|
[group]="gridState.group" [filter]="gridState.filter" [sort]="gridState.sort" [sortable]="true"
|
|
[filterable]="true" [pageable]="true" [selectable]="true" [groupable]="true"
|
|
(dataStateChange)="gridState = $event; processGridData()" (edit)="editHandler($event)"
|
|
(remove)="removeHandler($event)" (add)="addHandler()">
|
|
|
|
<kendo-grid-toolbar>
|
|
<button kendoGridAddCommand>Add new</button>
|
|
</kendo-grid-toolbar>
|
|
|
|
<kendo-grid-column field="title" title="Title" [width]="150">
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="heroClass" title="Hero Class" [width]="60">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ getHeroClassName(dataItem.heroClass) }}
|
|
</ng-template>
|
|
<ng-template kendoGridGroupHeaderTemplate let-value="value">
|
|
{{ getHeroClassName(value) }}
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="hP" title="HP" [width]="80">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
<md2-icon [icon]="MD2Icon.Mana_Color" size="sm"></md2-icon> {{ dataItem.mana }}
|
|
<md2-icon [icon]="MD2Icon.HP_Color" size="sm"></md2-icon> {{ dataItem.hp }}
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="skill" title="Skill" [width]="500">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
<div [innerHTML]="dataItem.skillHtml"></div>
|
|
<div>
|
|
<md2-icon [icon]="MD2Icon.Shadow" size="sm"></md2-icon> <b>Shadow:</b>
|
|
<div [innerHTML]="dataItem.shadowSkillHtml"></div>
|
|
</div>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-command-column title="Actions" [width]="140">
|
|
<ng-template kendoGridCellTemplate let-isNew="isNew" let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<button kendoGridEditCommand [primary]="true">Edit</button>
|
|
<button kendoGridRemoveCommand>Remove</button>
|
|
</ng-template>
|
|
</kendo-grid-command-column>
|
|
</kendo-grid>
|
|
</nb-card-body>
|
|
</nb-card> |