96 lines
3.2 KiB
TypeScript
96 lines
3.2 KiB
TypeScript
import { Component, OnInit, OnDestroy } from '@angular/core';
|
|
import { CommonModule } from '@angular/common';
|
|
import { FormsModule, ReactiveFormsModule, FormBuilder, FormGroup, Validators } from '@angular/forms';
|
|
import { ActivatedRoute, Router } from '@angular/router';
|
|
import { LucideAngularModule, Plus, Trash2 } from 'lucide-angular';
|
|
import { LoreService } from '../../services/lore.service';
|
|
import { TemplateService } from '../../services/template.service';
|
|
import { PageService } from '../../services/page.service';
|
|
import { LayoutService } from '../../services/layout.service';
|
|
import { LoreNode } from '../../services/lore.model';
|
|
import { loadLoreSidebarData, buildLoreSidebarConfig } from '../lore-sidebar.helper';
|
|
|
|
/**
|
|
* Écran de création d'un Template (gabarit de Page).
|
|
* - Champs principaux : nom, description, noeud par défaut.
|
|
* - Liste dynamique de "champs du template" (ex: "Nom", "Description", "Personnalité").
|
|
* Le user peut ajouter/retirer n'importe lequel — tous sont égaux.
|
|
*/
|
|
@Component({
|
|
selector: 'app-template-create',
|
|
standalone: true,
|
|
imports: [CommonModule, FormsModule, ReactiveFormsModule, LucideAngularModule],
|
|
templateUrl: './template-create.component.html',
|
|
styleUrls: ['./template-create.component.scss']
|
|
})
|
|
export class TemplateCreateComponent implements OnInit, OnDestroy {
|
|
readonly Plus = Plus;
|
|
readonly Trash2 = Trash2;
|
|
|
|
form: FormGroup;
|
|
loreId = '';
|
|
nodes: LoreNode[] = [];
|
|
/** Champs dynamiques actuellement définis. */
|
|
fields: string[] = ['Nom', 'Description'];
|
|
/** Valeur courante de l'input d'ajout de champ (non binding direct pour reset facile). */
|
|
newFieldName = '';
|
|
|
|
constructor(
|
|
private fb: FormBuilder,
|
|
private route: ActivatedRoute,
|
|
private router: Router,
|
|
private loreService: LoreService,
|
|
private templateService: TemplateService,
|
|
private pageService: PageService,
|
|
private layoutService: LayoutService
|
|
) {
|
|
this.form = this.fb.group({
|
|
name: ['', Validators.required],
|
|
description: [''],
|
|
defaultNodeId: ['', Validators.required]
|
|
});
|
|
}
|
|
|
|
ngOnInit(): void {
|
|
this.loreId = this.route.snapshot.paramMap.get('loreId')!;
|
|
loadLoreSidebarData(this.loreId, this.loreService, this.templateService, this.pageService).subscribe(data => {
|
|
this.nodes = data.nodes;
|
|
this.layoutService.show(buildLoreSidebarConfig(data));
|
|
});
|
|
}
|
|
|
|
addField(): void {
|
|
const name = this.newFieldName.trim();
|
|
if (!name || this.fields.includes(name)) return;
|
|
this.fields = [...this.fields, name];
|
|
this.newFieldName = '';
|
|
}
|
|
|
|
removeField(index: number): void {
|
|
this.fields = this.fields.filter((_, i) => i !== index);
|
|
}
|
|
|
|
submit(): void {
|
|
if (this.form.invalid) return;
|
|
const raw = this.form.value;
|
|
this.templateService.create({
|
|
loreId: this.loreId,
|
|
name: raw.name,
|
|
description: raw.description,
|
|
defaultNodeId: raw.defaultNodeId,
|
|
fields: this.fields
|
|
}).subscribe({
|
|
next: () => this.router.navigate(['/lore', this.loreId]),
|
|
error: () => console.error('Erreur lors de la création du template')
|
|
});
|
|
}
|
|
|
|
cancel(): void {
|
|
this.router.navigate(['/lore', this.loreId]);
|
|
}
|
|
|
|
ngOnDestroy(): void {
|
|
this.layoutService.hide();
|
|
}
|
|
}
|