diff --git a/src/Admin/Components/Components/Inputs/EditEducationalObect.js b/src/Admin/Components/Components/Inputs/EditEducationalObect.js
index e3afb26de7e9a6dab8b606a91ee21679c83e737f..a8e5be6cbc11b9692830a5154fdcbac68901ae7d 100644
--- a/src/Admin/Components/Components/Inputs/EditEducationalObect.js
+++ b/src/Admin/Components/Components/Inputs/EditEducationalObect.js
@@ -28,7 +28,7 @@ import CardAction from "@material-ui/core/CardActions";
import ListRoundedIcon from "@material-ui/icons/ListRounded";
import Chip from "@material-ui/core/Chip";
import MenuItem from "@material-ui/core/MenuItem";
-import { useTheme, makeStyles } from "@material-ui/core/styles";
+import { useTheme } from "@material-ui/core/styles";
import Tabs from "@material-ui/core/Tabs";
import Tab from "@material-ui/core/Tab";
import Box from "@material-ui/core/Box";
@@ -43,22 +43,12 @@ import {
import { EditFilter } from "../../../Filters";
import { StyledCard } from "../../../Components/Styles/DataCard";
import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
//routers
import { Link } from "react-router-dom";
import ClassicEditor from "@ckeditor/ckeditor5-build-classic"
import { CKEditor } from '@ckeditor/ckeditor5-react';
-const useStyles = makeStyles((theme) => ({
- root: {
- width: "100%",
- maxWidth: 250,
- backgroundColor: theme.palette.background.paper,
- position: "relative",
- overflow: "auto",
- maxHeight: 300,
- },
-}));
-
let text;
const EditEducationalObject = () => {
@@ -69,7 +59,6 @@ const EditEducationalObject = () => {
const id = urlParams.get("learnObj");
const theme = useTheme();
- const classes = useStyles();
const [error, setError] = useState(null); //Necessary to consult the API, catch errors
const [isLoaded, setIsLoaded] = useState(false); //Necessary to consult the API, wait until complete
@@ -480,9 +469,10 @@ const EditEducationalObject = () => {
value={value}
onChange={handleChangeTab}
indicatorColor="primary"
- textColor="primary"
+ textColor="inherit"
variant="fullWidth"
aria-label="full width tabs example"
+ TabIndicatorProps={{style: {background: state.contrast === "" ? "orange" : "yellow"}}}
>
<Tab label="Resumo" {...a11yProps(0)} />
<Tab label="Descrição" {...a11yProps(1)} />
@@ -497,18 +487,19 @@ const EditEducationalObject = () => {
<TabPanel value={value} index={0} dir={theme.direction}>
<form style={{ display: "flex", flexDirection: "column" }}>
{fields.map((field, index) => (
- <TextField
+ <FormInput
+ contrast={state.contrast}
key={index}
required={field.required}
- disabled={field.default}
+ disableField={field.default}
error={field.error}
- helperText={field.error ? field.errorMessage : ""}
- style={{ width: "250px", marginBottom: "1em" }}
- label={field.label}
- defaultValue={field.value}
- onBlur={field.onChange}
- type="search"
- multiline
+ help={field.error ? field.errorMessage : ''}
+ style={{ width: '250px', marginBottom: '1em' }}
+ placeholder={field.label}
+ value={field.value}
+ handleChange={field.onChange}
+ inputType="search"
+ multi={true}
/>
))}
{languagesID.map((data) => {
@@ -522,7 +513,8 @@ const EditEducationalObject = () => {
onDelete={
data === "React" ? undefined : handleDeleteLan(data)
}
- className={classes.chip}
+ color="primary"
+ style={state.contrast === "" ? {backgroundColor: "#ddd", color: "black"} : {backgroundColor: "black", color: "white", border: "1px solid white"}}
/>
</li>
);
@@ -547,7 +539,7 @@ const EditEducationalObject = () => {
</TextField>
<li style={{ listStyleType: "none", marginBottom: "0.5em" }}>
- <Chip label={objectType.name} className={classes.chip} />
+ <Chip label={objectType.name} style={state.contrast === "" ? {backgroundColor: "#ddd", color: "black"} : {backgroundColor: "black", color: "white", border: "1px solid white"}} />
</li>
<TextField
id="standard-select-currency"
@@ -584,12 +576,13 @@ const EditEducationalObject = () => {
<TabPanel value={value} index={2} dir={theme.direction}>
<form style={{ display: "flex", flexDirection: "column" }}>
{Imutables.map((field, index) => (
- <TextField
+ <FormInput
+ contrast={state.contrast}
key={index}
- disabled={field.default}
- style={{ width: "250px", marginBottom: "1em" }}
- label={field.label}
- defaultValue={field.value}
+ disableField={field.default}
+ style={{ width: '250px', marginBottom: '1em' }}
+ placeholder={field.label}
+ value={field.value}
/>
))}
</form>
diff --git a/src/Admin/Components/Components/Inputs/EditRating.js b/src/Admin/Components/Components/Inputs/EditRating.js
index 8fc402de672859fa6a76597ff6b11da5308bdc9f..7a585baa45c09c05683050a2749d3ee2df2ad8ac 100644
--- a/src/Admin/Components/Components/Inputs/EditRating.js
+++ b/src/Admin/Components/Components/Inputs/EditRating.js
@@ -18,7 +18,7 @@ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>
import React, { useState, useEffect, useContext } from 'react';
//imports material ui components
-import { Typography, TextField, Button, Grid } from '@material-ui/core';
+import { Typography, Button, Grid } from '@material-ui/core';
import CircularProgress from '@material-ui/core/CircularProgress';
import CardContent from "@material-ui/core/CardContent";
import CardAction from '@material-ui/core/CardActions';
@@ -29,6 +29,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
import LoadingSpinner from '../../../../Components/LoadingSpinner';
import { StyledCard } from "../../../Components/Styles/DataCard";
import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
//imports services
import { getRequest, putRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
import { EditFilter, GetAData } from '../../../Filters';
@@ -234,18 +235,19 @@ const EditRating = () => {
<form style={{ display: 'flex', flexDirection: 'column' }}>
{fields.map((field, index) => (
- <TextField
+ <FormInput
+ contrast={state.contrast}
key={index}
required={field.required}
- disabled={field.default}
+ disableField={field.default}
error={field.error}
- helperText={field.error ? field.errorMessage : ''}
+ help={field.error ? field.errorMessage : ''}
style={{ width: '250px', marginBottom: '1em' }}
- label={field.label}
+ placeholder={field.label}
value={field.value}
- onChange={field.onChange}
- type="search"
- multiline={true}
+ handleChange={field.onChange}
+ inputType="search"
+ multi={true}
/>
))}
</form>
diff --git a/src/Admin/Components/Components/Inputs/EditUser.js b/src/Admin/Components/Components/Inputs/EditUser.js
index 48f8ead0c66c6a2ed4a399825182189ec9e803a5..b3225b0afb6c5d36cdf6811f6f373f367407bfc3 100644
--- a/src/Admin/Components/Components/Inputs/EditUser.js
+++ b/src/Admin/Components/Components/Inputs/EditUser.js
@@ -36,6 +36,7 @@ import SnackBar from '../../../../Components/SnackbarComponent';
import LoadingSpinner from '../../../../Components/LoadingSpinner';
import { StyledCard } from "../../../Components/Styles/DataCard";
import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
//imports services
import { getRequest, putRequest, deleteRequest, postRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
import { EditFilter, GetAData } from '../../../Filters';
@@ -523,18 +524,19 @@ const EditUser = () => {
<form style={{ display: 'flex', flexDirection: 'column' }}>
{fields.map((field, index) => (
field.value !== "-1" ?
- <TextField
+ <FormInput
+ contrast={state.contrast}
key={index}
required={field.required}
- disabled={field.default}
+ disableField={field.default}
error={field.error}
- helperText={field.error ? field.errorMessage : ''}
+ help={field.error ? field.errorMessage : ''}
style={{ width: '250px', marginBottom: '1em' }}
- label={field.label}
+ placeholder={field.label}
value={field.value}
- onChange={field.onChange}
- type="search"
- multiline={true}
+ handleChange={field.onChange}
+ inputType="search"
+ multi={true}
/> : null
))}
{userRoles.map((data) => {
@@ -543,6 +545,8 @@ const EditUser = () => {
<Chip
label={data.name}
onDelete={data === 'React' ? undefined : handleDelete(data)}
+ color="primary"
+ style={state.contrast === "" ? {backgroundColor: "#ddd", color: "black"} : {backgroundColor: "black", color: "white", border: "1px solid white"}}
className={classes.chip}
/>
</li>
diff --git a/src/Admin/Components/Components/Inputs/EmailInputs.js b/src/Admin/Components/Components/Inputs/EmailInputs.js
index f75e8b482316ff43cea4ddff066ef9896ef81798..5ef59d34ceefcec91d22a2c4151f10c06ef20548 100644
--- a/src/Admin/Components/Components/Inputs/EmailInputs.js
+++ b/src/Admin/Components/Components/Inputs/EmailInputs.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useState } from "react";
+import React, { useState, useContext } from "react";
//material ui components
import TextField from "@material-ui/core/TextField";
import MenuItem from "@material-ui/core/MenuItem";
@@ -33,6 +33,8 @@ import SnackBar from "../../../../Components/SnackbarComponent";
import { postRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
import ClassicEditor from "@ckeditor/ckeditor5-build-classic"
import { CKEditor } from '@ckeditor/ckeditor5-react';
+import { Store } from 'Store'
+import FormInput from "Components/FormInput.js"
const useStyles = makeStyles((theme) => ({
root: {
@@ -49,6 +51,9 @@ const useStyles = makeStyles((theme) => ({
}));
const EmailInputs = (props) => {
+
+ const { state } = useContext(Store);
+
const classes = useStyles();
const [option, setOption] = useState(props.email ? "Emails" : "All"); //labels of the text field 'to'
const [isToEmails, setIsToEmails] = useState(props.email ? true : false)
@@ -371,13 +376,13 @@ const EmailInputs = (props) => {
}
/>
- <TextField
+ <FormInput
+ contrast={state.contrast}
id="outlined-input"
- label="De *"
- defaultValue="integrada.contato@mec.gov.br"
- variant="outlined"
- disabled={true}
- />
+ disableField={true}
+ placeholder="De *"
+ value="integrada.contato@mec.gov.br"
+ />
<div style={{ height: "1em" }} />
<TextField
@@ -433,36 +438,35 @@ const EmailInputs = (props) => {
<Chip
label={email}
onDelete={() => HandleDelete(index)}
+ color="primary"
+ style={state.contrast === "" ? {backgroundColor: "#ddd", color: "black"} : {backgroundColor: "black", color: "white", border: "1px solid white"}}
classes={classes.chip}
/>
</li>
))}
</div>
- <TextField
+ <FormInput
+ contrast={state.contrast}
id="outlined-input"
- label="Emails"
- rows={1}
error={errorInEmails.error}
- helperText={errorInEmails.message}
+ help={errorInEmails.message}
value={emails}
onKeyPress={(key) => OnKeyPressHandler(key.which)}
- onChange={EmailsHandler}
- // onBlur={ShowEmails}
+ handleChange={EmailsHandler}
placeholder="Digite um email por vez e pressione Enter"
- variant="outlined"
style={{ marginBottom: "1em" }}
/>
</>
}
- <TextField
+ <FormInput
+ contrast={state.contrast}
id="outlined-input"
- label="Assunto"
- value={subject}
error={errorInSubject.error}
- helperText={errorInSubject.message}
+ help={errorInSubject.message}
+ value={subject}
+ onKeyPress={(key) => OnKeyPressHandler(key.which)}
+ handleChange={SubjectHandler}
placeholder="Digite o assunto do email"
- onChange={SubjectHandler}
- variant="outlined"
/>
</form >
@@ -478,10 +482,11 @@ const EmailInputs = (props) => {
}}
/>
</div>
-
+ {/*
<div style={{ fontSize: 14 }}>
* Se você deseja enviar foto da sua máquina, é preciso <a href="mailto:name@email.com">Clicar aqui</a>
</div>
+ */}
<div style={{ marginTop: 18 }}>
<Button
diff --git a/src/Admin/Components/Components/PageHeader.js b/src/Admin/Components/Components/PageHeader.js
index 8a1bad3752e1049ab922d157d705b058dc44eb01..b2110129d04445823893f2f89e93211468b707af 100644
--- a/src/Admin/Components/Components/PageHeader.js
+++ b/src/Admin/Components/Components/PageHeader.js
@@ -77,4 +77,13 @@ const StyledButton = styled(Button)`
border: 1px solid ${props => props.contrast === "" ? "" : "white"} !important;
`
+export const StyledFilter = styled.div`
+ background-color: ${props => props.contrast === "" ? "white" : "black"};
+ color: ${props => props.contrast === "" ? "#666" : "white"};
+ border: 1px solid ${props => props.contrast === "" ? "#666" : "white"};
+ border-radius: 0 0 10px 10px;
+ padding: 10px;
+ margin-top: 10px;
+`
+
export default PageHeader;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/Activity.js b/src/Admin/Pages/Pages/SubPages/Activity.js
index 379d99019d1728d5c9570e55ee6eb153c1e709a0..a436d75c0758b3b2b21d5738d9d40ba02c08beda 100644
--- a/src/Admin/Pages/Pages/SubPages/Activity.js
+++ b/src/Admin/Pages/Pages/SubPages/Activity.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from "react"
+import React, { useEffect, useState, useContext } from "react"
import moment from 'moment'
//imports from local files
import TableData from "../../../Components/Components/Table"
@@ -26,6 +26,7 @@ import { getRequest } from '../../../../Components/HelperFunctions/getAxiosConfi
import LoadingSpinner from '../../../../Components/LoadingSpinner'
import MobilePageHeader from '../../../Components/Components/MobileComponents/MobilePageHeader'
import PageHeader from '../../../Components/Components/PageHeader'
+import { StyledLoadMoreButton, StyledDivButton } from "./Collections.js";
//imports from material ui
import { withStyles } from "@material-ui/core/styles"
import TableBody from "@material-ui/core/TableBody"
@@ -34,7 +35,7 @@ import MenuItem from "@material-ui/core/MenuItem"
import TableRow from "@material-ui/core/TableRow"
import TextField from "@material-ui/core/TextField"
import IconButton from "@material-ui/core/IconButton"
-import { Button, Paper } from "@material-ui/core"
+import { Button } from "@material-ui/core"
import CircularProgress from "@material-ui/core/CircularProgress"
import AddRoundedIcon from "@material-ui/icons/AddRounded"
import UpdateRoundedIcon from "@material-ui/icons/UpdateRounded"
@@ -44,7 +45,8 @@ import AllOutIcon from "@material-ui/icons/AllOut"
//routers
import { Link } from 'react-router-dom'
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
-import styled from "styled-components"
+
+import { Store } from 'Store'
const StyledTableCell = withStyles((theme) => ({
head: {
@@ -65,6 +67,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const Activity = () => {
+
+ const { state } = useContext(Store)
+
const ADD_ONE_LENGHT = [""];
const TOP_LABELS = [
"CRIADO EM",
@@ -242,9 +247,11 @@ const Activity = () => {
{items.map((row, index) =>
index === items.length - 1 ? (
<StyledDivButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
>
- <Button
+ <StyledLoadMoreButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
color="primary"
variant="text"
@@ -260,7 +267,7 @@ const Activity = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -419,10 +426,3 @@ const Activity = () => {
export default Activity;
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
diff --git a/src/Admin/Pages/Pages/SubPages/AproveTeacher.js b/src/Admin/Pages/Pages/SubPages/AproveTeacher.js
index 84df27d4bd40a90fa95c4daf810b35b8d79fc79d..3eb5cc9a1e54c0456d78dfc055dd59476f330515 100644
--- a/src/Admin/Pages/Pages/SubPages/AproveTeacher.js
+++ b/src/Admin/Pages/Pages/SubPages/AproveTeacher.js
@@ -16,9 +16,8 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useContext } from "react";
import moment from "moment";
-import styled from "styled-components";
//imports from local files
import TableData from "../../../Components/Components/Table";
import SnackBar from "../../../../Components/SnackbarComponent";
@@ -30,8 +29,11 @@ import {
} from "../../../../Components/HelperFunctions/getAxiosConfig";
import MobileList from "../../../Components/Components/MobileComponents/SimpleList";
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader";
-import PageHeader from "../../../Components/Components/PageHeader";
+import PageHeader, { StyledFilter } from "../../../Components/Components/PageHeader";
import { apiDomain } from '../../../../env';
+import FormInput from "Components/FormInput.js"
+import { Store } from 'Store'
+import { StyledLoadMoreButton, StyledDivButton } from "./Collections.js";
//imports from material ui
import { withStyles } from "@material-ui/core/styles";
import TableBody from "@material-ui/core/TableBody";
@@ -75,6 +77,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const AproveTeacher = () => {
+
+ const { state } = useContext(Store);
+
const WINDOW_WIDTH = window.innerWidth
const ADD_ONE_LENGHT = [""];
const TOP_LABELS = [
@@ -396,7 +401,7 @@ const AproveTeacher = () => {
]}
>
{showFilter ? (
- <>
+ <StyledFilter contrast={state.contrast}>
{showFilter ? (
<Grid
container
@@ -427,33 +432,36 @@ const AproveTeacher = () => {
</TextField>
</Grid>
<Grid item>
- <TextField
- label="Nome"
- onChange={NameHandler}
- value={nameValue}
- onBlur={(event) => { setName(event.target.value) }}
- helperText="Retire o foco do campo de texto ao terminar de digitar"
- />
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Nome"
+ handleChange={NameHandler}
+ value={nameValue}
+ onBlur={(event) => { setName(event.target.value) }}
+ help="Retire o foco do campo de texto ao terminar de digitar"
+ />
</Grid>
<Grid item>
- <TextField
- label="Email"
- onChange={EmailHandler}
- value={emailValue}
- onBlur={(event) => { setEmail(event.target.value) }}
- helperText="Retire o foco do campo de texto ao terminar de digitar"
- />
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Email"
+ handleChange={EmailHandler}
+ value={emailValue}
+ onBlur={(event) => { setEmail(event.target.value) }}
+ help="Retire o foco do campo de texto ao terminar de digitar"
+ />
</Grid>
</Grid>
) : null}
- </>
+ </StyledFilter>
) : null}
</MobilePageHeader>
{items.map((row, index) =>
index === items.length - 1 ? (
- <StyledDivButton>
- <Button
+ <StyledDivButton contrast={state.contrast}>
+ <StyledLoadMoreButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
color="primary"
variant="text"
@@ -469,7 +477,7 @@ const AproveTeacher = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -600,7 +608,7 @@ const AproveTeacher = () => {
]}
>
{showFilter ? (
- <>
+ <StyledFilter contrast={state.contrast}>
{showFilter ? (
<Grid
container
@@ -631,26 +639,28 @@ const AproveTeacher = () => {
</TextField>
</Grid>
<Grid item>
- <TextField
- label="Nome"
- onChange={NameHandler}
- value={nameValue}
- onBlur={(event) => { setName(event.target.value) }}
- helperText="Retire o foco do campo de texto ao terminar de digitar"
- />
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Nome"
+ handleChange={NameHandler}
+ value={nameValue}
+ onBlur={(event) => { setName(event.target.value) }}
+ help="Retire o foco do campo de texto ao terminar de digitar"
+ />
</Grid>
<Grid item>
- <TextField
- label="Email"
- onChange={EmailHandler}
- value={emailValue}
- onBlur={(event) => { setEmail(event.target.value) }}
- helperText="Retire o foco do campo de texto ao terminar de digitar"
- />
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Email"
+ handleChange={EmailHandler}
+ value={emailValue}
+ onBlur={(event) => { setEmail(event.target.value) }}
+ help="Retire o foco do campo de texto ao terminar de digitar"
+ />
</Grid>
</Grid>
) : null}
- </>
+ </StyledFilter>
) : null}
</PageHeader>
@@ -753,11 +763,4 @@ const AproveTeacher = () => {
}
}
};
-export default AproveTeacher;
-
-const StyledDivButton = styled(Paper)`
- width: 100%;
- display: flex;
- justify-content: center;
- align-items: center;
-`;
+export default AproveTeacher;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/BlockedUsers.js b/src/Admin/Pages/Pages/SubPages/BlockedUsers.js
index 7915870fa7aec7c90c69ad31fb2954af582f31ef..1e60e612a9b97883e93a4dc4476fdeca48154a23 100644
--- a/src/Admin/Pages/Pages/SubPages/BlockedUsers.js
+++ b/src/Admin/Pages/Pages/SubPages/BlockedUsers.js
@@ -15,9 +15,8 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState, useContext } from 'react';
import moment from "moment";
-import styled from "styled-components"
//Material ui componets
import { withStyles } from '@material-ui/core/styles';
import TableBody from '@material-ui/core/TableBody';
@@ -41,7 +40,9 @@ import LoadingSpinner from '../../../../Components/LoadingSpinner';
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import { apiDomain } from '../../../../env';
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
-import PageHeader from "../../../Components/Components/PageHeader"
+import PageHeader, { StyledFilter } from "../../../Components/Components/PageHeader"
+import { StyledLoadMoreButton, StyledDivButton } from "./Collections.js";
+import { Store } from 'Store'
//Services
import { getRequest, putRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
import { Url } from '../../../Filters';
@@ -70,6 +71,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const BlockedUsers = () => {
+
+ const { state } = useContext(Store)
+
const ADD_ONE_LENGHT = [''];
const WINDOW_WIDTH = window.innerWidth
@@ -277,6 +281,7 @@ const BlockedUsers = () => {
},
]}
>
+ <StyledFilter contrast={state.contrast}>
<Grid item>
<TextField
select
@@ -295,12 +300,14 @@ const BlockedUsers = () => {
))}
</TextField>
</Grid>
+ </StyledFilter>
</MobilePageHeader>
{items.map((row, index) =>
index === items.length - 1 ? (
- <StyledDivButton>
- <Button
+ <StyledDivButton contrast={state.contrast}>
+ <StyledLoadMoreButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
color="primary"
variant="text"
@@ -316,7 +323,7 @@ const BlockedUsers = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -408,6 +415,7 @@ const BlockedUsers = () => {
},
]}
>
+ <StyledFilter contrast={state.contrast}>
<Grid item>
<TextField
select
@@ -426,6 +434,7 @@ const BlockedUsers = () => {
))}
</TextField>
</Grid>
+ </StyledFilter>
</PageHeader>
<TableData
@@ -511,11 +520,4 @@ const BlockedUsers = () => {
}
-export default BlockedUsers;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
\ No newline at end of file
+export default BlockedUsers;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/Collections.js b/src/Admin/Pages/Pages/SubPages/Collections.js
index feec6ec26d0616e0c3a74940883ed10436a3bb22..c35bbaac5d3dd654808dca9d80fca48ae821a1c4 100644
--- a/src/Admin/Pages/Pages/SubPages/Collections.js
+++ b/src/Admin/Pages/Pages/SubPages/Collections.js
@@ -26,7 +26,8 @@ import AlertDialog from "../../../Components/Components/AlertDialog";
import LoadingSpinner from "../../../../Components/LoadingSpinner";
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
-import PageHeader from "../../../Components/Components/PageHeader"
+import PageHeader, { StyledFilter } from "../../../Components/Components/PageHeader"
+import FormInput from "Components/FormInput.js"
//imports from material ui
import { withStyles } from "@material-ui/core/styles";
import TableBody from "@material-ui/core/TableBody";
@@ -312,7 +313,7 @@ const Collections = () => {
]}
>
{showFilter ? (
- <>
+ <StyledFilter contrast={state.contrast}>
<Grid
container
alignItems="center"
@@ -342,25 +343,28 @@ const Collections = () => {
</Grid>
<Grid item>
- <TextField
- label="Pesquisa"
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Pesquisa"
+ handleChange={(event) => HandleSearch(event)}
value={valueOfSearch}
- helperText="Ao digitar, tire o foco do campo de texto"
- onChange={(event) => HandleSearch(event)}
onBlur={(event) => setSearch(event.target.value)}
- ></TextField>
+ help="Retire o foco do campo de texto ao terminar de digitar"
+ />
</Grid>
</Grid>
- </>
+ </StyledFilter>
) : null}
</MobilePageHeader>
{items.map((row, index) =>
index === items.length - 1 ? (
<StyledDivButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
>
- <Button
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -375,7 +379,7 @@ const Collections = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -470,7 +474,7 @@ const Collections = () => {
]}
>
{showFilter ? (
- <>
+ <StyledFilter contrast={state.contrast}>
<Grid
container
alignItems="center"
@@ -500,16 +504,17 @@ const Collections = () => {
</Grid>
<Grid item>
- <TextField
- label="Pesquisa"
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Pesquisa"
+ handleChange={(event) => HandleSearch(event)}
value={valueOfSearch}
- helperText="Ao digitar, tire o foco do campo de texto"
- onChange={(event) => HandleSearch(event)}
onBlur={(event) => setSearch(event.target.value)}
+ help="Retire o foco do campo de texto ao terminar de digitar"
/>
</Grid>
</Grid>
- </>
+ </StyledFilter>
) : null}
</PageHeader>
@@ -604,11 +609,20 @@ const Collections = () => {
};
export default Collections;
-const StyledDivButton = styled(Paper)`
+export const StyledLoadMoreButton = styled(Button)`
+ background-color: ${props => props.contrast === "" ? "white" : "black"} !important;
+ color: ${props => props.contrast === "" ? "" : "yellow"} !important;
+ text-decoration: ${props => props.contrast === "" ? "" : "underline yellow"} !important;
+`
+
+export const StyledDivButton = styled(Paper)`
width : 100%;
display : flex;
justify-content : center;
align-items : center;
+ background-color: ${props => props.contrast === "" ? "white" : "black"} !important;
+ color: ${props => props.contrast === "" ? "#666" : "white"} !important;
+ border: 1px solid ${props => props.contrast === "" ? "#666" : "white"} !important;
`
const StyledContent = styled.div`
diff --git a/src/Admin/Pages/Pages/SubPages/CommunityQuestions.js b/src/Admin/Pages/Pages/SubPages/CommunityQuestions.js
index 3d71db8d7e97e68df1ccf58c9c5477b37c3ae34a..81b29756cba5e62c847fdbb9735e4b8cb2f9a50e 100644
--- a/src/Admin/Pages/Pages/SubPages/CommunityQuestions.js
+++ b/src/Admin/Pages/Pages/SubPages/CommunityQuestions.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useContext } from "react";
import moment from 'moment';
//imports from local files
import TableData from "../../../Components/Components/Table";
@@ -26,15 +26,17 @@ import LoadingSpinner from '../../../../Components/LoadingSpinner';
import { getRequest } from '../../../../Components/HelperFunctions/getAxiosConfig';
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
-import PageHeader from "../../../Components/Components/PageHeader"
+import PageHeader, { StyledFilter } from "../../../Components/Components/PageHeader"
+import FormInput from "Components/FormInput.js"
+import { Store } from 'Store'
+import { StyledLoadMoreButton, StyledDivButton } from "./Collections.js";
//imports from material ui
import { withStyles } from "@material-ui/core/styles";
import TableBody from "@material-ui/core/TableBody";
import TableCell from "@material-ui/core/TableCell";
import TableRow from "@material-ui/core/TableRow";
-import TextField from "@material-ui/core/TextField";
import IconButton from "@material-ui/core/IconButton";
-import { Button, Paper, Grid } from "@material-ui/core";
+import { Button, Grid } from "@material-ui/core";
import CircularProgress from "@material-ui/core/CircularProgress";
import AddRoundedIcon from "@material-ui/icons/AddRounded";
import UpdateRoundedIcon from "@material-ui/icons/UpdateRounded";
@@ -44,7 +46,6 @@ import EmailRoundedIcon from '@material-ui/icons/EmailRounded';
import ContactSupportRoundedIcon from "@material-ui/icons/ContactSupportRounded";
//routers
import { Link } from 'react-router-dom';
-import styled from "styled-components"
const StyledTableCell = withStyles((theme) => ({
head: {
@@ -66,6 +67,8 @@ const StyledTableRow = withStyles((theme) => ({
const CommunityQuestion = () => {
+ const { state } = useContext(Store)
+
const ADD_ONE_LENGHT = [""];
const TOP_LABELS = [
"ID",
@@ -255,6 +258,7 @@ const CommunityQuestion = () => {
]}
>
{showFilter ? (
+ <StyledFilter contrast={state.contrast}>
<Grid
container
direction="row"
@@ -265,45 +269,48 @@ const CommunityQuestion = () => {
xs={12}
>
<Grid item>
- <TextField
- label="Email"
- value={valueOfEmailField}
- onChange={valueOfEmailHandler}
- onBlur={(e) => { setEmail(e.target.value) }}
- helperText="Por favor, ao digitar o email que você quer filtar, retire o foco do campo de texto"
- >
- </TextField>
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Email"
+ handleChange={valueOfEmailHandler}
+ value={valueOfEmailField}
+ onBlur={(event) => setEmail(event.target.value)}
+ help="Por favor, ao digitar o email que você quer filtar, retire o foco do campo de texto"
+ />
</Grid>
<Grid item>
- <TextField
- label="Mensagem"
- value={valueOfMessageField}
- onChange={valueOfMessageHandler}
- onBlur={(e) => { setMessage(e.target.value) }}
- helperText="Por favor, ao digitar a mensagem que você quer filtar, retire o foco do campo de texto"
- >
- </TextField>
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Mensagem"
+ handleChange={valueOfMessageHandler}
+ value={valueOfMessageField}
+ onBlur={(event) => setMessage(event.target.value)}
+ help="Por favor, ao digitar a mensagem que você quer filtar, retire o foco do campo de texto"
+ />
</Grid>
<Grid item>
- <TextField
- label="Nome"
- value={valueOfNameField}
- onChange={valueOfNameHandler}
- onBlur={(e) => { setName(e.target.value) }}
- helperText="Por favor, ao digitar o nome que você quer filtar, retire o foco do campo de texto"
- >
- </TextField>
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Nome"
+ handleChange={valueOfNameHandler}
+ value={valueOfNameField}
+ onBlur={(event) => setName(event.target.value)}
+ help="Por favor, ao digitar o nome que você quer filtar, retire o foco do campo de texto"
+ />
</Grid>
</Grid>
+ </StyledFilter>
) : null}
</MobilePageHeader>
{items.map((row, index) =>
index === items.length - 1 ? (
<StyledDivButton
+ contrast={state.contrast}
key="Load more"
>
- <Button
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -318,7 +325,7 @@ const CommunityQuestion = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -405,6 +412,7 @@ const CommunityQuestion = () => {
]}
>
{showFilter ? (
+ <StyledFilter contrast={state.contrast}>
<Grid
container
direction="row"
@@ -415,36 +423,37 @@ const CommunityQuestion = () => {
xs={12}
>
<Grid item>
- <TextField
- label="Email"
- value={valueOfEmailField}
- onChange={valueOfEmailHandler}
- onBlur={(e) => { setEmail(e.target.value) }}
- helperText="Por favor, ao digitar o email que você quer filtar, retire o foco do campo de texto"
- >
- </TextField>
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Email"
+ handleChange={valueOfEmailHandler}
+ value={valueOfEmailField}
+ onBlur={(event) => setEmail(event.target.value)}
+ help="Por favor, ao digitar o email que você quer filtar, retire o foco do campo de texto"
+ />
</Grid>
<Grid item>
- <TextField
- label="Mensagem"
- value={valueOfMessageField}
- onChange={valueOfMessageHandler}
- onBlur={(e) => { setMessage(e.target.value) }}
- helperText="Por favor, ao digitar a mensagem que você quer filtar, retire o foco do campo de texto"
- >
- </TextField>
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Mensagem"
+ handleChange={valueOfMessageHandler}
+ value={valueOfMessageField}
+ onBlur={(event) => setMessage(event.target.value)}
+ help="Por favor, ao digitar a mensagem que você quer filtar, retire o foco do campo de texto"
+ />
</Grid>
<Grid item>
- <TextField
- label="Nome"
- value={valueOfNameField}
- onChange={valueOfNameHandler}
- onBlur={(e) => { setName(e.target.value) }}
- helperText="Por favor, ao digitar o nome que você quer filtar, retire o foco do campo de texto"
- >
- </TextField>
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Nome"
+ handleChange={valueOfNameHandler}
+ value={valueOfNameField}
+ onBlur={(event) => setName(event.target.value)}
+ help="Por favor, ao digitar o nome que você quer filtar, retire o foco do campo de texto"
+ />
</Grid>
</Grid>
+ </StyledFilter>
) : null}
</PageHeader>
@@ -517,12 +526,3 @@ const CommunityQuestion = () => {
}
}
export default CommunityQuestion;
-
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
diff --git a/src/Admin/Pages/Pages/SubPages/Complaints.js b/src/Admin/Pages/Pages/SubPages/Complaints.js
index ee359ffca8aefbefd04ebad8318b19a18269af23..1eb512f6c10ee05025e10c6e8a11cb168f528e80 100644
--- a/src/Admin/Pages/Pages/SubPages/Complaints.js
+++ b/src/Admin/Pages/Pages/SubPages/Complaints.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useContext } from "react";
import moment from "moment";
//imports from local files
import TableData from "../../../Components/Components/Table";
@@ -26,7 +26,10 @@ import LoadingSpinner from '../../../../Components/LoadingSpinner';
import { getRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
-import PageHeader from "../../../Components/Components/PageHeader"
+import PageHeader, { StyledFilter } from "../../../Components/Components/PageHeader"
+import FormInput from "Components/FormInput.js"
+import { Store } from 'Store'
+import { StyledLoadMoreButton, StyledDivButton } from "./Collections.js";
//imports from material ui
import { withStyles } from "@material-ui/core/styles";
import TableBody from "@material-ui/core/TableBody";
@@ -66,6 +69,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const Complaints = () => {
+
+ const { state } = useContext(Store)
+
const WINDOW_WIDTH = window.innerWidth
const ADD_ONE_LENGHT = [""];
const PORTAL_MEC = "https://plataformaintegrada.mec.gov.br/";
@@ -328,6 +334,7 @@ const Complaints = () => {
]}
>
{showFilter ? (
+ <StyledFilter contrast={state.contrast}>
<Grid
container
direction="row"
@@ -376,18 +383,28 @@ const Complaints = () => {
</TextField>
</Grid>
<Grid item>
- <TextField label="Descrição" helperText="Ao digitar a descrição, retire o foco do campo de texto" onChange={DescriptionHandler} value={valueOfDescField} onBlur={e => setDescription(e.target.value)} />
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Descrição"
+ handleChange={DescriptionHandler}
+ value={valueOfDescField}
+ onBlur={(event) => setDescription(event.target.value)}
+ help="Ao digitar a descrição, retire o foco do campo de texto"
+ />
</Grid>
</Grid>
+ </StyledFilter>
) : null}
</MobilePageHeader>
{items.map((row, index) =>
index === items.length - 1 ? (
<StyledDivButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
>
- <Button
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -402,7 +419,7 @@ const Complaints = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -484,6 +501,7 @@ const Complaints = () => {
]}
>
{showFilter ? (
+ <StyledFilter contrast={state.contrast}>
<Grid
container
direction="row"
@@ -532,9 +550,17 @@ const Complaints = () => {
</TextField>
</Grid>
<Grid item>
- <TextField label="Descrição" helperText="Ao digitar a descrição, retire o foco do campo de texto" onChange={DescriptionHandler} value={valueOfDescField} onBlur={e => setDescription(e.target.value)} />
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Descrição"
+ handleChange={DescriptionHandler}
+ value={valueOfDescField}
+ onBlur={(event) => setDescription(event.target.value)}
+ help="Ao digitar a descrição, retire o foco do campo de texto"
+ />
</Grid>
</Grid>
+ </StyledFilter>
) : null}
</PageHeader>
@@ -636,12 +662,4 @@ const Complaints = () => {
}
}
};
-export default Complaints;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
+export default Complaints;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/EducationalObjects.js b/src/Admin/Pages/Pages/SubPages/EducationalObjects.js
index 3218221c627a340d550915c256788ce82e628dea..cf6397b6883ee61fc3906e7b06a70c97562d91ca 100644
--- a/src/Admin/Pages/Pages/SubPages/EducationalObjects.js
+++ b/src/Admin/Pages/Pages/SubPages/EducationalObjects.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useContext } from "react";
import moment from 'moment';
// Imports from local file
import TableData from "../../../Components/Components/Table";
@@ -25,7 +25,10 @@ import AlertDialog from "../../../Components/Components/AlertDialog";
import LoadingSpinner from '../../../../Components/LoadingSpinner';
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
-import PageHeader from "../../../Components/Components/PageHeader"
+import PageHeader, { StyledFilter } from "../../../Components/Components/PageHeader"
+import FormInput from "Components/FormInput.js"
+import { Store } from 'Store'
+import { StyledLoadMoreButton, StyledDivButton } from './Collections';
// Imports about icon
import FilterListRoundedIcon from "@material-ui/icons/FilterListRounded";
import AddRoundedIcon from "@material-ui/icons/AddRounded";
@@ -38,18 +41,15 @@ import VisibilityIcon from "@material-ui/icons/Visibility";
import DeleteIcon from "@material-ui/icons/Delete";
// Import from material-ui
import { withStyles } from "@material-ui/core/styles";
-import Paper from "@material-ui/core/Paper";
import Button from "@material-ui/core/Button";
import Grid from "@material-ui/core/Grid";
import { CircularProgress } from "@material-ui/core";
-import TextField from "@material-ui/core/TextField";
// services
import { getRequest, deleteRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
//Filters
import { Url, DeleteFilter } from "../../../Filters";
//router
import { Link } from 'react-router-dom';
-import styled from 'styled-components'
import MenuBookRoundedIcon from "@material-ui/icons/MenuBookRounded";
const StyledTableCell = withStyles((theme) => ({
@@ -71,6 +71,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const EducationalObjects = () => {
+
+ const { state } = useContext(Store)
+
const WINDOW_WIDTH = window.innerWidth
const ADD_ONE_LENGHT = [""];
@@ -341,23 +344,26 @@ const EducationalObjects = () => {
>
{
showFilter &&
+ <StyledFilter contrast={state.contrast}>
<Grid item xs={12}>
<Grid container justify="space-between" spacing={3}>
{TextFieldOfTheFilter.map((field, index) => (
<Grid item key={field.label}>
- <TextField
- id={index}
- label={field.label}
- type="search"
- onChange={field.onChange}
- onBlur={field.onBlur}
- value={field.value}
- helperText={field.helperText}
- />
+ <FormInput
+ contrast={state.contrast}
+ id={index}
+ placeholder={field.label}
+ inputType="search"
+ handleChange={field.onChange}
+ onBlur={field.onBlur}
+ value={field.value}
+ help={field.helperText}
+ />
</Grid>
))}
</Grid>
</Grid>
+ </StyledFilter>
}
</MobilePageHeader>
{/************** End of the header **************/}
@@ -365,8 +371,9 @@ const EducationalObjects = () => {
{/************** Start of display data in table **************/}
{items.map((row, index) =>
index === items.length - 1 ? (
- <StyledDivButton>
- <Button
+ <StyledDivButton contrast={state.contrast}>
+ <StyledLoadMoreButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
color="primary"
variant="text"
@@ -382,7 +389,7 @@ const EducationalObjects = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -480,23 +487,26 @@ const EducationalObjects = () => {
>
{
showFilter &&
+ <StyledFilter contrast={state.contrast}>
<Grid item xs={12}>
<Grid container justify="space-between" spacing={3}>
{TextFieldOfTheFilter.map((field, index) => (
<Grid item key={field.label}>
- <TextField
- id={index}
- label={field.label}
- type="search"
- onChange={field.onChange}
- onBlur={field.onBlur}
- value={field.value}
- helperText={field.helperText}
- />
+ <FormInput
+ contrast={state.contrast}
+ id={index}
+ placeholder={field.label}
+ inputType="search"
+ handleChange={field.onChange}
+ onBlur={field.onBlur}
+ value={field.value}
+ help={field.helperText}
+ />
</Grid>
))}
</Grid>
</Grid>
+ </StyledFilter>
}
</PageHeader>
{/************** End of the header **************/}
@@ -589,12 +599,4 @@ const EducationalObjects = () => {
}
};
-export default EducationalObjects;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
+export default EducationalObjects;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/Inframe.js b/src/Admin/Pages/Pages/SubPages/Inframe.js
index 9fec9f16a467f2a015348cca6b0df63ea9a60915..cfda1e2917175cd3bb4e21d543d6bd5748497579 100644
--- a/src/Admin/Pages/Pages/SubPages/Inframe.js
+++ b/src/Admin/Pages/Pages/SubPages/Inframe.js
@@ -16,30 +16,61 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useContext } from 'react';
+import React, { useContext, useEffect, useState } from 'react';
import Welcome from '../../../Components/Components/Welcome';
+import LoadingSpinner from 'Components/LoadingSpinner';
import { Store } from 'Store'
import styled from 'styled-components'
const IframeComponent = () => {
- const { state } = useContext(Store)
+ const { state } = useContext(Store);
+
+ const [srcMetabase, setSrcMetabase] = useState('');
+ const [loading, setLoading] = useState(false);
+
+ const changeMetabase = () => {
+ if (state.contrast !== "")
+ setSrcMetabase("https://metabase.c3sl.ufpr.br/public/dashboard/8ada315d-b8df-4b18-b7fb-d06b0ac64623#theme=night");
+ else
+ setSrcMetabase("https://metabase.c3sl.ufpr.br/public/dashboard/8ada315d-b8df-4b18-b7fb-d06b0ac64623");
+ }
+
+ useEffect(() => {
+ if (loading === true) {
+ changeMetabase();
+ setLoading(false);
+ }
+ }, [ loading ])
+
+ useEffect(() => {
+ setLoading(true);
+ }, [ state.contrast ])
return (
- <StyledDiv contrast={state.contrast}>
- <Welcome contrast={state.contrast}/>
- <div style={{ height: '1em' }}></div>
- <StyledIframe
- title="Métricas portal MEC"
- src='https://metabase.c3sl.ufpr.br/public/dashboard/8ada315d-b8df-4b18-b7fb-d06b0ac64623'
- height='800px'
- width='100%'
- // allowTransparency={true}
- frameBorder={0}
- contrast={state.contrast}
- >
- </StyledIframe>
- </StyledDiv>
+ <>
+ {!loading ? (
+ <StyledDiv contrast={state.contrast}>
+ <Welcome contrast={state.contrast}/>
+ <div style={{ height: '1em' }}></div>
+ <StyledIframe
+ title="Métricas portal MEC"
+ src={srcMetabase}
+ height='800px'
+ width='100%'
+ // allowTransparency={true}
+ frameBorder={0}
+ contrast={state.contrast}
+ >
+ </StyledIframe>
+ </StyledDiv>
+ )
+ :
+ (
+ <LoadingSpinner/>
+ )
+ }
+ </>
)
}
diff --git a/src/Admin/Pages/Pages/SubPages/Institutions.js b/src/Admin/Pages/Pages/SubPages/Institutions.js
index baf583e7d5c5d7f2732d3caf6a6693fe66bde698..43114af66b4f2d7a518c960eaab6af23b1728694 100644
--- a/src/Admin/Pages/Pages/SubPages/Institutions.js
+++ b/src/Admin/Pages/Pages/SubPages/Institutions.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useContext } from "react";
// Imports from local files
import TableData from "../../../Components/Components/Table";
import SnackBar from "../../../../Components/SnackbarComponent";
@@ -24,7 +24,9 @@ import AlertDialog from "../../../Components/Components/AlertDialog";
import LoadingSpinner from '../../../../Components/LoadingSpinner';
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
-import PageHeader from "../../../Components/Components/PageHeader"
+import PageHeader, { StyledFilter } from "../../../Components/Components/PageHeader"
+import { StyledLoadMoreButton, StyledDivButton } from "./Collections.js";
+import { Store } from 'Store'
// Imports about icon
import FilterListRoundedIcon from "@material-ui/icons/FilterListRounded";
import AddRoundedIcon from "@material-ui/icons/AddRounded";
@@ -37,18 +39,16 @@ import VisibilityIcon from "@material-ui/icons/Visibility";
import DeleteIcon from "@material-ui/icons/Delete";
// Import from material-ui
import { withStyles } from "@material-ui/core/styles";
-import Paper from "@material-ui/core/Paper";
import Button from "@material-ui/core/Button";
import Grid from "@material-ui/core/Grid";
import { CircularProgress } from "@material-ui/core";
-import TextField from "@material-ui/core/TextField";
+import FormInput from "Components/FormInput.js"
// services
import { getRequest, deleteRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
//Filters
import { Url, DeleteFilter } from "../../../Filters";
//router
import { Link, useHistory } from 'react-router-dom';
-import styled from "styled-components"
import AccountBalanceRoundedIcon from "@material-ui/icons/AccountBalanceRounded";
const StyledTableCell = withStyles((theme) => ({
@@ -70,6 +70,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const Institutions = () => {
+
+ const { state } = useContext(Store)
+
const WINDOW_WIDTH = window.innerWidth
const ADD_ONE_LENGHT = [""];
@@ -350,22 +353,25 @@ const Institutions = () => {
>
{
showFilter &&
+ <StyledFilter contrast={state.contrast}>
<Grid item xs={12}>
<Grid container justify="space-between" spacing={3}>
{TextFieldOfTheFilter.map((field, index) => (
<Grid item key={field.label}>
- <TextField
- id={index}
- label={field.label}
- value={field.value}
- helperText={field.helperText}
- onChange={field.onChange}
- onBlur={field.onBlur}
- />
+ <FormInput
+ contrast={state.contrast}
+ id={index}
+ placeholder={field.label}
+ handleChange={field.onChange}
+ onBlur={field.onBlur}
+ value={field.value}
+ help={field.helperText}
+ />
</Grid>
))}
</Grid>
</Grid>
+ </StyledFilter>
}
</MobilePageHeader>
{/************** End of the header **************/}
@@ -374,9 +380,11 @@ const Institutions = () => {
{items.map((row, index) =>
index === items.length - 1 ? (
<StyledDivButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
>
- <Button
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -391,7 +399,7 @@ const Institutions = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -497,22 +505,25 @@ const Institutions = () => {
>
{
showFilter &&
+ <StyledFilter contrast={state.contrast}>
<Grid item xs={12}>
<Grid container justify="space-between" spacing={3}>
{TextFieldOfTheFilter.map((field, index) => (
<Grid item key={field.label}>
- <TextField
- id={index}
- label={field.label}
- value={field.value}
- helperText={field.helperText}
- onChange={field.onChange}
- onBlur={field.onBlur}
- />
+ <FormInput
+ contrast={state.contrast}
+ id={index}
+ placeholder={field.label}
+ handleChange={field.onChange}
+ onBlur={field.onBlur}
+ value={field.value}
+ help={field.helperText}
+ />
</Grid>
))}
</Grid>
</Grid>
+ </StyledFilter>
}
</PageHeader>
{/************** End of the header **************/}
@@ -599,12 +610,4 @@ const Institutions = () => {
}
};
-export default Institutions;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
+export default Institutions;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/Languages.js b/src/Admin/Pages/Pages/SubPages/Languages.js
index 84ced080bdb0b344afaf05e5930ef75fa0417915..49d69ce8cbb98bb983cba6f13363a6ed4eff647a 100644
--- a/src/Admin/Pages/Pages/SubPages/Languages.js
+++ b/src/Admin/Pages/Pages/SubPages/Languages.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useState, useContext } from 'react'
//imports from local files
import TableData from '../../../Components/Components/Table';
import SnackBar from '../../../../Components/SnackbarComponent';
@@ -28,13 +28,15 @@ import { getRequest, deleteRequest } from '../../../../Components/HelperFunction
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
import PageHeader from "../../../Components/Components/PageHeader"
+import { Store } from 'Store'
+import { StyledLoadMoreButton, StyledDivButton } from './Collections';
//imports from material ui
import { withStyles } from '@material-ui/core/styles';
import TableBody from '@material-ui/core/TableBody';
import TableCell from '@material-ui/core/TableCell';
import TableRow from '@material-ui/core/TableRow';
import IconButton from '@material-ui/core/IconButton';
-import { Button, Paper } from '@material-ui/core';
+import { Button } from '@material-ui/core';
import CircularProgress from '@material-ui/core/CircularProgress';
import AddRoundedIcon from '@material-ui/icons/AddRounded';
import UpdateRoundedIcon from '@material-ui/icons/UpdateRounded';
@@ -42,7 +44,6 @@ import EditRoundedIcon from '@material-ui/icons/EditRounded';
import DeleteRoundedIcon from '@material-ui/icons/DeleteRounded';
//router
import { Link, useHistory } from 'react-router-dom';
-import styled from "styled-components"
import LanguageRoundedIcon from "@material-ui/icons/LanguageRounded";
const StyledTableCell = withStyles((theme) => ({
@@ -64,6 +65,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const Languages = () => {
+
+ const { state } = useContext(Store)
+
const ADD_ONE_LENGHT = [""];
const TOP_LABELS = ['ID', 'NOME', 'CODE', 'EDITAR', 'DELETAR'] //Labels from Table
const WINDOW_WIDTH = window.innerWidth
@@ -248,8 +252,9 @@ const Languages = () => {
{items.map((row, index) =>
index === items.length - 1 ? (
- <StyledDivButton key={new Date().toISOString() + row.created_at}>
- <Button
+ <StyledDivButton contrast={state.contrast} key={new Date().toISOString() + row.created_at}>
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -264,7 +269,7 @@ const Languages = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -421,12 +426,4 @@ const Languages = () => {
}
}
}
-export default Languages;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
+export default Languages;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/NoteVariables.js b/src/Admin/Pages/Pages/SubPages/NoteVariables.js
index 4f2c6c3c47e992ed72b94ed4353bf690b2776535..44276e4b28f81a4811bad4d734be797ef681a1e4 100644
--- a/src/Admin/Pages/Pages/SubPages/NoteVariables.js
+++ b/src/Admin/Pages/Pages/SubPages/NoteVariables.js
@@ -15,11 +15,10 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState, useContext } from 'react';
//Material ui componets
import { withStyles } from '@material-ui/core/styles';
import TableBody from '@material-ui/core/TableBody';
-import Paper from "@material-ui/core/Paper";
import TableCell from '@material-ui/core/TableCell';
import TableRow from '@material-ui/core/TableRow';
import CheckRoundedIcon from "@material-ui/icons/CheckRounded";
@@ -37,13 +36,13 @@ import LoadingSpinner from '../../../../Components/LoadingSpinner';
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
import PageHeader from "../../../Components/Components/PageHeader"
-
+import { StyledLoadMoreButton, StyledDivButton } from './Collections';
+import { Store } from 'Store'
//Services
import { getRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
import { Url } from '../../../Filters';
//routers
import { Link } from 'react-router-dom';
-import styled from "styled-components"
import TrendingUpRoundedIcon from "@material-ui/icons/TrendingUpRounded";
const StyledTableCell = withStyles((theme) => ({
@@ -65,6 +64,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const NoteVariables = () => {
+
+ const { state } = useContext(Store)
+
const WINDOW_WIDTH = window.innerWidth
const ADD_ONE_LENGHT = [""];
@@ -180,8 +182,9 @@ const NoteVariables = () => {
{items.map((row, index) =>
index === items.length - 1 ? (
- <StyledDivButton key={new Date().toISOString() + row.created_at}>
- <Button
+ <StyledDivButton contrast={state.contrast} key={new Date().toISOString() + row.created_at}>
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -196,7 +199,7 @@ const NoteVariables = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -329,11 +332,4 @@ const NoteVariables = () => {
}
-export default NoteVariables;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
+export default NoteVariables;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/Permissions.js b/src/Admin/Pages/Pages/SubPages/Permissions.js
index f0456fd617657b528b7294b6c053a1a38bd13f81..b6f3a489543e46b8fd3a16162985dcd70139f091 100644
--- a/src/Admin/Pages/Pages/SubPages/Permissions.js
+++ b/src/Admin/Pages/Pages/SubPages/Permissions.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useState, useContext } from 'react'
//imports from local files
import TableData from '../../../Components/Components/Table';
import SnackBar from '../../../../Components/SnackbarComponent';
@@ -28,12 +28,14 @@ import { getRequest, deleteRequest } from '../../../../Components/HelperFunction
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
import PageHeader from "../../../Components/Components/PageHeader"
+import { StyledLoadMoreButton, StyledDivButton } from './Collections';
+import { Store } from 'Store'
//imports from material ui
import { withStyles } from '@material-ui/core/styles';
import TableBody from '@material-ui/core/TableBody';
import TableCell from '@material-ui/core/TableCell';
import TableRow from '@material-ui/core/TableRow';
-import { Button, Paper } from '@material-ui/core';
+import { Button } from '@material-ui/core';
import CircularProgress from '@material-ui/core/CircularProgress';
import AddRoundedIcon from '@material-ui/icons/AddRounded';
import UpdateRoundedIcon from '@material-ui/icons/UpdateRounded';
@@ -41,7 +43,6 @@ import EditRoundedIcon from '@material-ui/icons/EditRounded';
import DeleteRoundedIcon from '@material-ui/icons/DeleteRounded';
//router
import { Link, useHistory } from 'react-router-dom';
-import styled from "styled-components"
import AccountCircleRoundedIcon from "@material-ui/icons/AccountCircleRounded"
const StyledTableCell = withStyles((theme) => ({
@@ -63,6 +64,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const UserPermissions = () => {
+
+ const { state } = useContext(Store)
+
const ADD_ONE_LENGHT = [""];
const TOP_LABELS = ['ID', 'NOME', 'DESCRIÇÃO', 'AÇÕES'] //Labels from Table
const WINDOW_WIDTH = window.innerWidth
@@ -252,8 +256,9 @@ const UserPermissions = () => {
{items.map((row, index) =>
index === items.length - 1 ? (
- <StyledDivButton key={new Date().toISOString() + row.created_at}>
- <Button
+ <StyledDivButton contrast={state.contrast} key={new Date().toISOString() + row.created_at}>
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -268,7 +273,7 @@ const UserPermissions = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -433,12 +438,4 @@ const UserPermissions = () => {
}
}
}
-export default UserPermissions;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
+export default UserPermissions;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/Questions.js b/src/Admin/Pages/Pages/SubPages/Questions.js
index 078cda4cfa404af856a9adde5670744d13471471..bd7a444a7ebab4bb195dcd4bfef98cf08f49290c 100644
--- a/src/Admin/Pages/Pages/SubPages/Questions.js
+++ b/src/Admin/Pages/Pages/SubPages/Questions.js
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useState, useContext } from 'react'
import moment from 'moment';
//imports from local files
import TableData from '../../../Components/Components/Table';
@@ -27,19 +27,20 @@ import { getRequest, putRequest } from '../../../../Components/HelperFunctions/g
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
import PageHeader from "../../../Components/Components/PageHeader"
+import { StyledLoadMoreButton, StyledDivButton } from './Collections';
+import { Store } from 'Store'
//imports from material ui
import { withStyles } from '@material-ui/core/styles';
import TableBody from '@material-ui/core/TableBody';
import TableCell from '@material-ui/core/TableCell';
import TableRow from '@material-ui/core/TableRow';
-import { Button, Paper } from '@material-ui/core';
+import { Button } from '@material-ui/core';
import CircularProgress from '@material-ui/core/CircularProgress';
import AddRoundedIcon from '@material-ui/icons/AddRounded';
import UpdateRoundedIcon from '@material-ui/icons/UpdateRounded';
import Switch from '@material-ui/core/Switch';
//router
import { useHistory } from 'react-router-dom';
-import styled from "styled-components"
import HelpRoundedIcon from "@material-ui/icons/HelpRounded";
const StyledTableCell = withStyles((theme) => ({
@@ -62,6 +63,8 @@ const StyledTableRow = withStyles((theme) => ({
const Questions = () => {
+ const { state } = useContext(Store)
+
const ADD_ONE_LENGHT = [""];
const WINDOW_WIDTH = window.innerWidth
const TOP_LABELS = ['ID', 'CRIAÇÃO EM', 'DESCRIÇÃO', 'STATUS', 'ATUALIZAÇÃO EM'] //Labels from Table
@@ -251,9 +254,11 @@ const Questions = () => {
{items.map((row, index) =>
index === items.length - 1 ? (
<StyledDivButton
+ contrast={state.contrast}
key={new Date().toISOString() + row.created_at}
>
- <Button
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -268,7 +273,7 @@ const Questions = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -419,12 +424,4 @@ const Questions = () => {
}
}
}
-export default Questions;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
+export default Questions;
\ No newline at end of file
diff --git a/src/Admin/Pages/Pages/SubPages/Rating.js b/src/Admin/Pages/Pages/SubPages/Rating.js
index 24b861b0b67f479dc906f51f19fc4d3629349cc6..c7872d7ee2f2a6088620af693a99ca3a8ac7cf72 100644
--- a/src/Admin/Pages/Pages/SubPages/Rating.js
+++ b/src/Admin/Pages/Pages/SubPages/Rating.js
@@ -16,11 +16,10 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState, useContext } from 'react';
//Material ui componets
import { withStyles } from '@material-ui/core/styles';
import TableBody from '@material-ui/core/TableBody';
-import Paper from "@material-ui/core/Paper";
import TableCell from '@material-ui/core/TableCell';
import TableRow from '@material-ui/core/TableRow';
import IconButton from '@material-ui/core/IconButton';
@@ -37,6 +36,8 @@ import LoadingSpinner from '../../../../Components/LoadingSpinner';
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
import PageHeader from "../../../Components/Components/PageHeader"
+import { StyledLoadMoreButton, StyledDivButton } from './Collections';
+import { Store } from 'Store'
//Services
import AlertDialog from "../../../Components/Components/AlertDialog";
import { Url } from '../../../Filters';
@@ -45,7 +46,6 @@ import { getRequest, deleteRequest } from '../../../../Components/HelperFunction
//routers
import { Link, useHistory } from 'react-router-dom';
import StarRoundedIcon from "@material-ui/icons/StarRounded";
-import styled from "styled-components"
const StyledTableCell = withStyles((theme) => ({
head: {
@@ -66,6 +66,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const Ratings = () => {
+
+ const { state } = useContext(Store)
+
const WINDOW_WIDTH = window.innerWidth
const ADD_ONE_LENGHT = [""];
@@ -249,8 +252,9 @@ const Ratings = () => {
{items.map((row, index) =>
index === items.length - 1 ? (
- <StyledDivButton key={new Date().toISOString() + row.created_at}>
- <Button
+ <StyledDivButton contrast={state.contrast} key={new Date().toISOString() + row.created_at}>
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -265,7 +269,7 @@ const Ratings = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -423,11 +427,3 @@ const Ratings = () => {
export default Ratings;
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
diff --git a/src/Admin/Pages/Pages/SubPages/Users.js b/src/Admin/Pages/Pages/SubPages/Users.js
index e13ad9d6b965424308b25af2d75f392f1637cec6..f7ef697179a0c7a69631734677966e22e3d72c6a 100644
--- a/src/Admin/Pages/Pages/SubPages/Users.js
+++ b/src/Admin/Pages/Pages/SubPages/Users.js
@@ -15,7 +15,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useState, useContext } from 'react';
//Material ui componets
import { withStyles } from '@material-ui/core/styles';
import TableBody from '@material-ui/core/TableBody';
@@ -28,7 +28,6 @@ import VisibilityIcon from '@material-ui/icons/Visibility';
import { Button, Chip } from '@material-ui/core';
import CircularProgress from '@material-ui/core/CircularProgress';
import AddRoundedIcon from '@material-ui/icons/AddRounded';
-import TextField from '@material-ui/core/TextField';
import UpdateRoundedIcon from '@material-ui/icons/UpdateRounded'
import FilterListRoundedIcon from "@material-ui/icons/FilterListRounded";
//Local files
@@ -37,7 +36,10 @@ import SnackBar from '../../../../Components/SnackbarComponent';
import LoadingSpinner from '../../../../Components/LoadingSpinner';
import MobileList from "../../../Components/Components/MobileComponents/SimpleList"
import MobilePageHeader from "../../../Components/Components/MobileComponents/MobilePageHeader"
-import PageHeader from "../../../Components/Components/PageHeader"
+import PageHeader, { StyledFilter } from "../../../Components/Components/PageHeader"
+import FormInput from "Components/FormInput.js"
+import { Store } from 'Store'
+import { StyledLoadMoreButton, StyledDivButton } from './Collections';
//Services
import { getRequest, putRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
import { Url } from '../../../Filters';
@@ -70,6 +72,9 @@ const StyledTableRow = withStyles((theme) => ({
}))(TableRow);
const Users = () => {
+
+ const { state } = useContext(Store)
+
const ADD_ONE_LENGHT = [''];
const WINDOW_WIDTH = window.innerWidth
@@ -296,34 +301,39 @@ const Users = () => {
>
{
showFilter ? (
+ <StyledFilter contrast={state.contrast}>
<Grid container direction="row" justify="space-between" alignItems="center">
<Grid item>
- <TextField
- label="Name"
- value={nameValue}
- onChange={(e) => { NameHandler(e) }}
- onBlur={(e) => { setEmail(e.target.value) }}
- helperText="Ao digitar, retire o foco do campo"
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Name"
+ handleChange={(e) => { NameHandler(e) }}
+ onBlur={(e) => { setName(e.target.value) }}
+ value={nameValue}
+ help="Ao digitar, retire o foco do campo"
/>
</Grid>
<Grid item>
- <TextField
- label="Email"
- value={emailValue}
- onChange={(e) => { EmailHandler(e) }}
- onBlur={(e) => { setEmail(e.target.value) }}
- helperText="Ao digitar, retire o foco do campo"
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Email"
+ handleChange={(e) => { EmailHandler(e) }}
+ onBlur={(e) => { setEmail(e.target.value) }}
+ value={emailValue}
+ help="Ao digitar, retire o foco do campo"
/>
</Grid>
</Grid>
+ </StyledFilter>
) : null
}
</MobilePageHeader>
{items.map((row, index) =>
index === items.length - 1 ? (
- <StyledDivButton key={new Date().toISOString() + row.created_at}>
- <Button
+ <StyledDivButton contrast={state.contrast} key={new Date().toISOString() + row.created_at}>
+ <StyledLoadMoreButton
+ contrast={state.contrast}
color="primary"
variant="text"
// disabled={isLoadingMoreItems}
@@ -338,7 +348,7 @@ const Users = () => {
) : (
"Carregar mais itens"
)}
- </Button>
+ </StyledLoadMoreButton>
</StyledDivButton>
) : (
<>
@@ -461,26 +471,30 @@ const Users = () => {
>
{
showFilter ? (
+ <StyledFilter contrast={state.contrast}>
<Grid container direction="row" justify="space-between" alignItems="center">
<Grid item>
- <TextField
- label="Name"
- value={nameValue}
- onChange={(e) => { NameHandler(e) }}
- onBlur={(e) => { setEmail(e.target.value) }}
- helperText="Ao digitar, retire o foco do campo"
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Name"
+ handleChange={(e) => { NameHandler(e) }}
+ onBlur={(e) => { setName(e.target.value) }}
+ value={nameValue}
+ help="Ao digitar, retire o foco do campo"
/>
</Grid>
<Grid item>
- <TextField
- label="Email"
- value={emailValue}
- onChange={(e) => { EmailHandler(e) }}
- onBlur={(e) => { setEmail(e.target.value) }}
- helperText="Ao digitar, retire o foco do campo"
+ <FormInput
+ contrast={state.contrast}
+ placeholder="Email"
+ handleChange={(e) => { EmailHandler(e) }}
+ onBlur={(e) => { setEmail(e.target.value) }}
+ value={emailValue}
+ help="Ao digitar, retire o foco do campo"
/>
</Grid>
</Grid>
+ </StyledFilter>
) : null
}
</PageHeader>
@@ -561,12 +575,4 @@ export default Users;
const ChipDiv = styled.div`
margin-top : 0.5em;
-`
-
-const StyledDivButton = styled(Paper)`
- width : 100%;
- display : flex;
- justify-content : center;
- align-items : center;
-`
-
+`
\ No newline at end of file
diff --git a/src/Components/FormInput.js b/src/Components/FormInput.js
index 45e38a05965519b9b99cb2cd7adea012c4c7fefb..e1f7cef11c7b00e5650b79994d8cca60a4387e4f 100644
--- a/src/Components/FormInput.js
+++ b/src/Components/FormInput.js
@@ -30,6 +30,13 @@ const StyledTextField = styled(TextField)`
.MuiFormHelperText-root {
color: ${props => props.contrast === "" ? "#666" : "white"};
}
+ .Mui-disabled{
+ color: ${props => props.contrast === "" ? "#999" : "white"} !important;
+ fieldset {
+ border-color: ${props => props.contrast === "" ? "#999" : "white"} !important;
+ }
+
+ }
.MuiFormHelperText-root.Mui-error {
color: ${props => props.contrast === "" ? "red" : "#e75480"};
@@ -115,23 +122,25 @@ export default function FormInput(props) {
contrast={props.contrast}
key={props.key}
label={props.placeholder}
+ select={props.selectable ? props.selectable : false}
disabled={props.disableField}
margin="normal"
id={props.id}
name={props.name}
type={props.inputType}
value={props.value}
+ onBlur={props.onBlur}
onChange={props.handleChange}
onKeyDown={props.onKeyDown}
variant="outlined"
rows={props.rows}
+ onKeyPress={props.onKeyPress}
error={props.error}
rowsMax={props.rowsMax}
InputProps={props.contrast === "" ? { className: classes.lightTextField } : { className: classes.darkTextField }}
required={props.required}
// helperText={<span style={props.contrast === "" ? { color: "red" } : { color: "#e75480" }}>{props.help}</span>}
helperText={props.help}
- style={{ width: "100%" }}
mask={props.mask}
multiline={props.multi}
/>