Aprire un lightning component dentro una pagina visualforce.
Mi è capitato che da un lightning component dovessi aprire un altro component per la stampa di informazioni.
Il problema è che in questo modo devo trovare un accorgimento per non mostrare alla stampa header e footer della piattaforma.
Un modo più veloce per ovviare a questo problema è aprire una visualforce che richiama a sua volta il component che dovrei stampare.
Passo 1 Bottone in pagina lightning che chiama la visualforce
<aura:component access="global" controller="AppointmentsGlobalReportLtgCmpCnt" implements="lightning:isUrlAddressable,flexipage:availableForRecordHome,force:hasRecordId,force:hasSObjectName,force:lightningQuickActionWithoutHeader">
<aura:dependency resource="markup://force:*" type="EVENT"/>
<lightning:button variant="brand" label="PDF" onclick="{!c.getPDFListReport}" />
Controller javascript component precedente
getPDFListReport : function(component, event, helper) {
var recordId = component.get("v.recordId");
var saList = String(component.get("v.saList"));
var sa = saList.split(',')[0];
var vfUrl = '/apex/NOME PAGINA VISUALFORCE DA CHIAMARE?saList=' + saList + '&id=' + sa;
var urlEvent = $A.get("e.force:navigateToURL");
urlEvent.setParams({
"url": vfUrl,
});
urlEvent.fire();
}
Pagina visualforce che viene chiamata dal bottone e che poi richiama ulteriore component
<apex:page showHeader="true" sidebar="false" standardController="NOME CONTROLLER"> <!-- -->
<apex:includeLightning />
<div id="lightning" ></div>
<script>
$Lightning.use("c:NOME LIGHTNING APP COMPONENT", function() {
var postEventToOneApp = function(name, params, fallbackAction) {
if (SfdcApp && SfdcApp.projectOneNavigator && SfdcApp.projectOneNavigator.fireContainerEvent) {
// Not officially supported by Salesforce
SfdcApp.projectOneNavigator.fireContainerEvent(name, params);
} else if (fallbackAction) {
// Fallback if no Salesforce support of fireContainerEvent
fallbackAction();
}
};
$Lightning.createComponent(
"c:NOME LIGHTNING COMPONENT DA CHIAMARE", {
recordId: "{!JSENCODE($CurrentPage.parameters.Id)}",
embeddedIntoVF: true,
disableSave: false,
saList : "{!$CurrentPage.parameters.saList}"
// PARAMETRI OPZIONALI
},
"lightning",
function (cmp) {
$A.eventService.addHandler({
event: 'force:showToast',
handler: function(event) {
postEventToOneApp('force:showToast', event.getParams(), function() {
alert(event.$params$.message);
});
}
});
$A.eventService.addHandler({
event: 'force:navigateToSObject',
handler: function (event) {
if (typeof sforce != 'undefined' && sforce.one) {
// VF page in S1 or Lightning Exp
// VF page in Classic
sforce.one.navigateToSObject(event.getParams().recordId, event.getParams().slideDevName);
} else {
window.parent.location.href = '/';
}
}
});
}
);
});
</script>
<style>
html body.sfdcBody {
padding: 0px !important;
}
html {
overflow-y: scroll;
overflow-x: hidden;
}
</style>
</apex:page>
Lightning component che viene chiamato dalla pagina visualforce descritta sopra
<aura:component access="global" implements="flexipage:availableForRecordHome,force:hasRecordId,force:hasSObjectName,force:lightningQuickActionWithoutHeader">
<aura:attribute access="global" name="recordId" type="Id" description="Record Id of object (page) calling this component"/>
<aura:dependency resource="markup://force:*" type="EVENT" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<lightning:button variant="brand" label="Print" onclick="{!c.print}" />
</aura:component>
Controller javascript lightning component di stampa
({
doInit : function(component, event, helper) {
var saList = component.get("v.saList"); // string of id comma separated
var array = string.split(','); // string to array
component.set("v.saList", array); // set attributute list on component
},
// GO TO BACK PAGE
cancel: function(component, event, helper) {
window.history.back();
},
// PRINT COMPONENT OR SAVE PDF
print: function(component, event, helper) {
window.print();
}
})