// 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); }}
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>