Lab 5: Power Pages. Build a portal for a Vet practice appointments

Setup

​​​​1. Register for the lab and receive your credentials at https://www.power-labs.org/access/. Use the "Event code" provided by the lab facilitator. Make sure you are familiar with the Terms of Use and Privacy Policy of PowerLabs.
2. Log in to https://make.powerpages.microsoft.com/ using the credentials received in email. These credentials will last 10 days.
3. Make sure that the environment selected is as the login you received (e.g. "Black Tulip"). It should NOT be "PowerLabs (default)"
4. Download the solution file: "https://www.power-labs.org/VetCRM_solution.zip"

Create Power Pages website

​1. Go to https://make.powerpages.microsoft.com/ and select "Start from blank" to create a new Power Pages website.
2. After the site is created and Power Pages Studio is open, in the "Pages" section on the "Home" page selected:
   a. Add a section with 2 columns
   b. Add heading text with a "Welcome" message . Set the text style to "Heading 1".
   c. Add description text of your liking. Try using Copilot generated text!
   d. On the other column add and Image element and select an existing image (the Cat with PC) or upload your own.
3. Select "Styling" on the left menu and choose a colour theme of your liking.
4. Click "Preview" and select "Desktop" to see the changes you made.

Add "My pets" page and login

1. In the Power Pages Studio, in the "Pages" section click "+ Page" to add a new page:
   a. Name: "My pets"
   b. Standard layouts: "Start from blank"
   c. Click "Add" to add the page.
2. On the submenu of the page, select "Page settings" to set permissions for accessing the page:
   a. On the Permissions tab of the window select "I want to choose who can see this page" and select "Authenticated users"
   b. Click "OK" to save
3. Add a text section with text "My pets" and "Heading 1" style. This is the heading for the page.
4. Click Preview and see that you are directed to login page instead, as expected.
5. Select "Azure AD" as the login method and when/if a window pops up asking for permissions, allow sharing.
6. You may land on the "Profile" page. Select "My pets" from the top navigation. The page is empty as we don’t have data yet!
7. (Optional) Log out as a website user and see that the page "My pets" is not visible anymore. Log back in to continue with the next step.

Import the Vet Practice Power App and create records

​1. In a new browser tab, go to https://make.powerapps.com/
2. Go to the "Solutions" section in the list on the left and click "Import solution" at the top menu:
   a. Select the downloaded solution file "VetCRM_solution.zip" and click "Next", then "Import"
   b. After the solution imported, click "Publish All Customizations" at the top.
3. Go to the "Apps" section on left and find the "Vet CRM" app. In the vertical 3-dots menu select "Play" to launch the app.
4. Add 2 new Pets of your choice, e.g. a fish and a cat. Give them a name, select a date of birth and set the "Customer" to the name of your user, e.g. "Black Tulip". Don’t forget to click "Save" 

Add Pets list to My pets page

​1. Go back to the tab with the Power Pages Studio and select "My pets" page in the menu.
2. Under the "My pets" text line find the "+" sign to add a "List" component.
3. Select "+ New List" and set:
   a. Choose a table: "Pet Animals"
   b. Select the data views: "Active Pet Animals"
4. When added to the page, see the "+ New Permission" message and click on it to set the Table permissions:
   a. Name: "Active Pet Animals"
   b. Table: "Pet Animals"
   c. Access type: "Global Access"
   d. Permission to: Read, Append, Append to.
   e. Add roles - select "Authenticated Users" web role
   f. Click "Save"
5. Preview the page and see the list of pet animals you created earlier!

Add "Book an appointment" page

​1. In the Power Pages Studio, Pages section, add a new page "Book an appointment"
2. For the new page set permissions to "Authenticated Users"
3. On the page layout, add a text section with text "New appointment" and "Heading 1" style. This is the heading for the page.
4. Add a "Form" component to the page, select "New form":
   a. Choose a table : "Vet Appointments"
   b. Select a form: "Information"
   c. On the Data section select "Creates a new record"
   d. On the CAPTCHA section unselect both Captcha options
   e. Save the new form.
5. In the "Security" section of the Design Studio, select "Table Permissions" and add a new permission:
   a. Name: "Vet Appointments"
   b. Table: "Vet Appointments"
   c. Access type: "Global Access"
   d. Permission to: Read, Create, Delete, Append, Append to.
   e. Add roles - select "Authenticated Users" web role
   f. Click "Save"
6. (Optional) Add a button element on the Home page with title "Make an appointment" and set it to navigate to the page "Make an appointment"

Add "My appointments" page

​1. In the Power Pages Studio, Pages section, add a new page "My appointments"
2. For the new page set permissions to "Authenticated Users"
3. On the page layout, add a text section with text "My appointments" and "Heading 1" style.
4. Add a "List" component and set it's properties:
   a. Table name: "Vet Appointments"
   b. Data view "Active Vet Appointments"
   c. On the "Actions" table select "Create a new record" and set:
       i. Target type: "Form"
       ii. Form: "Vet Appointments" (or how was named on the steps above).
       iii. Display label: "New appointment"
5. Preview the page and check the appointments added appear on the page.

Record level security

​1. Go to the Power App and add another Contact (e.g. "Cruella de Vil")
2. Add another Pet who belongs to that owner, e.g. a dog named "Pongo" and select the Customer as "Cruella del Vil"
3. Go back to the Portal and see that you can see Pongo in the list of the Pets. This is not your dog, you should not see it! Let's fix it.
4. Go to the "Security" section of the Power Pages Studio and edit the existing Table Permission for "Pet Animals":
   a. Access Type: Contact
   b. Relationship: "pwl_petanimals_Customer_contact"
   c. Leave the rest unchanged and save it.
5. (Optional) Create a Child permission to show appointments for the pet the customer owns. Click "Add a child permission" on the "Active Pet Animals" and set:
   a. Name: "Pet Appointments"
   b. Table: "Vet Appointments"
   c. Relationship: select the one is there
   d. Permission to: Read, Create, Delete, Append, Append to.
   e. Add roles - select "Authenticated Users" web role
   f. Click "Save"
   g. Deactivate previously created "Vet appointments" table permission.
6. Go to the "My pets" page, reload it and see that there is no longer "Pongo" there.

(Optional) Manage Pets from the portal

As additional exercise you may want to implement the capability to add, delete and edit pets information from the portal for a logged in user. You should know by now how to do it, but in a nutshell:
  • Add new forms for adding a new and editing and existing pet information.
  • Add Actions to the pets list pointing the these forms.
  • Don’t forget to update the permissions to create, update and delete in the My pets permissions record!

(Optional) Redesign Home page with Copilot AI

​   • In the top right corner, click the Copilot icon and enter a prompt "Design a home page for a vet clinic." and review the results!