84 lines
3.1 KiB
HTML
84 lines
3.1 KiB
HTML
<div class="modal-backdrop" (click)="onCancel()">
|
|
<div class="modal" (click)="$event.stopPropagation()">
|
|
|
|
<div class="modal-header">
|
|
<h2>Créer une nouvelle Campagne</h2>
|
|
<button class="btn-close" (click)="onCancel()">
|
|
<lucide-icon [img]="X" [size]="18"></lucide-icon>
|
|
</button>
|
|
</div>
|
|
|
|
<form [formGroup]="form" (ngSubmit)="submit()">
|
|
|
|
<div class="field">
|
|
<label for="campaign-name">Nom de la campagne *</label>
|
|
<input
|
|
id="campaign-name"
|
|
type="text"
|
|
formControlName="name"
|
|
placeholder="Ex: L'Ombre du Nord, Les Héritiers Oubliés..."
|
|
[class.invalid]="form.get('name')?.invalid && form.get('name')?.touched"
|
|
/>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="campaign-description">Description / Pitch</label>
|
|
<textarea
|
|
id="campaign-description"
|
|
formControlName="description"
|
|
placeholder="Résumez l'intrigue principale de votre campagne..."
|
|
rows="5"
|
|
></textarea>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="campaign-player-count">Nombre de joueurs</label>
|
|
<input id="campaign-player-count" type="number" formControlName="playerCount" min="1" />
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="campaign-lore">Univers associé</label>
|
|
<select id="campaign-lore" formControlName="loreId">
|
|
<option value="">— Aucun univers (campagne libre) —</option>
|
|
<option *ngFor="let lore of availableLores" [value]="lore.id">{{ lore.name }}</option>
|
|
</select>
|
|
<p class="hint">
|
|
Optionnel. Si associée, vous pourrez lier arcs, chapitres et scènes aux pages du Lore.
|
|
Laissez vide pour un one-shot ou si vous créerez le Lore plus tard.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label for="campaign-game-system">Système de JDR</label>
|
|
<select id="campaign-game-system" formControlName="gameSystemId">
|
|
<option value="">— Aucun (campagne générique) —</option>
|
|
<option *ngFor="let gs of availableGameSystems" [value]="gs.id">{{ gs.name }}</option>
|
|
</select>
|
|
<p class="hint">
|
|
Optionnel. Si défini, l'IA injectera les règles du système (classes, combat, lore...)
|
|
dans ses suggestions pour respecter les mécaniques du JDR.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<p><strong>💡 Organisation :</strong> Votre campagne sera structurée en :</p>
|
|
<ul>
|
|
<li><strong>Arcs</strong> - Les grandes phases narratives</li>
|
|
<li><strong>Chapitres</strong> - Les segments d'un arc</li>
|
|
<li><strong>Scènes</strong> - Les moments de jeu individuels</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="modal-actions">
|
|
<button type="submit" class="btn-primary" [disabled]="form.invalid">
|
|
<lucide-icon [img]="BookCopy" [size]="16"></lucide-icon>
|
|
Créer la campagne
|
|
</button>
|
|
<button type="button" class="btn-secondary" (click)="onCancel()">Annuler</button>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
</div>
|