This commit is contained in:
joseCorte-exe 2022-07-19 19:10:11 -03:00
parent 745c198306
commit f427c20a0a
5 changed files with 43 additions and 70 deletions

View File

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

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

View File

@ -40,7 +40,6 @@ export const GlobalStyle = createGlobalStyle`
box-sizing: border-box; box-sizing: border-box;
} }
.datePicker { .datePicker {
.MuiOutlinedInput-input, .MuiInputBase-input, .MuiInputBase-inputAdornedEnd, .css-nxo287-MuiInputBase-input-MuiOutlinedInput-input { .MuiOutlinedInput-input, .MuiInputBase-input, .MuiInputBase-inputAdornedEnd, .css-nxo287-MuiInputBase-input-MuiOutlinedInput-input {
padding: 0 0 0 15px; padding: 0 0 0 15px;

View File

@ -375,7 +375,7 @@ export const Uploads = styled.div`
`; `;
export const TableHeader = styled.div` export const TableHeader = styled.div`
width: 100%; width: 90%;
display: flex; display: flex;
align-items: center; align-items: center;
@ -393,7 +393,7 @@ export const ChartFilters = styled.section`
align-self: flex-start; align-self: flex-start;
width: 100%; width: 90%;
margin-top: 20px; margin-top: 20px;

View File

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