{"id":33504,"date":"2022-12-27T16:15:22","date_gmt":"2022-12-27T10:45:22","guid":{"rendered":"https:\/\/www.inogic.com\/blog\/?p=33504"},"modified":"2023-01-13T12:56:18","modified_gmt":"2023-01-13T07:26:18","slug":"how-to-modify-the-oob-field-service-technician-service-report-using-pcf-control","status":"publish","type":"post","link":"https:\/\/www.inogic.com\/blog\/2022\/12\/how-to-modify-the-oob-field-service-technician-service-report-using-pcf-control\/","title":{"rendered":"How to modify the OOB Field Service technician service Report using PCF control"},"content":{"rendered":"<p>Recently we had a requirement from one of our clients for incorporating the customization in the OOB Field service technician service report in the field service mobile and web app. Microsoft <a href=\"https:\/\/aka.ms\/fsmreporting-solution\" target=\"_blank\" rel=\"noopener\">Field Service Reporting<\/a> is a managed solution that can be installed in the environment.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33525\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/1OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"1169\" height=\"567\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/1OOB-field-service.jpeg 1169w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/1OOB-field-service-300x146.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/1OOB-field-service-1024x497.jpeg 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/1OOB-field-service-768x373.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/1OOB-field-service-660x320.jpeg 660w\" sizes=\"(max-width: 1169px) 100vw, 1169px\" \/><\/p>\n<p>Once you install the solution, the Report will appear on the Booking entity but if you are unable to see the report then you need to make sure the following two configurations are in place:<\/p>\n<p>1. Make sure that the logged-in user is having \u201c<strong>Field Service \u2013 Resource\u201d<\/strong> security role<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33524\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/2OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"485\" height=\"353\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/2OOB-field-service.jpeg 485w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/2OOB-field-service-300x218.jpeg 300w\" sizes=\"(max-width: 485px) 100vw, 485px\" \/><\/p>\n<p>2. In the field service mobile app, make sure that the below two forms are added to your app.<\/p>\n<ul>\n<li><strong>Reporting<\/strong><\/li>\n<li><strong>Booking and Work Order<\/strong><\/li>\n<\/ul>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33523\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/3OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"333\" height=\"421\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/3OOB-field-service.jpeg 333w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/3OOB-field-service-237x300.jpeg 237w\" sizes=\"(max-width: 333px) 100vw, 333px\" \/><\/p>\n<p>So, the OOB report will be viewed from the Bookable Resource Booking entity using the \u201cReport\u201d button.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33522\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/4OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"916\" height=\"474\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/4OOB-field-service.jpeg 916w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/4OOB-field-service-300x155.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/4OOB-field-service-768x397.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/4OOB-field-service-660x342.jpeg 660w\" sizes=\"(max-width: 916px) 100vw, 916px\" \/><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33521\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/5OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"586\" height=\"545\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/5OOB-field-service.jpeg 586w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/5OOB-field-service-300x279.jpeg 300w\" sizes=\"(max-width: 586px) 100vw, 586px\" \/><\/p>\n<p><strong>Now, we want to modify the above report, so let\u2019s see the steps to modify this OOB field service report using the custom PCF control:<\/strong><\/p>\n<p>This report is developed using PCF control so, we need to modify this PCF control as per our need and upload it with a new name with the new version.<\/p>\n<p>Let us understand how to incorporate the below changes:<\/p>\n<ul>\n<li>Modify the Logo<\/li>\n<li>Change the Company Name &amp; Address<\/li>\n<\/ul>\n<p>The below screenshot shows the OOB field service reporting header:<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33520\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/6OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"419\" height=\"537\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/6OOB-field-service.jpeg 419w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/6OOB-field-service-234x300.jpeg 234w\" sizes=\"(max-width: 419px) 100vw, 419px\" \/><\/p>\n<p>You need to first download the sample PCF code component solution used for the existing service report from <a href=\"https:\/\/aka.ms\/fsmreporting-pcf\" target=\"_blank\" rel=\"noopener\">here<\/a>. Also, some prerequisites need to be installed in the machine to modify the report.<\/p>\n<ul>\n<li><a href=\"https:\/\/code.visualstudio.com\/download\" target=\"_blank\" rel=\"noopener\">Visual Studio Code<\/a> (recommended for ease) or any IDE<\/li>\n<li><a href=\"https:\/\/nodejs.org\/en\/download\/\" target=\"_blank\" rel=\"noopener\">Node Js<\/a><\/li>\n<li><a href=\"https:\/\/marketplace.visualstudio.com\/items?itemName=microsoft-IsvExpTools.PowerPlatformTools\" target=\"_blank\" rel=\"noopener\">Power Platform Tools<\/a><\/li>\n<\/ul>\n<p>Following are the steps to update the report.<\/p>\n<p>1. Open the sample code solution in the visual studio code and open <strong>Input.xml<\/strong>. We need to rename the control <strong>namespace<\/strong>, <strong>constructor<\/strong> &amp; <strong>display-name-key <\/strong>as already a PCF control exists within the CRM with this same specific namespace and constructor. Just to avoid the duplicate name conflict issue later.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33519\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/7OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"600\" height=\"106\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/7OOB-field-service.jpeg 600w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/7OOB-field-service-300x53.jpeg 300w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/p>\n<p>Here, of-type=\u201d SingleLine.Text\u201d since we need to bind this control to the single line text field of property name \u2018bookingid\u2019.<\/p>\n<p>2. After #1, Update the class name in the <strong>ts<\/strong> file by using the same name as the constructor that we used above. For demonstration, we have used the name \u201cServiceReportPreview\u201d here.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33518\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/8OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"797\" height=\"425\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/8OOB-field-service.jpeg 797w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/8OOB-field-service-300x160.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/8OOB-field-service-768x410.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/8OOB-field-service-660x352.jpeg 660w\" sizes=\"(max-width: 797px) 100vw, 797px\" \/><\/p>\n<p>3. Open the visual studio code terminal and run the <strong>npm install <\/strong><\/p>\n<p>This will simply install the node module and create a subfolder that consists of all required packages for the project.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33517\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/9OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"407\" height=\"41\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/9OOB-field-service.jpeg 407w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/9OOB-field-service-300x30.jpeg 300w\" sizes=\"(max-width: 407px) 100vw, 407px\" \/><\/p>\n<p><strong>Note<\/strong>: If you are not able to install node modules with the above commands then delete <strong>package-lock.json<\/strong> and try to install npm again.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33513\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/10OOB-field-service-1.jpeg\" alt=\"OOB field service\" width=\"193\" height=\"461\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/10OOB-field-service-1.jpeg 193w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/10OOB-field-service-1-126x300.jpeg 126w\" sizes=\"(max-width: 193px) 100vw, 193px\" \/><\/p>\n<p>4. Once the node module is installed in #3 (it takes a few minutes), we can now modify the report.<\/p>\n<p>The dummy logo has been placed under the <strong>image.ts<\/strong> file. This file consists of a logo that has been converted to <strong>base64<\/strong>. To place your logo, convert the logo to base64 with any image using a base64 converter. Once the image is converted to base64, place the code in the <strong>SAMPLE_IMAGE<\/strong> variable.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33516\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/11OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"961\" height=\"54\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/11OOB-field-service.jpeg 961w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/11OOB-field-service-300x17.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/11OOB-field-service-768x43.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/11OOB-field-service-660x37.jpeg 660w\" sizes=\"(max-width: 961px) 100vw, 961px\" \/><\/p>\n<p><strong>NOTE<\/strong>: for displaying any image in the report using PCF you need to first convert the image into Base64 format as explained above<\/p>\n<p>5. Navigate to the <strong>ReportPreview<\/strong> Folder and open <strong>tsx<\/strong> file that contains the report code which defines the look and feel of the report.<\/p>\n<p>In the <strong>default<\/strong> function, you will be able to view the dummy company and address that was initially seen while displaying the OOB field service report.<\/p>\n<p>You can rename those values as per your requirements. As demonstrated below, I have changed the company name and address which were used in the header of a report previously:<\/p>\n<p>OOB sample company and address details used in header previously:<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33514\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/12OOB-field-service-1.jpeg\" alt=\"OOB field service\" width=\"973\" height=\"449\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/12OOB-field-service-1.jpeg 973w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/12OOB-field-service-1-300x138.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/12OOB-field-service-1-768x354.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/12OOB-field-service-1-660x305.jpeg 660w\" sizes=\"(max-width: 973px) 100vw, 973px\" \/><\/p>\n<p>Modified company and address details in header afterward:<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33515\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/13OOB-field-service-1.jpeg\" alt=\"OOB field service\" width=\"953\" height=\"443\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/13OOB-field-service-1.jpeg 953w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/13OOB-field-service-1-300x139.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/13OOB-field-service-1-768x357.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/13OOB-field-service-1-660x307.jpeg 660w\" sizes=\"(max-width: 953px) 100vw, 953px\" \/><\/p>\n<p>Once done, you can verify the changes in the local host first before deploying the final changes in CRM. For doing so you can open the terminal and enter <strong>npm start<\/strong> to run the report in the local host.<\/p>\n<p>As shown below our test went well in the local host:<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33511\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/14OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"332\" height=\"351\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/14OOB-field-service.jpeg 332w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/14OOB-field-service-284x300.jpeg 284w\" sizes=\"(max-width: 332px) 100vw, 332px\" \/><\/p>\n<p>6. To connect to your Dataverse CRM, enter <strong>pac auth create &#8211;URL https:\/\/xyz.crm.dynamics.com<\/strong>. In the URL enter your organization link.<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33510\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/15OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"677\" height=\"31\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/15OOB-field-service.jpeg 677w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/15OOB-field-service-300x14.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/15OOB-field-service-660x30.jpeg 660w\" sizes=\"(max-width: 677px) 100vw, 677px\" \/><\/p>\n<p>7. List the details of the environment by entering the <strong>pac auth list <\/strong>and selecting the environment using the index <strong>pac auth select &#8211;index &lt;index of the active profile&gt;<\/strong><\/p>\n<p>8. Push the component solution to the environment by entering the publisher name <strong>pac PCF push &#8211;publisher-prefix &lt;your publisher prefix&gt;<\/strong><\/p>\n<p><strong> <img decoding=\"async\" class=\"alignnone size-full wp-image-33509\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/16OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"596\" height=\"82\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/16OOB-field-service.jpeg 596w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/16OOB-field-service-300x41.jpeg 300w\" sizes=\"(max-width: 596px) 100vw, 596px\" \/><\/strong><\/p>\n<p><strong>Note: <\/strong>If the import fails then make sure that the <strong>.NET Framework developer pack<\/strong> has been installed on the machine.<\/p>\n<p>9. Once the solution has been imported into the CRM environment. \u201c<strong>PowerApps_dev<\/strong>\u201d is the name of the solution that is imported into the CRM.<\/p>\n<p><strong>\u00a0\u00a0 <img decoding=\"async\" class=\"alignnone size-full wp-image-33508\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/17OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"1153\" height=\"449\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/17OOB-field-service.jpeg 1153w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/17OOB-field-service-300x117.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/17OOB-field-service-1024x399.jpeg 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/17OOB-field-service-768x299.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/17OOB-field-service-660x257.jpeg 660w\" sizes=\"(max-width: 1153px) 100vw, 1153px\" \/>\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 <\/strong><\/p>\n<p>10. After #9, the next step is to select the custom PCF control of the <strong>reportview<\/strong><\/p>\n<p><strong>NOTE:<\/strong> By default, OOB control is selected for the <strong>reportview<\/strong> field. You need to explicitly select your custom control, in this demonstration I have selected the \u201cServiceReportPreview\u201d custom control, save the form and publish it.<\/p>\n<p>While adding the control make sure you are selecting the appropriate input parameters as below:<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33507\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/18OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"1039\" height=\"645\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/18OOB-field-service.jpeg 1039w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/18OOB-field-service-300x186.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/18OOB-field-service-1024x636.jpeg 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/18OOB-field-service-768x477.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/18OOB-field-service-660x410.jpeg 660w\" sizes=\"(max-width: 1039px) 100vw, 1039px\" \/><\/p>\n<p>And also select the platform like Web, Mobile, and Tablet, etc. from where you would like to access this report as shown below:<\/p>\n<p><strong> <img decoding=\"async\" class=\"alignnone size-full wp-image-33506\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/19OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"1045\" height=\"621\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/19OOB-field-service.jpeg 1045w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/19OOB-field-service-300x178.jpeg 300w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/19OOB-field-service-1024x609.jpeg 1024w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/19OOB-field-service-768x456.jpeg 768w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/19OOB-field-service-660x392.jpeg 660w\" sizes=\"(max-width: 1045px) 100vw, 1045px\" \/><\/strong><\/p>\n<p>In our scenario, if we access the modified sample custom report from Web then it will look like this-<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-33505\" style=\"border: 1px solid #0a0a0a; padding: 1px; margin: 1px;\" src=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/20OOB-field-service.jpeg\" alt=\"OOB field service\" width=\"447\" height=\"459\" srcset=\"https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/20OOB-field-service.jpeg 447w, https:\/\/www.inogic.com\/blog\/wp-content\/uploads\/2022\/12\/20OOB-field-service-292x300.jpeg 292w\" sizes=\"(max-width: 447px) 100vw, 447px\" \/><\/p>\n<h2><strong>Conclusion<\/strong><\/h2>\n<p>We can customize the existing field service technician service report as per our requirement by simply modifying the existing PCF code provided by Microsoft.<\/p>\n<h3 style=\"text-align: left;\"><div class=\"su-heading su-heading-style-default su-heading-align-center\" id=\"\" style=\"font-size:15px;margin-bottom:5px\"><div class=\"su-heading-inner\">Need any help with Microsoft Dynamics 365 Field Service module \/ Microsoft CRM \/ Power Platform development?<\/div><\/div><\/h3>\n<p><em>Want to manage your field services portal more effectively? Contact us at <a href=\"mailto:crm@inogic.com\" target=\"_blank\" rel=\"noopener\">crm@inogic.com<\/a> and our <a href=\"https:\/\/bit.ly\/3VvGawa\" target=\"_blank\" rel=\"noopener\">Inogic- Professional Services Division<\/a> will help you modify, optimize, and automate all our requirements within Microsoft Dynamics 365 Field Service!<\/em><\/p>\n<p><em>Happy Servicing!<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Recently we had a requirement from one of our clients for incorporating the customization in the OOB Field service technician service report in the field service mobile and web app. Microsoft Field Service Reporting is a managed solution that can be installed in the environment. Once you install the solution, the Report will appear on\u2026 <span class=\"read-more\"><a href=\"https:\/\/www.inogic.com\/blog\/2022\/12\/how-to-modify-the-oob-field-service-technician-service-report-using-pcf-control\/\">Read More &raquo;<\/a><\/span><\/p>\n","protected":false},"author":13,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[16,18,27,2361],"tags":[2649,1941],"class_list":["post-33504","post","type-post","status-publish","format-standard","hentry","category-dynamics-365","category-dynamics-365-v9-2","category-field-service-2","category-technical","tag-oob-field-service","tag-pcf-control"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/33504","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/users\/13"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/comments?post=33504"}],"version-history":[{"count":0,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/posts\/33504\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/media?parent=33504"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/categories?post=33504"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inogic.com\/blog\/wp-json\/wp\/v2\/tags?post=33504"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}