230 lines
10 KiB
HTML
230 lines
10 KiB
HTML
<div class="k-dialog-content detail-container">
|
|
<div class="mob-info-section">
|
|
<h3>{{ mobInfo?.name }}</h3>
|
|
<div class="info-grid">
|
|
<div class="info-item">
|
|
<label>Type:</label>
|
|
<span>{{ getMobTypeName(mobInfo?.type) }}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<label>Game Bundle:</label>
|
|
<span>{{ getGameBundleName(mobInfo?.from) }}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<label>Leader Image:</label>
|
|
<span>{{ mobInfo?.leaderImgUrl || 'N/A' }}</span>
|
|
</div>
|
|
<div class="info-item">
|
|
<label>Minion Image:</label>
|
|
<span>{{ mobInfo?.minionImgUrl || 'N/A' }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="levels-section">
|
|
<h4>Mob Levels</h4>
|
|
<div class="levels-toolbar">
|
|
<button kendoButton (click)="addLevelHandler()" [primary]="true">
|
|
<span class="k-icon k-i-plus"></span> Add Level
|
|
</button>
|
|
</div>
|
|
|
|
<kendo-grid #levelsGrid [data]="mobLevelInfos" [loading]="isLoading" [pageSize]="levelsState.take"
|
|
[skip]="levelsState.skip" [sortable]="true" [filterable]="true" [pageable]="true" [height]="300"
|
|
kendoGridTemplateEditing (edit)="editLevelHandler($event)" (cancel)="cancelLevelHandler($event)"
|
|
(save)="saveLevelHandler($event)" (remove)="removeLevelHandler($event)" (dataStateChange)="levelsState = $event">
|
|
|
|
<kendo-grid-column field="level" title="Level" [width]="50">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.level }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.level" [name]="'level_' + rowIndex" [min]="1" [decimals]="0"
|
|
[format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<!-- <kendo-grid-column field="fixedHp" title="HP" [width]="80">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.fixedHp }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.fixedHp" [name]="'fixedHp_' + rowIndex" [min]="0" [decimals]="0"
|
|
[format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column> -->
|
|
|
|
<kendo-grid-column field="hpPerHero" title="HP/Hero" [width]="80">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.hpPerHero }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.hpPerHero" [name]="'hpPerHero_' + rowIndex" [min]="0"
|
|
[decimals]="0" [format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<!-- <kendo-grid-column field="actions" title="Actions" [width]="100">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.actions }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.actions" [name]="'actions_' + rowIndex" [min]="0" [decimals]="0"
|
|
[format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column> -->
|
|
|
|
<kendo-grid-column field="rewardTokens" title="Reward Tokens" [width]="80">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.rewardTokens }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.rewardTokens" [name]="'rewardTokens_' + rowIndex" [min]="0"
|
|
[decimals]="0" [format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="fixedRareTreasure" title="Rare Treasure" [width]="80">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.fixedRareTreasure }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.fixedRareTreasure" [name]="'fixedRareTreasure_' + rowIndex"
|
|
[min]="0" [decimals]="0" [format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="fixedEpicTreasure" title="Epic Treasure" [width]="80">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.fixedEpicTreasure }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.fixedEpicTreasure" [name]="'fixedEpicTreasure_' + rowIndex"
|
|
[min]="0" [decimals]="0" [format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="fixedLegendTreasure" title="Legend Treasure" [width]="60">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.fixedLegendTreasure }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.fixedLegendTreasure" [name]="'fixedLegendTreasure_' + rowIndex"
|
|
[min]="0" [decimals]="0" [format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
<!-- result.defenceInfo.blue
|
|
result.defenceInfo.green -->
|
|
<kendo-grid-column field="defenceInfo.blue" title="Blue Dice" [width]="60">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ dataItem.defenceInfo.blue }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.defenceInfo.blue" [name]="'defenceInfo.blue_' + rowIndex"
|
|
[min]="0" [decimals]="0" [format]="'n0'">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-command-column title="Actions" [width]="250">
|
|
<ng-template kendoGridCellTemplate let-isNew="isNew" let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<button kendoGridEditCommand [primary]="true">Edit</button>
|
|
<button kendoGridRemoveCommand>Remove</button>
|
|
<button kendoButton (click)="selectLevelInfo(dataItem)" [look]="'flat'">
|
|
View Skills
|
|
</button>
|
|
<button kendoGridSaveCommand>Save</button>
|
|
<button kendoGridCancelCommand>Cancel</button>
|
|
</ng-template>
|
|
</kendo-grid-command-column>
|
|
</kendo-grid>
|
|
</div>
|
|
|
|
<div class="skills-section" *ngIf="selectedLevelInfo">
|
|
<h4>Skills for Selected Level</h4>
|
|
<div class="skills-toolbar">
|
|
<button kendoButton (click)="addSkillHandler()" [primary]="true">
|
|
<span class="k-icon k-i-plus"></span> Add Skill
|
|
</button>
|
|
</div>
|
|
|
|
<kendo-grid #skillsGrid [data]="skillsData" [loading]="isLoading" [pageSize]="skillsState.take"
|
|
[skip]="skillsState.skip" [sortable]="true" [filterable]="true" [pageable]="true" [height]="400"
|
|
kendoGridTemplateEditing (save)="saveSkillHandler($event)" (remove)="removeSkillHandler($event)"
|
|
(dataStateChange)="skillsState = $event">
|
|
|
|
<kendo-grid-column field="name" title="Name" [width]="150">
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem">
|
|
<input kendoTextBox [(ngModel)]="dataItem.name" name="name" placeholder="Enter skill name" />
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="type" title="Type" [width]="120">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ getSkillTypeName(dataItem.type) }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem">
|
|
<kendo-dropdownlist [(ngModel)]="dataItem.type" name="type" [data]="skillTypes" [valueField]="'value'"
|
|
[textField]="'text'">
|
|
</kendo-dropdownlist>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="skillTarget" title="Target" [width]="150">
|
|
<ng-template kendoGridCellTemplate let-dataItem>
|
|
{{ getSkillTargetName(dataItem.skillTarget) }}
|
|
</ng-template>
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem">
|
|
<kendo-dropdownlist [(ngModel)]="dataItem.skillTarget" name="skillTarget" [data]="skillTargets"
|
|
[valueField]="'value'" [textField]="'text'">
|
|
</kendo-dropdownlist>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="clawRoll" title="Claw Roll" [width]="100">
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.clawRoll" name="clawRoll" [min]="0">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="skillRoll" title="Skill Roll" [width]="100">
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem">
|
|
<kendo-numerictextbox [(ngModel)]="dataItem.skillRoll" name="skillRoll" [min]="0">
|
|
</kendo-numerictextbox>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-column field="description" title="Description" [width]="300">
|
|
<ng-template kendoGridEditTemplate let-dataItem="dataItem">
|
|
<textarea kendoTextArea [(ngModel)]="dataItem.description" name="description"
|
|
placeholder="Enter skill description" rows="3">
|
|
</textarea>
|
|
</ng-template>
|
|
</kendo-grid-column>
|
|
|
|
<kendo-grid-command-column title="Actions" [width]="200">
|
|
<ng-template kendoGridCellTemplate let-isNew="isNew" let-dataItem="dataItem" let-rowIndex="rowIndex">
|
|
<button kendoGridEditCommand [primary]="true">Edit</button>
|
|
<button kendoGridRemoveCommand>Remove</button>
|
|
</ng-template>
|
|
<ng-template kendoGridEditCommandTemplate let-isNew="isNew" let-rowIndex="rowIndex">
|
|
<button kendoGridSaveCommand>Save</button>
|
|
<button kendoGridCancelCommand>Cancel</button>
|
|
</ng-template>
|
|
</kendo-grid-command-column>
|
|
</kendo-grid>
|
|
</div>
|
|
</div>
|
|
|
|
<kendo-dialog-actions>
|
|
<button kendoButton [primary]="true" (click)="close()">Close</button>
|
|
</kendo-dialog-actions> |