From 860654e8a9517eb43fe797e1201fa064c6b40cc6 Mon Sep 17 00:00:00 2001 From: JezzDiego Date: Tue, 18 Jul 2023 18:32:54 -0300 Subject: [PATCH] =?UTF-8?q?Accordion=20nos=20t=C3=ADtulos=20das=20p=C3=A1g?= =?UTF-8?q?inas=20de=20informa=C3=A7=C3=B5es?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/AgencyWithNavigation.tsx | 22 ++++- src/components/AgencyWithoutNavigation.tsx | 27 +++++- src/components/MoreInfoAccordion/index.tsx | 102 ++++++++++++++++++++ src/pages/grupo/[summary].tsx | 32 +++++- src/pages/orgao/[agency]/[year]/[month].tsx | 36 ++++++- src/pages/orgao/[agency]/[year]/index.tsx | 16 +++ src/pages/orgao/[agency]/index.tsx | 25 +++++ 7 files changed, 243 insertions(+), 17 deletions(-) create mode 100644 src/components/MoreInfoAccordion/index.tsx diff --git a/src/components/AgencyWithNavigation.tsx b/src/components/AgencyWithNavigation.tsx index ab79a93e..52ad9635 100644 --- a/src/components/AgencyWithNavigation.tsx +++ b/src/components/AgencyWithNavigation.tsx @@ -34,10 +34,12 @@ import light from '../styles/theme-light'; import { formatAgency } from '../functions/format'; import Drawer from './Drawer'; import IndexTabGraph from './TransparencyChart/IndexTabChart'; +import MoreInfoAccordion from './MoreInfoAccordion'; export interface AgencyPageWithNavigationProps { id: string; year: number; + mi: SummaryzedMI[]; agency: Agency; title: string; setYear: (y: number) => void; @@ -50,6 +52,7 @@ export interface AgencyPageWithNavigationProps { const AgencyPageWithNavigation: React.FC = ({ id, + mi, title, year, agency, @@ -84,9 +87,22 @@ const AgencyPageWithNavigation: React.FC = ({ return ( - - {title} ({formatAgency(id.toLocaleUpperCase('pt'))}) - + d.timestamp.seconds).at(-1)} + repository={mi[0]?.dados_coleta.repositorio_coletor} + > + + {title} ({formatAgency(id.toLocaleUpperCase('pt'))}) + + {agency && agency.coletando && !data ? ( <> ) : ( diff --git a/src/components/AgencyWithoutNavigation.tsx b/src/components/AgencyWithoutNavigation.tsx index dd32ef40..0aa12c63 100644 --- a/src/components/AgencyWithoutNavigation.tsx +++ b/src/components/AgencyWithoutNavigation.tsx @@ -27,6 +27,7 @@ import ShareModal from './ShareModal'; import light from '../styles/theme-light'; import { formatAgency } from '../functions/format'; import Drawer from './Drawer'; +import MoreInfoAccordion from './MoreInfoAccordion'; const AnnualRemunerationGraph = dynamic( () => import('./AnnualRemunerationGraph'), @@ -43,6 +44,7 @@ const IndexTabGraph = dynamic( export interface AgencyPageWithoutNavigationProps { id: string; + agencyTotals: v2AgencyTotalsYear; year: number; agency: Agency; title: string; @@ -53,17 +55,32 @@ export interface AgencyPageWithoutNavigationProps { const AgencyPageWithoutNavigation: React.FC< AgencyPageWithoutNavigationProps -> = ({ id, title, year, agency, data, dataLoading, plotData }) => { +> = ({ + id, + agencyTotals, + title, + year, + agency, + data, + dataLoading, + plotData, +}) => { const [modalIsOpen, setModalIsOpen] = useState(false); const matches = useMediaQuery('(max-width:900px)'); const router = useRouter(); - return ( - - {title} ({formatAgency(id.toLocaleUpperCase('pt'))}) - + + + {title} ({formatAgency(id.toLocaleUpperCase('pt'))}) + + {agency && agency.coletando && !agency.possui_dados ? ( <> ) : ( diff --git a/src/components/MoreInfoAccordion/index.tsx b/src/components/MoreInfoAccordion/index.tsx new file mode 100644 index 00000000..0a3ffee2 --- /dev/null +++ b/src/components/MoreInfoAccordion/index.tsx @@ -0,0 +1,102 @@ +import { + Accordion, + AccordionDetails, + AccordionSummary, + List, + ListItem, + ListItemButton, + ListItemIcon, + ListItemText, + Typography, +} from '@mui/material'; +import { ExpandMore, Info } from '@mui/icons-material'; +import PublicIcon from '@mui/icons-material/Public'; +import TwitterIcon from '@mui/icons-material/Twitter'; +import AccessTimeIcon from '@mui/icons-material/AccessTime'; +import { useState } from 'react'; + +type MoreInfoAccordionProps = { + children: React.ReactNode; + ombudsman: string; + twitterHandle: string; + timestamp: number; + repository: string; +}; + +const MoreInfoAccordion = ({ + children, + ombudsman, + repository, + timestamp, + twitterHandle, +}: MoreInfoAccordionProps) => { + const [open, setOpen] = useState(false); + + const handleClick = () => { + setOpen(!open); + }; + return ( + + : } + aria-controls="panel1a-content" + id="panel1a-header" + > + {children} + + + + - Mais informações sobre o órgão - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); +}; + +export default MoreInfoAccordion; diff --git a/src/pages/grupo/[summary].tsx b/src/pages/grupo/[summary].tsx index 060667fb..640fdec1 100644 --- a/src/pages/grupo/[summary].tsx +++ b/src/pages/grupo/[summary].tsx @@ -153,14 +153,17 @@ const GraphWithNavigation: React.FC<{ id: string; title: string }> = ({ const [data, setData] = useState([]); const [year, setYear] = useState(getCurrentYear()); const [agencyData, setAgencyData] = useState(); + const [agencyTotals, setAgencyTotals] = useState(); const [dataLoading, setDataLoading] = useState(true); const [plotData, setPlotData] = useState([]); useEffect(() => { setDataLoading(true); - Promise.all([fetchAgencyData(), fetchPlotData()]).finally(() => - setDataLoading(false), - ); + Promise.all([ + fetchAgencyData(), + fetchPlotData(), + fetchAgencyTotalData(), + ]).finally(() => setDataLoading(false)); }, [year]); async function fetchAgencyData() { try { @@ -172,7 +175,6 @@ const GraphWithNavigation: React.FC<{ id: string; title: string }> = ({ console.log(err); } } - async function fetchPlotData() { try { const { data: transparencyPlot } = await api.default.get( @@ -183,10 +185,32 @@ const GraphWithNavigation: React.FC<{ id: string; title: string }> = ({ console.log(err); } } + const fetchAgencyTotalData = async () => { + const currentYear = getCurrentYear(); + await fetchAgencyTotalDataRecursive(currentYear); + }; + + const fetchAgencyTotalDataRecursive = async (yearParam: number) => { + try { + const { data: agencyTotalsResponse } = await api.ui.get( + `/v2/orgao/totais/${id}/${year}`, + ); + + if (agencyTotalsResponse.meses) { + setAgencyTotals(agencyTotalsResponse); + } else { + const previousYear = yearParam - 1; + await fetchAgencyTotalDataRecursive(previousYear); + } + } catch (err) { + console.log(err); + } + }; return (
(); const [loading, setLoading] = useState(true); + const [agencyInfo, setAgencyInfo] = useState(); function getNextDate() { let m = +month; let y = +year; @@ -78,7 +80,7 @@ export default function OmaPage({ useEffect(() => { // then it checks the next and the previous year to block the navigation buttons or to help to choose the right year // finally it fetchs the data from the api to fill the chart with the agency/month/year data - fetchChartData(); + Promise.all([fetchChartData(), fetchAgencyInfo()]); }, [year, month]); async function fetchChartData() { try { @@ -94,6 +96,17 @@ export default function OmaPage({ setLoading(false); } } + async function fetchAgencyInfo() { + try { + const { data: agencyObj }: { data: Agency } = await api.default.get( + `orgao/${agency}`, + ); + setAgencyInfo(agencyObj); + } catch (error) { + console.log(error); + router.push('/404'); + } + } function handleNavigateToNextSummaryOption() { const { m, y } = getNextDate(); setLoading(true); @@ -126,10 +139,23 @@ export default function OmaPage({
- - {oma ? oma?.orgao : 'Coleta não realizada!'} ( - {agency.toLocaleUpperCase('pt')}) - + + + {oma ? oma?.orgao : 'Coleta não realizada!'} ( + {agency.toLocaleUpperCase('pt')}) + + ([]); const router = useRouter(); function navigateToGivenYear(y: number) { router.push(`/orgao/${id}/${y}`); } const pageTitle = `${id.toUpperCase()} - ${year}`; + + useEffect(() => { + fetchMIData(); + }, []); + const fetchMIData = async () => { + try { + const { data: mi } = await api.default.get(`/dados/${id}/${year}`); + setMI(mi); + } catch (error) { + console.log(error); + router.push(`/404`); + } + }; return ( @@ -51,6 +66,7 @@ export default function AgencyPage({ (); useEffect(() => { const yearData: number = data && @@ -36,8 +37,31 @@ export default function AnualAgencyPage({ .sort((a, b) => b - a) .find(d => d <= getCurrentYear()); + fetchAgencyTotalData(); setYear(yearData); }, [data]); + + const fetchAgencyTotalData = async () => { + const currentYear = getCurrentYear(); + await fetchAgencyTotalDataRecursive(currentYear); + }; + + const fetchAgencyTotalDataRecursive = async (yearParam: number) => { + try { + const { data: agencyTotalsResponse } = await api.ui.get( + `/v2/orgao/totais/${id}/${year}`, + ); + + if (agencyTotalsResponse.meses) { + setAgencyTotals(agencyTotalsResponse); + } else { + const previousYear = yearParam - 1; + await fetchAgencyTotalDataRecursive(previousYear); + } + } catch (err) { + console.log(err); + } + }; return ( @@ -56,6 +80,7 @@ export default function AnualAgencyPage({