IETM_FIXE\ietm6
7c4a42327d
Migration pour l'ancienne partie des fiches perso vers les nouvelles pages Vue retravaillée pour les fiches perso
61 lines
1.9 KiB
TypeScript
61 lines
1.9 KiB
TypeScript
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
||
import { CommonModule } from '@angular/common';
|
||
import { LucideAngularModule, X, Image as ImageIcon } from 'lucide-angular';
|
||
import { ImageService } from '../../services/image.service';
|
||
import { Image } from '../../services/image.model';
|
||
import { ImageUploaderComponent } from '../image-uploader/image-uploader.component';
|
||
|
||
/**
|
||
* Picker d'image unique : preview + upload + suppression.
|
||
*
|
||
* Usage :
|
||
* <app-single-image-picker [imageId]="portraitId" (imageIdChange)="portraitId = $event">
|
||
* </app-single-image-picker>
|
||
*
|
||
* Comportements :
|
||
* - Si imageId est defini : affiche la miniature avec un bouton X pour retirer
|
||
* - Sinon : affiche le bouton d'upload (compact mode)
|
||
*
|
||
* Le composant ne supprime pas l'image cote backend — il decouple juste le
|
||
* lien (passe imageId a null). L'image reste accessible via d'autres entites.
|
||
*/
|
||
@Component({
|
||
selector: 'app-single-image-picker',
|
||
standalone: true,
|
||
imports: [CommonModule, LucideAngularModule, ImageUploaderComponent],
|
||
templateUrl: './single-image-picker.component.html',
|
||
styleUrls: ['./single-image-picker.component.scss']
|
||
})
|
||
export class SingleImagePickerComponent {
|
||
readonly X = X;
|
||
readonly ImageIcon = ImageIcon;
|
||
|
||
@Input() imageId: string | null = null;
|
||
|
||
/** Texte d'aide affiche sous le picker (ex: "Format conseille : 400×400"). */
|
||
@Input() hint?: string;
|
||
|
||
/** Aspect ratio de la preview (CSS aspect-ratio property). */
|
||
@Input() aspectRatio = '1 / 1';
|
||
|
||
@Output() imageIdChange = new EventEmitter<string | null>();
|
||
|
||
constructor(private imageService: ImageService) {}
|
||
|
||
contentUrl(id: string): string {
|
||
return this.imageService.contentUrl(id);
|
||
}
|
||
|
||
onUploaded(img: Image): void {
|
||
if (img?.id) {
|
||
this.imageId = img.id;
|
||
this.imageIdChange.emit(this.imageId);
|
||
}
|
||
}
|
||
|
||
remove(): void {
|
||
this.imageId = null;
|
||
this.imageIdChange.emit(null);
|
||
}
|
||
}
|