Untitled
unknown
plain_text
19 days ago
15 kB
5
Indexable
update the below code so that , if case card is selected then clear the data in application card on click on onnext and vice versa import React, { useEffect, useState } from 'react'; import { Section, Page, Header, Row, Column, Button, Para, Selectbox, UX, } from '@d-lift/uxcomponents'; import { withPage, Navigate, useAppState, AppContext, Lift } from '@d-lift/core'; import CPUtil from '@/Util/CPUtil'; import ButtonNavigation from '@/UXModule/ButtonNavigation/ButtonNavigation'; import './APLCN.scss'; import appealsService from '@/Services/Dashboard/AppealsService'; import appealsApplicationService from '@/Services/Dashboard/AppealsApplicationService'; import ConstantKeys from '@/Constants/ConstantKeys'; import dataAdapter from '@/Adapters/DataAdapter'; import PSUtil from '@/Util/PSUtil'; const pageConfig = { PageName: 'APLCN', Description: 'Case And Notice Page', ContextRoot: 'Appeals', ContentManager: true, PageType: 'workflow', WorkFlowNavigation: true, TemplateOptions: { cardWorkflow: true }, pageId: 'APLCN', ShowTitle: false, SaveAndExitActionUrl: '/APLCN/APLCNLoad', PersistActionUrl: '/APLCN/APLCNNext', }; const APLCN = () => { const defaultData = { caseNumber: '', appealingIndvId: '', applicationNumber: '', noticeType: '', appealId: '', }; const [APLCN] = useAppState('APLCN', defaultData); const [selectionFlag, setSelectionFlag] = useState(null); const [visibleCard, setVisibleCard] = useState(null); const [filteredCaseNumberList, setFilteredCaseNumberList] = useState([]); const [personList, setPersonList] = useState([]); const [caseDetailsResponse, setCaseDetailsResponse] = useState('caseDetailsResponse', {}); const [trackingNumberList, setTrackingNumberList] = useState('trackingNumberList', {}); useEffect(() => { // Only set current step, don't reset wayfinder steps CPUtil.setValueInAppcontext('currentStep', 3); APLCNLoadData(); }, []); const APLCNLoadData = () => { let serviceContextUrl = dataAdapter.getServiceUrlContext('APLCN'); dataAdapter .invokeAppealLoad( serviceContextUrl.baseUrl + '/APLCN/APLCNLoad', 'APLCN', 'APLCNLoad', serviceContextUrl.serviceContext, ) .then((response) => { if (response) { let loadAppealId = response?.data?.pageCollection?.Appeals_Collection?.[0].appealId; AppContext.model.setValue('APLCN.appealId', loadAppealId); } else { console.log('No data received from APLCNLoadData'); } }) .catch((error) => { console.error('Error in APLCNLoadData:', error); }); }; useEffect(() => { fetchDataAndUpdateState(); fetchApplicationNumber(); }, []); const fetchDataAndUpdateState = async () => { try { let guID = 'b6db655b-94ac-4f89-b8e1-c2b3d65512bf'; //hardcoded guID for now const caseDetailsResponse = await getCaseDetails(guID); console.log('Case Details Response >>>>>>>>>:', caseDetailsResponse); setCaseDetailsResponse(caseDetailsResponse); if (!caseDetailsResponse?.caseData) { console.log('Invalid case data received'); return; } const programCd = 'snap'; //Hardcoded fore now, will remove once able to pass data from prev screen let filteredCases = []; if (programCd === 'snap') { filteredCases = caseDetailsResponse.caseData.filter((c) => c.programList.some((p) => p.programCode === 'FS'), ); } else if (programCd === 'ff') { filteredCases = caseDetailsResponse.caseData.filter((c) => c.programList.some((p) => p.programCode === 'TA'), ); } setFilteredCaseNumberList( filteredCases.map((c) => ({ value: c.caseNumber, label: c.caseNumber, })), ); } catch (error) { console.error('Error processing case details:', error); } }; const getCaseDetails = async (guID) => { try { const response = await appealsService.getCaseDetails({ guID }); CPUtil.setValueInAppcontext('caseDetails', response); return response; } catch (error) { console.error('Error fetching case details:', error); throw error; } }; const getPersonList = (e) => { const value = e?.target?.value; if (value) { const selectedCase = caseDetailsResponse.caseData.find( (c) => c.caseNumber === APLCN.caseNumber, ); if (selectedCase?.casePersonDetails) { setPersonList( selectedCase.casePersonDetails.map( (p) => { // program.programPersonDetails.map((p) => { console.log('Person:', p, p.personId); return { value: p.personId, label: `${p.firstName} ${p.lastName} ${ p.middleInitial || '' }`.trim(), }; }, // }), ), ); } } }; const fetchApplicationNumber = async () => { try { CPUtil.showSpinner(); let requestJson = { serviceContext: 'householddemographics', userDetails: { loginUserId: 'b6db655b-94ac-4f89-b8e1-c2b3d65512bf', appNumber: PSUtil.getAppNum(), browserName: Lift.Device.browserName, deviceType: Lift.Device.deviceType, }, currentActionDetails: { pageId: 'ABGAD', pageAction: 'ABGADNext', indvSeqDetails: {}, }, pageCollection: { ApplicationRequest_Collection: { gUID: 'b6db655b-94ac-4f89-b8e1-c2b3d65512bf', caseList: [], }, }, }; let applicationDetailsResponse = await getApplicationDetails(requestJson); let trackingNumberList = applicationDetailsResponse?.pageCollection?.OngoingApplications?.map( (app) => app.tracking_num, ).filter((trackingNum) => trackingNum !== null); setTrackingNumberList(trackingNumberList); } catch (exceptionObject) { console.error('Error fetching application details:', exceptionObject); } finally { CPUtil.hideSpinner(); } }; const getApplicationDetails = async (requestJson) => { try { return await appealsApplicationService.getApplicationDetails({ requestJson }); } catch (error) { console.error('Error fetching application details:', error); throw error; } }; const onNext = () => { // Check if "NONE" option is selected if (selectionFlag === null) { AppContext.model.setValue( 'selectionErrorMsg', 'Select Case number or Application number to proceed.', ); setSelectionFlag(false); return; } else { // Clear error if validation passes AppContext.model.setValue('selectionErrorMsg', ''); setSelectionFlag(true); } let data = AppContext.model.getValue(AppContext.pagedetails.getPageConfig().pageId); if (!AppContext.model.getValue('errorMsg')) { dataAdapter .invokeAppealPersist( { ...data, appealId: CPUtil.getValueFromAppContext('appealId') }, // Pass appealId if it exists AppContext.pagedetails.getPageConfig().persistActionUrl, 'Appeals_Collection', APLCN, ) .then(() => { // Get current visited steps const visitedSteps = CPUtil.getValueFromAppContext('visitedSteps') || []; const nextStep = 3; // Add next step to visited steps if not already there if (!visitedSteps.includes(nextStep)) { visitedSteps.push(nextStep); } // Update visited steps in context CPUtil.setValueInAppcontext('visitedSteps', visitedSteps); CPUtil.setValueInAppcontext('currentStep', nextStep); // Update AppContext model AppContext.model.setValue('visitedSteps', visitedSteps); AppContext.model.setValue('currentStep', nextStep); Navigate.to('/Appeals/AppealsAppeallantInfo/APLIN'); }); } }; const onBack = () => { CPUtil.setValueInAppcontext('currentStep', 2); Navigate.to('/Appeals/AppealsContinuationOfBenefits/APLCB'); }; return ( <Page> <Section className="container"> <UX id="selectionError" errorType="error" type="pageError" showIf={selectionFlag === false}> {AppContext.model.getValue('selectionErrorMsg')} </UX> <Header labelKey="case_header" /> <Header header-size="2" className="mt-4" labelKey="case_subheader" /> <Row> <Column> <Button className="col-auto mx-2 mb-2" labelKey="caseNumber_btn_text" click={() => { setVisibleCard('case'); setSelectionFlag(true); }} /> </Column> <Column> <Button className="col-auto mx-2 mb-2" labelKey="applNumber_btn_text" click={() => { setVisibleCard('appl'); setSelectionFlag(true); }} /> </Column> </Row> {visibleCard === 'case' && ( <Section id="caseNumber_card" className="dynamic-fields left-button mb-4"> <Selectbox id="case_question1" labelKey="case_question1" defaultOption="true" defaultOptionValue="SEL" defaultOptionLabelKey="common_selectone" list={filteredCaseNumberList} model="APLCN.caseNumber" optionLabel="label" optionValue="value" change={(e) => { getPersonList(e); }} required="{true}" validationRules="required" errormessages='{{"required": "common_mandatory_error"}}' /> <Para className="ux-helper-text" labelKey="case_question_helper_text" /> <Selectbox id="case_question2" labelKey="case_question2" defaultOption="true" defaultOptionValue="SEL" defaultOptionLabelKey="selectIndividual_dropdown_text" list={personList} model="APLCN.appealingIndvId" optionLabel="label" optionValue="value" required="{true}" validationRules="required" errormessages='{{"required": "common_mandatory_error"}}' /> </Section> )} {visibleCard === 'appl' && ( <Section id="applNumber_card" className="dynamic-fields right-button mb-4"> <Selectbox id="application_question" labelKey="application_question" defaultOption="true" defaultOptionValue="SEL" defaultOptionLabelKey="common_selectone" model="APLCN.applicationNumber" list={trackingNumberList.map((num) => ({ value: num, label: num }))} optionLabel="label" optionValue="value" required="{true}" validationRules="required" errormessages='{{"required": "common_mandatory_error"}}' /> <Para className="ux-helper-text" labelKey="application_question_helper_text" /> </Section> )} <Header header-size="2" className="mt-4" labelKey="selectNotice_subheader" /> <Selectbox id="appeal_reason" labelKey="selectNotice_question" defaultOption="true" defaultOptionValue="SEL" defaultOptionLabelKey="selectDoc_dropdown_text" model="APLCN.noticeType" optionLabel={ConstantKeys.REF_TABLE_COLS.DESCRIPTION} optionValue={ConstantKeys.REF_TABLE_COLS.CODE} /> <Para className="ux-helper-text" labelKey="case_question_helper_text" /> </Section> <ButtonNavigation onNext={onNext} onBack={onBack} /> </Page> ); }; export default withPage(pageConfig, APLCN);
Editor is loading...
Leave a Comment