public class DragandDropController{
@AuraEnabled
public static List<Account> getAccountData() {
List<Account> lst=new List<Account>([Select id,name,CountValue__c,(select id,FirstName,LastName from Contacts) from Account order by countValue__c ]);
return lst;
}
@AuraEnabled
public static List<Account> DragDroprecordUpdate(String DragRecordId, String DropRecordId,String DragCount,String DropCount){
Map<id,Contact> mapcontact=new Map<id,Contact>([Select id,CountValue__c from Contact where id =:DragRecordId or id=:DropRecordId]);
mapcontact.get(DragRecordId).countvalue__c=Decimal.ValueOf(DropCount);
mapcontact.get(DropRecordId).countvalue__c=Decimal.ValueOf(DragCount);
update mapcontact.values();
return DragandDropController.getAccountData();
}
@AuraEnabled
public static List<Account> DragDroprecordUpdateAccount(String DragRecordId, String DropRecordId,String DragCount,String DropCount){
Map<id,Account> mapcontact=new Map<id,Account>([Select id,CountValue__c from Account where id =:DragRecordId or id=:DropRecordId]);
mapcontact.get(DragRecordId).countvalue__c=Decimal.ValueOf(DropCount);
mapcontact.get(DropRecordId).countvalue__c=Decimal.ValueOf(DragCount);
update mapcontact.values();
return DragandDropController.getAccountData();
}
@AuraEnabled
public static List<Account> DragDroprecordUpdateContact(String DragContactRecordId, String DropContactRecordId){
Map<id,Contact> mapcontact=new Map<id,Contact>([Select id,name,Accountid from Contact where id=:DragContactRecordId or id=:DropContactRecordId limit 2]);
mapcontact.get(DragContactRecordId).Accountid=mapcontact.get(DropContactRecordId).Accountid;
update mapcontact.values();
return DragandDropController.getAccountData();
}
@AuraEnabled
public static List<Account> DragDroprecordUpdateContactAccount(String DragContactRecordId, String DropAccountRecordId){
Map<id,Contact> mapcontact=new Map<id,Contact>([Select id,name,Accountid from Contact where id=:DragContactRecordId limit 1]);
mapcontact.get(DragContactRecordId).Accountid=DropAccountRecordId;
update mapcontact.values();
return DragandDropController.getAccountData();
}
}
<aura:component controller="DragandDropController" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global">
<aura:attribute name="objRecord" type="Account[]"/>
<aura:attribute name="objFields" type="String[]"/>
<aura:attribute name="DragRecordId" type="String"/>
<aura:attribute name="DropRecordId" type="String"/>
<aura:attribute name="DragCount" type="String"/>
<aura:attribute name="DropCount" type="String"/>
<aura:attribute name="AccountData" type="Account[]"/>
<aura:handler name="init" action="{!c.doInit}" value="{!this}"/>
<div class="slds-page-header">
<div class="slds-media">
<div class="slds-media__figure">
<span class="slds-icon_container" title="Description of icon when needed">
<lightning:icon iconName="utility:kanban" variant="bare" size="small"/>
</span>
</div>
<div class="slds-media__body">
<h1 class="slds-page-header__title slds-truncate slds-align-middle" title="Account Records">Account Records</h1>
</div>
</div>
</div>
<div style="padding:0.5rem;">
<div class="stageContainer" style="width:100%">
<ul ondrop="{!c.drop}" ondragover="{!c.allowDrop}" class="slds-has-dividers_around-space dropZone" style="height:100%;overflow-y:auto;">
<aura:iteration var="objRecord" items="{!v.AccountData }">
<li class="slds-item slds-m-around_small" draggable="true" ondragstart="{!c.drag}" id="{!objRecord.Id+'--'+objRecord.CountValue__c}">
<article class="slds-tile slds-tile_board">
<div class="slds-tile__detail slds-text-body_medium">
<p class="slds-text-heading_medium"> {!objRecord.Name} ----{!objRecord.CountValue__c}</p>
<ul ondrop="{!c.dropChild}" ondragover="{!c.allowDropChild}" class="slds-has-dividers_around-space dropZone" style="height:100%;overflow-y:auto;">
<aura:iteration items="{!objRecord.Contacts}" var="con" indexVar="index">
<li class="slds-item slds-m-around_small" draggable="true" ondragstart="{!c.drag}" id="{!con.Id}">
<article class="slds-tile slds-tile_board">
<div class="slds-tile__detail slds-text-body_medium">
<p class="slds-text-heading_medium"> Contact Name : {!con.FirstName} {!con.LastName}</p>
</div>
</article>
</li>
</aura:iteration>
</ul>
</div>
</article>
</li>
</aura:iteration>
</ul>
</div>
</div>
</aura:component>
Step 3 :- Copy below code and paste in DragandDropLigtningPage lightning page controller.
({
doInit: function(component, event, helper) {
helper.displaydata(component, event);
},
allowDrop: function(component, event, helper) {
event.preventDefault();
},
allowDropChild: function(component, event, helper) {
event.preventDefault();
},
drag: function (component, event, helper) {
event.dataTransfer.setData("text", event.target.id);
},
dragChild: function (component, event, helper) {
event.dataTransfer.setData("text", event.target.id);
},
drop: function (component, event, helper) {
var data1 = event.dataTransfer.getData("text");
var tar= event.target.closest('[id]').id.split('--');
if(data1.includes("--")){
var data=data1.split('-$-');
var action = component.get("c.DragDroprecordUpdateAccount");
action.setParams({
"DragRecordId":data[0],
"DropRecordId":tar[0],
"DragCount":data[1],
"DropCount":tar[1]
});
action.setCallback(this, function(response){
var state = response.getState();
if (state === "SUCCESS") {
console.dir(response.getReturnValue());
component.set("v.AccountData", response.getReturnValue());
}
});
$A.enqueueAction(action);
}
else{
//Account and Contact
var action = component.get("c.DragDroprecordUpdateContactAccount");
var data=data1;
action.setParams({
"DragContactRecordId":data,
"DropAccountRecordId":tar[0],
});
action.setCallback(this, function(response){
var state = response.getState();
if (state === "SUCCESS") {
console.dir(response.getReturnValue());
component.set("v.AccountData", response.getReturnValue());
}
});
$A.enqueueAction(action);
}
},
dropChild: function (component, event, helper) {
var data = event.dataTransfer.getData("text");
var tar= event.target.closest('[id]').id;
var action = component.get("c.DragDroprecordUpdateContact");
action.setParams({
"DragContactRecordId":data,
"DropContactRecordId":tar,
});
action.setCallback(this, function(response){
var state = response.getState();
if (state === "SUCCESS") {
console.dir(response.getReturnValue());
component.set("v.AccountData", response.getReturnValue());
}
});
$A.enqueueAction(action);
}
})
Step 4 :- Copy and paste below code in DragandDropLigtningPage lightning page helper.
({
displaydata : function(component, event) {
var action = component.get("c.getAccountData");
action.setCallback(this, function(response){
var state = response.getState();
if (state === "SUCCESS") {
console.dir(response.getReturnValue());
component.set("v.AccountData", response.getReturnValue());
}
});
$A.enqueueAction(action);
}
})
Step 5 :-Create an Lightning DragandDropLightningApp app and copy paste below code.
<aura:application extends="force:slds">
<c:DragandDropLigtningPage />
</aura:application>
Comments
Post a Comment