IETM_FIXE\ietm6
84ccdd53ad
- Lorsqu'on part de zéro : la création de dossier / page / template ce fait de manière plus fluide à la création d'un lore (par exemple création de page sans template et dossier : parcours facilité) - Ajout d'un bouton "+" dans le header templates - Harmonisation création / modification template Correction de tests unitaires
100 lines
3.6 KiB
HTML
100 lines
3.6 KiB
HTML
<div class="page">
|
|
|
|
<header class="page-header">
|
|
<h1>Créer une nouvelle Page</h1>
|
|
<p class="subtitle">Créez une page à partir d'un template existant</p>
|
|
</header>
|
|
|
|
<form [formGroup]="form" (ngSubmit)="submit()" class="page-form">
|
|
|
|
<!-- Titre -->
|
|
<div class="field">
|
|
<label>Titre de la page *</label>
|
|
<input type="text" formControlName="title" placeholder="Ex: Maître Eldrin, La Cité d'Argent..." />
|
|
</div>
|
|
|
|
<!-- Template -->
|
|
<div class="field">
|
|
<label>Template *</label>
|
|
|
|
<div class="templates-grid" *ngIf="templates.length; else emptyTemplates">
|
|
<button
|
|
type="button"
|
|
class="template-card"
|
|
*ngFor="let t of templates"
|
|
[class.selected]="selectedTemplateId === t.id"
|
|
(click)="selectTemplate(t)">
|
|
<div class="template-card-head">
|
|
<lucide-icon [img]="FileText" [size]="16"></lucide-icon>
|
|
<span class="template-name">{{ t.name }}</span>
|
|
</div>
|
|
<p class="template-description">{{ t.description || '—' }}</p>
|
|
</button>
|
|
</div>
|
|
|
|
<ng-template #emptyTemplates>
|
|
<p class="empty-hint">
|
|
Aucun template défini pour ce Lore.
|
|
<a [routerLink]="['/lore', loreId, 'templates', 'create']" [queryParams]="{ returnTo: 'page-create' }" (click)="saveDraft()">Créer un template</a> d'abord.
|
|
</p>
|
|
</ng-template>
|
|
</div>
|
|
|
|
<!-- Dossier de destination -->
|
|
<div class="field">
|
|
<label>Dossier de destination *</label>
|
|
|
|
<ng-container *ngIf="nodes.length; else emptyFolders">
|
|
<select formControlName="nodeId" [attr.disabled]="preselectedNodeId ? true : null">
|
|
<option value="" disabled>Sélectionnez un dossier</option>
|
|
<option *ngFor="let node of nodes" [value]="node.id">{{ node.name }}</option>
|
|
</select>
|
|
<p class="hint">La page sera créée dans ce dossier</p>
|
|
</ng-container>
|
|
|
|
<ng-template #emptyFolders>
|
|
<p class="empty-hint">
|
|
Aucun dossier dans ce Lore.
|
|
<a [routerLink]="['/lore', loreId, 'nodes', 'create']" [queryParams]="{ returnTo: 'page-create' }" (click)="saveDraft()">Créer un dossier</a> d'abord.
|
|
</p>
|
|
</ng-template>
|
|
</div>
|
|
|
|
<!-- Aide contextuelle -->
|
|
<div class="info-box">
|
|
💡 Option 1 : <strong>Créer la page</strong> vide, puis remplir les champs manuellement.<br>
|
|
💡 Option 2 : <strong>Créer avec l'IA</strong> pour dialoguer avec un assistant qui pré-remplira les champs.
|
|
</div>
|
|
|
|
<!-- Erreur wizard (parsing <values> ou échec HTTP) -->
|
|
<div class="wizard-error" *ngIf="wizardError" role="alert">{{ wizardError }}</div>
|
|
|
|
<!-- Actions -->
|
|
<div class="actions-row">
|
|
<button type="button" class="btn-secondary" (click)="cancel()">Annuler</button>
|
|
<button type="button" class="btn-ai" (click)="openWizard()" [disabled]="!canSubmit"
|
|
title="Ouvrir l'assistant IA pour pré-remplir les champs">
|
|
<lucide-icon [img]="Sparkles" [size]="14"></lucide-icon>
|
|
Créer avec l'IA
|
|
</button>
|
|
<button type="submit" class="btn-primary" [disabled]="!canSubmit">Créer la page</button>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
<!-- Drawer chat IA en mode wizard -->
|
|
<app-ai-chat-drawer
|
|
[loreId]="loreId"
|
|
[isOpen]="chatOpen"
|
|
[persistent]="false"
|
|
[welcomeMessage]="wizardWelcome"
|
|
[systemPromptAddon]="wizardSystemPrompt"
|
|
[quickSuggestions]="wizardSuggestions"
|
|
[primaryAction]="wizardPrimaryAction"
|
|
(close)="closeWizard()"
|
|
(assistantReply)="onWizardReply($event)"
|
|
(primaryActionClick)="applyWizardAndCreate()">
|
|
</app-ai-chat-drawer>
|