- ng update @angular/core@21 @angular/cli@21 (corrige GHSA-jrmj-c5cx-3cw6, XSS SVG) - Migration automatique des templates vers le control flow natif (@if/@for, 138 fichiers) - Correction des 5 `track` invalides generes par la migration (trackBy a 1 argument -> track $index) + suppression des fonctions trackBy mortes - TypeScript 5.9, zone.js 0.15 ; npm audit : 0 vulnerabilite Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
85 lines
2.7 KiB
TypeScript
85 lines
2.7 KiB
TypeScript
import { Component, OnInit } from '@angular/core';
|
||
|
||
import { ActivatedRoute, Router } from '@angular/router';
|
||
import { LucideAngularModule, ArrowLeft, Edit3, Dices } from 'lucide-angular';
|
||
import { RandomTableService } from '../../../services/random-table.service';
|
||
import { CampaignSidebarService } from '../../../services/campaign-sidebar.service';
|
||
import { RandomTable, RandomTableEntry } from '../../../services/random-table.model';
|
||
import { DiceUtils, DiceRoll } from '../../../shared/dice.utils';
|
||
|
||
/**
|
||
* Vue d'une table aléatoire : affiche les entrées et permet de LANCER le dé
|
||
* (jet côté client) → surligne l'entrée tombée + montre son détail.
|
||
* Route : /campaigns/:campaignId/random-tables/:tableId
|
||
*/
|
||
@Component({
|
||
selector: 'app-random-table-view',
|
||
imports: [LucideAngularModule],
|
||
templateUrl: './random-table-view.component.html',
|
||
styleUrls: ['./random-table-view.component.scss']
|
||
})
|
||
export class RandomTableViewComponent implements OnInit {
|
||
readonly ArrowLeft = ArrowLeft;
|
||
readonly Edit3 = Edit3;
|
||
readonly Dices = Dices;
|
||
|
||
campaignId: string | null = null;
|
||
tableId: string | null = null;
|
||
table: RandomTable | null = null;
|
||
|
||
lastRoll: DiceRoll | null = null;
|
||
matched: RandomTableEntry | null = null;
|
||
|
||
constructor(
|
||
private route: ActivatedRoute,
|
||
private router: Router,
|
||
private service: RandomTableService,
|
||
private campaignSidebar: CampaignSidebarService
|
||
) {}
|
||
|
||
ngOnInit(): void {
|
||
const params = this.route.snapshot.paramMap;
|
||
this.campaignId = params.get('campaignId');
|
||
this.tableId = params.get('tableId');
|
||
if (this.tableId) {
|
||
this.service.getById(this.tableId).subscribe({
|
||
next: t => this.table = t,
|
||
error: () => this.back()
|
||
});
|
||
}
|
||
if (this.campaignId) {
|
||
this.campaignSidebar.show(this.campaignId);
|
||
}
|
||
}
|
||
|
||
roll(): void {
|
||
if (!this.table) return;
|
||
const result = DiceUtils.roll(this.table.diceFormula);
|
||
if (!result) { this.lastRoll = null; this.matched = null; return; }
|
||
this.lastRoll = result;
|
||
this.matched = this.table.entries.find(
|
||
e => result.total >= e.minRoll && result.total <= e.maxRoll
|
||
) ?? null;
|
||
}
|
||
|
||
isMatched(entry: RandomTableEntry): boolean {
|
||
return this.matched === entry;
|
||
}
|
||
|
||
rangeLabel(entry: RandomTableEntry): string {
|
||
return entry.minRoll === entry.maxRoll
|
||
? String(entry.minRoll)
|
||
: `${entry.minRoll}–${entry.maxRoll}`;
|
||
}
|
||
|
||
edit(): void {
|
||
if (this.campaignId && this.tableId) {
|
||
this.router.navigate(['/campaigns', this.campaignId, 'random-tables', this.tableId, 'edit']);
|
||
}
|
||
}
|
||
|
||
back(): void {
|
||
this.router.navigate(this.campaignId ? ['/campaigns', this.campaignId] : ['/campaigns']);
|
||
}
|
||
}
|