Smart/smartEnergyView-frontend
2
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

✨ add charts

Browse Source
This commit is contained in:
joseCorte-exe 2022-05-17 13:52:44 -03:00
parent 83b035e262
commit ed10b5d050
21 changed files with 198 additions and 197 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/components/graph/Chart.tsx
View File

@ -14,6 +14,8 @@ import {
import faker from 'faker'
import { ChartView } from './ChartView';
import RenderIf from '../../utils/renderIf';
import ChartTitle from './ChartTitle';
import { data } from './LineBarChart';
ChartJS.register(
CategoryScale,
@ -26,15 +28,33 @@ ChartJS.register(
interface ChartInterface {
title: string,
data?: any,
subtitle: string,
data1: any,
data2: any,
single?: any
label: any
}
export default function Chart({ title, single, data }: ChartInterface) {
const [ graphData, setGraphData ] = useState({
labels: [],
datasets: [],
})
export default function Chart({ title, data1, data2, label, subtitle }: ChartInterface) {
const labels = label;
const data = {
labels,
datasets: [
{
label: '2020',
data: data1.map(value => value),
backgroundColor: '#C2D5FB',
},
{
label: '2021',
data: data2.map(value => value),
backgroundColor: '#255488',
},
],
}
const options = {
responsive: true,
plugins: {
@ -43,43 +63,24 @@ export default function Chart({ title, single, data }: ChartInterface) {
},
title: {
display: true,
text: title,
text: '',
},
},
};
const labels = ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez'];
useEffect(() => {
setGraphData({
labels,
datasets: [
{
label: '2020',
data: labels.map(() => faker.datatype.number({ min: 0, max: 1200 })),
backgroundColor: '#C2D5FB',
},
{
label: '2021',
data: labels.map(() => faker.datatype.number({ min: 0, max: 1200 })),
backgroundColor: '#255488',
},
],
})
}, [])
return (
<ChartView>
<RenderIf isTrue={single? true : false} >
{/* <RenderIf isTrue={single? true : false} >
<Bar
options={options}
data={graphData}
/>
</RenderIf>
</RenderIf> */}
<ChartTitle title={title} subtitle={subtitle} />
<Bar
options={options}
data={graphData}
data={data}
/>
</ChartView>
)

8
src/components/graph/ChartView.ts
View File

@ -9,5 +9,13 @@ export const ChartView = styled.div`
`
export const ChartTitleView = styled.div`
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
* {
margin: 0;
}
`

63
src/components/graph/LineBarChart.tsx
View File

@ -12,6 +12,7 @@ import {
import { Chart } from 'react-chartjs-2';
import faker from 'faker';
import { ChartView } from './ChartView';
import ChartTitle from './ChartTitle';
ChartJS.register(
LinearScale,
@ -23,28 +24,6 @@ ChartJS.register(
Tooltip
);
const labels = ['1', '2', '3', '4', '5', '6', '7', '8', '8', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30'];
export const data = {
labels,
datasets: [
{
type: 'line' as const,
label: 'Dataset 1',
borderColor: '#C2D5FB',
borderWidth: 2,
fill: false,
data: labels.map(() => faker.datatype.number({ min: 0, max: 140000 })),
},
{
type: 'bar' as const,
label: 'Dataset 2',
backgroundColor: '#255488',
data: labels.map(() => faker.datatype.number({ min: 0, max: 140000 })),
},
],
};
function triggerTooltip(chart: ChartJS | null) {
const tooltip = chart?.tooltip;
@ -78,9 +57,46 @@ function triggerTooltip(chart: ChartJS | null) {
chart.update();
}
export function LineBarChart() {
interface LineBarChartInterface {
title: string,
subtitle: string,
data1: any,
data2: any,
data3: any,
label: any
}
export function LineBarChart({ title, subtitle, data1, data2, data3, label }: LineBarChartInterface) {
const chartRef = useRef<ChartJS>(null);
const labels = label
const data = {
labels,
datasets: [
{
type: 'line' as const,
label: 'Dataset 1',
borderColor: '#0c9200',
borderWidth: 2,
fill: false,
data: data1.map(value => value),
},
{
type: 'bar' as const,
label: 'Dataset 2',
backgroundColor: '#255488',
data: data2.map(value => value),
},
{
type: 'bar' as const,
label: 'Dataset 2',
backgroundColor: '#C2D5FB',
data: data3.map(value => value),
},
],
};
useEffect(() => {
const chart = chartRef.current;
@ -89,6 +105,7 @@ export function LineBarChart() {
return (
<ChartView>
<ChartTitle title={title} subtitle={subtitle}/>
<Chart ref={chartRef} type='bar' data={data} />
</ChartView>
)

90
src/components/graph/LineChart.tsx
View File

@ -41,6 +41,7 @@ import {
} from 'chart.js';
// import { Line } from 'react-chartjs-2';
import faker from 'faker';
import ChartTitle from './ChartTitle';
ChartJS.register(
CategoryScale,
@ -55,47 +56,15 @@ ChartJS.register(
interface ChartInterface {
title: string,
datas: any
subtitle: string,
data1: any,
data2?: any,
data3?: any,
data4?: any,
label: any,
}
export default function LineChart({ title, datas }: ChartInterface) {
// const [ graphData, setGraphData ] = useState({
// labels: [],
// datasets: [],
// })
// const options = {
// responsive: true,
// plugins: {
// legend: {
// position: 'bottom' as const,
// },
// title: {
// display: true,
// text: title,
// },
// },
// };
// const labels = ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez'];
// useEffect(() => {
// setGraphData({
// labels,
// datasets: [
// {
// label: '2020',
// data: labels.map(() => faker.datatype.number({ min: 0, max: 1200 })),
// backgroundColor: '#C2D5FB',
// },
// {
// label: '2021',
// data: labels.map(() => faker.datatype.number({ min: 0, max: 1200 })),
// backgroundColor: '#255488',
// },
// ],
// })
// }, [])
export default function LineChart({ title, subtitle, data1, data2, data3, data4, label }: ChartInterface) {
const options = {
responsive: true,
plugins: {
@ -104,45 +73,46 @@ export default function LineChart({ title, datas }: ChartInterface) {
},
title: {
display: true,
text: 'Chart.js Line Chart',
text: '',
},
},
};
const labels = ['0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8',];
const labels = label;
const data = {
labels,
datasets: [
// {
// label: 'Dataset 1',
// data: [9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9],
// borderColor: 'rgb(53, 162, 235)',
// backgroundColor: 'rgba(53, 162, 235, 0.5)',
// },
// {
// label: 'Dataset 2',
// data: [6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6],
// borderColor: 'rgb(255, 114, 32)',
// backgroundColor: 'rgba(255, 145, 0, 0.5)',
// },
{
label: 'Dataset 1',
data: data1.map(value => value),
borderColor: 'rgb(53, 162, 235)',
backgroundColor: 'rgba(53, 162, 235, 0.5)',
},
{
label: 'Dataset 2',
data: data2.map(value => value),
borderColor: 'rgb(255, 114, 32)',
backgroundColor: 'rgba(255, 145, 0, 0.5)',
},
{
label: 'Dataset 3',
data: datas,
data: data3.map(value => value),
borderColor: 'rgb(109, 109, 109)',
backgroundColor: 'rgba(90, 90, 90, 0.5)',
},
// {
// label: 'Dataset4',
// data: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
// borderColor: 'rgb(255, 166, 0)',
// backgroundColor: 'rgba(255, 187, 0, 0.5)',
// },
{
label: 'Dataset4',
data: data4.map(value => value),
borderColor: 'rgb(255, 166, 0)',
backgroundColor: 'rgba(255, 187, 0, 0.5)',
},
],
};
return (
<ChartView>
<ChartTitle title={title} subtitle={subtitle} />
<Line options={options} data={data} />
</ChartView>
)

58
src/components/graph/SingleBar.tsx
View File

@ -11,6 +11,9 @@ import {
import { Bar } from 'react-chartjs-2';
import faker from 'faker';
import { ChartView } from './ChartView';
import ChartTitle from './ChartTitle';
import { dataEconomiaBruta } from '../../services/economiaBruta'
ChartJS.register(
CategoryScale,
@ -21,35 +24,42 @@ ChartJS.register(
Legend
);
export const options = {
responsive: true,
plugins: {
legend: {
position: 'top' as const,
},
title: {
display: true,
text: 'Chart.js Bar Chart',
},
},
};
interface SingleBarInterface{
title: string,
subtitle: string,
dataProps: any,
label: any
}
const labels = ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez'];
export const data = {
labels,
datasets: [
{
label: 'Dataset 2',
data: labels.map(() => faker.datatype.number({ min: 0, max: 1000 })),
backgroundColor: '#255488',
export function SingleBar({ title, subtitle, dataProps, label }: SingleBarInterface) {
const options = {
responsive: true,
plugins: {
legend: {
position: 'top' as const,
},
title: {
display: true,
text: '',
},
},
],
};
};
export function SingleBar() {
const labels = label;
const data = {
labels,
datasets: [
{
label: 'Dataset 2',
data: dataProps.map(value => value),
backgroundColor: '#255488',
},
],
};
return (
<ChartView>
<ChartTitle title={title} subtitle={subtitle} />
<Bar options={options} data={data} />
</ChartView>
)

4
src/pages/accumulatedSavings.tsx
View File

@ -1,8 +1,10 @@
import React from 'react'
import Chart from '../components/graph/Chart'
import { SingleBar } from '../components/graph/SingleBar'
import Header from '../components/header/Header'
import PageTitle from '../components/pageTitle/PageTitle'
import { EconomiaAcumulada } from '../services/economiaAcumulada'
import { AccumulatedSavingsView } from '../styles/layouts/economy/accumulatedSavings/AccumulatedSavingsView'
@ -12,7 +14,7 @@ export default function AccumulatedSavings() {
<Header name='' />
<PageTitle title='Economia Acumulada' subtitle='Economia Bruta Estimada e Acumulada anual (Valores em R$ mil)' />
<section>
<Chart title='Indicador de custo' />
<SingleBar title='Economia Bruta Estimada e Acumulada' subtitle='(Valores em R$ mil)' label={EconomiaAcumulada.label1} dataProps={EconomiaAcumulada.data2} />
</section>
</AccumulatedSavingsView>
)

5
src/pages/costIndicator.tsx
View File

@ -1,8 +1,11 @@
import React from 'react'
import Chart from '../components/graph/Chart'
import { SingleBar } from '../components/graph/SingleBar'
import Header from '../components/header/Header'
import PageTitle from '../components/pageTitle/PageTitle'
import { dataEconomiaBruta } from '../services/economiaBruta'
import { dataEconomiaIndicador } from '../services/economiaIndicador'
import { CostIndicatorView } from '../styles/layouts/economy/costIndicator/CostIndicatorView'
export default function CostIndicator() {
@ -11,7 +14,7 @@ export default function CostIndicator() {
<Header name='' />
<PageTitle title='Indicador de Custo' subtitle='Valores em R$/MWh'/>
<section>
<Chart title='Indicador de custo' />
<Chart title='Indicador de Custo' subtitle='(Valores em R$/MWh)' data1={dataEconomiaIndicador.data1} data2={dataEconomiaIndicador.data2} label={dataEconomiaIndicador.labels} />
</section>
</CostIndicatorView>
)

16
src/pages/dashboard.tsx
View File

@ -8,6 +8,12 @@ import Header from '../components/header/Header'
import PageTitle from '../components/pageTitle/PageTitle'
import Link from 'next/link'
import LineChart from '../components/graph/LineChart'
import { SingleBar } from '../components/graph/SingleBar'
import { dataEconomiaBruta } from '../services/economiaBruta'
import { dataEconomiaIndicador } from '../services/economiaIndicador'
import { EconomiaAcumulada } from '../services/economiaAcumulada'
import Chart from '../components/graph/Chart'
export default function Dashboard() {
@ -27,10 +33,14 @@ export default function Dashboard() {
<section className='dashboard'>
<GraphCard title='Consumo' subtitle='Gráfico de Consumo' consumption={25} line>
{/* <LineChart datas={dataEconomia} /> */}
<LineChart data1={EconomiaAcumulada.data2} data2={[]} data3={[]} data4={[]} title='Consumo Acumulado' subtitle='' label={EconomiaAcumulada.label1} />
</GraphCard>
<GraphCard title='Indicador de Custo' subtitle='Valores em R$/ MWh'>
<Chart title='Indicador de Custo' subtitle='(Valores em R$/MWh)' data1={dataEconomiaIndicador.data1} data2={dataEconomiaIndicador.data2} label={dataEconomiaIndicador.labels} />
</GraphCard>
<GraphCard title='Economia Acumulado' subtitle='Economia Acumulado' className='footerGraph' singleBar>
<SingleBar title='Economia Bruta Estimada e Acumulada' subtitle='(Valores em R$ mil)' label={EconomiaAcumulada.label1} dataProps={EconomiaAcumulada.data2} />
</GraphCard>
<GraphCard title='Indicador de Custo' subtitle='Valores em R$/ MWh' />
<GraphCard title='Economia Acumulado' subtitle='Economia Acumulado' className='footerGraph' singleBar />
</section>
</DashboardView>
)

4
src/pages/estimatedCost.tsx
View File

@ -1,8 +1,10 @@
import React from 'react'
import Chart from '../components/graph/Chart'
import { LineBarChart } from '../components/graph/LineBarChart'
import Header from '../components/header/Header'
import PageTitle from '../components/pageTitle/PageTitle'
import { ConsumoEstimado } from '../services/consumoEstimado'
import { EstimatedCostView } from '../styles/layouts/economy/estimatedCost/EstimatedCostView'
@ -12,7 +14,7 @@ export default function EstimatedCost() {
<Header name='' />
<PageTitle title='Custos Estimados' subtitle='Comparativo de Custo Estimado' />
<section>
<Chart title='Indicador de custo' />
<LineBarChart data1={ConsumoEstimado.data2} data2={ConsumoEstimado.data} data3={ConsumoEstimado.data1} label={ConsumoEstimado.label} title='evolução pld' subtitle='' />
</section>
</EstimatedCostView>
)

4
src/pages/grossSavings.tsx
View File

@ -1,8 +1,10 @@
import React from 'react'
import Chart from '../components/graph/Chart'
import { SingleBar } from '../components/graph/SingleBar'
import Header from '../components/header/Header'
import PageTitle from '../components/pageTitle/PageTitle'
import { dataEconomiaBruta } from '../services/economiaBruta'
import { GrossSavingsView } from '../styles/layouts/economy/grossSavings/GrossSavings'
@ -12,7 +14,7 @@ export default function GrossSavings() {
<Header name='' />
<PageTitle title='Economia Bruta' subtitle='Economia Bruta Estimada e Acumulada anual (Valores em R$ mil)' />
<section>
<Chart title='Indicador de custo' />
<SingleBar title='Economia Bruta Estimada e Acumulada' subtitle='(Valores em R$ mil)' label={dataEconomiaBruta.labels} dataProps={dataEconomiaBruta.data} />
</section>
</GrossSavingsView>
)

39
src/pages/pld/index.tsx
View File

@ -14,6 +14,8 @@ import PageTitle from '../../components/pageTitle/PageTitle';
import Link from 'next/link';
import LineChart from '../../components/graph/LineChart';
import { LineBarChart } from '../../components/graph/LineBarChart';
import { EconomiaAcumulada } from '../../services/economiaAcumulada';
import { EvolucaoPld } from '../../services/evolucaoPld';
export default function region() {
const router = useRouter()
@ -30,39 +32,6 @@ export default function region() {
console.log(page)
}, [page])
const labels = ['0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8',];
const data = {
labels,
datasets: [
{
label: 'Dataset 1',
data: [9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9],
borderColor: 'rgb(53, 162, 235)',
backgroundColor: 'rgba(53, 162, 235, 0.5)',
},
{
label: 'Dataset 2',
data: [6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6],
borderColor: 'rgb(255, 114, 32)',
backgroundColor: 'rgba(255, 145, 0, 0.5)',
},
{
label: 'Dataset 3',
data: [3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3],
borderColor: 'rgb(109, 109, 109)',
backgroundColor: 'rgba(90, 90, 90, 0.5)',
},
{
label: 'Dataset4',
data: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
borderColor: 'rgb(255, 166, 0)',
backgroundColor: 'rgba(255, 187, 0, 0.5)',
},
],
};
return (
<main style={{
width: '100%',
@ -231,7 +200,7 @@ export default function region() {
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09"/>
<BasicButton title='Download (csv)' />
</section>
<LineBarChart />
<LineBarChart data1={EvolucaoPld.data} data2={EvolucaoPld.data1} data3={[]} label={EvolucaoPld.label} title='evolução pld' subtitle='' />
</PldGraphView>
</RenderIf>
@ -243,7 +212,7 @@ export default function region() {
<input type="date" data-date="" data-date-format="DD MMMM YYYY" value="2015-08-09"/>
<BasicButton title='Download (csv)' />
</section>
<LineChart title='' data={data}/>
<LineChart data1={EconomiaAcumulada.data3} data2={EconomiaAcumulada.data4} data3={EconomiaAcumulada.data5} data4={EconomiaAcumulada.data6} title='Consumo Acumulado' subtitle='' label={EconomiaAcumulada.label1} />
</PldGraphView>
</RenderIf>
</main>

16
src/services/economiaAcumulada.js
View File

@ -1,5 +1,15 @@
export const EconomiaAcumulada = {
data : [872, 903, 938, 985, 1021, 1055, 1094, 1133, 1181, 1226, 1294],
data1 : [1445, 1615],
label: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez']
data : [872, 903, 938, 985, 1021, 1055, 1094, 1133, 1181, 1226, 1294],
data1 : [1445, 1615],
data2 : [872, 903, 938, 985, 1021, 1055, 1094, 1133, 1181, 1226, 1294, 872, 903, 938, 985, 1021, 1055, 1094, 1133, 1181, 1226, 1294, 872, 903, 938, 985, 1021, 1055, 1094, 1133, 1181, 1226, 1294, 872, 903, 938, 985, 1021, 1055, 1094, 1133, 1181, 1226, 1294, 872, 903, 938, 985, 1021, 1055],
data3: [9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9, 9],
data4: [6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6, 6],
data5: [3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3],
data6: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
label: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez'],
label1: ['1', '2', '3', '4', '5', '6', '7', '8', '8', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30'],
label3: ['0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8', '0', '2', '4', '6', '8',]
}

5
src/services/economiaBruta.js
View File

@ -1 +1,4 @@
export const dataEconomiaBruta=[872, 1.615, 2.196, 3.838, 4.814, 5.853]
export const dataEconomiaBruta = {
data: [872, 1615, 2196, 2930, 3838, 4814, 5853],
labels: ['até 2020', '2021', '2022', '2023', '2024', '2025', '2026']
}

6
src/services/economiaIndicador.js
View File

@ -1 +1,5 @@
export const data = []
export const dataEconomiaIndicador = {
data1: [591, 552, 527, 1138, 529, 478, 456, 515, 526, 731, 890, 742],
data2: [714, 683, 547, 575, 660, 628, 699, 751, 819, 700],
labels: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'ago', 'set', 'out', 'nov', 'dez']
}

2
src/services/evolucaoPld.js
View File

@ -5,4 +5,4 @@ export const EvolucaoPld = {
data1 :[97.00, 98.00, 99.00, 100.00, 105.00, 113.00, 116.00, 120.00, 123.00, 120.00, 120.00, 118.00, 113.00, 101.00, 100.00, 98.00,
98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00, 98.00],
label: ['1', '2', '3', '4', '5', '6', '7', '8', '8', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30']
}
}

3
src/styles/layouts/consumption/ConsumptionView.ts
View File

@ -11,8 +11,5 @@ export const ConsumptionView = styled.main`
justify-content: center;
align-items: center;
canvas {
margin: 160px 0 0 0
}
}
`

1
src/styles/layouts/economy/accumulatedSavings/AccumulatedSavingsView.ts
View File

@ -12,7 +12,6 @@ export const AccumulatedSavingsView = styled.main`
align-items: center;
canvas {
margin: 160px 0 0 0;
}
}
`

6
src/styles/layouts/economy/costIndicator/CostIndicatorView.ts
View File

@ -9,10 +9,6 @@ export const CostIndicatorView = styled.main`
section {
display: flex;
justify-content: center;
align-items: center;
canvas {
margin: 160px 0 0 0;
}
align-items: center
}
`

1
src/styles/layouts/economy/estimatedCost/EstimatedCostView.ts
View File

@ -12,7 +12,6 @@ export const EstimatedCostView = styled.main`
align-items: center;
canvas {
margin: 160px 0 0 0;
}
}
`

1
src/styles/layouts/economy/grossSavings/GrossSavings.ts
View File

@ -22,7 +22,6 @@ export const GrossSavingsView = styled.main`
align-items: center;
canvas {
margin: 160px 0 0 0;
}
}
`

2
src/styles/layouts/pld/PldView.ts
View File

@ -168,10 +168,10 @@ export const PldGraphView = styled.main`
:first-child {
justify-content: space-around;
margin-bottom: 50px;
}
:nth-child(2) {
margin-top: 50px;
margin-bottom: 50px;
justify-content: space-evenly;
}