Power Platform - Apps - Automate - SharePoint

Power Platform  - Apps - Automate - SharePoint

Exos

Exo03 | Créer des applications dans Teams

Scénario

Il n'est pas rare que les organisations accumulent des périphériques informatiques, des cordons d'alimentation et d'autres appareils électroniques inutilisés. Votre organisation prend des mesures pour réutiliser les appareils et les périphériques informatiques existants avant de commander de nouveaux équipements.

Vous êtes invité à créer une application où les utilisateurs peuvent publier des appareils dont ils n'ont plus besoin et parcourir ce que leurs collègues ont publié.

Exigences

1. L'application doit utiliser Dataverse pour Teams.

2. Les utilisateurs doivent être en mesure de créer de nouveaux éléments (périphériques informatiques), de modifier les éléments qu'ils ont créés et de voir les éléments créés par d'autres utilisateurs.

3. Les éléments doivent être retirés de la liste s'ils ne sont plus disponibles.

4. Autoriser les utilisateurs à réserver un article.

5. Permet à l'utilisateur de marquer l'article pour le ramassage.

6. Si l'article est réservé, seul l'utilisateur réservé doit être en mesure de marquer l'article ramassé.

7. Les utilisateurs doivent être en mesure de rechercher des éléments.

Ce que vous apprendrez

1. Comment créer une application à l’aide de Dataverse for Teams.

2. Comment publier une application.

3. Comment accorder à d’autres utilisateurs l’autorisation d’accéder à votre application.

Ressources à télécharger

Le fichier Excel :

Recycle.xlsx

10 kB

⁠

Les images :

pl_100_images.zip

18.5 MB

⁠

Étapes détaillées

Exercice 1 : Prise en main de Microsoft Dataverse for Teams

Dans cet exercice, vous allez créer une équipe et installer Power Apps for Teams.

Tâche 1 : Créer une équipe

Dans cette tâche, vous allez créer une nouvelle équipe.

1. Accédez à

Microsoft Teams⁠

(https://teams.microsoft.com/).

2. Sélectionner Équipes, passez la souris sur Créer une équipe et sélectionner le bouton Créer une équipe.

⁠

3. Sélectionner À partir de zéro.

4. Sélectionner publique.

5. Entrer Green pour Nom de l’équipe et sélectionner Créer.

6. Sélectionner Ignorer dans l’écran Ajouter des membres à Green.

7. Vous devriez maintenant avoir une nouvelle équipe nommée Green.

⁠

8. Ne quittez pas cette page.

Tâche 2 : Installer Power Apps

Dans cette tâche, vous allez installer Power Apps for Teams.

1. Sélectionner... Obtenir plus d’applications, recherchez Power Apps et sélectionner Power Apps.

⁠

2. Sélectionner Ajouter puis Ajouter.

3. Cliquer avec le bouton droit sur l’onglet Power Apps et sélectionner Épingler.

⁠

Exercice 2 : Créer une application

Dans cet exercice, vous allez configurer Dataverse for Teams en créant une application et vous allez également créer une table Dataverse avec des colonnes.

Tâche 1 : Créer une application

Dans cette tâche, vous allez configurer Dataverse for Teams en créant une application.

1. Accédez à

Microsoft Teams⁠

(https://teams.microsoft.com/)

2. Sélectionner Power Apps et sélectionner Démarrer maintenant.

⁠

3. Sélectionner l’équipe Green que vous avez créée et sélectionner Créer.

4. Attendez que l’approvisionnement soit terminé.

5. Entrer Upcycle pour le nom de l’application et sélectionner Enregistrer :

⁠

6. Ne quittez pas cette page.

Tâche 2 : Créer une table

Dans cette tâche, vous allez créer une table et des colonnes.

1. Sélectionner Avec données, puis Créer une nouvelle table.

⁠

2. Sélectionnez Démarrer avec une table vierge :

⁠

3. Cliquer sur Modifier les propriétés de table :

⁠

4. Entrer Gadget pour Nom de la table et sélectionner Créer :

⁠

5. Cliquer sur la colonne Nouvelle colonne puis Modifier la colonne.

6. Entrez Nom dans le champ Nom d'affichage, puis sélectionnez Mettre à jour.

7. Sélectionner + (Nouvelle colonne).

8. Entrer Description pour Nom complet, sélectionner Une seule ligne de texte pour Type de données et sélectionner Enregistrer.

9. Sélectionner à nouveau + Nouvelle colonne.

10. Entrer Disponibilité pour Nom, sélectionner Option > Option pour le Type données.

11. Entrer Disponibilité pour Nom complet.

12. Entrer Disponible pour le premier choix et sélectionner + Nouveau choix.

13. Entrer Réservé pour le deuxième choix et sélectionner + Nouveau choix.

14. Entrer Récupéré pour le troisième choix et sélectionner Enregistrer :

⁠

15. Sélectionner Disponible pour le Choix par défaut et Sélectionner Enregistrer.

16. Sélectionner + (Nouvelle colonne).

17. Saisir Emplacement pour le Nom complet, sélectionner Texte pour le Type de données, cocher Obligatoire et cliquer sur Enregistrer :

18. Cliquer sur + (Nouvelle colonne)

19. Saisir Photo pour le Nom complet, sélectionner Fichier > Image pour le Type de données, cocher la case Image principale et cliquer sur Enregistrer.

20. Cliquer sur + (Nouvelle colonne)

21. Saisir Réservé par pour le Nom complet, sélectionner Recherche pour le Type de données, sélectionner User pour la Table associée et cliquer sur Enregistrer :

⁠

22. Votre écran de table devrait maintenant ressembler à l’image ci-dessous.

⁠

23. Fermez l’éditeur de tableau en sélectionnant le bouton Enregistrer et fermer.

24. Ne quittez pas cette page.

Tâche 3 : Modifier l’application

Dans cette tâche, vous allez modifier l’application à l’aide de filtres pour les gadgets disponibles et modifier le formulaire.

REMARQUE Si Power Apps Studio n'est pas ouvert à partir de la dernière étape, accédez à l'application Power Apps, sélectionnez l'onglet Accueil et ouvrez l'application Upcycle que vous avez créée.

1. Sélectionner Screen1. Si l’écran contient déjà le formulaire, passez à l’étape suivante, sinon sélectionner Avec des données et sélectionner Table Gadgets sous Environnement actuel. Cela créera les éléments de l’écran, y compris le formulaire.

2. Assurez-vous que RightContainer1 est développé et sélectionner le contrôle EditForm1 dans l’arborescence.

⁠

3. Accédez au volet Propriétés (à droite) et sélectionner X champs sélectionnés (ou Modifier les champs).

⁠

4. Sélectionner le bouton + Ajouter un champ.

5. Si l’un des champs ci-dessous n’existe pas sur le contrôle EditForm, sélectionner le bouton + Ajouter un champ, sélectionner le champ manquant et sélectionner Ajouter :

Nom

Description

Disponibilité

Emplacement

Réservé par

Photo

6. Supprimez tous les champs supplémentaires et fermez le volet Champs. Votre formulaire ne doit comporter que les colonnes Nom, Description, Disponibilité, Emplacement, Réservé par et Photo.

7. Mettre 1 à Colonnes.

⁠

8. Sélectionner Photo_DataCard1 à l’intérieur de la zone de travail et définissez Largeur sur 400.

⁠

9. Développez le formulaire et sélectionner la carte Réservé par_DataCard1.

⁠

10. Accédez au volet Propriétés, sélectionner l’onglet Avancé, puis sélectionner Déverrouiller.

⁠

11. Recherchez la propriété DisplayMode et remplacez la valeur Parent.DisplayMode par DisplayMode.View.

12. Sélectionner la galerie BrowseGallery1 sous LeftContainer dans l’arborescence.

13. Sélectionner Items dans la barre de formule et remplacez la valeur par la formule ci-dessous. Cette formule filtrera les gadgets pour afficher uniquement les gadgets disponibles.

Filter(Gadget; Disponibilité <> 'Disponibilité (Gadget)'.'Récupéré')

14. Sélectionner Image1 dans la galerie.

⁠

15. Accédez à la barre de formule et vérifiez que la valeur de la propriété Image est définie sur la formule ci-dessous.

ThisItem.Photo

16. Sélectionner l’onglet Données (icône en forme de base de données) dans le volet de navigation de gauche, sélectionner le bouton ... Autres d’actions de la source Gadgets et sélectionner Actualiser.

⁠

17. Sélectionner Enregistrer (en haut à droite) et attendez que l’application soit enregistrée :

⁠

18. Sélectionner Afficher un aperçu de l’application :

⁠

19. Sélectionner + Nouvel enregistrement.

⁠

20. Remplissez le formulaire et sélectionner Appuyer ou cliquer pour ajouter une image.

21. Fournissez votre propre photo ou choisissez-en une dans le dossier Ressources du laboratoire :

⁠

22. Sélectionner Enregistrer :

23. Ajouter quelques nouveaux enregistrements.

Nom

Description

Disponibilité

Emplacement

Photo

Clavier

Clavier sans fil

Disponible

Bureau D30

Keyboard.jpg

Souris

Souris dans fil

Disponible

Bureau A05

Mouse.jpg

Ecouteurs

Ecouteurs sans fil

Disponible

Bureau B15

Earbuds.jpg

Cable réseau noir

Cable réseau noir de 1 m

Disponible

Bureau D50

Black Network Cable.jpg

Cable réseau bleu

Cable réseau bleu de 1 m

Disponible

Bureau B16

Blue Network Cable.jpg

Cable chargeur téléphone

Cable chargeur téléphone 40 cm

Disponible

Bureau C20

Phone Charger Cable.jpg

Cable d’alimentation

Cable d’alimentation 3 m

Disponible

Bureau C21

Power cord.jpg

There are no rows in this table

⁠

24. Votre application doit maintenant ressembler à l’image ci-dessous. Fermez l’aperçu.

⁠

25. Sélectionner le X pour fermer l’application.

Tâche 4 : Mettre à jour les lignes Dataverse

Dans cette tâche, vous ajouterez des boutons qui permettront aux utilisateurs de réserver et / ou de ramasser l’élément, vous mettrez également à jour les lignes dans Dataverse comme réservées ou récupérées.

1. Depuis la vue Arborescence, sélectionner App et affectez à la propriété OnStart la formule ci-dessous. Cette formule crée une variable nommée CurrentUser et définit sa valeur sur le premier utilisateur qui correspond à l’adresse e-mail de l’utilisateur connecté.

⁠

Set(CurrentUser; First(Filter(Utilisateurs;'Adresse de messagerie principale'=User().Email)))

Set(CurrentUser; First(Filter(Users; 'Primary Email'=User().Email)))

⁠

2. Sélectionner App, sélectionner … et sélectionner Exécuter OnStart.

3. Sélectionner le RightContainer1.

⁠

4. Sélectionner le bouton + (Insérer), puis sélectionner Bouton.

⁠

5. Sélectionner l’arborescence, double-cliquer sur le bouton que vous venez d’ajouter et renommez-le Bouton de réserve.

⁠

6. Définissez la propriété Texte du Bouton de réserve sur Réserver.

7. Déplacez le bouton Réserver et placez-le à côté de l’image du gadget.

⁠

8. Affectez à la propriété DisplayMode du bouton de réserve la formule ci-dessous. Cette formule désactive le bouton si l’élément sélectionné n’est pas disponible.

If(BrowseGallery1.Selected.Disponibilité = 'Disponibilité (Gadgets)'.Disponible; DisplayMode.Edit; DisplayMode.Disabled)

9. Affectez à la propriété OnSelect du bouton de réserve la formule ci-dessous. Cette formule met à jour l’enregistrement sélectionné en définissant la valeur réservée par à l’utilisateur actuel et la valeur de disponibilité sur réservé.

Patch(Gadgets; BrowseGallery1.Selected; {Disponibilité: 'Disponibilité (Gadgets)'.Réservé; 'Réservé par': CurrentUser})

10. Définissez la propriété Visible du bouton de réserve sur la formule ci-dessous. Cette formule masque le bouton si l’utilisateur crée un nouvel enregistrement.

If(EditForm1.Mode = FormMode.View; true; false)

11. Sélectionner à nouveau le RightContainer1.

12. Sélectionner le bouton + Insérer, puis sélectionner à nouveau Bouton.

13. Sélectionner l’arborescence, double-cliquer sur le bouton que vous venez d’ajouter et renommez-le en Récupéré.

14. Définissez la propriété Texte du bouton sur Récupéré.

15. Ajustez la propriété Largeur sur 150 et déplacez le bouton Récupéré et placez-le à droite du bouton de réservation.

⁠

16. Définissez la valeur DisplayMode du bouton Récupéré sur la formule ci-dessous. Cette formule désactive le bouton si l’élément sélectionné est réservé et que l’utilisateur réservé n’est pas l’utilisateur actuel.

If(BrowseGallery1.Selected.Disponibilité = 'Disponibilité (Gadgets)'.Réservé And BrowseGallery1.Selected.'Réservé par'.'Adresse de messagerie principale' <> CurrentUser.'Adresse de messagerie principale'; DisplayMode.Disabled; DisplayMode.Edit)

17. Définissez la valeur OnSelect du bouton Récupéré sur la formule ci-dessous. Cette formule met à jour l’enregistrement sélectionné en définissant la valeur réservée par à l’utilisateur actuel et la valeur de disponibilité à ramasser. La deuxième formule sélectionnera le premier élément de la galerie.

Patch(Gadgets;BrowseGallery1.Selected;{Disponibilité:'Disponibilité (Gadgets)'.Récupéré;'Réservé par':CurrentUser});;Select(BrowseGallery1;1)

18. Définissez la valeur Visible du bouton Récupéré sur la formule ci-dessous. Cette formule masque le bouton si l’utilisateur crée un nouvel enregistrement.

If(EditForm1.Mode = FormMode.View; true; false)

19. Sélectionner Enregistrer pour enregistrer vos modifications.

20. Ne quittez pas cette page.