Hi, I build a Task Component. I would like to delete the ActivityDate as a column and replace it with status as a column. In addition I would like to have a "View All "-Button for the tasks next the right side at the row of "Tasks"-header


<aura:component controller="TaskController" implements="force:appHostable,flexipage:availableForAllPageTypes,force:hasRecordId" >
    
    <aura:attribute name="recordId" type="Id" />    
    <aura:attribute name="tasks" type="Task[]"/>
    <aura:attribute name="tasks2" type="Task[]"/>
    <aura:attribute name="tasks3" type="Task[]"/>
    <aura:attribute name="tasks4" type="Task[]"/>
    
    <aura:handler name="init" action="{!c.doInit}" value="{!this}"/>   
    <aura:attribute name="mycolumns" type="List"/>
    <aura:attribute name="mycolumns2" type="List"/>
    <aura:attribute name="mycolumns3" type="List"/>
    <aura:attribute name="mycolumns4" type="List"/>
                                                   
    <lightning:card iconName="standard:task" title="Tasks">
        <div class="slds-card__body slds-card__body_inner">           
        </div>
        
        <div style= "font-size: 14px; font-weight: bold; margin-left:15px; margin-top:10px;">
            Überfällig        
        </div>
        <div>
            <aura:if isTrue="{!not(empty(v.tasks))}">
                <lightning:datatable data="{!v.tasks }" 
                                     columns="{!v.mycolumns }" 
                                     keyField="Id"
                                     hideCheckboxColumn="true"/>
                <aura:set attribute="else">
                    <div Style="text-align : center">Keine Aufgaben</div>
                </aura:set>
            </aura:if>
        </div>
        
        <div style= "font-size: 14px; font-weight: bold; margin-left:15px; margin-top:10px;">
            Heute        
        </div>      
        <div>
            <aura:if isTrue="{!not(empty(v.tasks2))}">
                <lightning:datatable data="{!v.tasks2}" 
                                     columns="{!v.mycolumns2}" 
                                     keyField="Id"
                                     hideCheckboxColumn="true"/>
                <aura:set attribute="else">
                    <div Style="text-align : center">Keine Aufgaben</div>
                </aura:set>
            </aura:if>
        </div>
        
        <div style= "font-size: 14px; font-weight: bold; margin-left:15px; margin-top:10px; ">
            Morgen        
        </div>       
        <div>
            <aura:if isTrue="{!not(empty(v.tasks3))}">
                <lightning:datatable data="{!v.tasks3}" 
                                     columns="{!v.mycolumns3}" 
                                     keyField="Id"
                                     hideCheckboxColumn="true"/>
                <aura:set attribute="else">
                    <div Style="text-align : center">Keine Aufgaben</div>
                </aura:set>
            </aura:if>
        </div>
        
        <div style= "font-size: 14px; font-weight: bold; margin-left:15px; margin-top:10px;">
            In 2 Tagen        
        </div>    
        <div>
            <aura:if isTrue="{!not(empty(v.tasks4))}">
                <lightning:datatable data="{!v.tasks4}" 
                                     columns="{!v.mycolumns4}" 
                                     keyField="Id"
                                     hideCheckboxColumn="true"/>
                <aura:set attribute="else">
                    <div Style="text-align : center">Keine Aufgaben</div>
                </aura:set>
            </aura:if>
        </div> 
        
    </lightning:card>
</aura:component>



Controller:

({
    doInit: function(component, event, helper) {
        
        component.set('v.mycolumns', [
            {label: 'Subject', fieldName: 'SubjectName', type: 'url',
            typeAttributes: {label: { fieldName: 'Subject' }, target: '_blank'}},
            { label: "ActivityDate", fieldName: "ActivityDate", type: "date-local", typeAttributes:{ month: "2-digit", day: "2-digit" } },
            
        ]);
        var action = component.get("c.loadTasks");
            action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                var records =response.getReturnValue();
                records.forEach(function(record){
                   
                    record.SubjectName = '/'+record.Id;
                    record.ActivityDate= record.ActivityDate;
                });
                component.set("v.tasks", records);
            }
        });
        $A.enqueueAction(action);
            
            
            component.set('v.mycolumns2', [
            {label: 'Subject', fieldName: 'SubjectName', type: 'url',
            typeAttributes: {label: { fieldName: 'Subject' }, target: '_blank'}},            
            { label: "ActivityDate", fieldName: "ActivityDate", type: "date-local", typeAttributes:{ month: "2-digit", day: "2-digit" } },            
        ]);
        var action = component.get("c.loadTasks2");
        
        
        
        var whatId = component.get("v.recordId");
        action.setParams({
            "recordId":whatId
        });
          
            action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                var records =response.getReturnValue();
                records.forEach(function(record){
                   
                    record.SubjectName = '/'+record.Id;
                    record.ActivityDate= record.ActivityDate;
                });
                component.set("v.tasks2", records);
            }
        });
        $A.enqueueAction(action);
        
        
            component.set('v.mycolumns3', [
            {label: 'Subject', fieldName: 'SubjectName', type: 'url',
            typeAttributes: {label: { fieldName: 'Subject' }, target: '_blank'}},            
            { label: "ActivityDate", fieldName: "ActivityDate", type: "date-local", typeAttributes:{ month: "2-digit", day: "2-digit" } },            
        ]);
        var action = component.get("c.loadTasks3");
        
        
        
        var whatId = component.get("v.recordId");
        action.setParams({
            "recordId":whatId
        });
          
            action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                var records =response.getReturnValue();
                records.forEach(function(record){
                   
                    record.SubjectName = '/'+record.Id;
                    record.ActivityDate= record.ActivityDate;
                });
                component.set("v.tasks3", records);
            }
        });
        $A.enqueueAction(action);
                
                
             component.set('v.mycolumns4', [
            {label: 'Subject', fieldName: 'SubjectName', type: 'url',
            typeAttributes: {label: { fieldName: 'Subject' }, target: '_blank'}},            
            { label: "ActivityDate", fieldName: "ActivityDate", type: "date-local", typeAttributes:{ month: "2-digit", day: "2-digit" } },            
        ]);
        var action = component.get("c.loadTasks4");
        
        
        
        var whatId = component.get("v.recordId");
        action.setParams({
            "recordId":whatId
        });
          
            action.setCallback(this, function(response){
            var state = response.getState();
            if (state === "SUCCESS") {
                var records =response.getReturnValue();
                records.forEach(function(record){
                   
                    record.SubjectName = '/'+record.Id;
                    record.ActivityDate= record.ActivityDate;
                });
                component.set("v.tasks4", records);
            }
        });
        $A.enqueueAction(action);

    },
   
})


Apex:

public with sharing class TaskController {
    
//ÜBERFÄLLIG - Abfrage Tasks, wo das Activity Date abgelaufen und der Status "Not Completed" ist//
@AuraEnabled
public static List<Task> loadTasks(Id recordId){
    string userId = UserInfo.getUserId();
    return[SELECT Subject, ActivityDate FROM Task WHERE WhatId=:recordId And ActivityDate< TODAY AND OwnerId=:userId AND Status !='Completed'];
}
    
//HEUTE - Abfrage Tasks, wo das Activity Date gleich heute ist//     
@AuraEnabled
public static List<Task> loadTasks2(Id recordId){
    string userId = UserInfo.getUserId();
    return[SELECT Subject, ActivityDate FROM Task WHERE WhatId=:recordId And ActivityDate = TODAY AND OwnerId=:userId];
}
    
//MORGEN - Abfrage Tasks, wo das Activity Date Heute+1 entspricht//    
@AuraEnabled
public static List<Task> loadTasks3(Id recordId){
    string userId = UserInfo.getUserId();
    return[SELECT Subject, ActivityDate FROM Task WHERE WhatId=:recordId And ActivityDate = TOMORROW AND OwnerId=:userId];
}
    
//ÜBERMORGEN - Abfrage Tasks, wo das Activity Date Heute+2 entspricht//    
@AuraEnabled
public static List<Task> loadTasks4(Id recordId){
    string userId = UserInfo.getUserId();
    return[SELECT Subject, ActivityDate FROM Task WHERE WhatId=:recordId And ActivityDate > TOMORROW AND ActivityDate <= Next_N_Days:2 AND OwnerId=:userId];
}

//OHNE DATE - Abfrage Tasks, wo kein Activity Date vorhanden ist//     
@AuraEnabled
public static List<Task> loadTasks5(Id recordId){
    string userId = UserInfo.getUserId();
    return[SELECT Subject, ActivityDate FROM Task WHERE WhatId=:recordId And ActivityDate = null AND OwnerId=:userId]; 
}
    
}