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 
Telemetry

See merge request kluppsoftware/smart-energia-web!115
This commit is contained in:
José Corte 2022-07-19 22:12:18 +00:00
commit 72f02b3035
10 changed files with 100 additions and 118 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,7 +1,7 @@
import styled from "styled-components"
export const ChartView = styled.div`
min-width: 90%;
width: 100%!important;
div{
/* margin-top: 10px; */

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

@ -63,7 +63,7 @@ export default function CostIndicatorChart({ title, data1, data2, label, subtitl
dataArr.map(data => {
sum += data;
});
const result = `${(parseFloat(value)/10).toLocaleString('pt-br').slice(0, 4)}`
const result = `${parseInt((parseInt(value)/10).toLocaleString('pt-br'))}`
return value==null? null : result
},

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

@ -103,7 +103,7 @@ export default function GrossMensalChart({ title, data1, data2, label, subtitle,
{
type: 'bar',
label: 'Consolidado',
data: data1.map(value => value?.economia_acumulada),
data: data1.map(value => !value.dad_estimado? value?.economia_acumulada : null),
backgroundColor: '#255488'
},
{

2
src/components/sidebar/Sidebar.tsx
View File

@ -129,7 +129,7 @@ export default function Sidebar() {
<Link href='/telemetria'><li className={router.pathname=='/telemetria'? 'actualPath' : null}><Image src='/assets/sidebar/telemetryIcon.svg' width={25} height={25} />{'Telemetria'}</li></Link>
<Link href='/resumoOperacao'><li className={router.pathname=='/resumoOperacao'? 'actualPath' : null} ><Image src='/assets/sidebar/summaryOperationsIcon.svg' width={25} height={25} />{'Resumo de Op. '}</li></Link>
<Link href='/news'><li className={router.pathname=='/news'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'Notícias'}</li></Link>
<Link href='/pld'><li onClick={() => setPldDrawer(!pldDrawer)} className={router.pathname=='/pld'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'PLD >'}</li></Link>
<Link href='/pld'><li onClick={() => setPldDrawer(!pldDrawer)} className={router.pathname=='/pld'? 'actualPath' : null}><Image src='/assets/sidebar/newsIcon.svg' width={25} height={25} />{'PLD'}</li></Link>
{/* <div className='pldDrawer drawer'>
<Link href='/pld'><li onClick={() => setPldMenu(0)} className={pldMenu==0? 'actualPathDrawer' : null}>PLD Histórico</li></Link>
<Link href='/pld'><li onClick={() => setPldMenu(1)} className={pldMenu===1? 'actualPathDrawer' : null}>Valores Diários</li></Link>

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

@ -175,17 +175,17 @@ export default function economy({userName, anual, years, brutaMensal, yearsBruta
</Select>
</FormControl>
</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'))}
label={months}
/>
</section>
<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'))}
label={months}
/>
</section>
</RenderIf>
</EconomyView>
)

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

@ -14,42 +14,44 @@ import { Button, NewsView } from '../../styles/layouts/news/NewsView'
export default function aboutUs({userName, news}: any) {
return (
<NewsView>
<main style={{display: 'flex', flexDirection: 'column'}}>
<Head>
<title>Smart Energia - Noticias</title>
</Head>
<Header name={userName}>
<PageTitle title='Notícias' subtitle='Tudo de importante no setor de energia'/>
</Header>
{/* <Banner title='Notícias' subtitle='Tudo de importante no setor de energia' imgSource='/assets/banners/newsBanner.webp'/> */}
<NewsView>
{/* <Banner title='Notícias' subtitle='Tudo de importante no setor de energia' imgSource='/assets/banners/newsBanner.webp'/> */}
{
news.slice(0, 3).map(data => {
{
news.slice(0, 3).map(data => {
return <>
<section>
<h2 dangerouslySetInnerHTML={{__html: data.pubDate.slice(0, -8)}} />
<strong dangerouslySetInnerHTML={{__html: data.title}} />
<strong>ANEEL APROVA REAJUSTE TARIFÁRIO ANUAL DA ENERGISA SERGIPE DE 16,46 % PARA O CONSUMIDOR RESIDENCIAL</strong>
<br />
<br />
{
<p dangerouslySetInnerHTML={{__html: data.description}} className='description'/>
}
<Button>
<fieldset>
<legend> <BasicButton title='Ver Mais...' onClick={() => window.open(data.guid)}/></legend>
</fieldset>
</Button>
</section>
</>
})
}
return <>
<section>
<h2 dangerouslySetInnerHTML={{__html: data.pubDate.slice(0, -8)}} />
<strong dangerouslySetInnerHTML={{__html: data.title}} />
<strong>ANEEL APROVA REAJUSTE TARIFÁRIO ANUAL DA ENERGISA SERGIPE DE 16,46 % PARA O CONSUMIDOR RESIDENCIAL</strong>
<br />
<br />
{
<p dangerouslySetInnerHTML={{__html: data.description}} className='description'/>
}
<Button>
<fieldset>
<legend> <BasicButton title='Ver Mais...' onClick={() => window.open(data.guid)}/></legend>
</fieldset>
</Button>
</section>
</>
})
}
<a href='https://www.energiasmart.com.br/noticias/'
target={"_blank"}
rel={"noreferrer"}><BasicButton title='Noticias Atualizadas' onClick={() => console.log()}/></a>
</NewsView>
<a href='https://www.energiasmart.com.br/noticias/'
target={"_blank"}
rel={"noreferrer"}><BasicButton title='Noticias Atualizadas' onClick={() => console.log()}/></a>
</NewsView>
</main>
)
}

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

@ -372,7 +372,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
{/* grafico de grafico por seleção de data (mês) (diario)*/}
<RenderIf isTrue={pldMenu===1}>
<PldGraphView>
<section className='toolsbar'>
<section className='toolsbar2'>
<FormControl sx={{
width: '320px'
}}>
@ -388,36 +388,36 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
<MenuItem value={'SUL'}>Sul</MenuItem>
<MenuItem value={'SUDESTE'}>Sudeste</MenuItem>
</Select>
</FormControl>
<FormControl sx={{
width: '320px',
ml: 1
}}>
<InputLabel id="demo-simple-select-label">Mês</InputLabel>
<Select
value={month}
onChange={handleChangeDay}
displayEmpty
placeholder='dia'
label="Age"
>
<MenuItem value={'0'}>Nenhum</MenuItem>
{
clientMonth.sort((a, b) => {
if (parseFloat(a.mes_ref.slice(0, 2)) < parseFloat(b.mes_ref.slice(0, 2)))
if (parseFloat(a.mes_ref.slice(3, 7)) > parseFloat(b.mes_ref.slice(3, 7))) return -1
else return 1
if (parseFloat(a.mes_ref.slice(0, 2)) > parseFloat(b.mes_ref.slice(0, 2)))
if (parseFloat(a.mes_ref.slice(3, 7)) < parseFloat(b.mes_ref.slice(3, 7))) return 1
else return -1
</FormControl>
<FormControl sx={{
width: '320px',
ml: 1
}}>
<InputLabel id="demo-simple-select-label">Mês</InputLabel>
<Select
value={month}
onChange={handleChangeDay}
displayEmpty
placeholder='dia'
label="Age"
>
<MenuItem value={'0'}>Nenhum</MenuItem>
{
clientMonth.sort((a, b) => {
if (parseFloat(a.mes_ref.slice(0, 2)) < parseFloat(b.mes_ref.slice(0, 2)))
if (parseFloat(a.mes_ref.slice(3, 7)) > parseFloat(b.mes_ref.slice(3, 7))) return -1
else return 1
if (parseFloat(a.mes_ref.slice(0, 2)) > parseFloat(b.mes_ref.slice(0, 2)))
if (parseFloat(a.mes_ref.slice(3, 7)) < parseFloat(b.mes_ref.slice(3, 7))) return 1
else return -1
return 0
}).map((data, index) => {
return <MenuItem key={index} value={data.mes_ref}>{data.mes_ref}</MenuItem>
})
}
</Select>
</FormControl>
return 0
}).map((data, index) => {
return <MenuItem key={index} value={data.mes_ref}>{data.mes_ref}</MenuItem>
})
}
</Select>
</FormControl>
</section>
<LineBarChart
data1={dataByDay.map(value => value.mmovel)} data3={dataByDay}
@ -441,7 +441,7 @@ export default function pld({tableData, userName, clientMonth}: pldInterface) {
inputFormat="dd/MM/yyyy"
value={date}
onChange={handleChangeDate}
renderInput={(params) => <TextField {...params}/>}
renderInput={(params) => <TextField {...params} style={{minWidth: '320px'}}/>}
/>
</div>
</LocalizationProvider>

20
src/styles/globals.ts
View File

@ -40,8 +40,12 @@ export const GlobalStyle = createGlobalStyle`
box-sizing: border-box;
}
.datePicker {
.MuiOutlinedInput-input, .MuiInputBase-input, .MuiInputBase-inputAdornedEnd, .css-nxo287-MuiInputBase-input-MuiOutlinedInput-input {
padding: 0 0 0 15px;
width: 100%;
height: 63px!important;
}
.css-1u3bzj6-MuiFormControl-root-MuiTextField-root,
.css-o9k5xi-MuiInputBase-root-MuiOutlinedInput-root,
.css-o9k5xi-MuiInputBase-root-MuiOutlinedInput-root,
@ -54,8 +58,8 @@ export const GlobalStyle = createGlobalStyle`
.css-nxo287-MuiInputBase-input-MuiOutlinedInput-input{
/* background-color: red; */
/* position: relative; */
width: 100%;
height:68px;
/* width: 100%;
height:63px; */
}
.MuiFormControl-root,
@ -76,7 +80,7 @@ export const GlobalStyle = createGlobalStyle`
.MuiOutlinedInput-input,
.MuiInputBase-input .MuiInputBase-inputAdornedEnd,
.css-nxo287-MuiInputBase-input-MuiOutlinedInput-input {
padding-top: 6px;
/* padding-top: 6px; */
}
.MuiButtonBase-root,
@ -84,8 +88,8 @@ export const GlobalStyle = createGlobalStyle`
.MuiIconButton-edgeEnd,
.MuiIconButton-sizeMedium,
.css-1yq5fb3-MuiButtonBase-root-MuiIconButton-root {
width: 30px;
height: 30px;
/* width: 30px;
height: 30px; */
}
}
@ -97,7 +101,7 @@ export const GlobalStyle = createGlobalStyle`
.MuiFormLabel-colorPrimary,
.MuiFormLabel-filled,
.css-1sumxir-MuiFormLabel-root-MuiInputLabel-root {
color: rgba(0, 0, 0, 0.6);
/* color: rgba(0, 0, 0, 0.6);
font-family: "Roboto","Helvetica","Arial",sans-serif;
font-weight: 400;
font-size: 1rem;
@ -115,6 +119,6 @@ export const GlobalStyle = createGlobalStyle`
left: 0;
user-select: none;
z-index: 1;
pointer-events: auto;
pointer-events: auto; */
}
`;

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

@ -176,6 +176,8 @@ export const TelemetriaView = styled.main`
input {
width: 15rem;
height: 63px!important;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-weight: 400;
@ -373,7 +375,7 @@ export const Uploads = styled.div`
`;
export const TableHeader = styled.div`
width: 100%;
width: 90%;
display: flex;
align-items: center;
@ -391,7 +393,7 @@ export const ChartFilters = styled.section`
align-self: flex-start;
width: 100%;
width: 90%;
margin-top: 20px;

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

@ -442,24 +442,28 @@ export const PldGraphView = styled.main`
.toolsbar {
display: flex;
justify-content: center;
align-items: flex-start!important;
align-items: flex-start;
align-self: flex-start;
flex-direction: row;
flex-wrap: nowrap;
width: 90%!important;
padding-left: 25px;
}
.toolsbar2 {
display: flex;
justify-content: flex-start;
align-items: flex-start!important;
flex-direction: column;
min-width: 320px;
/* margin-bottom: 9px; */
padding-left: 25px;
/* transform: translateY(-8px); */
width: 100%;
p {
margin: 0;
@ -468,9 +472,7 @@ export const PldGraphView = styled.main`
input {
width: 16.6rem;
height: 3.5rem;
/* padding: 14px; */
height: 63px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
font-weight: 400;
@ -480,34 +482,6 @@ export const PldGraphView = styled.main`
background-color: #F9F9F9;
}
section {
display: flex;
align-items: center;
flex-wrap: wrap;
:first-child {
justify-content: flex-start;
align-items: center;
}
:nth-child(2) {
margin-top: 50px;
margin-bottom: 50px;
justify-content: space-evenly;
}
width: 100%;
}
footer {
label {
cursor: pointer;
margin: 20px;
}
}
`
export const GoBack = styled.label`