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

Merge branch 'telemetry' into 'dev'

Browse Source 
more issus pointed

See merge request kluppsoftware/smart-energia-web!116
This commit is contained in:
José Corte 2022-07-20 03:31:30 +00:00
commit 67cd3ad8e0
23 changed files with 635 additions and 572 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -101,7 +101,7 @@ export default function Chart({ title, data1, data2, label, subtitle, dataset1,
data: data2.map(value => value.custo_unit>0? value.custo_unit : null),
// backgroundColor: '#C2d5fb'
backgroundColor: (value, ctx) => {
return data2[value.dataIndex]?.dad_estimado == false ? '#C2d5fb' : draw('diagonal-right-left', '#C2d5fb');
return data2[value.dataIndex]?.dad_estimado == false ? '#C2d5fb' : document ? document ? draw('diagonal-right-left', '#C2d5fb') : null: null;
},
}
],

2
src/components/graph/Chart2.tsx
View File

@ -102,7 +102,7 @@ export default function Chart({ title, data1, data2, label, subtitle, dataset1,
type: 'bar',
label: 'Estimado',
data: data2.map(value => value.dad_estimado? value?.economia_acumulada : null),
backgroundColor: draw('diagonal-right-left', '#C2d5fb')
backgroundColor: document ? document ? draw('diagonal-right-left', '#C2d5fb') : null: null
},
],
}

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

@ -1,7 +1,11 @@
import styled from "styled-components"
export const ChartView = styled.div`
width: 100%!important;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
div{
/* margin-top: 10px; */

2
src/components/graph/DemRegXDemConChart.tsx
View File

@ -155,7 +155,7 @@ export function DemRegXDemConChart({
return (
<ChartView>
{/* <ChartTitle title={title} subtitle={subtitle}/> */}
<div>
<div style={{width: '90%'}}>
<Chart ref={chartRef} type='bar' options={options} data={data} />
</div>
</ChartView>

2
src/components/graph/DiscretizedConsumptionChart.tsx
View File

@ -98,7 +98,7 @@ export function DiscretizedConsumptionChart({ title, subtitle, dataProps, label,
return (
<ChartView>
{/* <ChartTitle title={title} subtitle={subtitle}/> */}
<div>
<div style={{width: '90%'}}>
<Chart type='bar' options={options} data={data} />
</div>
</ChartView>

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

@ -179,9 +179,7 @@ export function LineBarChart({ title, subtitle, data1, data2, data3, label, red,
return (
<ChartView>
<ChartTitle title={title} subtitle={subtitle}/>
<div>
<Chart ref={chartRef} type='bar' options={options} data={data} />
</div>
</ChartView>
)
}

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

@ -104,7 +104,7 @@ export function SingleBar({ title, subtitle, dataProps, label, dataset, barLabel
return parseFloat(value.economia_acumulada).toFixed(2)
}),
backgroundColor: (value, ctx) => {
return dataProps[value.dataIndex]?.dad_estimado == false ? '#255488' : draw('diagonal-right-left', '#C2d5fb');
return dataProps[value.dataIndex]?.dad_estimado == false ? '#255488' : document ? document ? draw('diagonal-right-left', '#C2d5fb') : null: null;
},
},
{

10
src/components/graph/cativoXLivreChart/index.tsx
View File

@ -136,7 +136,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
},
borderWidth: 2,
fill: false,
data: chartData.map(value => parseInt(value.economia_mensal)),
data: chartData?.map(value => parseInt(value.economia_mensal)),
},
{
type: 'bar' as const,
@ -144,7 +144,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
backgroundColor: (value, ctx) => {
return '#C2D5FB'
},
data: chartData.map(value => {
data: chartData?.map(value => {
if (!value.dad_estimado)
return parseInt(value.custo_cativo)
}),
@ -156,7 +156,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
backgroundColor: (value, ctx) => {
return '#255488'
},
data: chartData.map(value => {
data: chartData?.map(value => {
if (!value.dad_estimado)
return parseInt(value.custo_livre)
}),
@ -165,7 +165,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
type: 'bar',
label: 'Est. Cativo',
backgroundColor: pattern.draw('diagonal', '#C2D5FB'),
data: chartData.map(value => {
data: chartData?.map(value => {
if (value.dad_estimado)
return parseInt(value.custo_cativo)
}),
@ -174,7 +174,7 @@ export function CativoXLivreChart({ title, subtitle, chartData, label, red, data
type: 'bar',
label: 'Est. Livre',
backgroundColor: pattern.draw('diagonal', '#255488'),
data: chartData.map(value => {
data: chartData?.map(value => {
if (value.dad_estimado)
return parseInt(value.custo_livre)
}),

4
src/components/graph/costIndicatorChart/index.tsx
View File

@ -89,7 +89,7 @@ export default function CostIndicatorChart({ title, data1, data2, label, subtitl
datasets: [
{
label: '2021',
data: data1.map(value => value.custo_unit>0? value.custo_unit : null),
data: data1?.map(value => value.custo_unit>0? value.custo_unit : null),
// backgroundColor: '#C2d5fb'
backgroundColor: (value, ctx) => {
if (value.dad_estimado)
@ -100,7 +100,7 @@ export default function CostIndicatorChart({ title, data1, data2, label, subtitl
},
{
label: '2022',
data: data2.map(value => value.custo_unit>0? value.custo_unit : null),
data: data2?.map(value => value.custo_unit>0? value.custo_unit : null),
// backgroundColor: '#255488'
backgroundColor: (value, ctx) => {
if (value.dad_estimado)

4
src/components/graph/fatorPotenciaChart.tsx
View File

@ -82,6 +82,8 @@ export default function FatorPotenciaChart({ title, subtitle, data1, data2, labe
const labels = label;
console.log(data1)
const data = {
labels,
datasets: [
@ -106,7 +108,9 @@ export default function FatorPotenciaChart({ title, subtitle, data1, data2, labe
return (
<ChartView>
{/* <ChartTitle title={title} subtitle={subtitle} /> */}
<div style={{width: '90%'}}>
<Line options={options} data={data} />
</div>
</ChartView>
)
}

19
src/components/graph/graphCard/ChartCard.tsx
View File

@ -33,7 +33,6 @@ export default function ChartCard({ title, subtitle, consumption, className, lin
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: [
@ -43,24 +42,6 @@ export default function ChartCard({ title, subtitle, consumption, className, lin
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],
// borderColor: 'rgb(255, 114, 32)',
// backgroundColor: 'rgba(255, 145, 0, 0.5)',
// },
// {
// label: 'Dataset 3',
// data: [1, 2, 3, 5, 7, 8, 9, 8, 9, 7, 8, 6, 4, 3, 2, 3, 3, 4, 4, 5, 5, 5, 6, 6, 7, 7, 9, 10, 11, 12, 12, 14, 15, 17, 20, 21, 18, 15, 14, 12, 11, 10, 8, 6, 7, 8, 7, 9],
// 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],
// borderColor: 'rgb(255, 166, 0)',
// backgroundColor: 'rgba(255, 187, 0, 0.5)',
// },
],
};

2
src/components/graph/grossAnualChart/GrossAnualChart.tsx
View File

@ -30,7 +30,7 @@ interface SingleBarInterface{
export function GrossAnualChart({ title, subtitle, dataProps, label, dataset, barLabel, miniature, bruta }: SingleBarInterface) {
function spacement(string) {
const spaces = string.length===1?'' : string.length===2? '⠀⠀⠀⠀' : string.length===3? '⠀⠀⠀' : string.length===4? '⠀⠀' : string.length===5? '⠀' : ''
const spaces = string.length===1?'' : string.length===2? '' : string.length===3? ' ' : string.length===4? ' ' : string.length===5? ' ' : ''
console.log(string.length)

3
src/components/graph/grossMensalChart/GrossMensalChart.tsx
View File

@ -43,7 +43,8 @@ interface ChartInterface {
export default function GrossMensalChart({ title, data1, data2, label, subtitle, miniature }: ChartInterface) {
function spacement(string) {
const spaces = string.length===1?'' : string.length===2? '⠀⠀⠀⠀' : string.length===3? '⠀⠀⠀' : string.length===4? '⠀⠀' : string.length===5? '⠀' : ''
const spaces = string.length===1?'' : string.length===2? '' : string.length===3? ' ' : string.length===4? ' ' : string.length===5? ' ' : ''
// const spaces = string.length===1?'' : string.length===2? '⠀⠀⠀⠀' : string.length===3? '⠀⠀⠀' : string.length===4? '⠀⠀' : string.length===5? '⠀' : ''
console.log(string.length)

6
src/pages/dashboard/index.tsx
View File

@ -64,6 +64,9 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
</section>
</Link>
{
typeof window === 'undefined' || typeof window === undefined? null :
<>
<section className='dashboard'>
<GraphCard title='Economia Bruta Anual' subtitle='Economia Bruta Estimada e Acumulada Anual - Valores em R$ x mil'>
<GrossAnualChart title='' subtitle=''
@ -97,6 +100,9 @@ export default function Dashboard({grossAnualGraph, grossAnualYears, grossMensal
/>
</GraphCard>
</section>
</>
}
</DashboardView>
)
}

28
src/pages/economy/index.tsx
View File

@ -37,6 +37,8 @@ import { ConsumoEstimado } from '../../services/consumoEstimado';
import CostIndicatorChart from '../../components/graph/costIndicatorChart';
import { EconomyView } from '../../styles/layouts/economy/economy';
import dynamic from 'next/dynamic';
export default function economy({userName, anual, years, brutaMensal, yearsBrutaMensal, catLiv, clients, indicatorCost}: any) {
const {economyMenu, setEconomyMenu} = useContext(MenuContext)
@ -74,20 +76,20 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
}, [unity])
useEffect(() => {
api.post('/economy/estimates', unity!==''?{
api.post('/economy/MWh', unity!==''?{
"filters": [
{"type" : "=", "field":"dados_cadastrais.cod_smart_unidade", "value": unity}
]
}:{}).then(res => {
setIndicatorDataState(res.data.data)
console.log()
console.log('res', res.data.data)
}).catch(res => {
// console.log(res)
})
}, [unity])
return (
<EconomyView style={{width: '100%'}}>
<EconomyView>
<Head>
<title>Smart Energia - PLD</title>
</Head>
@ -105,6 +107,9 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
</Tabs>
</TableHeader>
{
typeof window === 'undefined' || typeof window === undefined? null :
<>
<RenderIf isTrue={economyMenu===0}>
<section>
<GrossAnualChart title='' subtitle=''
@ -117,22 +122,25 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
</RenderIf>
<RenderIf isTrue={economyMenu===1}>
<section>
<GrossMensalChart title='' subtitle=''
data1={brutaMensal}
data2={brutaMensal}
label={yearsBrutaMensal}
/>
</section>
</RenderIf>
<RenderIf isTrue={economyMenu===2}>
<div style={{paddingLeft: '7%'}}>
<FormControl sx={{ m: 1, minWidth: 120, width: 200 }} size="small">
<FormControl sx={{ m: 1, minWidth: 120, width: 200, height: '64px' }} size="small">
<InputLabel id="demo-select-small">Unidade</InputLabel>
<Select
labelId="demo-select-small"
id="demo-select-small"
value={unity}
label="Unidade"
sx={{height: '64px'}}
onChange={value => setUnity(value.target.value)}
fullWidth
>
@ -161,6 +169,7 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
labelId="demo-select-small"
id="demo-select-small"
value={unity}
sx={{height: '64px'}}
label="Unidade"
onChange={value => setUnity(value.target.value)}
fullWidth
@ -177,16 +186,15 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
</div>
<section>
<CostIndicatorChart title='' subtitle=''
data1={unity!=''? indicatorDataState?.filter((value, index) => value.mes.slice(4, 8).includes('2021'))
:
indicatorCost?.filter((value, index) => value.mes.slice(4, 8).includes('2021'))}
data2={unity!=''? indicatorDataState?.filter((value, index) => value.mes.slice(4, 8).includes('2022'))
:
indicatorCost?.filter((value, index) => value.mes.slice(4, 8).includes('2022'))}
data1={indicatorDataState?.filter((value, index) => value.mes.slice(4, 8).includes('2021'))}
data2={indicatorDataState?.filter((value, index) => value.mes.slice(4, 8).includes('2022'))}
label={months}
/>
</section>
</RenderIf>
</>
}
</EconomyView>
)
}

3
src/pages/news/index.tsx
View File

@ -49,7 +49,8 @@ export default function aboutUs({userName, news}: any) {
<a href='https://www.energiasmart.com.br/noticias/'
target={"_blank"}
rel={"noreferrer"}><BasicButton title='Noticias Atualizadas' onClick={() => console.log()}/></a>
rel={"noreferrer"}>Ver Mais</a>
</NewsView>
</main>
)

46
src/pages/telemetria/index.tsx
View File

@ -197,7 +197,7 @@ export default function Telemetria({userName, clients}: any) {
}, [discretization])
return(
<TelemetriaView>
<main style={{width: '100%'}}>
<Head>
<title>Smart Energia - Telemetria</title>
</Head>
@ -245,6 +245,7 @@ export default function Telemetria({userName, clients}: any) {
<Header name={userName}>
<PageTitle title ='Telemetria' subtitle='Dados Coletados do Sistema de Coleta de Dados de Energia'/>
</Header>
<TelemetriaView>
{/* <Banner title ='Telemetria' subtitle='Dados Coletados do Sistema de Coleta de Dados de Energia -
SCDE da Câmara de Comercialização de Energia Elétrica - CCEE,
sendo que as quantidades aqui informadas são de responsabilidade do agente de medição
@ -275,7 +276,7 @@ export default function Telemetria({userName, clients}: any) {
value={unity}
label="Unidade"
onChange={value => setUnity(value.target.value)}
sx={{height: 63, mb: 0.5}}
sx={{height: 63, mb: 2}}
fullWidth
>
<MenuItem value="">
@ -299,7 +300,7 @@ export default function Telemetria({userName, clients}: any) {
value={discretization}
label="Discretização"
onChange={value => setDiscretization(value.target.value)}
sx={{height: 63, mb: 0.5}}
sx={{height: 63, mb: 2}}
fullWidth
>
<MenuItem value="">
@ -308,8 +309,8 @@ export default function Telemetria({userName, clients}: any) {
<MenuItem value="5_min">5 minutos</MenuItem>
<MenuItem value="15_min">15 minutos</MenuItem>
<MenuItem value="1_hora">1 hora</MenuItem>
<MenuItem value="1_dia">1 dia</MenuItem>
<MenuItem value="1_mes">1 mês</MenuItem>
{/* <MenuItem value="1_dia">1 dia</MenuItem>
<MenuItem value="1_mes">1 mês</MenuItem> */}
</Select>
</FormControl>
</div>
@ -320,7 +321,7 @@ export default function Telemetria({userName, clients}: any) {
inputFormat="dd/MM/yyyy"
value={startDate}
onChange={handleChangeStartDate}
renderInput={(params) => <TextField {...params}/>}
renderInput={(params) => <TextField {...params} sx={{mr: 1, mb: 2}}/>}
/>
</div>
<div className='datePicker' style={{marginRight: 10}}>
@ -339,7 +340,7 @@ export default function Telemetria({userName, clients}: any) {
new Date(startDate).setUTCDate(startDate.getUTCDate()+1)
}
onChange={(newValue: any) => handleChangeEndDate(newValue)}
renderInput={(params) => <TextField {...params} sx={{ml: 1}}/>}
renderInput={(params) => <TextField {...params} sx={{mb: 2}}/>}
/>
</div>
</LocalizationProvider>
@ -363,7 +364,7 @@ export default function Telemetria({userName, clients}: any) {
<RenderIf isTrue={menu===1}>
<ChartFilters>
<div className='input'>
<FormControl sx={{ minWidth: 100, width: 200 }} size="small">
<FormControl style={{ minWidth: 100, width: 200}} size="small">
<InputLabel>Unidade</InputLabel>
<Select
labelId="demo-select-small"
@ -371,7 +372,7 @@ export default function Telemetria({userName, clients}: any) {
value={unity}
label="Unidade"
onChange={value => setUnity(value.target.value)}
sx={{height: 63, mb: 0.5}}
sx={{height: 63, mb: 2}}
fullWidth
>
<MenuItem value="">
@ -395,7 +396,7 @@ export default function Telemetria({userName, clients}: any) {
value={discretization}
label="Discretização"
onChange={value => setDiscretization(value.target.value)}
sx={{height: 63, mb: 0.5}}
sx={{height: 63, mb: 2}}
fullWidth
>
<MenuItem value="">
@ -416,7 +417,7 @@ export default function Telemetria({userName, clients}: any) {
inputFormat="dd/MM/yyyy"
value={startDate}
onChange={handleChangeStartDate}
renderInput={(params) => <TextField {...params}/>}
renderInput={(params) => <TextField {...params} sx={{mr: 1, mb: 2}}/>}
/>
</div>
<div className='datePicker' style={{marginRight: 10}}>
@ -435,14 +436,14 @@ export default function Telemetria({userName, clients}: any) {
new Date(startDate).setUTCDate(startDate.getUTCDate()+1)
}
onChange={(newValue: any) => handleChangeEndDate(newValue)}
renderInput={(params) => <TextField {...params} sx={{ml: 1}}/>}
renderInput={(params) => <TextField {...params} sx={{mb: 2}}/>}
/>
</div>
</LocalizationProvider>
<div className='select'>
<BasicButton title='Selecionar!' onClick={() => {
getDiscretization(unity, startDate, endDate, discretization)
.then(result => setDiscretizedConsumptionData(result))
getDemand(unity, startDate, endDate, discretization)
.then(result => setDemRegXDemCon(result))
.catch(exception => console.log(exception))
}}/>
</div>
@ -455,7 +456,7 @@ export default function Telemetria({userName, clients}: any) {
<RenderIf isTrue={menu===2}>
<ChartFilters>
<div className='input'>
<FormControl sx={{ minWidth: 100, width: 200 }} size="small">
<FormControl style={{ minWidth: 100, width: 200}} size="small">
<InputLabel>Unidade</InputLabel>
<Select
labelId="demo-select-small"
@ -463,7 +464,7 @@ export default function Telemetria({userName, clients}: any) {
value={unity}
label="Unidade"
onChange={value => setUnity(value.target.value)}
sx={{height: 63, mb: 0.5}}
sx={{height: 63, mb: 2}}
fullWidth
>
<MenuItem value="">
@ -487,7 +488,7 @@ export default function Telemetria({userName, clients}: any) {
value={discretization}
label="Discretização"
onChange={value => setDiscretization(value.target.value)}
sx={{height: 63, mb: 0.5}}
sx={{height: 63, mb: 2}}
fullWidth
>
<MenuItem value="">
@ -508,7 +509,7 @@ export default function Telemetria({userName, clients}: any) {
inputFormat="dd/MM/yyyy"
value={startDate}
onChange={handleChangeStartDate}
renderInput={(params) => <TextField {...params}/>}
renderInput={(params) => <TextField {...params} sx={{mr: 1, mb: 2}}/>}
/>
</div>
<div className='datePicker' style={{marginRight: 10}}>
@ -527,14 +528,14 @@ export default function Telemetria({userName, clients}: any) {
new Date(startDate).setUTCDate(startDate.getUTCDate()+1)
}
onChange={(newValue: any) => handleChangeEndDate(newValue)}
renderInput={(params) => <TextField {...params} sx={{ml: 1}}/>}
renderInput={(params) => <TextField {...params} sx={{mb: 2}}/>}
/>
</div>
</LocalizationProvider>
<div className='select'>
<BasicButton title='Selecionar!' onClick={() => {
getDiscretization(unity, startDate, endDate, discretization)
.then(result => setDiscretizedConsumptionData(result))
getPowerFactorData(unity, startDate, endDate, discretization)
.then(result => setFatorPotenciaData(result))
.catch(exception => console.log(exception))
}}/>
</div>
@ -594,7 +595,7 @@ export default function Telemetria({userName, clients}: any) {
</div>
<div className='select'>
<BasicButton title='Selecionar!' onClick={() => {
getDiscretization(unity, startDate, endDate, discretization)
getDemand(unity, startDate, endDate, discretization)
.then(result => setDiscretizedConsumptionData(result))
.catch(exception => console.log(exception))
}}/>
@ -682,6 +683,7 @@ export default function Telemetria({userName, clients}: any) {
</p>
</TelemetriaView>
</main>
)
}

1
src/services/charts/telemetry/getDemand.ts
View File

@ -10,6 +10,7 @@ export async function getDemand(
) {
const { '@smartAuth-token': token } = parseCookies()
const { data } = await api.post('https://smart-energia-api.herokuapp.com/api/telemetry/demand', {
"type": discretization,
"filters": [
{"type" : "=", "field": `med_5min.ponto`, "value": unity},
{"type" : "between", "field": "dia_num", "value": [startDate.toLocaleDateString().split('/').reverse().join('-'), endDate.toLocaleDateString().split('/').reverse().join('-')]}

1
src/services/charts/telemetry/getPowerFactor.ts
View File

@ -9,6 +9,7 @@ export async function getPowerFactorData(
discretization: string
) {
const { data } = await api.post('http://smart-energia-api.herokuapp.com/api/telemetry/powerFactor', {
"type": discretization,
"filters": [
{"type" : "=", "field": "med_5min.ponto", "value": unity},
{"type" : "between", "field": "dia_num", "value": [startDate.toLocaleDateString().split('/').reverse().join('-'), endDate.toLocaleDateString().split('/').reverse().join('-')]}

2
src/styles/globals.ts
View File

@ -44,7 +44,7 @@ export const GlobalStyle = createGlobalStyle`
.MuiOutlinedInput-input, .MuiInputBase-input, .MuiInputBase-inputAdornedEnd, .css-nxo287-MuiInputBase-input-MuiOutlinedInput-input {
padding: 0 0 0 15px;
width: 100%;
height: 63px!important;
height: 63px;
}
.css-1u3bzj6-MuiFormControl-root-MuiTextField-root,
.css-o9k5xi-MuiInputBase-root-MuiOutlinedInput-root,

18
src/styles/layouts/Telemetria/TelemetriaView.ts
View File

@ -7,7 +7,7 @@ export const TelemetriaView = styled.main`
flex-direction: column;
padding: 20px;
padding: 0;
width: 100%;
.modal {
@ -95,14 +95,12 @@ export const TelemetriaView = styled.main`
table {
display: none;
}
.tg{
border-collapse:collapse;
border-spacing:0;
font-family:Poppins;
width: 100%;
}
.tg td{
border-color:#DDDFE1;
border-style:solid;
@ -113,7 +111,6 @@ export const TelemetriaView = styled.main`
padding:17px 30px;
word-break:normal;
}
.tg th{
border-color:#DDDFE1;
border-style:solid;
@ -158,7 +155,6 @@ export const TelemetriaView = styled.main`
text-align:center;
vertical-align:top
}
.tg .tg-baqh{
text-align:center;
vertical-align:top
@ -173,6 +169,10 @@ export const TelemetriaView = styled.main`
vertical-align:top
}
canvas {
align-self: center;
}
input {
width: 15rem;
@ -383,13 +383,15 @@ export const TableHeader = styled.div`
flex-direction: row;
padding: 0 40px 0 40px
/* padding: 0 40px 0 40px */
`
export const ChartFilters = styled.section`
display: flex;
align-items: center;
justify-content: center!important;
align-items: flex-start;
justify-content: flex-start!important;
margin-left: 72px;
align-self: flex-start;

19
src/styles/layouts/economy/economy.ts
View File

@ -1,9 +1,28 @@
import styled from 'styled-components'
export const EconomyView = styled.main`
width: 100%;
.MuiInputLabel-root, .MuiInputLabel-formControl {
margin-top: 11px;
}
section {
display: flex;
justify-content: center;
align-items: center;
}
input {
width: 16.6rem;
height: 63px!important;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-weight: 400;
border-radius: 6px;
border: solid gray 1px;
background-color: #F9F9F9;
}
`

35
src/styles/layouts/news/NewsView.ts
View File

@ -1,6 +1,12 @@
import styled from "styled-components";
export const NewsView = styled.main`
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 100%;
margin-bottom: 100px;
@ -71,6 +77,35 @@ export const NewsView = styled.main`
}
}
}
a {
display: flex;
justify-content: center;
align-items: center;
margin-top: 1px;
width: 140px;
height: 45px;
cursor: pointer;
background: #dadada;
border-radius: 8px;
border-style: none;
font-family: 'Poppins';
font-size: 90%;
transition: all 350ms ease-in;
:hover {
transform: scale(1.02);
opacity: 0.9;
box-shadow: rgb(0, 0, 0, 0.2) 0px 2px 4px -1px;
}
color: #000;
}
`;
export const Button = styled.div`