Create an Expense Receipt Template for Security Effortlessly

Expense receipt template for Security

[Music] so this is the demo of the expense reporting solution i am logged in with the user who is a contributor in this application the first screen is the home screen that showcases the user all their expenses in the system right on the top the user can see the status of all the expenses that they have submitted as part of this application currently this user only has one expense and that expense two is approved right here at the bottom there are different filters that the user can select from they can see all their expenses that are currently open that is in draft status they haven't yet submitted it for review pending means the process is currently in review approved is if the approver has approved it reject it if it has been rejected and all basically showcases all the respective expenses that the user has submitted now there are certain filters here that the user can also leverage if they would like to filter and see the expenses that fall in a specific date range they can go ahead and select that at the same time they can also sort the expenses by the date next i will go ahead and create a new expense in this application i will go ahead and give this expense a name i will pick the start date and end date associated with this expense and then i will pick the cost center associated with this expense you can create multiple cost centers in the backend tables that i will showcase and provide comments for the approver once you're done with filling all the information associated with the expense form just go ahead and click on create this will create an expense in the database now because this expense is currently in the status open the user can go ahead and make changes to it so if there are any edits that need to be made that can be done there is also an id associated with the expense they can also go ahead and delete the expense if the expense is deleted all the line items associated with the expense will also be deleted i have currently not added any line items if i go back to the home screen now if i head over to the open status will show me this expense currently which is open showing zero dollars because i have not added any line items next i will go ahead and start adding line items to this expense i'm going to click on plus now right here we are leveraging the new receipt scanning component which is a part of ai builder this component is currently in preview this component is being leveraged as part of the solution and the advantage of this is if i go ahead and if i upload a receipt associated with my expense the receipt scanning component will come alive and it will start scanning the data points out of this receipt in this scenario i'm just capturing the merchant name the total of my receipt as well as the transaction date this uses ai builder now i can go ahead and also scan another receipt or update this receipt if required and then i can go ahead and pick my receipt category i'll pick food and beverage i'm going to say lunch with customer and once i've completed all the details i can either go ahead and save this or save and add another line item if required in this case i'm going to do that and this will again open up another line item form so i'm going to go ahead once again scan another receipt provide my category and notice how ai builder once again pulls all the details out for me from this receipt that i just uploaded and this time i'll click on save this takes me now back to the main expense and i can see all the line items that i have added i can click on this attachment icon and i can see the expense that the user has uploaded i can do the same for every line item i can delete the line items i can even go and make modifications to the line items once again if i delete the expense all the associated line items will also be deleted because they are related to the main expense once the user is ready with all the information the user can go ahead and click on submit which will begin the approval process the approvers are dynamically defined at the back end table based on the cost center the cost center in this case is microsoft and the approver is reza this user is james so i'm going to click on submit and notice the moment i click on submit the status changes to pending and if i click on the expense now i cannot make any modifications to this expense although i can go ahead and see the details of the expense as well as i can click on the individual line items and see the information that was submitted now signing in as the approver associated with the cost center as you can see i am receiving an email notification for the approval and right here are the details of the approval and when i select this link it will directly open the expense app and not just that it will also deep link directly to the expense that the user had submitted i can see the details associated with the expense and i can also go ahead and look at the individual line item details now as the approver i can go ahead and either approve this or eject this directly from my email because i'm using the power automate approval action now the beauty of this action is you can approve or reject through emails or you can even approve or reject through the mobile app if you have the power automate mobile app installed you can also approve a reject directly from the approval dashboard or if you're a user who works in teams we can also modify the flow to post the approval information as an adaptive card to teams now the next video series that i will be working on will cover approvals exclusively in flow so all those scenarios will be covered there so please do watch out for the new approval series that's coming shortly now in this scenario i'm just going to approve it directly from the email i'm going to say all good and click on submit directly from the email i'm taking the approval action as the approver now once i take this action of course the user will get notified that the approval process is complete and the approver has approved it and now back as the user persona if i just refresh my app or if i would have reopened the app of course the data connectors would be refreshed change the status to approved right here i can see my meeting with client b which is approved and if i click on this i can look at my commands i was the requester and the approver said all good i have all the information right here now this entire solution is available for you to download and leverage now as part of the solution package we have all these components i just want to cover a few important topics here first thing is we have two security rules we have contributors and approvers contributors will be able to contribute in the application approvers can also contribute however they are like the admins of the application and the users that you define as the approvers in the cost center table need to have the approver's role assigned we have the flow that handles the approval process let's look at the flow this flow gets triggered when a new record is created or updated in the expenses entity right here we have the link to the app and here we are going ahead and starting the approval process once we begin with the approval process once the approver takes the decision we are checking to see the outcome of the decision if the outcome is approved we are going ahead and updating the status to approved and also sending an email back to the requester specifying that their expense report has been approved if it has been rejected we are setting the status to reject it and we are sending the email to the requester that their approval process has been rejected now if you have a system of record that you would like to integrate right here and go ahead and provide additional data points into that system of record once this process completes you can go ahead and do that because you have complete control over this flow now as part of the tables associated with this solution there are three main entities the first entity is the expenses entity we are using the common data service as the database here cds is a premium component so definitely we would need the premium licensing in this scenario however with the announcement of cds for teams which enables you to get cds within teams and not just that all of that is provided at no premium licensing cost for you so you can actually leverage this solution in cds for teams and you would not need to incur any premium licensing costs now let's look at the tables or the entities in action the first entity here is the expenses entity so let's check this out so in the expenses entity if i just go ahead and change the view to custom these are the main columns associated with the expense entity we have the approver name this gets picked dynamically based on the cost center that you select we have comments which is a text area we have the cost center which is a lookup this is a relational database system that we are leveraging right here cds at the same time we have the submitted date we have the start date and the end date that the user enters we have the status of the expense which is approved or rejected or pending and this is coming from an option set we have the id of the expense that gets generated automatically that's an order number and the name which is the primary field is the name of the expense the next entity we're going to look at is the line items entity now there is a relationship between the expenses entity and the line items entity of course one expense can be related with multiple line items cds is relational so we are leveraging its full capabilities right here now in terms of the line items entity we have the category the cost the date the description and right here is that relationship to the expenses entity we have the name which is the name of the line item and right here we are using a new data type in cds known as image which stores the image of the receipt that the user had uploaded the third entity is the cost center entity the cost center entity basically has the name of the cost center and the approver which is the email address that you need to provide so you can create multiple cost centers that will show up in the form directly as well as dynamically the approvers will be picked up from the cost center information that you provide in this entity there are a few option sets as well the expand status which is the statuses that you see in the system and the categories are the categories that the user picks and the line items food and beverage and so and so forth and now we will explore the canvas app now inside the canvas application i will just cover the main core components we have the main gallery right here which is known as the expenses gallery and this will list out all the expenses based on the current logged in user only and as you can see right here i'm filtering the expenses entity where the start date and end date are in a defined time range those are the filters that the user picks in the application and those are picked right here i can go to filter and define my start date and end date range so i can only see expenses related to that date range that i have specified and then i'm going ahead and getting all the expenses based on the status that is stored in a variable called expense status now the buttons that you see right here as the user picks these we are just setting that variable to the respective expense status on start of this app we also have a couple of variables that we are setting which is that same expense start date and end date so by default when the user logs in they will see expenses that which have a start date seven months before today and end date which is 14 days from today so if you would like to customize that you can go ahead and make the changes right here also in the app on start we have the deep linking logic right here where the expense id is passed from the approval scenario so when the approver clicks on the link to the expense this is how the deep linking takes place that parameter known as expense id is passed it's read right here we have the main report screen that shows the details about the expense and these are the line items and this gallery is getting the information from the line items entity based on the expense that has currently been selected so these were some of the major components of this canvas app so for deploying the solution into your environment head over to make.powerapps.com and in your environment head over to solutions the next step is going to be to import the solution file that is provided in the description of this video and there is a link to my github repo which has the solution go ahead and import the solution file so once you've downloaded the solution and once you go to import go ahead and choose that file that you have downloaded once you select the solution file go ahead and click on next once the solution information is provided once again go ahead and select next and then click on import this will go ahead and import all the customizations that have been provided as part of the solution package this will include the cds entities the security rules the option sets this will also include the canvas app as well as the supporting flow the solution has been provided as an unmanaged solution so that you can make changes to the solution once you have imported it once the solution import is completed go ahead and click on publish all customizations once done click on close you should now see the expense reporting solution once you click on this this will showcase all the components as part of this expense report solution i will go ahead and sort this based on type we have the expenses canvas app we have the three main entities expenses the associated line items and the cost center information we have the expense report flow we have a couple of supporting option sets and a couple of security rules the expense contributors as well as the expense approvers or the admins of this application to turn on the flow associated with the solution as you can see the flow is turned off by default so go ahead and click on edit this will take you to the flow and all you have to do here is just provide the connection information next click on save once the flow is saved hit the back button and back to the flow details page go ahead and turn on the flow close the browser tab and click on done make sure that the status of the flow is now turned on the next step is we need to provide the url of the app inside the flow so in order to get the url of the canvas app once again in the context of the solution go to details associated with the canvas app and copy the web link associated with your app that has been deployed as part of the solution go back to the expense reporting solution go back to the flow and click edit inside the flow we have a variable called app link go ahead and include the web link that you copied on the previous screen right here click on save once saved close the browser tab and once again click done next step is to provide the cost center information so as you can see the cost center entity is right here click on this head over to the data tab and click on add record cost center is a mandatory field in the current solution so we need to provide at least one constant enter information provide the name of your cost center which is going to provide microsoft in my case and also provide the approver email once you're done you can click on save and close click on refresh data to ensure that your data has been recorded if you would like to look at all the fields just go ahead and change the view to all fields to look at all the information if you need additional cost centers go ahead and add them right here and dynamically define your approvals as well this now completes the setup now all we have to do is go ahead and share the canvas app in the canvas app go ahead and click on share i will pick the user james taylor and now for this user i'm going to go ahead and grant the user the expense contributors row there are two security rules associated with this solution contributors are users who can contribute to the expense report application they can only see their own content expense approvers are like the admins of the application they are defined in the cost center entity so you need to ensure that all your approvers or admins have the expense approvals role in this scenario james taylor is a user who is going to contribute to the application so i'm just going to grant the expense contributors role at the same time because the solution leverages the receipt scanning component of ai builder there are specific entities that the user would need access to so at the minimum you need to also ensure that the user has the common data service user role so two roles i've provided here expense contributors and common data service user i will go ahead and click on share of course i have the send an email invitation to new users on so this user will also receive an email invitation if you don't want that to go out just turn this off if you want to define your admins you can go ahead and select the user and then go ahead and make sure that that user has the respective rules in this case i have a user called sarah tabor and she already has the expense approvers and the expense contributors role assigned and also the common data service user and i can of course go ahead and use this user as one of the approvers in the call center i have a video that exclusively talks about sharing apps i will paste the link to that video in the description of this video so do check that out i am gonna go ahead and log in with the user persona james taylor who is a contributor in the system now logging into powerapps with a different user persona this is james taylor and when james taylor heads over to the apps you should see the expense report app and when i click on this app this should launch the expense report app for me of course it's the first time so it's going to ask me to sign in this takes the user to the expense app this is a clean system so there is nothing in the system for the user so the user is going to go ahead and create an expense i'm going to go ahead and call this meeting with client a and provide the details associated with my expense report i'm going to pick the cost center and this cost center is coming from the cost center information that i provided in the cost center entity if you had multiple records in the course center entity they will all line up right here once i provide all the information i'm going to go ahead and click create so this will go ahead and create the expense report next i will go ahead and start adding the line items now right here i have the scan receipt option so i'm going to click on this and upload a receipt the receipt scanning component should kick in and it should provide me the information related to the name of the merchant the total cost as well as the transaction date the categories are coming from the option set value that you can modify in this scenario just going to go ahead and pick food and beverage and provide some description and once i'm done with this i'm going to click on save of course i can keep adding additional information and once i am ready to submit this for the review process i'm going to click on submit this now moves this expense report into the pending status and the approval that i defined in the call center entity should get an approval notification so here's the approval for the cost center approver i will just go ahead and in this scenario i can see all the details right here i can even click and this should deep link directly into the application for me just going to go ahead and approve this and back as the user james as you can see the expense report now shows us approved so that's how you can set up the solution now one more thing that i would like to cover here is receipt scanning is currently a preview feature and when it will go out of preview ai builder is a premium feature so that means you would need premium licensing now i did speak about cds for teams coming up and in that sense you don't need to pay premium licensing for cds as well as this solution however receipt scanning would still be a premium feature now if you do not want to utilize that as part of the solution you can actually go and turn that off as well i'll show you how you can do that so in this scenario i already have an open an open expense i'll go ahead and add a line item here now this is where that receipt scanning component shows up now these are the steps that you need to take if you do not want to leverage the new receipt scanning feature first thing is we will go ahead and we have this group pop-up receipt just go ahead and delete this that's step number one step number two on the new line item screen go ahead over to the on visible property and right here we have this logic that has been defined we're just going to go right here and remove everything and just keep the reset form let's remove everything right here and just keep reset form that's it now once i've made this change the next step is i will go ahead and select the line item form go to edit fields add and add the receipt image field and that's the receipt image field that comes right here at the bottom now go back to the custom receipt card that's already available that has the receipt scanning component in it and go ahead and delete that card now select the new card that you added and place it and then you will have certain errors that we will have to fix first thing is these three data cards that we're getting data from that receipt scanning component will now error out so let's go to through each one of these and just go ahead and set the default property to the default value of the field so for the name it's this item dot name for the total data card if you look at the error just need to remove all of this and keep it this item dot cost for the transaction date it is this item dot date and once you've made these modifications we have a couple of errors at the bottom so let's go and look at these the first thing is for the save and add new item action all we need to do is just let this be all the errors should go away now if i play this app this time when i click on this it's going to ask me to upload the receipt now if you don't like the naming right here it says tap or click to add a picture you can just go here and say upload the receipt or change the receipt now as part of this control that comes in it has the add picture control right here as you can see and it also has the image now the image overlaps this control so if i click on this and upload a receipt you will notice that it sits right in the button sits right in front of this now if you would like to change that this is the image right which is sitting right behind you can move this thing the way you like it and also you can also change the position of the button so you feel free to make changes based on your use case i'm just going to keep it the way it is here's my receipt that i added of course this time receipt scanning is not going to kick in so i have to manually add the data i say sample merchant and once i fill out the details i'm going to click on save this should go ahead and post the data to the line item associated with the expense and as you can see it's exactly done that all the other features should work as is right here and this time if i want to modify this if i go to edit notice i can go here and even change the picture if i need to that is change the receipt you can modify the receipt go back and forth update this add another item if required and once you're done with this you can go ahead and submit this for approval so this was the expense report power platform solution as you can see it leverages the full power of the power platform is leveraging canvas apps is leveraging the data layer which is the common data service it's also leveraging ai builder receipt scanning component and it is also leveraging flow for automating the approval process thank you so much for watching do like comment and please please subscribe to my youtube channel