//https://github.com/marcoalmodova/confirm-dialogimport{LightningElement,api}from'lwc';exportdefaultclassConfirmationDialogextendsLightningElement{@apivisible;//used to hide/show dialog@apititle;//modal title@apiname;//reference name of the component@apimessage;//modal message@apiconfirmLabel;//confirm button label@apicancelLabel;//cancel button label@apioriginalMessage;//any event/message/detail to be published back to the parent component//handles button clickshandleClick(event){//creates object which will be published to the parent componentletfinalEvent={originalMessage:this.originalMessage,status:event.target.name};//dispatch a 'click' event so the parent component can handle itthis.dispatchEvent(newCustomEvent('click',{detail:finalEvent}));}}
<template><lightning-cardtitle="Slice reservation"icon-name="utility:cut"><divclass="slds-p-around_medium"><lightning-inputtype="text"label="Enter a slicing scheme"requiredonchange={handleDividerChange}></lightning-input></div><templateif:true={nrOfSlices}><divclass="slds-p-around_medium"><h3class="slds-text-heading_small">We will create <strong>{nrOfSlices}</strong> slices</h3><ul><templatefor:each={slices}for:item="slice"><likey={slice.key}><lightning-formatted-date-timevalue={slice.sliceStart}hour="2-digit"minute="2-digit"time-zone="Europe/London"></lightning-formatted-date-time> -
<lightning-formatted-date-timevalue={slice.sliceEnd}hour="2-digit"minute="2-digit"time-zone="Europe/London"></lightning-formatted-date-time></li></template></ul></div><divclass="slds-p-around_medium"><lightning-buttonvariant="brand"label="Create Slices"title="Create Slices"onclick={handleClick}></lightning-button></div></template></lightning-card><c-confirm-dialogtitle='Slicing Complete?'message='Are you sure you want to create the slices?'confirm-label='Yes, I am sure'cancel-label='Cancel'visible={isDialogVisible}original-message={originalMessage}name="confirmModal"onclick={handleConfirmClick}></c-confirm-dialog></template>
import{LightningElement,api,track,wire}from'lwc';import{ShowToastEvent}from'lightning/platformShowToastEvent';import{getRecord,getFieldValue}from'lightning/uiRecordApi';importcreateSlicesfrom'@salesforce/apex/Ctrl_Reservations.createSlices';constFIELDS=['B25__Reservation__c.B25__Start__c','B25__Reservation__c.B25__End__c','B25__Reservation__c.Duration_in_Minutes__c'];exportdefaultclassSliceReservationextendsLightningElement{@apirecordId;reservation;start;errors;duration;nrOfSlices;@trackslices=[];@trackisDialogVisible=false;@wire(getRecord,{recordId:'$recordId',fields:FIELDS})wiredRecord({error,data}){if(error){letmessage='Unknown error';if(Array.isArray(error.body)){message=error.body.map(e=>e.message).join(', ');}elseif(typeoferror.body.message==='string'){message=error.body.message;}this.dispatchEvent(newShowToastEvent({title:'Error loading reservation',message,variant:'error',}),);}elseif(data){this.reservation=data;this.start=this.reservation.fields.B25__Start__c.value;this.end=this.reservation.fields.B25__End__c.value;this.duration=this.reservation.fields.Duration_in_Minutes__c.value;}}handleDividerChange(event){vardivider=event.target.value;divider=divider.trim();if(divider==null||divider==''){this.nrOfSlices=null;this.slices=[];return;}vardividers=divider.split(' ');//simple slice in even partsif(dividers.length==1){this.nrOfSlices=Math.ceil(this.duration/divider);this.addSimpleSlices(divider);return;}varsliceLength=0;dividers.forEach(function(entry){sliceLength+=parseInt(entry);});//exactly divided into the available minutesif(sliceLength==this.duration){console.log('exactly divided');this.nrOfSlices=dividers.length;this.addSlices(dividers);return;// else we need to add one more slice at the end}elseif(sliceLength<this.duration){console.log('needs slide at end');this.nrOfSlices=dividers.length+1;this.addSlices(dividers);//add final slices of remaining minutesvarendItem=newDate(this.end);varslice={sliceStart:this.addMinutes(endItem,(this.duration-sliceLength)*-1),sliceEnd:endItem};this.slices.push(slice);return;}}addMinutes(date,minutes){returnnewDate(date.getTime()+parseInt(minutes)*60000);}addSimpleSlices(divider){varstartItem=newDate(this.start);this.slices=[];varsliceLength=0;for(vari=0;i<Math.floor(this.duration/divider);i++){varslice={sliceStart:startItem,sliceEnd:this.addMinutes(startItem,divider)};sliceLength+=parseInt(divider);startItem=slice.sliceEnd;this.slices.push(slice);}if(sliceLength<this.duration){varslice={sliceStart:startItem,sliceEnd:this.addMinutes(startItem,(this.duration-sliceLength))};this.slices.push(slice);}}addSlices(dividers){varstartItem=newDate(this.start);this.slices=[];for(vari=0;i<dividers.length;i++){varslice={sliceStart:startItem,sliceEnd:this.addMinutes(startItem,dividers[i])};startItem=slice.sliceEnd;this.slices.push(slice);}}handleClick(event){this.isDialogVisible=true;}handleConfirmClick(event){if(event.detail!==1&&event.detail.status==='confirm'){createSlices({recordId:this.recordId,slices:JSON.stringify(this.slices)}).then((result)=>{this.dispatchEvent(newShowToastEvent({title:'Success',message:'We created the child reservations',variant:'success',}),);this.errors=undefined;this.slices=[];this.nrOfSlices=null;}).catch((error)=>{this.handleError(error);this.reservations=undefined;});}this.isDialogVisible=false;}handleError(error){console.log(error);}}
<?xml version="1.0" encoding="UTF-8"?><LightningComponentBundlexmlns="http://soap.sforce.com/2006/04/metadata"><apiVersion>51.0</apiVersion><isExposed>true</isExposed><masterLabel>Slice Reservations</masterLabel><description>Allows you to 'slice' reservation into smaller pieces.</description><targets><target>lightning__RecordPage</target></targets><targetConfigs><targetConfigtargets="lightning__RecordPage"><objects><object>B25__Reservation__c</object></objects></targetConfig></targetConfigs></LightningComponentBundle>
Comments (0)
HTTPSSSH
You can clone a snippet to your computer for local editing.
Learn more.
