Untitled
unknown
plain_text
a month ago
7.8 kB
3
Indexable
import { useAppState, withPage } from '@d-lift/core'; import { AppContext, Navigate, PageConfig } from '@d-lift/core'; import { Section, Page, Header, Button, Row, Column, Para, UX, Card } from '@d-lift/uxcomponents'; import React, { useEffect, useState } from 'react'; import ToDoCard from '@/UXModule/Card/ToDoCard/ToDoCard'; import AppealsStatusCard from '@/UXModule/Card/AppealsStatusCard/AppealsStatusCard'; const AppealsDashboardNew = () => { const [fileManageAppealsCards, setFileManageAppealsCards] = useAppState( 'fileManageAppealsCards', [], ); const [appealsDetailsCardsData, setAppealsDetailsCardsData] = useAppState( 'AppealsDetailsCardData', [], ); useEffect(() => { updateFileManageAppealsCards(); updateAppealsDetailsCardsData(); }, []); const addFileManageAppealsCardItem = (cardItem) => { const nextFileManageAppealCard = [...AppContext.model.getValue('fileManageAppealsCards')]; nextFileManageAppealCard.push(cardItem); AppContext.model.setValue('fileManageAppealsCards', nextFileManageAppealCard); }; const updateFileManageAppealsCards = () => { const fileManageCards = [ { heading: 'File_appeal_heading', description: 'File_appeal_description', type: 'fileAppeal', linkText: 'File_appeal_link', }, { heading: 'Link_appeal_heading', description: 'Link_appeal_description', type: 'linkAppeal', linkText: 'Link_appeal_link', }, { heading: 'Upload_document_heading', description: 'Upload_document_description', type: 'linkAppeal', linkText: 'Upload_document_link', }, ]; setFileManageAppealsCards(fileManageCards); }; const updateAppealsDetailsCardsData = () => { const AppealsDetailsCardData = [ { appealId: '1234567890', program: 'TANF', status: 'In Progress', statusCode: 'IP', submittedDate: '01/01/2021 12:00 PM', }, { appealId: '1234567891', program: 'SNAP', status: 'Submitted', statusCode: 'SU', submittedDate: '01/01/2021 12:00 PM', }, { appealId: '1234567892', program: 'DSNAP', status: 'Submitted', statusCode: 'SU', submittedDate: '01/01/2021 12:00 PM', }, { appealId: '1234567893', program: 'childcare', status: 'Submitted', statusCode: 'SU', submittedDate: '01/01/2021 12:00 PM', }, ]; if (!AppContext.model.getValue('dataLoaded')) return; setAppealsDetailsCardsData(AppealsDetailsCardData); AppContext.model.setValue( 'suCount', AppealsDetailsCardData.filter((data) => data.statusCode === 'SU').length, ); AppContext.model.setValue( 'ipCount', AppealsDetailsCardData.filter((data) => data.statusCode === 'IP').length, ); }; const handleFileManageAppealCardClick = (data) => { if (data.type === 'fileAppeal') { Navigate.to('/Appeals/APLMR'); } }; const handleAppealDetailsCardClick = (data) => { console.log('AppealsDetailsCard clicked:', data); }; const handleActionIconClick = (e, filedAppeal) => { console.log('filedAppeal', filedAppeal); if (filedAppeal.statusCode === 'IP') { console.log("do some thing for 'IP' status"); } else if (filedAppeal.statusCode === 'SU') { console.log("do some thing for 'SU' status"); } }; return ( <Page> <Section className="container"> <Row> <Column> <Header labelKey="Appeals_dashboard_header_1" /> <Para labelKey="Appeals_dashboard_sub_heading_1"></Para> {fileManageAppealsCards?.map((cardData, index) => ( <ToDoCard key={`fileManageAppealsCards_${index}`} className="mb-4" data={cardData} onClick={() => handleFileManageAppealCardClick(cardData)} /> ))} </Column> <Column> <Header labelKey="Appeals_dashboard_header_2" /> <Para className="mb-3 status-heading"> {AppContext.model.getValue('ipCount')} </Para> {appealsDetailsCardsData?.map((cardData, index) => ( <AppealsStatusCard key={`AppealsDetailsCardData_${index}`} className="mb-4" data={cardData} onClick={() => handleAppealDetailsCardClick(cardData)} showIf={ cardData.statusCode === 'IP' && AppContext.model.getValue('dataLoaded') } /> ))} <Card className="mb-4 justify-items" showIf={!AppContext.model.getValue('dataLoaded')}> <Para className="mb-0 status-heading" labelKey="inprogress_empty_text" /> </Card> <Para className="mb-3 status-heading"> {AppContext.model.getValue('suCount')} </Para> {appealsDetailsCardsData?.map((cardData, index) => ( <AppealsStatusCard key={`AppealsStatusCardData_${index}`} className="mb-4" data={cardData} onClick={() => handleAppealDetailsCardClick(cardData)} showIf={ cardData.statusCode === 'SU' && AppContext.model.getValue('dataLoaded') } /> ))} <Card className="mb-4 justify-items" showIf={!AppContext.model.getValue('dataLoaded')}> <Para className="mb-0 status-heading" labelKey="submitted_empty_text" /> </Card> </Column> </Row> </Section> </Page> ); }; export default withPage( { Description: 'Appeals Dashboard Page', ContentManager: true, PageId: 'APLDB', }, AppealsDashboardNew, ); update the above code to initialize dataLoaded: true, ipCount: 0, suCount: 0, and update the code usage accordingly
Editor is loading...
Leave a Comment