Caméra

Le composant Avonni Camera permet aux utilisateurs de capturer des images directement à l'aide de l'appareil photo de leur dispositif depuis un composant dynamique Avonni sur les pages Lightning de Salesforce. Cela offre un moyen fluide d'ajouter une documentation visuelle, des preuves ou des photos de profil directement aux enregistrements Salesforce sans quitter l'application.

Aperçu

Ce composant intègre la fonctionnalité d'appareil photo dans vos interfaces personnalisées. Les principales caractéristiques incluent :

• Capture d'image directe: Les utilisateurs peuvent activer la caméra de leur appareil et prendre des photos au sein du composant.

• Affichage flexible: Afficher la vue de la caméra en ligne ou la lancer via un bouton.

• Options de capture: Configurer des fonctionnalités telles que des minuteries de compte à rebours, l'aperçu des photos, et des captures uniques ou multiples par session.

• Intégration Salesforce: Enregistrer automatiquement les images capturées en tant que fichiers Salesforce (ContentDocument) et obtenir leurs identifiants.

• Interface personnalisable: Ajuster la taille du composant, le rapport d'aspect, les icônes de boutons et les libellés.

Cas d'utilisation

Le composant Camera est particulièrement utile dans des scénarios mobiles utilisant l'application Salesforce Mobile, mais peut également fonctionner sur des ordinateurs de bureau/portables équipés de caméras :

• Service sur site (Field Service): Les techniciens capturent des photos des dommages d'équipement, des travaux effectués ou des conditions du site, en les liant directement aux ordres de travail ou aux actifs.

• Inspections et audits: Documenter visuellement les constats lors d'inspections (par ex. : état d'une propriété, conformité en matière de sécurité).

• Ventes: Les commerciaux prennent des photos des placements de produits, des installations d'événements ou des tableaux blancs des clients lors de visites.

• Service client: Permettre aux clients (dans Experience Cloud) ou aux agents de télécharger des photos liées à un cas (par ex. : produit endommagé).

• Dossiers des employés: Capturer des photos de profil pour les enregistrements Utilisateur ou pour des objets personnalisés d'employés.

• Demandes d'indemnisation (assurance): Soumettre des preuves photographiques pour les réclamations.

Ajout du composant Camera

Glisser-déposer : Depuis la bibliothèque de composants (panneau de gauche), trouvez le composant "Camera" et faites-le glisser sur votre canevas.

Configuration

Sélectionnez le composant Camera sur le canevas pour accéder à ses propriétés dans le panneau Propriétés (panneau de droite).

Propriétés de base

Ces propriétés contrôlent l'étiquetage fondamental et l'identification.

• Nom API : (Texte) Un identifiant unique pour cette instance de composant (par ex. : SitePhotoCapture, EvidenceCamera).

• Libellé : (Texte, Optionnel) Un libellé affiché au-dessus ou à côté du composant, selon la variante. Exemple : "Prendre une photo du site :", "Téléverser une preuve :".

• Aide de niveau champ : (Texte, Optionnel) Texte d'aide affiché à côté du libellé.

Fonctionnalité principale

Ces paramètres définissent le fonctionnement de la caméra et la manière dont les utilisateurs interagissent avec elle.

• propriété: (Texte ou Collection de textes - Sortie) Cette propriété contient généralement le résultat de la capture.

  • Liaison de données : Vous devriez généralement lier ceci à une Variable Texte (pour une capture unique) ou à une Variable Collection de Textes (si 'Autoriser plusieurs captures' est activé).

  • Si 'Enregistrer en tant que Content Document' est activé, cette variable sera peuplée avec l'(les) ID(s) ContentDocument Salesforce de l(es) image(s) enregistrée(s) après la capture. Vous pouvez ensuite utiliser cet ID dans des interactions ultérieures (comme lier le fichier à un enregistrement).

• Afficher en tant que: (Sélection) Choisissez comment l'interface de la caméra est présentée :

  • inline : L'aperçu caméra en direct est intégré directement dans la zone du composant sur la page.

  • button : Un bouton est affiché. Cliquer sur le bouton ouvre l'interface de la caméra (souvent en plein écran ou en modal, surtout sur mobile).

• Afficher les photos capturées: (Booléen - Case à cocher) Si activé, affiche des vignettes ou des aperçus des photos prises par l'utilisateur durant la session en cours, sous la vue de la caméra ou après la capture.

• Afficher le compte à rebours: (Booléen - Case à cocher) Si activé, affiche une minuterie de compte à rebours (par ex. : 3...2...1...) avant que la photo ne soit réellement prise après que l'utilisateur ait lancé la capture.

• Durée du compte à rebours: (Nombre) Si 'Afficher le compte à rebours' est activé, spécifie la durée du compte à rebours en secondes (par ex. : 3).

Paramètres de capture multiple

Ces paramètres s'appliquent uniquement si plusieurs captures sont autorisées.

• Autoriser plusieurs captures: (Booléen - Case à cocher)

  • Coché : Les utilisateurs peuvent prendre plusieurs photos en une seule session avant de confirmer.

  • Non coché (par défaut) : Les utilisateurs ne capturent qu'une seule photo par session.

• Disposition des images: (Sélection - Si Autoriser plusieurs captures est activé) Définit la manière dont les aperçus des photos multiples capturées sont agencés (par ex. : grille, carrousel).

• Titre d'image par défaut: (Texte - Si Autoriser plusieurs captures est activé) Définit un titre de base par défaut pour les images capturées enregistrées en tant que fichiers Salesforce. Vous pouvez l'utiliser avec des formules ou des variables pour créer des noms significatifs (par ex. : "{!CaseNumber}").Preuve (Evidence)").

Sortie/Enregistrement

Ces paramètres contrôlent la manière dont les images capturées sont enregistrées dans Salesforce et liées aux enregistrements pertinents.

• Enregistrer en tant que Content Document : (Booléen - Case à cocher)

  • Activé (recommandé) : Il s'agit de la méthode la plus courante et la plus simple pour traiter les images capturées. Lorsque cela est coché, le composant enregistre automatiquement l(es) image(s) capturée(s) en tant que Fichier (ContentDocument) Salesforce enregistrements lorsque l'utilisateur confirme la capture.

  • Désactivé : Si non coché, le comportement du composant pour la sortie des données d'image peut différer (par ex. : fournir potentiellement des données Base64 via la propriété propriété). Vous seriez alors responsable de la mise en œuvre d'une logique personnalisée (probablement via un Flow ou Apex déclenché par une interaction) pour traiter manuellement les données de sortie, créer l'enregistrement Fichier Salesforce, et créer le ContentDocumentLink enregistrement nécessaire pour l'associer à un autre enregistrement. Cette approche est significativement plus complexe et généralement non recommandée sauf si vous avez des exigences précises.

• Content Document Linked Entity Id : (Texte - Apparaît et est pertinent UNIQUEMENT lorsque 'Enregistrer en tant que Content Document' est activé)

  • Objectif : Ce paramètre critique indique à Avonni à quel enregistrement Salesforce spécifique le fichier d'image nouvellement capturé doit être automatiquement lié. Il remplit le LinkedEntityId champ sur le ContentDocumentLink enregistrement de jonction que Salesforce crée.

  • Comment le définir : Vous devez fournir l'ID Salesforce de 15 ou 18 caractères de l'enregistrement auquel vous voulez lier le fichier. Utilisez l'icône du sélecteur de ressource ( ressource) à côté de la propriété pour lier cela dynamiquement. Les sources courantes et recommandées sont :(via le sélecteur de ressources) :) (Cas d'utilisation le plus courant)

    • $Component.recordId Si votre composant dynamique a son défini et est placé sur une page d'enregistrement (par ex. : une page Compte), sélectionnez Composant Objet de page cible (souvent affiché comme ). Cela lie automatiquement l'image capturée à > recordId l'enregistrement affiché sur la page. @recordIdUne ressource Variable : enregistrement en cours Sélectionnez une ressource Variable (par ex. ,

    • {!inputRecordId} ) qui contient l'ID de l'enregistrement que vous souhaitez lier. Cela est courant si le composant Camera se trouve dans une fenêtre modale ou un panneau qui a reçu un ID d'enregistrement en entrée. Un champ d'une Variable Record :Si vous avez chargé un enregistrement dans une Variable Record (par ex. ,

    • {!relatedAccount} ), vous pourriez potentiellement sélectionner son champ Id (par ex. , {!relatedAccount.Id}). Apparence avancée et comportement).

Ces propriétés permettent d'affiner l'apparence et l'état d'interaction.

: (Sélection) Contrôle la taille approximative du cadre du composant (surtout pour l'affichage 'inline') : small, medium, large, responsive.

• TailleRapport d'aspect vidéo

• : (Sélection) Définit le rapport d'aspect pour l'aperçu caméra en direct (par ex. : 1:1, 4:3, 16:9). Choisissez celui qui correspond aux orientations typiques des appareils ou au rendu souhaité.: (Sélection) Détermine comment le flux vidéo en direct s'ajuste au sein du rapport d'aspect défini (par ex. : Cover - remplit la zone, peut recadrer ; Contain - affiche l'ensemble du flux, peut afficher des bandes).

• propriétés d'ajustement du recadrageIcônes des boutons

• : (Sélecteur d'icônes) Personnalisez les icônes utilisées pour les actions standard dans le composant :Icône du bouton Capturer la photo

  • Icône du bouton Supprimer la photo

  • (Autres icônes potentielles comme changer de caméra, confirmer, etc.)

  • Libellés

• : (Champs de texte) Personnalisez les textes affichés sur les boutons ou autres éléments de l'interface caméra (par ex. : changer "Capture" en "Prendre une photo").: (Booléen - Case à cocher) Désactive l'ensemble du composant, empêchant l'interaction.

• Désactivé: (Booléen - Case à cocher) Typiquement non applicable pour la capture photo, mais peut empêcher la suppression des aperçus déjà capturés si utilisé.

• Lecture seule: (Booléen - Case à cocher) Rend la capture d'au moins une image obligatoire avant de continuer (généralement utilisé avec la validation de formulaire).

• Requis: (Booléen) Contrôle la visibilité globale du composant.

• VisibleConfiguration des interactions

Au-delà de sa fonctionnalité de capture, le composant Camera vous permet de déclencher des interactions Avonni standard basées sur des événements spécifiques, permettant des flux de travail plus dynamiques. Vous les configurez dans la

section du panneau Propriétés lorsque le composant Camera est sélectionné. Interactions À la capture d'image

Quand il se déclenche :

• Cet événement déclenche généralement après que l'utilisateur ait réussi à capturer une ou plusieurs images et confirmé l'action (par ex. : clique sur "Terminé" ou "Enregistrer" dans l'interface caméra, surtout si Enregistrer en tant que Content Document est activé). message confirmant que la (les) image(s) ont été enregistrée(s) ou sont prêtes à être liées (par ex. : "Preuve photo capturée !").

• Cas d’utilisation courants :

  • Afficher un Afficher Toast Mettre à jour la Variable Record / Exécuter un Flow :

  • Déclenchez une action pour mettre à jour un champ sur un enregistrement lié indiquant qu'une photo a été ajoutée (par ex. : définir Photo_Taken__c à true). Diriger automatiquement l'utilisateur vers un autre emplacement après une capture réussie.

  • Naviguer : (Si vous N'UTILISEZ PAS 'Enregistrer en tant que Content Document') :

  • Déclenchez une action ou Apex pour Exécuter Flow traiter et enregistrer les données d'image fournies par le composant. Lier le fichier enregistré (si nécessaire) :

  • pour créer le ou Apex pour Exécuter Flow enregistrement si vous ContentDocumentLink n'avez pas utilisé le paramètre Content Document Linked Entity Id mais avez utilisé et capturé l'ID dans le est activé). Au démarrage de la caméra propriété variable.

Cet événement se déclenche lorsque l'aperçu de la caméra devient actif (soit lorsque le composant se charge si

• Cet événement déclenche généralement inline Afficher en tant que est , soit lorsque l'utilisateur clique sur le bouton sibutton Afficher en tant que est ).).

• Cas d’utilisation courants : Généralement moins courant pour des actions significatives, mais peut être utilisé pour :

  • ou Apex pour Exécuter Flow à des fins de journalisation/audit.

  • Définir la valeur d'une variable pour suivre l'état actif de la caméra.

À l'arrêt de la caméra

• Cet événement déclenche généralement Cet événement se déclenche lorsque la vue de la caméra est fermée ou désactivée, potentiellement sans une capture réussie (par ex. : l'utilisateur clique sur un bouton 'Annuler' si disponible, ou quitte la page).

• Cas d’utilisation courants :

  • Naviguer : Renvoyer l'utilisateur à un état ou écran précédent.

  • Définir la valeur d'une variable : Mettre à jour une variable pour indiquer que la caméra n'est plus active.

Exemple

Ajouter des preuves photo à un dossier (Case)

1

Ajouter le composant Camera

Ajoutez le composant Camera au canevas.

2

Configurer la caméra

• Nom API : evidenceCamera

• Libellé : "Joindre une preuve photo"

• Afficher en tant que : ).

• Autoriser plusieurs captures : Cochée

• Enregistrer en tant que Content Document : Cochée

3

Ajouter une interaction au bouton

• Sélectionnez le evidenceCamera .

• Allez au Interactions panneau.

• Ajoutez une action à l' Quand il se déclenche : événement (ou un événement de succès similaire).

• Type d'action : Afficher Toast

• Configurer le toast : Variante success, Titre Succès, Message Photo(s) attachée(s) au dossier !.

Assurez-vous que l'option est activé). est activée (cochée) sur le composant, ET que le mais champ est défini sur l'ID de l'enregistrement courant (en le liant à $Component.recordId en utilisant le sélecteur de ressources)

Résultat : L'utilisateur clique sur "Joindre une preuve photo", prend des photos, confirme. Les photos sont enregistrées en tant que Fichiers et liés automatiquement au dossier. Un toast de succès confirme l'action.

Considérations clés

• Autorisations: Les utilisateurs ont besoin des autorisations de l'appareil pour accéder à la caméra. Ils ont aussi besoin des autorisations Salesforce pour créer des objet ContentDocument (Fichiers) et potentiellement des ContentDocumentLink enregistrements si les fichiers sont enregistrés/assignés.

• Mobile d'abord: Bien que fonctionnel sur des ordinateurs de bureau avec webcams, l'expérience utilisateur est généralement optimisée pour l'application mobile Salesforce ou les navigateurs mobiles.

• est activé).: Activer ceci est le moyen le plus simple de persister les images dans Salesforce. Si désactivé, la gestion des données de sortie nécessite une logique personnalisée (Flow/Apex).

• Connexion réseau: Requise pour enregistrer des fichiers dans Salesforce. Envisagez des capacités hors ligne si nécessaire (cela peut nécessiter des solutions différentes).

• Limites de stockage: Faites attention aux limites de stockage de fichiers Salesforce.

En résumé

Le composant Avonni Camera propose une solution intégrée et sans code pour capturer des images directement depuis votre interface Salesforce sur les pages Lightning, rationalisant les flux de travail pour le service sur site, les inspections, la collecte de preuves, et plus encore, particulièrement dans les cas d'utilisation mobile.