Skip to main content

// JS code:

import {LightningElement, wire} from 'lwc';import Opplist from '@salesforce/apex/OpportunityHandler.getOpportunities';import {getObjectInfo, getPicklistValues} from 'lightning/uiObjectInfoApi';import StageName from '@salesforce/schema/Opportunity.StageName';export default class OppWebComponent extends LightningElement {    opportunityData;    CloseDate = null;    StageName;    error;    options = [];    @wire(Opplist, {        CloseDate: '$CloseDate',        StageName: '$StageName'    }) wiredData({data, error}) {        if (data) {            this.opportunityData = data;            this.error = undefined;        }        else if (error) {            this.opportunityData = undefined;            this.error = error;        }    }    handleChange(event) {        let {name, value} = event.target;        if (name == 'stage') {            this.StageName = value;        }        else {            this.CloseDate = value;        }    }    @wire(getObjectInfo, {        objectApiName: 'Account'    }) wiredData;    @wire(getPicklistValues, {        recordTypeId: '$wiredData.data.defaultRecordTypeId',        fieldApiName: StageName    }) wiredPicklist({data, error}) {        if (data) {            this.options = data.values;            console.log(data);        }        else if (error) {            console.log(error);        }    }}

// HTML File

<template>    <lightning-card title="opportunity Filter">       <lightning-combobox            name="stage"            label="Status"            value={StageName}            placeholder="Select Stage"            options={options}            onchange={handleChange} ></lightning-combobox>        <lightning-input value={CloseDate} type="Date" name="date" onchange={handleChange} ></lightning-input>    </lightning-card>    <lightning-card title="Opportunity List">        <template lwc:if={opportunityData}>            <lightning-layout multiple-rows="true">                <template for:each={opportunityData} for:item="opp" for:index="i">                    <lightning-layout-item size="4" key={opp.i}>                        <c-opp-tile opportunity={opp}></c-opp-tile>                    </lightning-layout-item>                </template>            </lightning-layout>        </template>    </lightning-card></template>

// Apex Class

public with sharing class OpportunityHandler {    @AuraEnabled(cacheable = true)    public static List<Opportunity> getOpportunities(String StageName,Date CloseDate){        String Query = 'select Id,Name,CloseDate,StageName from Opportunity';        system.debug(StageName+' ayush'+CloseDate);        if(StageName!='' || CloseDate!=null){            Query+=' where ';        }        if(StageName!='') {            Query+=' StageName = :StageName ';        }        if(StageName!='' && CloseDate!=null){            Query+=' And ';        }        if(CloseDate!=null){            //String formattedTime = CloseDate.formatGMT('yyyy-MM-dd\'T\'HH:mm:ss\'Z\'');            Query +='CloseDate>= '+CloseDate;        }        system.debug(Query);        return Database.query(Query);    }}

 

#Apex Class

4 answers
  1. Dec 9, 2024, 1:56 PM

    Hi @Ayush Singhal

     

    This is the updated Apex Code and Js and Html.

     

    if this answer resolve your query please mark as helpful.

     

    Thanks.

     

    public with sharing class OpportunityHandler {

    @AuraEnabled(cacheable = true)

    public static List<Opportunity> getOpportunities(String StageName, Date CloseDate) {

    String query = 'SELECT Id, Name, CloseDate, StageName FROM Opportunity';

    Boolean whereClauseAdded = false;

    // Add filter for StageName if provided

    if (String.isNotBlank(StageName)) {

    query += ' WHERE StageName = :StageName';

    whereClauseAdded = true;

    }

    // Add filter for CloseDate if provided

    if (CloseDate != null) {

    if (whereClauseAdded) {

    query += ' AND CloseDate >= :CloseDate';

    } else {

    query += ' WHERE CloseDate >= :CloseDate';

    whereClauseAdded = true;

    }

    }

    // Execute query

    return Database.query(query);

    }

    }

    updated Js

    import { LightningElement, wire } from 'lwc';

    import Opplist from '@salesforce/apex/OpportunityHandler.getOpportunities';

    import { getObjectInfo, getPicklistValues } from 'lightning/uiObjectInfoApi';

    import StageName from '@salesforce/schema/Opportunity.StageName';

    export default class OppWebComponent extends LightningElement {

    opportunityData;

    CloseDate = null;

    StageName = '';

    error;

    options = [];

    // Wire to fetch opportunity data from Apex method

    @wire(Opplist, {

    StageName: '$StageName',

    CloseDate: '$CloseDate'

    })

    wiredOpportunities({ data, error }) {

    if (data) {

    this.opportunityData = data;

    this.error = undefined;

    } else if (error) {

    this.opportunityData = undefined;

    this.error = error;

    }

    }

    // Handle changes for CloseDate and StageName

    handleChange(event) {

    const { name, value } = event.target;

    if (name === 'stage') {

    this.StageName = value;

    } else if (name === 'date') {

    this.CloseDate = value;

    }

    }

    // Wire to fetch Object Info (Opportunity object info)

    @wire(getObjectInfo, { objectApiName: 'Opportunity' }) // Change 'Account' to 'Opportunity' for StageName field

    objectInfo;

    // Wire to fetch picklist values for StageName field

    @wire(getPicklistValues, {

    recordTypeId: '$objectInfo.data.defaultRecordTypeId',

    fieldApiName: StageName

    })

    wiredPicklist({ data, error }) {

    if (data) {

    this.options = data.values;

    } else if (error) {

    console.error('Error fetching picklist values: ', error);

    }

    }

    }

    Update Html

    <template>

    <lightning-card title="Opportunity Filter">

    <lightning-combobox

    name="stage"

    label="Status"

    value={StageName}

    placeholder="Select Stage"

    options={options}

    onchange={handleChange}

    ></lightning-combobox>

    <lightning-input

    value={CloseDate}

    type="Date"

    name="date"

    onchange={handleChange}

    ></lightning-input>

    </lightning-card>

    <lightning-card title="Opportunity List">

    <template if:true={opportunityData}>

    <lightning-layout multiple-rows="true">

    <template for:each={opportunityData} for:item="opp">

    <lightning-layout-item size="4" key={opp.Id}>

    <c-opp-tile opportunity={opp}></c-opp-tile>

    </lightning-layout-item>

    </template>

    </lightning-layout>

    </template>

    </lightning-card>

    </template>

0/9000