From b8b35645ac6928839fcd0d641123514e4e6611b4 Mon Sep 17 00:00:00 2001 From: Chris Chen Date: Tue, 4 Nov 2025 07:42:24 -0800 Subject: [PATCH] WIP --- .../massive-darkness2.db.model.ts | 1 + .../md2-mob-info-detail.component.html | 204 ++++++++++++------ .../md2-mob-info-detail.component.scss | 36 +--- .../md2-mob-info-detail.component.ts | 125 +++++++++++ .../md2-mob-info-maintenance.component.ts | 6 +- 5 files changed, 274 insertions(+), 98 deletions(-) diff --git a/src/app/games/massive-darkness2/massive-darkness2.db.model.ts b/src/app/games/massive-darkness2/massive-darkness2.db.model.ts index c151bc9..68a5966 100644 --- a/src/app/games/massive-darkness2/massive-darkness2.db.model.ts +++ b/src/app/games/massive-darkness2/massive-darkness2.db.model.ts @@ -29,6 +29,7 @@ export interface MD2MobInfo { export interface MD2MobLevelInfo { id: string; + level: number; mobInfoId: string; rewardTokens: number; fixedRareTreasure: number; diff --git a/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.html b/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.html index 88e5432..9ec6d79 100644 --- a/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.html +++ b/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.html @@ -23,20 +23,129 @@

Mob Levels

-
-
- Level {{ i + 1 }} -
- HP: {{ levelInfo.fixedHp }} - Actions: {{ levelInfo.actions }} - Reward Tokens: {{ levelInfo.rewardTokens }} -
-
+
+
+ + + + + + {{ dataItem.level }} + + + + + + + + + + + + {{ dataItem.hpPerHero }} + + + + + + + + + + + + {{ dataItem.rewardTokens }} + + + + + + + + + + {{ dataItem.fixedRareTreasure }} + + + + + + + + + + {{ dataItem.fixedEpicTreasure }} + + + + + + + + + + {{ dataItem.fixedLegendTreasure }} + + + + + + + + + + {{ dataItem.defenceInfo.blue }} + + + + + + + + + + + + + + + + +
@@ -46,89 +155,63 @@ Add Skill
- - - - + + - + - + {{ getSkillTypeName(dataItem.type) }} - - + {{ getSkillTargetName(dataItem.skillTarget) }} - + - + - + - + - + - + - - + @@ -144,5 +227,4 @@ - - + \ No newline at end of file diff --git a/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.scss b/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.scss index 77dc91e..cb21276 100644 --- a/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.scss +++ b/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.scss @@ -41,40 +41,8 @@ } } -.levels-list { - display: flex; - flex-direction: column; - gap: 10px; - max-height: 150px; - overflow-y: auto; - padding: 10px; - border: 1px solid #e0e0e0; - border-radius: 4px; -} - -.level-item { - padding: 10px; - border: 1px solid #e0e0e0; - border-radius: 4px; - cursor: pointer; - transition: background-color 0.2s; - - &:hover { - background-color: #f5f5f5; - } - - &.selected { - background-color: #e3f2fd; - border-color: #2196f3; - } -} - -.level-details { - display: flex; - gap: 15px; - margin-top: 5px; - font-size: 12px; - color: #666; +.levels-toolbar { + margin-bottom: 10px; } .skills-section { diff --git a/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.ts b/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.ts index bf0b325..a4b45b5 100644 --- a/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.ts +++ b/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-detail/md2-mob-info-detail.component.ts @@ -16,9 +16,20 @@ import { MsgBoxService } from '../../../../services/msg-box.service'; }) export class MD2MobInfoDetailComponent extends DialogContentBase implements OnInit { @Input() public mobInfo: MD2MobInfo; + @ViewChild('levelsGrid') levelsGrid: GridComponent; @ViewChild('skillsGrid') skillsGrid: GridComponent; public mobLevelInfos: MD2MobLevelInfo[] = []; + public levelsData: GridDataResult = { data: [], total: 0 }; + public levelsState: State = { + skip: 0, + take: 10, + sort: [], + filter: { + logic: 'and', + filters: [] + } + }; public selectedLevelInfo: MD2MobLevelInfo | null = null; public skillsData: GridDataResult = { data: [], total: 0 }; public skillsState: State = { @@ -74,10 +85,120 @@ export class MD2MobInfoDetailComponent extends DialogContentBase implements OnIn } public selectLevelInfo(levelInfo: MD2MobLevelInfo): void { + if (levelInfo.defenceInfo == null) { + levelInfo.defenceInfo = { blue: 0, green: 0, yellow: 0, orange: 0, red: 0, black: 0 }; + } + if (levelInfo.attackInfo == null) { + levelInfo.attackInfo = { blue: 0, green: 0, yellow: 0, orange: 0, red: 0, black: 0 }; + } this.selectedLevelInfo = levelInfo; this.loadSkills(levelInfo); } + public editLevelHandler({ sender, rowIndex, dataItem }: any): void { + // The template-driven editing directive handles edit mode automatically + // This handler is here to ensure the grid enters edit mode + // The grid should already be in edit mode from the directive, but we ensure it + } + + public cancelLevelHandler({ sender, rowIndex }: any): void { + // Cancel editing - template-driven editing handles this automatically + sender.closeRow(rowIndex); + } + + public addLevelHandler(): void { + if (!this.mobInfo || !this.levelsGrid) return; + + const newLevel: MD2MobLevelInfo = { + id: this.generateLevelId(), + level: this.mobLevelInfos.length + 1, + mobInfoId: this.mobInfo.id, + rewardTokens: 0, + fixedRareTreasure: 0, + fixedEpicTreasure: 0, + fixedLegendTreasure: 0, + fixedHp: 1, + hpPerHero: 0, + actions: 1, + attackInfo: { yellow: null, orange: null, red: null, blue: null, green: null, black: null }, + defenceInfo: { yellow: null, orange: null, red: null, blue: null, green: null, black: null }, + skills: [] + }; + + // Use grid's addRow method to properly add a new row in edit mode + this.levelsGrid.addRow(newLevel); + } + + public saveLevelHandler({ dataItem, isNew }: any): void { + if (isNew) { + dataItem.id = this.generateLevelId(); + dataItem.mobInfoId = this.mobInfo?.id; + } + + // Ensure required objects exist + if (!dataItem.attackInfo) { + dataItem.attackInfo = { yellow: null, orange: null, red: null, blue: null, green: null, black: null }; + } + if (!dataItem.defenceInfo) { + dataItem.defenceInfo = { yellow: null, orange: null, red: null, blue: null, green: null, black: null }; + } + if (!dataItem.skills) { + dataItem.skills = []; + } + + this.isLoading = true; + this.mobLevelInfoService.createOrUpdate(dataItem).pipe(first()).subscribe(result => { + this.isLoading = false; + if (isNew) { + // For new items, add to the array + + result.attackInfo.black = 0; + this.mobLevelInfos.push(result); + } else { + // For existing items, update in the array + const index = this.mobLevelInfos.findIndex(l => l.id === result.id); + if (index !== -1) { + this.mobLevelInfos[index] = result; + // Update selected level if it's the one being edited + if (this.selectedLevelInfo?.id === result.id) { + this.selectedLevelInfo = result; + this.loadSkills(result); + } + } + } + // Close the edit row after saving + if (this.levelsGrid) { + const rowIndex = this.mobLevelInfos.findIndex(l => l.id === result.id); + if (rowIndex !== -1) { + this.levelsGrid.closeRow(rowIndex); + } + } + }, error => { + this.isLoading = false; + console.error('Error saving level info:', error); + }); + } + + public removeLevelHandler({ dataItem }: { dataItem: MD2MobLevelInfo }): void { + this.msgBoxService.showConfirmDeleteBox().pipe(first()).subscribe(answer => { + if (answer === true) { + this.isLoading = true; + this.mobLevelInfoService.delete(dataItem.id).pipe(first()).subscribe(result => { + const index = this.mobLevelInfos.findIndex(l => l.id === dataItem.id); + if (index !== -1) { + this.mobLevelInfos.splice(index, 1); + // Clear selection if deleted level was selected + if (this.selectedLevelInfo?.id === dataItem.id) { + this.selectedLevelInfo = null; + this.skillsData = { data: [], total: 0 }; + } + } + this.isLoading = false; + }); + } + }); + } + public loadSkills(levelInfo: MD2MobLevelInfo): void { if (levelInfo && levelInfo.skills) { this.skillsData = { @@ -169,6 +290,10 @@ export class MD2MobInfoDetailComponent extends DialogContentBase implements OnIn return 'skill_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9); } + private generateLevelId(): string { + return 'level_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9); + } + public getSkillTypeName(type: MobSkillType): string { return MobSkillType[type] || ''; } diff --git a/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-maintenance.component.ts b/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-maintenance.component.ts index 6f5650b..24921a9 100644 --- a/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-maintenance.component.ts +++ b/src/app/games/massive-darkness2/md2-mob-info-maintenance/md2-mob-info-maintenance.component.ts @@ -57,7 +57,7 @@ export class MD2MobInfoMaintenanceComponent implements OnInit { const dialogRef = this.dialogService.open({ title: 'Add New Mob Info', content: MD2MobInfoEditorComponent, - width: 800, + width: '90vw', height: 600 }); @@ -81,7 +81,7 @@ export class MD2MobInfoMaintenanceComponent implements OnInit { const dialogRef = this.dialogService.open({ title: 'Edit Mob Info', content: MD2MobInfoEditorComponent, - width: 800, + width: '90vw', height: 600 }); @@ -112,7 +112,7 @@ export class MD2MobInfoMaintenanceComponent implements OnInit { const dialogRef = this.dialogService.open({ title: `Mob Info: ${mobInfo.name}`, content: MD2MobInfoDetailComponent, - width: 1200, + width: '90vw', height: 800 });