{"type":"doc","content":[{"type":"paragraph","content":[{"text":"GoMeddo also includes a standalone reservation form component that can be embedded in your Lightning solutions. One way to include it is through the Lightning App Builder, through drag & drop. Doing so is fast and easy, but only lets you control certain attributes of the component. If you want more control over your reservation form, you can consider wrapping it in your own custom component. This article explains how. ","type":"text","marks":[{"type":"em"}]}]},{"type":"paragraph","content":[{"text":"For more information on initial creation of a standalone reservation form, refer to the ","type":"text","marks":[{"type":"em"}]},{"text":"standalone reservation form documentation page","type":"text","marks":[{"type":"em"},{"type":"link","attrs":{"href":"https://gomeddo.atlassian.net/wiki/spaces/BPD/pages/2782298121"}}]},{"text":".","type":"text","marks":[{"type":"em"}]}]},{"type":"heading","attrs":{"level":1},"content":[{"text":"B25:standaloneReservationForm","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Code Sample (example)","type":"text"}]},{"type":"paragraph","content":[{"text":"Below is a basic Lightning Web Component that can be included on a Lightning Record page. This component lets you specify a Calendar Name ","type":"text"},{"text":"(calender-name={calendarName})","type":"text","marks":[{"type":"strong"}]},{"text":", an Object API Name ","type":"text"},{"text":"(object-api-name={objectApiName})","type":"text","marks":[{"type":"strong"}]},{"text":", an optional Flow Name to run prior to Reservation creation ","type":"text"},{"text":"(pre-create-flow-name={preCreateFlowName})","type":"text","marks":[{"type":"strong"}]},{"text":", the recordId it should apply to - such as the Id of the Lightning Record page ","type":"text"},{"text":"(record-id={contextId})","type":"text","marks":[{"type":"strong"}]},{"text":", and some initial data for the draft Reservation ","type":"text"},{"text":"(prototype-reservation={prototypeReservation})","type":"text","marks":[{"type":"strong"}]},{"text":". ","type":"text"}]},{"type":"paragraph","content":[{"text":"This is just an example. When copying this sample, keep a few things in mind:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Though the standalone reservation form does not directly display on a calendar, the ","type":"text"},{"text":"calendarName","type":"text","marks":[{"type":"code"}]},{"text":" specified impacts which ","type":"text"},{"text":"Reservation Types","type":"text","marks":[{"type":"strong"}]},{"text":" are available for use.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"The ","type":"text"},{"text":"recordId","type":"text","marks":[{"type":"code"}]},{"text":" passed to the component will be set in the Flow specified in ","type":"text"},{"text":"preCreateFlowName","type":"text","marks":[{"type":"code"}]},{"text":" as the contextRecordId.","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Do not render the Standalone Reservation Form until all of the relevant data has loaded in the wrapper component.","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"If you do, then your existing data won’t load in properly on the form component.","type":"text"}]}]}]}]}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Component","type":"text"}]},{"type":"codeBlock","content":[{"text":"","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Controller","type":"text"}]},{"type":"codeBlock","content":[{"text":"import { LightningElement, api, wire } from 'lwc';\nimport { getRecord } from 'lightning/uiRecordApi';\nimport RESERVATION_FIELD from '@salesforce/schema/Opportunity.ReservationLookup__c';\n\nexport default class StandaloneReservationFormWrapper extends LightningElement {\n @api recordId;\n @api calendarName;\n @api preCreateFlowName;\n @api prototypeReservation = {\n 'sobjectType': 'B25__Reservation__c'\n };\n objectApiName;\n contextId;\n infoLoaded = false;\n @wire(getRecord, { recordId: '$recordId', fields: [RESERVATION_FIELD]})\n receiveOpportunityRecord(wireData) {\n if (wireData.data === undefined) {\n return;\n }\n\n if (wireData?.data?.fields?.ReservationLookup__c?.value) {\n this.objectApiName = 'B25__Reservation__c';\n this.contextId = wireData.data.fields.ReservationLookup__c.value;\n } else {\n this.objectApiName = 'Opportunity';\n this.contextId = this.recordId;\n }\n\n this.infoLoaded = true;\n }\n}","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"XML","type":"text"}]},{"type":"codeBlock","content":[{"text":"\n\n 62.0\n true\n\t\n Standalone reservation form (wrapped)\n \n \n Standalone reservation form (wrapped)\n \n \n lightning__AppPage\n lightning__RecordPage\n \n \n \n \n \n \n \n \n \n \n \n","type":"text"}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"Properties","type":"text"}]},{"type":"paragraph","content":[{"text":"The following properties can be used:","type":"text"}]},{"type":"table","attrs":{"layout":"default","width":1800.0,"localId":"a8249b1f-9eed-4aa8-8f58-af7846d646c5"},"content":[{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[207.0]},"content":[{"type":"paragraph","content":[{"text":"Property","type":"text","marks":[{"type":"strong"}]}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[244.0]},"content":[{"type":"paragraph","content":[{"text":"Expected Value","type":"text","marks":[{"type":"strong"}]}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[444.0]},"content":[{"type":"paragraph","content":[{"text":"Description","type":"text","marks":[{"type":"strong"}]}]}]}]},{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[207.0]},"content":[{"type":"paragraph","content":[{"text":"recordId","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[244.0]},"content":[{"type":"paragraph","content":[{"text":"The ","type":"text"},{"text":"Id","type":"text","marks":[{"type":"strong"}]},{"text":" of the related record.","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[444.0]},"content":[{"type":"paragraph","content":[{"text":"This pre-populates the form data, and is passed alone to the Flow specified in preCreateFlowName. Can be a Reservation Id, or a different Object Id depending on intentions. If the component is used on a Lightning Record page, will default to the Id of the record.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[207.0]},"content":[{"type":"paragraph","content":[{"text":"objectApiName","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[244.0]},"content":[{"type":"paragraph","content":[{"text":"The ","type":"text"},{"text":"API Name","type":"text","marks":[{"type":"strong"}]},{"text":" of the Object type specified in the recordId.","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[444.0]},"content":[{"type":"paragraph","content":[{"text":"If the component is used on a Lightning Record page, will default to the name of the SObject.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[207.0]},"content":[{"type":"paragraph","content":[{"text":"calendarName","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[244.0]},"content":[{"type":"paragraph","content":[{"text":"The ","type":"text"},{"text":"Name","type":"text","marks":[{"type":"strong"}]},{"text":" of a Calendar record.","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[444.0]},"content":[{"type":"paragraph","content":[{"text":"This sets the available Reservation Types based on the linked Calendar name.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[207.0]},"content":[{"type":"paragraph","content":[{"text":"preCreateFlowName","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[244.0]},"content":[{"type":"paragraph","content":[{"text":"The ","type":"text"},{"text":"API Name","type":"text","marks":[{"type":"strong"}]},{"text":" of the Flow to run before Reservation creation.","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[444.0]},"content":[{"type":"paragraph","content":[{"text":"This lets you optionally specify whether you want to run a flow prior to the Reservation being created.","type":"text"}]}]}]},{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":[207.0]},"content":[{"type":"paragraph","content":[{"text":"prototypeReservation","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[244.0]},"content":[{"type":"paragraph","content":[{"text":"An object that represents a Reservation record.","type":"text"}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":[444.0]},"content":[{"type":"paragraph","content":[{"text":"Allows you to prepopulate fields on new reservations being created on the calendar, even if that field is not displayed on the reservation form.","type":"text"}]},{"type":"paragraph","content":[{"text":"Note:","type":"text","marks":[{"type":"strong"}]},{"text":" you can include junctions (such as ReservationContacts) or service reservations in the prototype.","type":"text"}]}]}]}]},{"type":"paragraph"}],"version":1}

Browser not supported