• jaishri
  • NEWBIE
  • 80 Points
  • Member since 2021

  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 16
    Questions
  • 30
    Replies
accountForm.html

<template>
    <div class="slds-grid slds-gutters">
        <div class="slds-col">
            <span>
                <lightning-input type="Currency" label="AnnualRevenue Start" value={revenueStart} name="AVStart"
                    onchange={handleChange} placeholder="Enter Value"></lightning-input>
            </span>
        </div>
        <div class="slds-col">
            <span>
                <lightning-input type="Currency" label="AnnualRevenue End" value={revenueEnd} name="AVEnd"
                    onchange={handleChange} placeholder="Enter Value"> </lightning-input>
            </span>
        </div>
        <div class="slds-col">
            <span>
                <template if:true={typeValues.data}>
                    <lightning-combobox name="Type" label="Type" value={value} options={typeValues.data.values}
                        onchange={handleChange} placeholder="Select Type">
                    </lightning-combobox>
                </template>
            </span>
        </div>
        <div class="slds-col">
            <span>
                <template if:true={ratingValues.data}>
                    <lightning-combobox name="Rating" label="Rating" value={value} options={ratingValues.data.values}
                        onchange={handleChange} placeholder="Select Rating">
                    </lightning-combobox>
                </template>
            </span>
        </div>
        <div class="slds-col">
            <span>
                <template if:true={industryValues.data}>
                    <lightning-combobox name="Industry" label="Industry" value={value}
                        options={industryValues.data.values} onchange={handleChange} placeholder="Select Industry">
                    </lightning-combobox>
                </template>
            </span>
        </div>
    </div>

    <lightning-button type="submit" variant="brand" label="Show Accounts" onclick={handleClick}></lightning-button>

    <template if:true={showSearchtable}>
        <lightning-datatable key-field="Id" data={accounts} columns={columns} onsave={handleSave}
            draft-values={draftValues} sorted-by={sortBy} sorted-direction={sortDirection} onsort={doSorting}
            hide-checkbox-column="true"></lightning-datatable>
    </template>
    
    <template if:true={showSearchComponent}>
        <p>No data to display</p>
    </template>

    <template if:true={loading}>
        <div class="slds-spinner_container">
            <lightning-spinner alternative-text="Loading" variant="brand" size="medium">
            </lightning-spinner>
        </div>
    </template>
    <div class="slds-m-around_medium">
        <p class="slds-m-vertical_medium content">
            Displaying {startingRecord} to {endingRecord} of {totalRecountCount} records.
            Page {page} of {totalPage}. </p>
        <c-paginator onprevious={previousHandler} onnext={nextHandler}></c-paginator>
    </div>
</template>
 
accountForm.js

import { LightningElement, wire, track, api } from 'lwc';

import { getPicklistValues } from 'lightning/uiObjectInfoApi';
import Type from '@salesforce/schema/Account.Type';
import Rating from '@salesforce/schema/Account.Rating';
import AnnualRevenue from '@salesforce/schema/Account.AnnualRevenue';
import ChangeRating__c from '@salesforce/schema/Account.ChangeRating__c';

import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import Industry from '@salesforce/schema/Account.Industry';

import getAccountList from '@salesforce/apex/AccountForm.getAccountList';



import { updateRecord } from 'lightning/uiRecordApi';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';


const columns = [
  { label: 'Account Name', fieldName: 'AccName', type: 'url', sortable: "true", typeAttributes: { label: { fieldName: 'Name' } } },
  { label: 'AnnualRevenue', fieldName: 'AnnualRevenue', type: 'currency', editable: true, sortable: "true" },

  { label: 'Industry', fieldName: 'Industry', editable: true, sortable: "true" },
  { label: 'Type', fieldName: 'Type', editable: true, sortable: "true" },
  { label: 'Rating', fieldName: 'Rating', type: 'picklist', editable: true, sortable: "true" },
  { label: 'Website', fieldName: 'Website', type: 'url', editable: true, sortable: "true" },
  { label: 'ChangeRating', fieldName: 'ChangeRating__c', type: 'number', editable: true, sortable: "true" }
];

let i = 0;
export default class AccountForm extends LightningElement {

  @track page = 1;
  @track items = [];
  @track columns;
  @track startingRecord = 1;
  @track endingRecord = 0;
  @track pageSize = 10;
  @track totalRecountCount = 0;
  @track totalPage = 0;

  @track accounts = [];
  @track showSearchComponent = false;
  @track showSearchtable;
  @track revenueStart;
  @track revenueEnd;
  @track loading = false;
  @track sortBy;
  @track sortDirection;

  @api recordId;
  columns = columns;
  draftValues = [];

  @wire(getObjectInfo, { objectApiName: ACCOUNT_OBJECT })
  accountInfo;
  nameVal;
  typeVal;
  industryVal;

  @wire(getPicklistValues, {
    recordTypeId: '$accountInfo.data.defaultRecordTypeId',
    fieldApiName: Type

  })
  typeValues;

  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Rating })
  ratingValues;

  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Industry })
  industryValues;


  handleChange(event) {
    var fieldname = event.target.label;
    if (fieldname == 'Rating') {
      this.nameVal = event.target.value;
    }
    else if (fieldname == 'Type') {
      this.typeVal = event.target.value;
    } else if (fieldname == 'Industry') {
      this.industryVal = event.target.value;
    }
    else if (fieldname == 'AnnualRevenue Start') {
      this.revenueStart = event.target.value;
    }
    else if (fieldname == 'AnnualRevenue End') {
      this.revenueEnd = event.target.value;
    }
  }

  handleClick() {
    this.showSearchComponent = true;
    this.loading = true;
    console.log('AnnualRevenueStart --> ', this.revenueStart);
    console.log('Anuual end --> ', this.revenueEnd);
    if (this.revenueEnd != null && this.revenueEnd != '' && this.revenueStart != null && this.revenueStart != '' && this.revenueEnd < this.revenueStart) {
      console.log('this.revenueEnd' + this.revenueEnd);
      this.loading = false;
      console.log('Alert message');
      const toastEvt = new ShowToastEvent({
        title: 'Error',
        message: 'AnnualRevenueEnd should not be lesser than AnnualRevenueStart',
        variant: 'error',

      });
      this.dispatchEvent(toastEvt);
    }
    else {
      getAccountList({ type: this.typeVal, rating: this.nameVal, industry: this.industryVal, AnnualRevenueStart: this.revenueStart, AnnualRevenueEnd: this.revenueEnd })
        .then(results => {
          if (results != null) {
            let tempAccList = [];
            results.forEach((result) => {
              let tempAccRec = Object.assign({}, result);
              tempAccRec.AccName = '/' + tempAccRec.Id;
              tempAccList.push(tempAccRec);
              this.showSearchComponent = false;
              this.showSearchtable = true;
              this.accounts = tempAccList;
            });
            if (accounts) {
              this.items = accounts;
              this.totalRecountCount = accounts.length;
              this.totalPage = Math.ceil(this.totalRecountCount / this.pageSize);
              this.accounts = this.items.slice(0, this.pageSize);
              this.endingRecord = this.pageSize;
              this.columns = columns;

              this.error = undefined;
            } else if (error) {
              this.error = error;
              this.accounts = undefined;
            }
          }
          else {
            this.showSearchtable = false;
            this.showSearchComponent = true;
          }
          this.loading = false;
        })
        .catch(error => {
          console.log('error' + error);
          this.loading = false;
        })
    }
  }

  handleSave(event) {
    const recordInputs = event.detail.draftValues.slice().map(draft => {
      const fields = Object.assign({}, draft);
      return { fields };
    });

    const promises = recordInputs.map(recordInput => updateRecord(recordInput));
    Promise.all(promises).then(accounts => {
      this.dispatchEvent(
        new ShowToastEvent({
          title: 'Success',
          message: 'Accounts updated',
          variant: 'success'
        })
      );
      // Clear all draft values
      this.draftValues = [];

      // Display fresh data in the 
      this.handleClick();

    }).catch(error => {
      // Handle error
    });
  }

  doSorting(event) {
    this.sortBy = event.detail.fieldName;
    this.sortDirection = event.detail.sortDirection;
    this.sortData(this.sortBy, this.sortDirection);
  }

  sortData(fieldname, direction) {
    let parseData = JSON.parse(JSON.stringify(this.accounts));

    let keyValue = (a) => {
      return a[fieldname];
    };

    let isReverse = direction === 'asc' ? 1 : -1;

    parseData.sort((x, y) => {
      x = keyValue(x) ? keyValue(x) : '';
      y = keyValue(y) ? keyValue(y) : '';

      return isReverse * ((x > y) - (y > x));
    });
    this.accounts = parseData;
  }

  previousHandler() {
    if (this.page > 1) {
      this.page = this.page - 1;
      this.displayRecordPerPage(this.page);
    }
  }
  nextHandler() {
    if ((this.page < this.totalPage) && this.page !== this.totalPage) {
      this.page = this.page + 1;
      this.displayRecordPerPage(this.page);
    }
  }
  displayRecordPerPage(page) {
    this.startingRecord = ((page - 1) * this.pageSize);
    this.endingRecord = (this.pageSize * page);
    this.endingRecord = (this.endingRecord > this.totalRecountCount)
      ? this.totalRecountCount : this.endingRecord;
    this.accounts = this.items.slice(this.startingRecord, this.endingRecord);
    this.startingRecord = this.startingRecord + 1;
  }
}
 
AccountForm.cls

public with sharing class AccountForm {
    @AuraEnabled
    public static List<Account>  getAccountList(String type,String rating,String industry,String AnnualRevenueStart,String AnnualRevenueEnd){
        System.debug('AnnualRevenueStart='+AnnualRevenueStart);
        System.debug('AnnualRevenueEnd='+AnnualRevenueEnd);
        String accQuery = 'SELECT Id,Name,Website,Type,Rating,AnnualRevenue,Industry,ChangeRating__c FROM Account';                     
        String whereClause  = '';
        String Query1;
        Integer arStart;
        if(String.isNotEmpty(AnnualRevenueStart)){
            arStart = Integer.valueOf(AnnualRevenueStart);
        }
        Integer arEnd;
        if(String.isNotEmpty(AnnualRevenueEnd)){
            arEnd = Integer.valueOf(AnnualRevenueEnd);
        }
        if(arStart!=Null){
            whereClause=whereClause+' where AnnualRevenue>=:arStart';
        }
        if(arEnd!=Null){
            if(String.isEmpty(whereClause)){
                whereClause=whereClause+' WHERE AnnualRevenue<=:arEnd';
            }
            else 
            {
                whereClause=whereClause+' AND AnnualRevenue<=:arEnd';
            }
        }
        if(String.isNotEmpty(type)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Type = :type';
            }else{
                whereClause =whereClause + ' AND Type = :type';
            }
            
        }
        if(String.isNotEmpty(rating)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Rating = :rating';
            }else{
                whereClause =whereClause + ' AND Rating = :rating';
            }
        } 
        if(String.isNotEmpty(industry)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Industry = :industry';
            }else{
                whereClause =whereClause + ' AND Industry = :industry';
            }
            
        } 
        String finalquery = accQuery+whereClause;
        System.debug('finalquery='+finalquery);
        
        List<Account> acclist=Database.query(finalquery);
        if(acclist.size()>0){
            return acclist;
        }
        else {
            return null;
            
        }
    }  
}
 
paginator.html

<template>
    <lightning-layout>
        <lightning-layout-item>
            <lightning-button label="Previous" icon-name="utility:chevronleft" onclick={previousHandler}></lightning-button>
        </lightning-layout-item>
        <lightning-layout-item flexibility="grow"></lightning-layout-item>
        <lightning-layout-item>
            <lightning-button label="Next" icon-name="utility:chevronright" icon-position="right" onclick={nextHandler}></lightning-button>
        </lightning-layout-item>
    </lightning-layout>
</template>
 
paginator.js

import { LightningElement} from 'lwc';

export default class Paginator extends LightningElement {
    previousHandler() {
        this.dispatchEvent(new CustomEvent('previous'));
    }

    nextHandler() {
        this.dispatchEvent(new CustomEvent('next'));
    }
}

 
<template>
    <div class="slds-p-around_medium lgc-bg">
        <lightning-input type="Currency" label="AnnualRevenue Start" value={revenueStart} name="AVStart"
            onchange={handleChange}></lightning-input>
    </div>

    <div class="slds-p-around_medium lgc-bg">
        <lightning-input type="Currency" label="AnnualRevenue End" value={revenueEnd} name="AVEnd"
            onchange={handleChange}> </lightning-input>

    </div>

    <div class="slds-p-around_medium lgc-bg">
        <template if:true={typeValues.data}>
            <lightning-combobox name="Type" label="Type" value={value} options={typeValues.data.values}
                onchange={handleChange}>
            </lightning-combobox>
        </template>
    </div>

    <div class="slds-p-around_medium lgc-bg">
        <template if:true={ratingValues.data}>
            <lightning-combobox name="Rating" label="Rating" value={value} options={ratingValues.data.values}
                onchange={handleChange}>
            </lightning-combobox>
        </template>
    </div>

    <div class="slds-p-around_medium lgc-bg">
        <template if:true={industryValues.data}>
            <lightning-combobox name="Industry" label="Industry" value={value} options={industryValues.data.values}
                onchange={handleChange}>
            </lightning-combobox>
        </template>
    </div>

    <lightning-button type="submit" variant="brand" label="Show Accounts" onclick={handleClick}></lightning-button>
    
    <template if:true={showSearchComponent}>
        <lightning-datatable key-field="Id" data={accounts} columns={columns} onsave={handleSave}
            draft-values={draftValues} hide-checkbox-column="true"></lightning-datatable>
    </template>

    <template if:false={accounts}>
        <p>No data to display</p>
    </template>

    <template if:true={loading}>
        <div class="slds-spinner_container">
            <lightning-spinner alternative-text="Loading" variant="brand" size="medium">
            </lightning-spinner>
        </div>
    </template>
</template>
 
import { LightningElement, wire, track, api } from 'lwc';

import { getPicklistValues } from 'lightning/uiObjectInfoApi';
import Type from '@salesforce/schema/Account.Type';
import Rating from '@salesforce/schema/Account.Rating';
import AnnualRevenue from '@salesforce/schema/Account.AnnualRevenue';

// import ChangeRating__c from '@salesforce/schema/Account.ChangeRating__c';

import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import Industry from '@salesforce/schema/Account.Industry';

import getAccountList from '@salesforce/apex/AccountForm.getAccountList';

//import getAccounts from '@salesforce/apex/AccountForm.getAccounts';
import { updateRecord } from 'lightning/uiRecordApi';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { refreshApex } from '@salesforce/apex';

const columns = [
  { label: 'Account Name', fieldName: 'AccName', type: 'url', typeAttributes: { label: { fieldName: 'Name' } } },
  { label: 'AnnualRevenue', fieldName: 'AnnualRevenue', type: 'currency', editable: true },
  { label: 'Industry', fieldName: 'Industry' },
  { label: 'Type', fieldName: 'Type', editable: true },
  { label: 'Rating', fieldName: 'Rating', type: 'picklist', editable: true },
  { label: 'Website', fieldName: 'Website', type: 'url', editable: true },
  { label: 'ChangeRating', fieldName: 'ChangeRating__c', type: 'number', editable: true }
];

export default class AccountForm extends LightningElement {

  @track accounts;
  @track showSearchComponent = false;
  @track loading = false;
  @track revenueStart;
  @track revenueEnd;
  @api recordId;
  columns = columns;
  draftValues = [];
  accounts ;

  error;
  empty = false;


  @wire(getObjectInfo, { objectApiName: ACCOUNT_OBJECT })
  accountInfo;
  nameVal;
  typeVal;
  industryVal;


  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Type })
  typeValues;

  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Rating })
  ratingValues;

  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Industry })
  industryValues;


  handleChange(event) {
    var fieldname = event.target.label;
    if (fieldname == 'Rating') {
      this.nameVal = event.target.value;
    } else if (fieldname == 'Type') {
      this.typeVal = event.target.value;
    } else if (fieldname == 'Industry') {
      this.industryVal = event.target.value;
    } else if (fieldname == 'AnnualRevenue Start') {
      this.revenueStart = event.target.value;
    } else if (fieldname == 'AnnualRevenue End') {
      this.revenueEnd = event.target.value;
    }
  }

  handleClick() {
    // console.log('buttom clicked');
    this.showSearchComponent = true;
    this.loading = true;
    //console.log('type--> '+this.typeVal+' rating--> '+this.nameVal+' industry--> '+this.industryVal);
    getAccountList({ type: this.typeVal, rating: this.nameVal, industry: this.industryVal, AnnualRevenueStart: this.revenueStart, AnnualRevenueEnd: this.revenueEnd })
      .then(results => {
        // console.log('account result--> '+JSON.stringify(result))
        let tempAccList = [];

        results.forEach((result) => {
          let tempAccRec = Object.assign({}, result);
          tempAccRec.AccName = '/' + tempAccRec.Id;
          tempAccList.push(tempAccRec);

        });
            this.accounts = tempAccList
        //  this.accounts=result;
            this.loading = false;
      })
      .catch(error => {
        console.log('error' + error);
        this.loading = false;
      })


  }


  handleSave(event) {
    const recordInputs = event.detail.draftValues.slice().map(draft => {
      const fields = Object.assign({}, draft);
      return { fields };
    });

    const promises = recordInputs.map(recordInput => updateRecord(recordInput));
    Promise.all(promises).then(accounts => {
      this.dispatchEvent(
        new ShowToastEvent({
          title: 'Success',
          message: 'Accounts updated',
          variant: 'success'
        })

      );
      // Clear all draft values
      this.draftValues = [];

      // Display fresh data in the datatable
      return refreshApex(this.accounts);
    }).catch(error => {
      // Handle error
    });
  }

public with sharing class AccountForm {
    @AuraEnabled
    public static List<Account>  getAccountList(String type,String rating,String industry,Integer AnnualRevenueStart,Integer AnnualRevenueEnd){
        String accQuery = 'SELECT Id,Name,Type,Rating,AnnualRevenue FROM Account';                     
        String whereClause  = '';
        
     /*   if(AnnualRevenueStart>=30000){
            whereClause =whereClause +' where AnnualRevenue>=30000';
        }
       if(AnnualRevenueEnd<=100000){
            whereClause =whereClause +' AND AnnualRevenue<=100000';
            
        }*/

        if(AnnualRevenueStart!=Null){
            whereClause=whereClause+' where AnnualRevenue>=:AnnualRevenueStart';
        }
        if(AnnualRevenueEnd!=Null){
            if(String.isEmpty(whereClause)){
            whereClause=whereClause+' WHERE AnnualRevenue<=:AnnualRevenueEnd';
        }
        else 
            {
                whereClause=whereClause+' AND AnnualRevenue<=:AnnualRevenueEnd';
            }
        }

        if(String.isNotEmpty(type)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Type = :type';
            }else{
                whereClause =whereClause + ' AND Type = :type';
            }
            
        }
        if(String.isNotEmpty(rating)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Rating = :rating';
            }else{
                whereClause =whereClause + ' AND Rating = :rating';
            }
        } 
        if(String.isNotEmpty(industry)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Industry = :industry';
            }else{
                whereClause =whereClause + ' AND Industry = :industry';
            }
            
        } 
        String finalquery = accQuery+whereClause;
        System.debug('finalquery='+finalquery);
        
        List<Account> acclist=Database.query(finalquery);
        
        return acclist;
        
    }
}
I have build lwc component which show datatable when i give the input in field but when i change field data in row it is also save in datatable but the data is showing after refresh the whole page after saving the field it is not updating in UI Page.....can anyone help me

 
accountForm.html

<template>
    <div class="slds-p-around_medium lgc-bg">
        <lightning-input type="Currency" label="AnnualRevenue Start"></lightning-input>
    </div>
    <div class="slds-p-around_medium lgc-bg">
         <lightning-input type="Currency" label="AnnualRevenue End"></lightning-input>
    </div>
    <div class="slds-p-around_medium lgc-bg">
        <template if:true={typeValues.data}>
            <lightning-combobox name="Type" label="Type" value={value} 
                options={typeValues.data.values} onchange={handleChange} >
            </lightning-combobox>
        </template>
    </div>
    <div class="slds-p-around_medium lgc-bg">
        <template if:true={ratingValues.data}>
            <lightning-combobox name="Rating" label="Rating" value={value} 
                options={ratingValues.data.values} onchange={handleChange} >
            </lightning-combobox>
        </template>
    </div>
    <div class="slds-p-around_medium lgc-bg">
        <template if:true={industryValues.data}>
            <lightning-combobox name="Industry" label="Industry" value={value} 
                options={industryValues.data.values} onchange={handleChange}>
            </lightning-combobox>
        </template>
    </div>

    <lightning-button type="submit" variant="brand" label="Show Accounts" onclick={handleClick}  ></lightning-button>
    <c-account-datatable if:true={showSearchComponent}></c-account-datatable>
</template>


accountForm.js

import { LightningElement, wire,track } from 'lwc';

import { getPicklistValues } from 'lightning/uiObjectInfoApi';
import Type from '@salesforce/schema/Account.Type';
import Rating from '@salesforce/schema/Account.Rating';

import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import Industry from '@salesforce/schema/Account.Industry';

export default class AccountForm extends LightningElement {
    @track showSearchComponent = false;
    searchKey = '';
    accounts;
    error;

    @wire(getObjectInfo, { objectApiName: ACCOUNT_OBJECT })
    accountInfo;
    nameVal;
    typeVal;
    industryVal;

    @wire(getPicklistValues, {
        recordTypeId: '$accountInfo.data.defaultRecordTypeId',
        fieldApiName: Type

    })
    typeValues;

    @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Rating })
    ratingValues;

    @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Industry })
    industryValues;


    handleChange(event){
        var fieldname = event.target.label;
       if(fieldname == 'Rating'){
         this.nameVal= event.target.value;
       }
       else if(fieldname == 'Type'){
        this.typeVal = event.target.value;
      }else if (fieldname == 'Industry'){
        this.industryVal = event.target.value;
      }


      if(this.nameVal== 'Hot' && this.typeVal == 'Prospect' && this.industryVal =='Agriculture'){
        this.hideBtn = true;
        
      }else{
        this.hideBtn = false;
      }
    }
    handleonchange(event){
        this.searchKey = event.target.value;
    }
    handleClick() {
        this.showSearchComponent = true;
        findAccountList({keyword: this.searchKey})
        .then((result) =>{
            this.accounts = result;
            this.error = undefined;
        })
        .catch((error)=>{
            this.error = error;
            this.accounts = undefined;
        });
    }   
}

accountDatatble.html

<template>
    <lightning-datatable
    key-field="Id"
    data={accounts.data}
    columns={columns} ></lightning-datatable>
</template>

accountDatatble.js

import { LightningElement, wire } from 'lwc';
import getAccountList from '@salesforce/apex/AccountForm.getAccountList';

const columns = [
{ label: 'AnnualRevenue', fieldName: 'AnnualRevenue', type:'currency' },
{ label: 'Industry', fieldName: 'Industry' },
{ label: 'Type', fieldName: 'Type' },
{ label: 'Rating', fieldName: 'Rating', type: 'picklist' },
{ label: 'Website', fieldName: 'Website', type: 'url' },
];
export default class AccountDatatble extends LightningElement {
error;
columns = columns;

@wire(getAccountList)
accounts;
}

AccountForm.cls

 public with sharing class AccountForm {
  @AuraEnabled(cacheable=true)
  public static List<Account> getAccountList(String searchKey) {
    String key = '%' + searchKey + '%';
      return [SELECT Id, Industry, Type, Rating, AnnualRevenue,Website  FROM Account  WHERE Type = :searchKey LIMIT 10];
  }

 
Test Class 

@isTest
    public static void testmethod3(){
        contact con = new contact();
        con.LastName = 'Test contact';
        con.Email = 'sample@sample.com';
        insert con;
        List<Case> caseList = new List<Case>();
        for(Integer i=1; i<=200 ; i++){
            Case cs = new Case();
            cs.Status = 'New';
            cs.Origin = 'Phone';
            cs.ContactId =con.Id;
            caseList.add(cs);
        }
        
          Test.startTest();
          insert caseList;
          Test.stopTest();
    
}

 
Trigger

trigger CaseTrigger on Case (after insert,after delete) {
    system.debug('trigger value--> '+Trigger.isDelete+'and--> '+Trigger.IsAfter);
    CaseTriggerHandler CaseHandler = new CaseTriggerHandler();
    if(Trigger.isInsert&&Trigger.IsAfter){
        system.debug('inside insert trigger');
        CaseHandler.AfterInsert(Trigger.new);
    }
    if(Trigger.isDelete&&Trigger.IsAfter){
        system.debug('inside isDelete trigger');
        CaseHandler.AfterDelete(Trigger.old);
    }
 
Handler class 
  
   public class CaseTriggerHandler {
    public void AfterInsert(List<Case> case1){
        system.debug('inside CaseTriggerHandler insert trigger '+case1);
        List<Messaging.SingleEmailMessage> emails = new List<Messaging.SingleEmailMessage>();
        
        TestEmailCase__mdt testEmail = [select id, Label,NamespacePrefix,To_Address__c from TestEmailCase__mdt];
        system.debug('test case list -->'+testEmail); 
        for(Case ca:case1){
            system.debug('test email start -->'+testEmail.To_Address__c); 
            Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
            List<String> eid = new List<String>();
            
            eid.add(testEmail.To_Address__c);
            email.setToAddresses(eid);
            email.setSubject('case create');
            email.setPlainTextBody('case created');
            emails.add(email);
            system.debug('test email end -->'); 
        }
        Messaging.sendEmail(emails);
    }
    public void AfterDelete(List<Case> case1){
        List<Messaging.SingleEmailMessage> emails = new List<Messaging.SingleEmailMessage>();
        
        TestEmailCase__mdt testEmail = [select id, Label,NamespacePrefix,To_Address__c from TestEmailCase__mdt];
        system.debug(testEmail);
        
        for(Case ca:case1){
            Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
            List<String> eid = new List<String>();
            
            eid.add(testEmail.To_Address__c);
            email.setToAddresses(eid);
            email.setSubject('case deleted');
            email.setPlainTextBody('case deleted');
            emails.add(email);
        }
        Messaging.sendEmail(emails);
    }
}
 
Test Class
    
  @isTest
public class CaseTriggerHandler_Test_class{

     @isTest static void setup() {
        // Create common test accounts
        List<Case> testCase = new List<Case>();
        for(Integer i=0;i<1;i++) {
            Case cas = new Case();  
            cas.Origin='Email';
            cas.Subject='Test Case';
            cas.Status = 'Closed case';
            cas.To_Address__c = 'sample@sample.com';
            testCase.add(cas);
        }
        insert testCase;  
        
        Delete testCase;
        
    }

 
Trigger:
trigger CaseEmail on Case (after insert, after update,before delete) {
    
   If((Trigger.isUpdate || Trigger.isinsert) && Trigger.isafter){//This line will allow only if the record is created or edited
	CaseEmailHandler.sendemailforInsrtupdate(Trigger.new);
   }
    if(Trigger.isDelete && Trigger.isBefore){// if the case is deleted we have to send an email so using this line and we used before because after deletion we cannot send email 
	CaseEmailHandler.sendemailfordelete(Trigger.old);
}
    }
 
Handler:
 
public class CaseEmailHandler {

    public static void sendemailforInsrtupdate(List<Case> caselist){
            Set<Id> conIds = new Set<Id>();
    List<Messaging.SingleEmailMessage> mails = new List<Messaging.SingleEmailMessage>();
    for (Case c: caselist) {
        conIds.add(c.ContactId);//adding the contact id so we can get the contact email for the case
   }
    Map<Id, Contact> conMap = new Map<Id, Contact>([SELECT Id, Email FROM Contact WHERE Id In :conIds]);// quering the contact so we get the contact email
    
    for (Case c : caselist) {
        if (c.status == 'Closed') {// checking if the status is closed in case of create or edit scenerio
            Contact relatedCaseContact = conMap.get(c.ContactId);//getting the contact information related to particular case
            
            Messaging.SingleEmailMessage CaseNotificationmail = new Messaging.SingleEmailMessage();  
            CaseNotificationmail.setToAddresses(new List<String> { relatedCaseContact.Email });//adding to address
            CaseNotificationmail.setReplyTo('sample@salesforce.com');//adding reply to  address
            CaseNotificationmail.setSenderDisplayName('Salesforce');  //adding display name          
            
            CaseNotificationmail.setSubject(' Case Status updation  ' + 'Changed to ' + c.status + ' Case Number:' + c.CaseNumber);//adding subject
            CaseNotificationmail.setPlainTextBody(' Your case Status for Case Number: ' + c.CaseNumber + '  Related Case Contact:' +c.ContactId +' has been closed '); //adding body of the email
            mails.add(CaseNotificationmail); //adding the notification to the list so all the emails can be sent once
        }
        
        if(Trigger.isinsert && Trigger.isafter){// as we need a notification when a case is craeted
            Contact relatedCaseContact = conMap.get(c.ContactId);
                   Messaging.SingleEmailMessage mail =  new Messaging.SingleEmailMessage();
        mail.setToAddresses(new List<String> { relatedCaseContact.Email });
        mail.setSubject('New Case Create: '+ c.CaseNumber);
        String body = 'Case is created. Thank you for contacting us';
        mail.setHtmlBody(body);
        mails.add(mail);
        }
    }
 Messaging.sendEmail(mails);//sending the emails at once   
    }
    public static void sendemailfordelete(List<Case> caselist){
               Set<Id> conIds = new Set<Id>();
         for (Case c: caselist) {
        conIds.add(c.ContactId);
   }
      List<Messaging.SingleEmailMessage> emails = new List<Messaging.SingleEmailMessage>();
         Map<Id, Contact> conMp = new Map<Id, Contact>([SELECT Id, Email FROM Contact WHERE Id In :conIds]);
        
    for (Case cs : caselist) {
         Contact relatedCaseContact = conMp.get(cs.ContactId);
        Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
        
        email.setToAddresses(new List<String> { relatedCaseContact.Email  });
        email.setSubject('Case Deleted');
        email.setPlainTextBody('This message is to alert you that the Case number' + cs.CaseNumber + ' has been deleted. Thank you for contacting us.');
        emails.add(email);
    }
    Messaging.sendEmail(emails);
    }
    
}

 
trigger CaseEmail on Case (after insert, after update,before delete) {
    
   If((Trigger.isUpdate || Trigger.isinsert) && Trigger.isafter){
       Set<Id> conIds = new Set<Id>();
    List<Messaging.SingleEmailMessage> mails = new List<Messaging.SingleEmailMessage>();
    for (Case c: trigger.new) {
        conIds.add(c.ContactId);
   }
    Map<Id, Contact> conMap = new Map<Id, Contact>([SELECT Id, Email FROM Contact WHERE Id In :conIds]);
    
    for (Case c : trigger.new) {
        if (c.status == 'Closed') {
            Contact relatedCaseContact = conMap.get(c.ContactId);
            
            Messaging.SingleEmailMessage CaseNotificationmail = new Messaging.SingleEmailMessage();  
            CaseNotificationmail.setToAddresses(new List<String> { relatedCaseContact.Email });
            CaseNotificationmail.setReplyTo('jayati.shukla.sbg@gmail.com');
            CaseNotificationmail.setSenderDisplayName('Salesforce');            
            
            CaseNotificationmail.setSubject(' Case Status updation  ' + 'Changed to ' + c.status + ' Case Number:' + c.CaseNumber);
            CaseNotificationmail.setPlainTextBody(' Your case Status for Case Number: ' + c.CaseNumber + '  Related Case Contact:' +c.ContactId +' has been closed '); 
            mails.add(CaseNotificationmail); 
        }
        
        if(Trigger.isinsert && Trigger.isafter){
            Contact relatedCaseContact = conMap.get(c.ContactId);
                   Messaging.SingleEmailMessage mail =  new Messaging.SingleEmailMessage();
        mail.setToAddresses(new List<String> { relatedCaseContact.Email });
        mail.setSubject('New Case Create: '+ c.CaseNumber);
        String body = 'Case is created. Thank you for contacting us';
        mail.setHtmlBody(body);
        mails.add(mail);
        }
    }
 Messaging.sendEmail(mails);
   }
    if(Trigger.isDelete && Trigger.isBefore){
       Set<Id> conIds = new Set<Id>();
      List<Messaging.SingleEmailMessage> emails = new List<Messaging.SingleEmailMessage>();
         Map<Id, Contact> conMp = new Map<Id, Contact>([SELECT Id, Email FROM Contact WHERE Id In :conIds]);
        
    for (Case cs : Trigger.old) {
         Contact relatedCaseContact = conMp.get(cs.ContactId);
        Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
        
        email.setToAddresses(new List<String> { relatedCaseContact.Email  });
        email.setSubject('Case Deleted');
        email.setPlainTextBody('This message is to alert you that the Case number' + cs.CaseNumber + ' has been deleted. Thank you for contacting us.');
        emails.add(email);
    }
    Messaging.sendEmail(emails);
}
    }
<template>
   <lightning-card title="File" icon-name="standard : Files">
     <div class="slds‐m‐around_small">
      <template if:true={filesList}>
         <table class="slds-table slds-table_bordered slds-table_cell-buffer">
            <thead>
               <tr class="slds-text-title_caps">
                  <th scope="col">
                     <div title="Key">File Name</div>
                  </th>
                  <th scope="col">
                     <div title="Value">File Extension</div>
                  </th>
               </tr>
            </thead>
            <tbody>
               <template for:each={filesList} for:item="keyValue">
                  <tr key={keyValue.Id}>
                     <th scope="col">
                        <div>{keyValue.Title}</div>
                     </th>
                     <th scope="col">
                        <div>{keyValue.FileExtension}</div>
                     </th>
                  </tr>
               </template>
            </tbody>
         </table>
      </template>
      </div>
   </lightning-card>
</template>

import { LightningElement,api,wire } from 'lwc';
import queryFiles from '@salesforce/apex/filePreviewAndDownloadController.queryFiles'
export default class FileList extends LightningElement {
    @api recordId;
    wiredActivities;
    filesList =[];
    @wire(queryFiles, {recId: '$recordId'})
    wiredclass(value){
        this.wiredActivities = value;
        const { data, error } = value;
        if (data) {
            console.log(data)
            this.filesList = data;
            console.log('Data========> '+JSON.stringify(this.filesList));
        }
        if(error){
            console.log(error);
        }
    }
}
   

public with sharing class filePreviewAndDownloadController {
    @AuraEnabled(cacheable = true)
    public Static  List<ContentVersion> queryFiles(String recId){
        set<Id> SetIds = new Set<id>();
        list<Account> lstAccount = [Select Id,(Select Id From Contacts),(Select Id From Opportunities) from Account where Id = :recId];
        for(Account Acc : lstAccount){
            SetIds.add(Acc.Id);
            for(Contact con : Acc.Contacts){
            SetIds.add(con.Id);
            }
            for(Opportunity opp : Acc.Opportunities){
            SetIds.add(opp.Id);
            }
        }
           List<ContentDocumentLink> files = [SELECT ContentDocumentId FROM ContentDocumentLink WHERE LinkedEntityId = :SetIds];
            List<ID> fileIDs = new List<ID>();
            for (ContentDocumentLink docLink : files) {
                fileIDs.add(docLink.ContentDocumentId);
            }
            List<ContentVersion> docs = [SELECT Id,ContentDocumentId, FileExtension, Title
                                         FROM ContentVersion WHERE ContentDocumentId IN :fileIDs];
         
            return docs;
    }
}
 
accountForm.html

<template>
    <div class="slds-grid slds-gutters">
        <div class="slds-col">
            <span>
                <lightning-input type="Currency" label="AnnualRevenue Start" value={revenueStart} name="AVStart"
                    onchange={handleChange} placeholder="Enter Value"></lightning-input>
            </span>
        </div>
        <div class="slds-col">
            <span>
                <lightning-input type="Currency" label="AnnualRevenue End" value={revenueEnd} name="AVEnd"
                    onchange={handleChange} placeholder="Enter Value"> </lightning-input>
            </span>
        </div>
        <div class="slds-col">
            <span>
                <template if:true={typeValues.data}>
                    <lightning-combobox name="Type" label="Type" value={value} options={typeValues.data.values}
                        onchange={handleChange} placeholder="Select Type">
                    </lightning-combobox>
                </template>
            </span>
        </div>
        <div class="slds-col">
            <span>
                <template if:true={ratingValues.data}>
                    <lightning-combobox name="Rating" label="Rating" value={value} options={ratingValues.data.values}
                        onchange={handleChange} placeholder="Select Rating">
                    </lightning-combobox>
                </template>
            </span>
        </div>
        <div class="slds-col">
            <span>
                <template if:true={industryValues.data}>
                    <lightning-combobox name="Industry" label="Industry" value={value}
                        options={industryValues.data.values} onchange={handleChange} placeholder="Select Industry">
                    </lightning-combobox>
                </template>
            </span>
        </div>
    </div>

    <lightning-button type="submit" variant="brand" label="Show Accounts" onclick={handleClick}></lightning-button>

    <template if:true={showSearchtable}>
        <lightning-datatable key-field="Id" data={accounts} columns={columns} onsave={handleSave}
            draft-values={draftValues} sorted-by={sortBy} sorted-direction={sortDirection} onsort={doSorting}
            hide-checkbox-column="true"></lightning-datatable>
    </template>
    
    <template if:true={showSearchComponent}>
        <p>No data to display</p>
    </template>

    <template if:true={loading}>
        <div class="slds-spinner_container">
            <lightning-spinner alternative-text="Loading" variant="brand" size="medium">
            </lightning-spinner>
        </div>
    </template>
    <div class="slds-m-around_medium">
        <p class="slds-m-vertical_medium content">
            Displaying {startingRecord} to {endingRecord} of {totalRecountCount} records.
            Page {page} of {totalPage}. </p>
        <c-paginator onprevious={previousHandler} onnext={nextHandler}></c-paginator>
    </div>
</template>
 
accountForm.js

import { LightningElement, wire, track, api } from 'lwc';

import { getPicklistValues } from 'lightning/uiObjectInfoApi';
import Type from '@salesforce/schema/Account.Type';
import Rating from '@salesforce/schema/Account.Rating';
import AnnualRevenue from '@salesforce/schema/Account.AnnualRevenue';
import ChangeRating__c from '@salesforce/schema/Account.ChangeRating__c';

import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import Industry from '@salesforce/schema/Account.Industry';

import getAccountList from '@salesforce/apex/AccountForm.getAccountList';



import { updateRecord } from 'lightning/uiRecordApi';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';


const columns = [
  { label: 'Account Name', fieldName: 'AccName', type: 'url', sortable: "true", typeAttributes: { label: { fieldName: 'Name' } } },
  { label: 'AnnualRevenue', fieldName: 'AnnualRevenue', type: 'currency', editable: true, sortable: "true" },

  { label: 'Industry', fieldName: 'Industry', editable: true, sortable: "true" },
  { label: 'Type', fieldName: 'Type', editable: true, sortable: "true" },
  { label: 'Rating', fieldName: 'Rating', type: 'picklist', editable: true, sortable: "true" },
  { label: 'Website', fieldName: 'Website', type: 'url', editable: true, sortable: "true" },
  { label: 'ChangeRating', fieldName: 'ChangeRating__c', type: 'number', editable: true, sortable: "true" }
];

let i = 0;
export default class AccountForm extends LightningElement {

  @track page = 1;
  @track items = [];
  @track columns;
  @track startingRecord = 1;
  @track endingRecord = 0;
  @track pageSize = 10;
  @track totalRecountCount = 0;
  @track totalPage = 0;

  @track accounts = [];
  @track showSearchComponent = false;
  @track showSearchtable;
  @track revenueStart;
  @track revenueEnd;
  @track loading = false;
  @track sortBy;
  @track sortDirection;

  @api recordId;
  columns = columns;
  draftValues = [];

  @wire(getObjectInfo, { objectApiName: ACCOUNT_OBJECT })
  accountInfo;
  nameVal;
  typeVal;
  industryVal;

  @wire(getPicklistValues, {
    recordTypeId: '$accountInfo.data.defaultRecordTypeId',
    fieldApiName: Type

  })
  typeValues;

  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Rating })
  ratingValues;

  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Industry })
  industryValues;


  handleChange(event) {
    var fieldname = event.target.label;
    if (fieldname == 'Rating') {
      this.nameVal = event.target.value;
    }
    else if (fieldname == 'Type') {
      this.typeVal = event.target.value;
    } else if (fieldname == 'Industry') {
      this.industryVal = event.target.value;
    }
    else if (fieldname == 'AnnualRevenue Start') {
      this.revenueStart = event.target.value;
    }
    else if (fieldname == 'AnnualRevenue End') {
      this.revenueEnd = event.target.value;
    }
  }

  handleClick() {
    this.showSearchComponent = true;
    this.loading = true;
    console.log('AnnualRevenueStart --> ', this.revenueStart);
    console.log('Anuual end --> ', this.revenueEnd);
    if (this.revenueEnd != null && this.revenueEnd != '' && this.revenueStart != null && this.revenueStart != '' && this.revenueEnd < this.revenueStart) {
      console.log('this.revenueEnd' + this.revenueEnd);
      this.loading = false;
      console.log('Alert message');
      const toastEvt = new ShowToastEvent({
        title: 'Error',
        message: 'AnnualRevenueEnd should not be lesser than AnnualRevenueStart',
        variant: 'error',

      });
      this.dispatchEvent(toastEvt);
    }
    else {
      getAccountList({ type: this.typeVal, rating: this.nameVal, industry: this.industryVal, AnnualRevenueStart: this.revenueStart, AnnualRevenueEnd: this.revenueEnd })
        .then(results => {
          if (results != null) {
            let tempAccList = [];
            results.forEach((result) => {
              let tempAccRec = Object.assign({}, result);
              tempAccRec.AccName = '/' + tempAccRec.Id;
              tempAccList.push(tempAccRec);
              this.showSearchComponent = false;
              this.showSearchtable = true;
              this.accounts = tempAccList;
            });
            if (accounts) {
              this.items = accounts;
              this.totalRecountCount = accounts.length;
              this.totalPage = Math.ceil(this.totalRecountCount / this.pageSize);
              this.accounts = this.items.slice(0, this.pageSize);
              this.endingRecord = this.pageSize;
              this.columns = columns;

              this.error = undefined;
            } else if (error) {
              this.error = error;
              this.accounts = undefined;
            }
          }
          else {
            this.showSearchtable = false;
            this.showSearchComponent = true;
          }
          this.loading = false;
        })
        .catch(error => {
          console.log('error' + error);
          this.loading = false;
        })
    }
  }

  handleSave(event) {
    const recordInputs = event.detail.draftValues.slice().map(draft => {
      const fields = Object.assign({}, draft);
      return { fields };
    });

    const promises = recordInputs.map(recordInput => updateRecord(recordInput));
    Promise.all(promises).then(accounts => {
      this.dispatchEvent(
        new ShowToastEvent({
          title: 'Success',
          message: 'Accounts updated',
          variant: 'success'
        })
      );
      // Clear all draft values
      this.draftValues = [];

      // Display fresh data in the 
      this.handleClick();

    }).catch(error => {
      // Handle error
    });
  }

  doSorting(event) {
    this.sortBy = event.detail.fieldName;
    this.sortDirection = event.detail.sortDirection;
    this.sortData(this.sortBy, this.sortDirection);
  }

  sortData(fieldname, direction) {
    let parseData = JSON.parse(JSON.stringify(this.accounts));

    let keyValue = (a) => {
      return a[fieldname];
    };

    let isReverse = direction === 'asc' ? 1 : -1;

    parseData.sort((x, y) => {
      x = keyValue(x) ? keyValue(x) : '';
      y = keyValue(y) ? keyValue(y) : '';

      return isReverse * ((x > y) - (y > x));
    });
    this.accounts = parseData;
  }

  previousHandler() {
    if (this.page > 1) {
      this.page = this.page - 1;
      this.displayRecordPerPage(this.page);
    }
  }
  nextHandler() {
    if ((this.page < this.totalPage) && this.page !== this.totalPage) {
      this.page = this.page + 1;
      this.displayRecordPerPage(this.page);
    }
  }
  displayRecordPerPage(page) {
    this.startingRecord = ((page - 1) * this.pageSize);
    this.endingRecord = (this.pageSize * page);
    this.endingRecord = (this.endingRecord > this.totalRecountCount)
      ? this.totalRecountCount : this.endingRecord;
    this.accounts = this.items.slice(this.startingRecord, this.endingRecord);
    this.startingRecord = this.startingRecord + 1;
  }
}
 
AccountForm.cls

public with sharing class AccountForm {
    @AuraEnabled
    public static List<Account>  getAccountList(String type,String rating,String industry,String AnnualRevenueStart,String AnnualRevenueEnd){
        System.debug('AnnualRevenueStart='+AnnualRevenueStart);
        System.debug('AnnualRevenueEnd='+AnnualRevenueEnd);
        String accQuery = 'SELECT Id,Name,Website,Type,Rating,AnnualRevenue,Industry,ChangeRating__c FROM Account';                     
        String whereClause  = '';
        String Query1;
        Integer arStart;
        if(String.isNotEmpty(AnnualRevenueStart)){
            arStart = Integer.valueOf(AnnualRevenueStart);
        }
        Integer arEnd;
        if(String.isNotEmpty(AnnualRevenueEnd)){
            arEnd = Integer.valueOf(AnnualRevenueEnd);
        }
        if(arStart!=Null){
            whereClause=whereClause+' where AnnualRevenue>=:arStart';
        }
        if(arEnd!=Null){
            if(String.isEmpty(whereClause)){
                whereClause=whereClause+' WHERE AnnualRevenue<=:arEnd';
            }
            else 
            {
                whereClause=whereClause+' AND AnnualRevenue<=:arEnd';
            }
        }
        if(String.isNotEmpty(type)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Type = :type';
            }else{
                whereClause =whereClause + ' AND Type = :type';
            }
            
        }
        if(String.isNotEmpty(rating)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Rating = :rating';
            }else{
                whereClause =whereClause + ' AND Rating = :rating';
            }
        } 
        if(String.isNotEmpty(industry)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Industry = :industry';
            }else{
                whereClause =whereClause + ' AND Industry = :industry';
            }
            
        } 
        String finalquery = accQuery+whereClause;
        System.debug('finalquery='+finalquery);
        
        List<Account> acclist=Database.query(finalquery);
        if(acclist.size()>0){
            return acclist;
        }
        else {
            return null;
            
        }
    }  
}
 
paginator.html

<template>
    <lightning-layout>
        <lightning-layout-item>
            <lightning-button label="Previous" icon-name="utility:chevronleft" onclick={previousHandler}></lightning-button>
        </lightning-layout-item>
        <lightning-layout-item flexibility="grow"></lightning-layout-item>
        <lightning-layout-item>
            <lightning-button label="Next" icon-name="utility:chevronright" icon-position="right" onclick={nextHandler}></lightning-button>
        </lightning-layout-item>
    </lightning-layout>
</template>
 
paginator.js

import { LightningElement} from 'lwc';

export default class Paginator extends LightningElement {
    previousHandler() {
        this.dispatchEvent(new CustomEvent('previous'));
    }

    nextHandler() {
        this.dispatchEvent(new CustomEvent('next'));
    }
}

 
<template>
    <div class="slds-p-around_medium lgc-bg">
        <lightning-input type="Currency" label="AnnualRevenue Start" value={revenueStart} name="AVStart"
            onchange={handleChange}></lightning-input>
    </div>

    <div class="slds-p-around_medium lgc-bg">
        <lightning-input type="Currency" label="AnnualRevenue End" value={revenueEnd} name="AVEnd"
            onchange={handleChange}> </lightning-input>

    </div>

    <div class="slds-p-around_medium lgc-bg">
        <template if:true={typeValues.data}>
            <lightning-combobox name="Type" label="Type" value={value} options={typeValues.data.values}
                onchange={handleChange}>
            </lightning-combobox>
        </template>
    </div>

    <div class="slds-p-around_medium lgc-bg">
        <template if:true={ratingValues.data}>
            <lightning-combobox name="Rating" label="Rating" value={value} options={ratingValues.data.values}
                onchange={handleChange}>
            </lightning-combobox>
        </template>
    </div>

    <div class="slds-p-around_medium lgc-bg">
        <template if:true={industryValues.data}>
            <lightning-combobox name="Industry" label="Industry" value={value} options={industryValues.data.values}
                onchange={handleChange}>
            </lightning-combobox>
        </template>
    </div>

    <lightning-button type="submit" variant="brand" label="Show Accounts" onclick={handleClick}></lightning-button>
    
    <template if:true={showSearchComponent}>
        <lightning-datatable key-field="Id" data={accounts} columns={columns} onsave={handleSave}
            draft-values={draftValues} hide-checkbox-column="true"></lightning-datatable>
    </template>

    <template if:false={accounts}>
        <p>No data to display</p>
    </template>

    <template if:true={loading}>
        <div class="slds-spinner_container">
            <lightning-spinner alternative-text="Loading" variant="brand" size="medium">
            </lightning-spinner>
        </div>
    </template>
</template>
 
import { LightningElement, wire, track, api } from 'lwc';

import { getPicklistValues } from 'lightning/uiObjectInfoApi';
import Type from '@salesforce/schema/Account.Type';
import Rating from '@salesforce/schema/Account.Rating';
import AnnualRevenue from '@salesforce/schema/Account.AnnualRevenue';

// import ChangeRating__c from '@salesforce/schema/Account.ChangeRating__c';

import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import Industry from '@salesforce/schema/Account.Industry';

import getAccountList from '@salesforce/apex/AccountForm.getAccountList';

//import getAccounts from '@salesforce/apex/AccountForm.getAccounts';
import { updateRecord } from 'lightning/uiRecordApi';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { refreshApex } from '@salesforce/apex';

const columns = [
  { label: 'Account Name', fieldName: 'AccName', type: 'url', typeAttributes: { label: { fieldName: 'Name' } } },
  { label: 'AnnualRevenue', fieldName: 'AnnualRevenue', type: 'currency', editable: true },
  { label: 'Industry', fieldName: 'Industry' },
  { label: 'Type', fieldName: 'Type', editable: true },
  { label: 'Rating', fieldName: 'Rating', type: 'picklist', editable: true },
  { label: 'Website', fieldName: 'Website', type: 'url', editable: true },
  { label: 'ChangeRating', fieldName: 'ChangeRating__c', type: 'number', editable: true }
];

export default class AccountForm extends LightningElement {

  @track accounts;
  @track showSearchComponent = false;
  @track loading = false;
  @track revenueStart;
  @track revenueEnd;
  @api recordId;
  columns = columns;
  draftValues = [];
  accounts ;

  error;
  empty = false;


  @wire(getObjectInfo, { objectApiName: ACCOUNT_OBJECT })
  accountInfo;
  nameVal;
  typeVal;
  industryVal;


  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Type })
  typeValues;

  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Rating })
  ratingValues;

  @wire(getPicklistValues, { recordTypeId: '$accountInfo.data.defaultRecordTypeId', fieldApiName: Industry })
  industryValues;


  handleChange(event) {
    var fieldname = event.target.label;
    if (fieldname == 'Rating') {
      this.nameVal = event.target.value;
    } else if (fieldname == 'Type') {
      this.typeVal = event.target.value;
    } else if (fieldname == 'Industry') {
      this.industryVal = event.target.value;
    } else if (fieldname == 'AnnualRevenue Start') {
      this.revenueStart = event.target.value;
    } else if (fieldname == 'AnnualRevenue End') {
      this.revenueEnd = event.target.value;
    }
  }

  handleClick() {
    // console.log('buttom clicked');
    this.showSearchComponent = true;
    this.loading = true;
    //console.log('type--> '+this.typeVal+' rating--> '+this.nameVal+' industry--> '+this.industryVal);
    getAccountList({ type: this.typeVal, rating: this.nameVal, industry: this.industryVal, AnnualRevenueStart: this.revenueStart, AnnualRevenueEnd: this.revenueEnd })
      .then(results => {
        // console.log('account result--> '+JSON.stringify(result))
        let tempAccList = [];

        results.forEach((result) => {
          let tempAccRec = Object.assign({}, result);
          tempAccRec.AccName = '/' + tempAccRec.Id;
          tempAccList.push(tempAccRec);

        });
            this.accounts = tempAccList
        //  this.accounts=result;
            this.loading = false;
      })
      .catch(error => {
        console.log('error' + error);
        this.loading = false;
      })


  }


  handleSave(event) {
    const recordInputs = event.detail.draftValues.slice().map(draft => {
      const fields = Object.assign({}, draft);
      return { fields };
    });

    const promises = recordInputs.map(recordInput => updateRecord(recordInput));
    Promise.all(promises).then(accounts => {
      this.dispatchEvent(
        new ShowToastEvent({
          title: 'Success',
          message: 'Accounts updated',
          variant: 'success'
        })

      );
      // Clear all draft values
      this.draftValues = [];

      // Display fresh data in the datatable
      return refreshApex(this.accounts);
    }).catch(error => {
      // Handle error
    });
  }

public with sharing class AccountForm {
    @AuraEnabled
    public static List<Account>  getAccountList(String type,String rating,String industry,Integer AnnualRevenueStart,Integer AnnualRevenueEnd){
        String accQuery = 'SELECT Id,Name,Type,Rating,AnnualRevenue FROM Account';                     
        String whereClause  = '';
        
     /*   if(AnnualRevenueStart>=30000){
            whereClause =whereClause +' where AnnualRevenue>=30000';
        }
       if(AnnualRevenueEnd<=100000){
            whereClause =whereClause +' AND AnnualRevenue<=100000';
            
        }*/

        if(AnnualRevenueStart!=Null){
            whereClause=whereClause+' where AnnualRevenue>=:AnnualRevenueStart';
        }
        if(AnnualRevenueEnd!=Null){
            if(String.isEmpty(whereClause)){
            whereClause=whereClause+' WHERE AnnualRevenue<=:AnnualRevenueEnd';
        }
        else 
            {
                whereClause=whereClause+' AND AnnualRevenue<=:AnnualRevenueEnd';
            }
        }

        if(String.isNotEmpty(type)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Type = :type';
            }else{
                whereClause =whereClause + ' AND Type = :type';
            }
            
        }
        if(String.isNotEmpty(rating)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Rating = :rating';
            }else{
                whereClause =whereClause + ' AND Rating = :rating';
            }
        } 
        if(String.isNotEmpty(industry)){
            if(String.isEmpty(whereClause)){
                whereClause =whereClause +  ' WHERE Industry = :industry';
            }else{
                whereClause =whereClause + ' AND Industry = :industry';
            }
            
        } 
        String finalquery = accQuery+whereClause;
        System.debug('finalquery='+finalquery);
        
        List<Account> acclist=Database.query(finalquery);
        
        return acclist;
        
    }
}
I have build lwc component which show datatable when i give the input in field but when i change field data in row it is also save in datatable but the data is showing after refresh the whole page after saving the field it is not updating in UI Page.....can anyone help me

 
Test Class 

@isTest
    public static void testmethod3(){
        contact con = new contact();
        con.LastName = 'Test contact';
        con.Email = 'sample@sample.com';
        insert con;
        List<Case> caseList = new List<Case>();
        for(Integer i=1; i<=200 ; i++){
            Case cs = new Case();
            cs.Status = 'New';
            cs.Origin = 'Phone';
            cs.ContactId =con.Id;
            caseList.add(cs);
        }
        
          Test.startTest();
          insert caseList;
          Test.stopTest();
    
}

 
Trigger

trigger CaseTrigger on Case (after insert,after delete) {
    system.debug('trigger value--> '+Trigger.isDelete+'and--> '+Trigger.IsAfter);
    CaseTriggerHandler CaseHandler = new CaseTriggerHandler();
    if(Trigger.isInsert&&Trigger.IsAfter){
        system.debug('inside insert trigger');
        CaseHandler.AfterInsert(Trigger.new);
    }
    if(Trigger.isDelete&&Trigger.IsAfter){
        system.debug('inside isDelete trigger');
        CaseHandler.AfterDelete(Trigger.old);
    }
 
Handler class 
  
   public class CaseTriggerHandler {
    public void AfterInsert(List<Case> case1){
        system.debug('inside CaseTriggerHandler insert trigger '+case1);
        List<Messaging.SingleEmailMessage> emails = new List<Messaging.SingleEmailMessage>();
        
        TestEmailCase__mdt testEmail = [select id, Label,NamespacePrefix,To_Address__c from TestEmailCase__mdt];
        system.debug('test case list -->'+testEmail); 
        for(Case ca:case1){
            system.debug('test email start -->'+testEmail.To_Address__c); 
            Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
            List<String> eid = new List<String>();
            
            eid.add(testEmail.To_Address__c);
            email.setToAddresses(eid);
            email.setSubject('case create');
            email.setPlainTextBody('case created');
            emails.add(email);
            system.debug('test email end -->'); 
        }
        Messaging.sendEmail(emails);
    }
    public void AfterDelete(List<Case> case1){
        List<Messaging.SingleEmailMessage> emails = new List<Messaging.SingleEmailMessage>();
        
        TestEmailCase__mdt testEmail = [select id, Label,NamespacePrefix,To_Address__c from TestEmailCase__mdt];
        system.debug(testEmail);
        
        for(Case ca:case1){
            Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
            List<String> eid = new List<String>();
            
            eid.add(testEmail.To_Address__c);
            email.setToAddresses(eid);
            email.setSubject('case deleted');
            email.setPlainTextBody('case deleted');
            emails.add(email);
        }
        Messaging.sendEmail(emails);
    }
}
 
Test Class
    
  @isTest
public class CaseTriggerHandler_Test_class{

     @isTest static void setup() {
        // Create common test accounts
        List<Case> testCase = new List<Case>();
        for(Integer i=0;i<1;i++) {
            Case cas = new Case();  
            cas.Origin='Email';
            cas.Subject='Test Case';
            cas.Status = 'Closed case';
            cas.To_Address__c = 'sample@sample.com';
            testCase.add(cas);
        }
        insert testCase;  
        
        Delete testCase;
        
    }

 
Trigger:
trigger CaseEmail on Case (after insert, after update,before delete) {
    
   If((Trigger.isUpdate || Trigger.isinsert) && Trigger.isafter){//This line will allow only if the record is created or edited
	CaseEmailHandler.sendemailforInsrtupdate(Trigger.new);
   }
    if(Trigger.isDelete && Trigger.isBefore){// if the case is deleted we have to send an email so using this line and we used before because after deletion we cannot send email 
	CaseEmailHandler.sendemailfordelete(Trigger.old);
}
    }
 
Handler:
 
public class CaseEmailHandler {

    public static void sendemailforInsrtupdate(List<Case> caselist){
            Set<Id> conIds = new Set<Id>();
    List<Messaging.SingleEmailMessage> mails = new List<Messaging.SingleEmailMessage>();
    for (Case c: caselist) {
        conIds.add(c.ContactId);//adding the contact id so we can get the contact email for the case
   }
    Map<Id, Contact> conMap = new Map<Id, Contact>([SELECT Id, Email FROM Contact WHERE Id In :conIds]);// quering the contact so we get the contact email
    
    for (Case c : caselist) {
        if (c.status == 'Closed') {// checking if the status is closed in case of create or edit scenerio
            Contact relatedCaseContact = conMap.get(c.ContactId);//getting the contact information related to particular case
            
            Messaging.SingleEmailMessage CaseNotificationmail = new Messaging.SingleEmailMessage();  
            CaseNotificationmail.setToAddresses(new List<String> { relatedCaseContact.Email });//adding to address
            CaseNotificationmail.setReplyTo('sample@salesforce.com');//adding reply to  address
            CaseNotificationmail.setSenderDisplayName('Salesforce');  //adding display name          
            
            CaseNotificationmail.setSubject(' Case Status updation  ' + 'Changed to ' + c.status + ' Case Number:' + c.CaseNumber);//adding subject
            CaseNotificationmail.setPlainTextBody(' Your case Status for Case Number: ' + c.CaseNumber + '  Related Case Contact:' +c.ContactId +' has been closed '); //adding body of the email
            mails.add(CaseNotificationmail); //adding the notification to the list so all the emails can be sent once
        }
        
        if(Trigger.isinsert && Trigger.isafter){// as we need a notification when a case is craeted
            Contact relatedCaseContact = conMap.get(c.ContactId);
                   Messaging.SingleEmailMessage mail =  new Messaging.SingleEmailMessage();
        mail.setToAddresses(new List<String> { relatedCaseContact.Email });
        mail.setSubject('New Case Create: '+ c.CaseNumber);
        String body = 'Case is created. Thank you for contacting us';
        mail.setHtmlBody(body);
        mails.add(mail);
        }
    }
 Messaging.sendEmail(mails);//sending the emails at once   
    }
    public static void sendemailfordelete(List<Case> caselist){
               Set<Id> conIds = new Set<Id>();
         for (Case c: caselist) {
        conIds.add(c.ContactId);
   }
      List<Messaging.SingleEmailMessage> emails = new List<Messaging.SingleEmailMessage>();
         Map<Id, Contact> conMp = new Map<Id, Contact>([SELECT Id, Email FROM Contact WHERE Id In :conIds]);
        
    for (Case cs : caselist) {
         Contact relatedCaseContact = conMp.get(cs.ContactId);
        Messaging.SingleEmailMessage email = new Messaging.SingleEmailMessage();
        
        email.setToAddresses(new List<String> { relatedCaseContact.Email  });
        email.setSubject('Case Deleted');
        email.setPlainTextBody('This message is to alert you that the Case number' + cs.CaseNumber + ' has been deleted. Thank you for contacting us.');
        emails.add(email);
    }
    Messaging.sendEmail(emails);
    }
    
}