Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision

Target

Select target project
  • portalmec/portalmec-react
  • rfhferreira/cleaning-portal-mec-react
2 results
Select Git revision
Show changes
Showing
with 781 additions and 332 deletions
...@@ -16,12 +16,11 @@ GNU Affero General Public License for more details. ...@@ -16,12 +16,11 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
import GerenciandoConta from '../../../img/ajuda/Gerenciando_a_conta.png'; import GerenciandoConta from "../../../img/ajuda/Gerenciando_a_conta.png";
import { Link } from 'react-router-dom';
import { Link } from "react-router-dom";
export default function CardGerenciando(props) { export default function CardGerenciando(props) {
return ( return (
...@@ -30,37 +29,61 @@ export default function CardGerenciando(props) { ...@@ -30,37 +29,61 @@ export default function CardGerenciando(props) {
<img src={GerenciandoConta} alt="" /> <img src={GerenciandoConta} alt="" />
<h3>Gerenciando Conta</h3> <h3>Gerenciando Conta</h3>
<hr /> <hr />
<Link to={{ <Link
pathname : 'gerenciando-conta', to={{
state : {value : '0'} pathname: "gerenciando-conta",
}}>Por que me cadastrar?</Link> state: { value: "0" }
}}
>
Por que me cadastrar?
</Link>
<br /> <br />
<Link to={{ <Link
pathname : 'gerenciando-conta', to={{
state : {value : '1'} pathname: "gerenciando-conta",
}}>Como fazer meu cadastro?</Link> state: { value: "1" }
}}
>
Como fazer meu cadastro?
</Link>
<br /> <br />
<Link to={{ <Link
pathname : 'gerenciando-conta', to={{
state : {value : '2'} pathname: "gerenciando-conta",
}}>Como alterar minha senha?</Link> state: { value: "2" }
}}
>
Como alterar minha senha?
</Link>
<br /> <br />
<Link to={{ <Link
pathname : 'gerenciando-conta', to={{
state : {value : '3'} pathname: "gerenciando-conta",
}}>Como acessar a conta?</Link> state: { value: "3" }
}}
>
Como acessar a conta?
</Link>
<br /> <br />
<Link to={{ <Link
pathname : 'gerenciando-conta', to={{
state : {value : '4'} pathname: "gerenciando-conta",
}}>Esqueci minha senha. O que fazer?</Link> state: { value: "4" }
}}
>
Esqueci minha senha. O que fazer?
</Link>
<br /> <br />
</div> </div>
<div className="card-rodape"> <div className="card-rodape">
<Link to={{ <Link
pathname : 'gerenciando-conta', to={{
state : {value : '0'} pathname: "gerenciando-conta",
}}>VER MAIS</Link> state: { value: "0" }
}}
>
VER MAIS
</Link>
</div> </div>
</CardAjuda> </CardAjuda>
); );
...@@ -69,7 +92,7 @@ export default function CardGerenciando(props) { ...@@ -69,7 +92,7 @@ export default function CardGerenciando(props) {
const CardAjuda = styled.div` const CardAjuda = styled.div`
height: 360px; height: 360px;
margin-bottom: 20px margin-bottom: 20px;
.card { .card {
...@@ -81,7 +104,7 @@ const CardAjuda = styled.div` ...@@ -81,7 +104,7 @@ const CardAjuda = styled.div`
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24);
h3 { h3 {
font-size: 24px; font-size: 23px;
font-weight: 400; font-weight: 400;
color: #666; color: #666;
margin-top: 20px; margin-top: 20px;
...@@ -147,4 +170,4 @@ const CardAjuda = styled.div` ...@@ -147,4 +170,4 @@ const CardAjuda = styled.div`
} }
` `;
\ No newline at end of file
...@@ -16,12 +16,11 @@ GNU Affero General Public License for more details. ...@@ -16,12 +16,11 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
import ParticipandoRede from '../../../img/ajuda/Participando_da_rede.png'; import ParticipandoRede from "../../../img/ajuda/Participando_da_rede.png";
import { Link } from 'react-router-dom';
import { Link } from "react-router-dom";
export default function CardParticipando(props) { export default function CardParticipando(props) {
return ( return (
...@@ -30,22 +29,34 @@ export default function CardParticipando(props) { ...@@ -30,22 +29,34 @@ export default function CardParticipando(props) {
<img src={ParticipandoRede} alt="" /> <img src={ParticipandoRede} alt="" />
<h3>Participando da Rede</h3> <h3>Participando da Rede</h3>
<hr /> <hr />
<Link to={{ <Link
pathname : 'participando-da-rede', to={{
state : {value : '0'} pathname: "participando-da-rede",
}}>Comentanto os recursos</Link> state: { value: "0" }
}}
>
Comentanto os recursos
</Link>
<br /> <br />
<Link to={{ <Link
pathname : 'participando-da-rede', to={{
state : {value : '1'} pathname: "participando-da-rede",
}}>Como relatar uma experiência ou avaliar um recurso?</Link> state: { value: "1" }
}}
>
Como relatar uma experiência ou avaliar um recurso?
</Link>
<br /> <br />
</div> </div>
<div className="card-rodape"> <div className="card-rodape">
<Link to={{ <Link
pathname : 'participando-da-rede', to={{
state : {value : '0'} pathname: "participando-da-rede",
}}>VER MAIS</Link> state: { value: "0" }
}}
>
VER MAIS
</Link>
</div> </div>
</CardAjuda> </CardAjuda>
); );
...@@ -54,7 +65,7 @@ export default function CardParticipando(props) { ...@@ -54,7 +65,7 @@ export default function CardParticipando(props) {
const CardAjuda = styled.div` const CardAjuda = styled.div`
height: 360px; height: 360px;
margin-bottom: 20px margin-bottom: 20px;
.card { .card {
...@@ -66,7 +77,7 @@ const CardAjuda = styled.div` ...@@ -66,7 +77,7 @@ const CardAjuda = styled.div`
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24);
h3 { h3 {
font-size: 24px; font-size: 23px;
font-weight: 400; font-weight: 400;
color: #666; color: #666;
margin-top: 20px; margin-top: 20px;
...@@ -132,4 +143,4 @@ const CardAjuda = styled.div` ...@@ -132,4 +143,4 @@ const CardAjuda = styled.div`
} }
` `;
\ No newline at end of file
...@@ -16,11 +16,10 @@ GNU Affero General Public License for more details. ...@@ -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 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
import PublicandoRecursos from '../../../img/ajuda/Publicando_recursos.png'; import PublicandoRecursos from "../../../img/ajuda/Publicando_recursos.png";
import { Link } from 'react-router-dom'; import { Link } from "react-router-dom";
export default function CardPublicando(props) { export default function CardPublicando(props) {
return ( return (
...@@ -29,27 +28,43 @@ return( ...@@ -29,27 +28,43 @@ return(
<img src={PublicandoRecursos} alt="" /> <img src={PublicandoRecursos} alt="" />
<h3>Publicando Recursos</h3> <h3>Publicando Recursos</h3>
<hr /> <hr />
<Link to={{ <Link
pathname : 'publicando-recurso', to={{
state : {value : '0'} pathname: "publicando-recurso",
}}>Por que enviar um recurso?</Link> state: { value: "0" }
}}
>
Por que enviar um recurso?
</Link>
<br /> <br />
<Link to={{ <Link
pathname : 'publicando-recurso', to={{
state : {value : '1'} pathname: "publicando-recurso",
}}>Como publicar um recurso?</Link> state: { value: "1" }
}}
>
Como publicar um recurso?
</Link>
<br /> <br />
<Link to={{ <Link
pathname : 'publicando-recurso', to={{
state : {value : '2'} pathname: "publicando-recurso",
}}>Quais tipos de recurso e formatos a plataforma aceita?</Link> state: { value: "2" }
}}
>
Quais tipos de recurso e formatos a plataforma aceita?
</Link>
<br /> <br />
</div> </div>
<div className="card-rodape"> <div className="card-rodape">
<Link to={{ <Link
pathname : 'publicando-recurso', to={{
state : {value : '0'} pathname: "publicando-recurso",
}}>VER MAIS</Link> state: { value: "0" }
}}
>
VER MAIS
</Link>
</div> </div>
</CardAjuda> </CardAjuda>
); );
...@@ -58,7 +73,7 @@ return( ...@@ -58,7 +73,7 @@ return(
const CardAjuda = styled.div` const CardAjuda = styled.div`
height: 360px; height: 360px;
margin-bottom: 20px margin-bottom: 20px;
.card { .card {
...@@ -70,7 +85,7 @@ margin-bottom: 20px ...@@ -70,7 +85,7 @@ margin-bottom: 20px
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24);
h3 { h3 {
font-size: 24px; font-size: 23px;
font-weight: 400; font-weight: 400;
color: #666; color: #666;
margin-top: 20px; margin-top: 20px;
...@@ -136,4 +151,4 @@ margin-bottom: 20px ...@@ -136,4 +151,4 @@ margin-bottom: 20px
} }
` `;
\ No newline at end of file
...@@ -16,30 +16,28 @@ GNU Affero General Public License for more details. ...@@ -16,30 +16,28 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
export default function How(props) { export default function How(props) {
return ( return (
<Card> <Card>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet"/> <link
href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap"
rel="stylesheet"
/>
<div style={{ marginBottom: "9px" }}> <div style={{ marginBottom: "9px" }}>
<span>{props.title}</span> <span>{props.title}</span>
</div> </div>
<div style={{ width: "640px", height: "360px" }}> <div style={{ width: "640px", height: "360px" }}>
<iframe width="640" <iframe
width="640"
height="360" height="360"
src="https://www.youtube.com/embed/CRW5h2pHugM" src="https://www.youtube.com/embed/CRW5h2pHugM"
frameborder="0" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen allowfullscreen
> ></iframe>
</iframe>
</div> </div>
</Card> </Card>
); );
...@@ -48,7 +46,7 @@ export default function How(props) { ...@@ -48,7 +46,7 @@ export default function How(props) {
const Card = styled.div` const Card = styled.div`
margin-bottom: 5px; margin-bottom: 5px;
background-color: #fff; background-color: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
padding: 30px; padding: 30px;
color: #666; color: #666;
span { span {
...@@ -64,8 +62,6 @@ const Card = styled.div` ...@@ -64,8 +62,6 @@ const Card = styled.div`
} }
} }
ul { ul {
padding-left: 0 !important; padding-left: 0 !important;
margin-top: 0; margin-top: 0;
...@@ -82,7 +78,4 @@ const Card = styled.div` ...@@ -82,7 +78,4 @@ const Card = styled.div`
margin: 0 0 10px; margin: 0 0 10px;
font-size: 15px; font-size: 15px;
} }
`;
`
\ No newline at end of file
...@@ -16,48 +16,104 @@ GNU Affero General Public License for more details. ...@@ -16,48 +16,104 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
const softwares = [ const softwares = [
{ recursos : "Google Chrome" , texto : "Navegador web." , link : "https://ninite.com/chrome/" }, {
{ recursos : "Java" , texto : "Necessário para a execução de sites que utilizem sua linguagem de programação java." , link : "http://javadl.oracle.com/webapps/download/AutoDL?BundleId=225355_090f390dda5b47b9b721c7dfaa008135NINITE: https://ninite.com/java8/" }, recursos: "Google Chrome",
{ recursos : "Adobe Flash Player" , texto : "plugin que reproduz multimídia na internet de forma mais eficiente." , link : "https://get.adobe.com/br/flashplayer/download/?installer=FP_27_for_Opera_and_Chromium_-_PPAPI&os=Windows%207&browser_type=KHTML&browser_dist=Chrome&dualoffer=false&mdualoffer=true&stype=6703&d=McAfee_Security_Scan_Plus&d=McAfee_Safe_Connect" }, texto: "Navegador web.",
{ recursos : "Adobe Air" , texto : "Plugin para execução de códigos para aplicações nativas e jogos para computadores desktop com Windows e Mac OS bem como dispositivos iOS e Android." , link : "https://ninite.com/air/" }, link: "https://ninite.com/chrome/"
{ recursos : "Net Framework" , texto : "O .NET Framework é um ambiente de execução de tempo de execução que gerencia os aplicativos destinados ao .NET Framework." , link : "https://ninite.com/.net4.7/" }, },
{ recursos : "Acrobat Reader DC" , texto : "Abrir documento no formato PDF" , link : "https://ninite.com/foxit/" }, {
{ recursos : "Video LAN" , texto : "REPRODUTOR DE VÍDEO." , link : "http://download.winzip.com/gl/nkln/winzip21_downwz.exe" }, recursos: "Java",
{ recursos : "Winzip" , texto : "WinZip: abrir arquivos compactados." , link : "http://download.winzip.com/gl/nkln/winzip21_downwz.exe" }, texto:
{ recursos : "K-Lite Codec" , texto : "Software que ajuda na reprodução de arquivos multimídia no computador." , link : "https://ninite.com/libreoffice/" }, "Necessário para a execução de sites que utilizem sua linguagem de programação java.",
{ recursos : "Libre Office" , texto : "Software gratuito para visualização e edição de documentos, planilhas e apresentações." , link : "https://ninite.com/libreoffice/" }, link:
{ recursos : "Swiff Player" , texto : "reprodutor de mídia do formato swf" , link : "https://www.w3schools.com/html/" } "http://javadl.oracle.com/webapps/download/AutoDL?BundleId=225355_090f390dda5b47b9b721c7dfaa008135NINITE: https://ninite.com/java8/"
},
] {
recursos: "Adobe Flash Player",
texto:
"plugin que reproduz multimídia na internet de forma mais eficiente.",
link:
"https://get.adobe.com/br/flashplayer/download/?installer=FP_27_for_Opera_and_Chromium_-_PPAPI&os=Windows%207&browser_type=KHTML&browser_dist=Chrome&dualoffer=false&mdualoffer=true&stype=6703&d=McAfee_Security_Scan_Plus&d=McAfee_Safe_Connect"
},
{
recursos: "Adobe Air",
texto:
"Plugin para execução de códigos para aplicações nativas e jogos para computadores desktop com Windows e Mac OS bem como dispositivos iOS e Android.",
link: "https://ninite.com/air/"
},
{
recursos: "Net Framework",
texto:
"O .NET Framework é um ambiente de execução de tempo de execução que gerencia os aplicativos destinados ao .NET Framework.",
link: "https://ninite.com/.net4.7/"
},
{
recursos: "Acrobat Reader DC",
texto: "Abrir documento no formato PDF",
link: "https://ninite.com/foxit/"
},
{
recursos: "Video LAN",
texto: "REPRODUTOR DE VÍDEO.",
link: "http://download.winzip.com/gl/nkln/winzip21_downwz.exe"
},
{
recursos: "Winzip",
texto: "WinZip: abrir arquivos compactados.",
link: "http://download.winzip.com/gl/nkln/winzip21_downwz.exe"
},
{
recursos: "K-Lite Codec",
texto:
"Software que ajuda na reprodução de arquivos multimídia no computador.",
link: "https://ninite.com/libreoffice/"
},
{
recursos: "Libre Office",
texto:
"Software gratuito para visualização e edição de documentos, planilhas e apresentações.",
link: "https://ninite.com/libreoffice/"
},
{
recursos: "Swiff Player",
texto: "reprodutor de mídia do formato swf",
link: "https://www.w3schools.com/html/"
}
];
export default function Software(props) { export default function Software(props) {
return ( return (
<Card> <Card>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet"/> <link
href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap"
rel="stylesheet"
/>
<div style={{ marginBottom: "9px" }}> <div style={{ marginBottom: "9px" }}>
<span>{props.title}</span> <span>{props.title}</span>
</div> </div>
<p> <p>
Todo e qualquer recurso digital precisa de um programa ou aplicativo para Todo e qualquer recurso digital precisa de um programa ou aplicativo
ser visualizado. Por exemplo, grande parte dos recursos são arquivos para ser visualizado. Por exemplo, grande parte dos recursos são
compactados que servem para ocupar menos espaço de armazenamento, recebendo arquivos compactados que servem para ocupar menos espaço de
a extensão .zip ou .rar, para utilizá-lo, você precisa ter instalado um armazenamento, recebendo a extensão .zip ou .rar, para utilizá-lo, você
descompactador de arquivos, como o <a href="http://download.winzip.com/gl/nkln/winzip21_downwz.exe">Winzip</a> ou <a href="https://ninite.com/winrar/">Winrar</a>. precisa ter instalado um descompactador de arquivos, como o{" "}
<a href="http://download.winzip.com/gl/nkln/winzip21_downwz.exe">
Winzip
</a>{" "}
ou <a href="https://ninite.com/winrar/">Winrar</a>.
</p> </p>
<p> <p>
Alguns destes programas são bem comuns, e provavelmente, você já deve ter Alguns destes programas são bem comuns, e provavelmente, você deve
instalado em seu computador, como processador de texto para formato .docx, ter instalado em seu computador, como processador de texto para formato
o Microsoft Word (para Sistema Operacional Windows) ou LibreOffice .docx, o Microsoft Word (para Sistema Operacional Windows) ou
(nas distribuições Linux). Porém, existem outros programas que não são tão LibreOffice (nas distribuições Linux). Porém, existem outros programas
comuns assim, mas que são fáceis de instalar em seu computador. A seguir, que não são tão comuns assim, mas que são fáceis de instalar em seu
vamos apresentar umas informações que podem guiar a utilização dos recursos computador. A seguir, vamos apresentar umas informações que podem guiar
em suas aulas. a utilização dos recursos em suas aulas.
</p> </p>
<p> <p>
Você precisa ficar atento as siglas que terminação do recurso que dizem Você precisa ficar atento as siglas que terminação do recurso que dizem
...@@ -66,10 +122,12 @@ export default function Software(props) { ...@@ -66,10 +122,12 @@ export default function Software(props) {
softwares que você poderá precisar de acordo com o tipo de recurso: softwares que você poderá precisar de acordo com o tipo de recurso:
</p> </p>
<ul> <ul>
{softwares.map((item)=> {softwares.map(item => (
<li><a href={item.link} >{item.recursos}</a> - {item.texto} <br/><br/> </li> <li>
)} <a href={item.link}>{item.recursos}</a> - {item.texto} <br />
<br />{" "}
</li>
))}
</ul> </ul>
</Card> </Card>
); );
...@@ -78,7 +136,7 @@ export default function Software(props) { ...@@ -78,7 +136,7 @@ export default function Software(props) {
const Card = styled.div` const Card = styled.div`
margin-bottom: 5px; margin-bottom: 5px;
background-color: #fff; background-color: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
padding: 30px; padding: 30px;
color: #666; color: #666;
span { span {
...@@ -94,8 +152,6 @@ const Card = styled.div` ...@@ -94,8 +152,6 @@ const Card = styled.div`
} }
} }
ul { ul {
padding-left: 0 !important; padding-left: 0 !important;
margin-top: 0; margin-top: 0;
...@@ -112,7 +168,4 @@ const Card = styled.div` ...@@ -112,7 +168,4 @@ const Card = styled.div`
margin: 0 0 10px; margin: 0 0 10px;
font-size: 15px; font-size: 15px;
} }
`;
`
\ No newline at end of file
...@@ -16,10 +16,8 @@ GNU Affero General Public License for more details. ...@@ -16,10 +16,8 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
const tipos = [ const tipos = [
{ recursos: "- áudios;" }, { recursos: "- áudios;" },
...@@ -28,30 +26,32 @@ const tipos = [ ...@@ -28,30 +26,32 @@ const tipos = [
{ recursos: "- softwares educacionais" }, { recursos: "- softwares educacionais" },
{ recursos: "- textos;" }, { recursos: "- textos;" },
{ recursos: "- vídeos" } { recursos: "- vídeos" }
] ];
export default function Types(props) { export default function Types(props) {
return ( return (
<Card> <Card>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet"/> <link
href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap"
rel="stylesheet"
/>
<div style={{ marginBottom: "9px" }}> <div style={{ marginBottom: "9px" }}>
<span>{props.title}</span> <span>{props.title}</span>
</div> </div>
<p> <p>
A plataforma integra os Recursos Educacionais Digitais dos principais portais abertos. Conheça alguns deles: A plataforma integra os Recursos Educacionais Digitais dos principais
portais abertos. Conheça alguns deles:
</p> </p>
<ul> <ul>
{tipos.map((item)=> {tipos.map(item => (
<li>{item.recursos}</li> <li>{item.recursos}</li>
))}
)}
</ul> </ul>
<p> <p>
E ainda, nesta plataforma são organizados pelos diferentes componentes curriculares (matemática, artes, etc.) e E ainda, nesta plataforma são organizados pelos diferentes componentes
etapas de ensino (Ensino Médio, Fundamental, Anos Iniciais, etc.) onde podem ser aplicados. curriculares (matemática, artes, etc.) e etapas de ensino (Ensino Médio,
Fundamental, Anos Iniciais, etc.) onde podem ser aplicados.
</p> </p>
</Card> </Card>
); );
} }
...@@ -59,7 +59,7 @@ export default function Types(props) { ...@@ -59,7 +59,7 @@ export default function Types(props) {
const Card = styled.div` const Card = styled.div`
margin-bottom: 5px; margin-bottom: 5px;
background-color: #fff; background-color: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
padding: 30px; padding: 30px;
color: #666; color: #666;
span { span {
...@@ -67,8 +67,6 @@ const Card = styled.div` ...@@ -67,8 +67,6 @@ const Card = styled.div`
font-weight: bold; font-weight: bold;
} }
ul { ul {
padding-left: 0 !important; padding-left: 0 !important;
margin-top: 0; margin-top: 0;
...@@ -85,7 +83,4 @@ const Card = styled.div` ...@@ -85,7 +83,4 @@ const Card = styled.div`
margin: 0 0 10px; margin: 0 0 10px;
font-size: 15px; font-size: 15px;
} }
`;
`
\ No newline at end of file
...@@ -16,35 +16,36 @@ GNU Affero General Public License for more details. ...@@ -16,35 +16,36 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
export default function Understand(props) { export default function Understand(props) {
return ( return (
<Card> <Card>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet"/> <link
href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap"
rel="stylesheet"
/>
<div style={{ marginBottom: "9px" }}> <div style={{ marginBottom: "9px" }}>
<span>{props.title}</span> <span>{props.title}</span>
</div> </div>
<p> <p>
<strong>Área de Recursos Educacionais Digitais</strong> <strong>Área de Recursos Educacionais Digitais</strong>
<br /> <br />
Recursos que, no mínimo, têm uma licença de uso mais flexível. Uma licença Recursos que, no mínimo, têm uma licença de uso mais flexível. Uma
que permite que o recurso possa ser utilizado, alterado e manipulado sem licença que permite que o recurso possa ser utilizado, alterado e
restrições. Adicionalmente, um recurso aberto pode utilizar um formato manipulado sem restrições. Adicionalmente, um recurso aberto pode
aberto, um formato de arquivo que permite a fácil edição por terceiros. utilizar um formato aberto, um formato de arquivo que permite a fácil
Nenhum controle (como cadastro e senha) deve existir para acesso a recursos abertos. edição por terceiros. Nenhum controle (como cadastro e senha) deve
existir para acesso a recursos abertos.
</p> </p>
<p> <p>
<strong>Área de Materiais de Formação</strong> <strong>Área de Materiais de Formação</strong>
<br /> <br />
Nesta área, você acessa livremente materiais completos de formação, como Nesta área, você acessa livremente materiais completos de formação, como
cursos oferecidos pelo MEC e seus parceiros. São conteúdos elaborados cursos oferecidos pelo MEC e seus parceiros. São conteúdos elaborados
por equipes multidisciplinares e de autoria de pesquisadores e educadores por equipes multidisciplinares e de autoria de pesquisadores e
renomados nas áreas. educadores renomados nas áreas.
</p> </p>
<p> <p>
<strong>Área de Coleções de Usuários</strong> <strong>Área de Coleções de Usuários</strong>
...@@ -53,8 +54,6 @@ export default function Understand(props) { ...@@ -53,8 +54,6 @@ export default function Understand(props) {
usuários da plataforma. É mais uma possibilidade de buscar recursos usuários da plataforma. É mais uma possibilidade de buscar recursos
educacionais para sua aula! educacionais para sua aula!
</p> </p>
</Card> </Card>
); );
} }
...@@ -62,7 +61,7 @@ export default function Understand(props) { ...@@ -62,7 +61,7 @@ export default function Understand(props) {
const Card = styled.div` const Card = styled.div`
margin-bottom: 5px; margin-bottom: 5px;
background-color: #fff; background-color: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
padding: 30px; padding: 30px;
color: #666; color: #666;
span { span {
...@@ -74,7 +73,4 @@ const Card = styled.div` ...@@ -74,7 +73,4 @@ const Card = styled.div`
margin: 0 0 10px; margin: 0 0 10px;
font-size: 15px; font-size: 15px;
} }
`;
`
\ No newline at end of file
...@@ -16,36 +16,44 @@ GNU Affero General Public License for more details. ...@@ -16,36 +16,44 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
export default function What(props) { export default function What(props) {
return ( return (
<Card> <Card>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet"/> <link
href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap"
rel="stylesheet"
/>
<div style={{ marginBottom: "9px" }}> <div style={{ marginBottom: "9px" }}>
<span>{props.title}</span> <span>{props.title}</span>
</div> </div>
<p>Bem-vindo(a) à Plataforma MEC, uma iniciativa do Ministério da Educação!</p> <p>
Bem-vindo(a) à Plataforma MEC, uma iniciativa do Ministério da Educação!
</p>
<p> <p>
A Plataforma MEC é parte do processo de implementação do Compromisso 6 A Plataforma MEC é parte do processo de implementação do Compromisso 6
do 3º Plano de Ação da Parceria Governo Aberto (OGP-Brasil), que tem por do 3º Plano de Ação da Parceria Governo Aberto (OGP-Brasil), que tem por
objetivo incorporar na política educacional o potencial da cultura digital, objetivo incorporar na política educacional o potencial da cultura
de modo a fomentar a autonomia para uso, reuso e adaptação de recursos digital, de modo a fomentar a autonomia para uso, reuso e adaptação de
educacionais digitais, valorizando a pluralidade e a diversidade da educação recursos educacionais digitais, valorizando a pluralidade e a
brasileira. O documento completo pode ser consultado <a href="http://www.governoaberto.cgu.gov.br/noticias/2017/3o-plano-de-acao-nacional-na-parceria-para-governo-aberto" >aqui</a>. diversidade da educação brasileira. O documento completo pode ser
consultado{" "}
<a href="http://www.governoaberto.cgu.gov.br/noticias/2017/3o-plano-de-acao-nacional-na-parceria-para-governo-aberto">
aqui
</a>
.
</p> </p>
<p> <p>
<strong>Abertos</strong> <strong>Abertos</strong>
<br /> <br />
Recursos que, no mínimo, têm uma licença de uso mais flexível. Uma licença Recursos que, no mínimo, têm uma licença de uso mais flexível. Uma
que permite que o recurso possa ser utilizado, alterado e manipulado sem licença que permite que o recurso possa ser utilizado, alterado e
restrições. Adicionalmente, um recurso aberto pode utilizar um formato manipulado sem restrições. Adicionalmente, um recurso aberto pode
aberto, um formato de arquivo que permite a fácil edição por terceiros. utilizar um formato aberto, um formato de arquivo que permite a fácil
Nenhum controle (como cadastro e senha) deve existir para acesso a recursos abertos. edição por terceiros. Nenhum controle (como cadastro e senha) deve
existir para acesso a recursos abertos.
</p> </p>
<p> <p>
<strong>Grátis</strong> <strong>Grátis</strong>
...@@ -66,17 +74,18 @@ export default function What(props) { ...@@ -66,17 +74,18 @@ export default function What(props) {
<p> <p>
O Plano Nacional de Educação (2014-2024) enfatiza, nas metas 5 e 7, a O Plano Nacional de Educação (2014-2024) enfatiza, nas metas 5 e 7, a
importância dos recursos educacionais abertos para fomentar a qualidade da importância dos recursos educacionais abertos para fomentar a qualidade
educação básica. da educação básica.
</p> </p>
<p> <p>
A Resolução CNE/CES 1, de 11 de março de 2016, também enfatiza a importância A Resolução CNE/CES 1, de 11 de março de 2016, também enfatiza a
dos recursos educacionais abertos para as instituições de educação superior importância dos recursos educacionais abertos para as instituições de
e para as atividades de educação a distância, promovendo a criação, educação superior e para as atividades de educação a distância,
disponibilização, uso e gestão de tecnologias e recursos educacionais abertos, promovendo a criação, disponibilização, uso e gestão de tecnologias e
por meio de licenças livres, que facilitem o uso, a revisão, a tradução, a recursos educacionais abertos, por meio de licenças livres, que
adaptação, a recombinação, a distribuição e o compartilhamento gratuito pelo facilitem o uso, a revisão, a tradução, a adaptação, a recombinação, a
cidadão, resguardados os direitos autorais pertinentes. distribuição e o compartilhamento gratuito pelo cidadão, resguardados os
direitos autorais pertinentes.
</p> </p>
</Card> </Card>
); );
...@@ -85,7 +94,7 @@ export default function What(props) { ...@@ -85,7 +94,7 @@ export default function What(props) {
const Card = styled.div` const Card = styled.div`
margin-bottom: 5px; margin-bottom: 5px;
background-color: #fff; background-color: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
padding: 30px; padding: 30px;
color: #666; color: #666;
span { span {
...@@ -105,7 +114,4 @@ const Card = styled.div` ...@@ -105,7 +114,4 @@ const Card = styled.div`
margin: 0 0 10px; margin: 0 0 10px;
font-size: 15px; font-size: 15px;
} }
`;
`
\ No newline at end of file
...@@ -16,36 +16,35 @@ GNU Affero General Public License for more details. ...@@ -16,36 +16,35 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License 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/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, { Component, useState, useEffect } from 'react'; import React from "react";
import styled from 'styled-components'; import styled from "styled-components";
const parcas = [ const parcas = [
{ parceiro: "- Portal do Profesor" }, { parceiro: "- Portal do Profesor" },
{ parceiro: "- Domínio Público;" }, { parceiro: "- Domínio Público;" },
{ parceiro: "- Banco internacional de objetos educacionais;" }, { parceiro: "- Banco internacional de objetos educacionais;" },
{ parceiro: "- TV Escola;" } { parceiro: "- TV Escola;" }
] ];
export default function Which(props) { export default function Which(props) {
return ( return (
<Card> <Card>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap" rel="stylesheet"/> <link
href="https://fonts.googleapis.com/css?family=Roboto:400,700&display=swap"
rel="stylesheet"
/>
<div style={{ marginBottom: "9px" }}> <div style={{ marginBottom: "9px" }}>
<span>{props.title}</span> <span>{props.title}</span>
</div> </div>
<p> <p>
A plataforma integra os Recursos Educacionais Digitais dos principais portais abertos. Conheça alguns deles: A plataforma integra os Recursos Educacionais Digitais dos principais
portais abertos. Conheça alguns deles:
</p> </p>
<ul> <ul>
{parcas.map((item)=> {parcas.map(item => (
<li>{item.parceiro}</li> <li>{item.parceiro}</li>
))}
)}
</ul> </ul>
</Card> </Card>
); );
} }
...@@ -53,7 +52,7 @@ export default function Which(props) { ...@@ -53,7 +52,7 @@ export default function Which(props) {
const Card = styled.div` const Card = styled.div`
margin-bottom: 5px; margin-bottom: 5px;
background-color: #fff; background-color: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.24); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
padding: 30px; padding: 30px;
color: #666; color: #666;
span { span {
...@@ -61,8 +60,6 @@ const Card = styled.div` ...@@ -61,8 +60,6 @@ const Card = styled.div`
font-weight: bold; font-weight: bold;
} }
ul { ul {
padding-left: 0 !important; padding-left: 0 !important;
margin-top: 0; margin-top: 0;
...@@ -79,7 +76,4 @@ const Card = styled.div` ...@@ -79,7 +76,4 @@ const Card = styled.div`
margin: 0 0 10px; margin: 0 0 10px;
font-size: 15px; font-size: 15px;
} }
`;
`
\ No newline at end of file
/*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
Departamento de Informatica - Universidade Federal do Parana
This file is part of Plataforma Integrada MEC.
Plataforma Integrada MEC is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Plataforma Integrada MEC is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
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, useState, useEffect} from 'react';
import { Button } from '@material-ui/core';
import Modal from '@material-ui/core/Modal';
import Backdrop from '@material-ui/core/Backdrop';
import Zoom from '@material-ui/core/Fade';
import styled from 'styled-components'
import LoginContainer from './LoginContainerFunction.js'
import {Store} from '../Store.js'
import axios from 'axios'
import {apiUrl} from '../env';
import Snackbar from '@material-ui/core/Snackbar';
import MuiAlert from '@material-ui/lab/Alert';
function Alert(props) {
return <MuiAlert elevation={6} variant="filled" {...props} />;
}
export default function LoginComponent (props) {
const {state, dispatch} = useContext(Store)
/*snackbar variables*/
const [successSnackbar, toggleSuccessSnackbar] = useState(false)
const [failSnackbar, toggleFailSnackbar] = useState(false)
useEffect( () => {
if(state.currentUser.id === '') {
const email = sessionStorage.getItem('@portalmec/uid')
const password = sessionStorage.getItem('@portalmec/senha')
let loginInfo = {email : email, senha : password}
tryLogin(loginInfo)
}
}, [])
const tryLogin = (login) => {
axios.post(`${apiUrl}/auth/sign_in`,
{
email : login.email,
password : login.senha
}).then( (response) => {
console.log(response)
handleSuccess(response, login.senha)
},
(error) => {
handleFailure()
}
)
}
const handleSuccess = (response, senha) => {
toggleSuccessSnackbar(true)
dispatch ({
type: "USER_LOGGED_IN",
userLoggedIn: !state.userIsLoggedIn,
login: {
id : response.data.data.id,
username : response.data.data.name,
email : response.data.data.email,
accessToken : response.headers['access-token'],
clientToken : response.headers.client,
userAvatar : response.data.data.avatar_file_name,
userCover : response.data.data.cover_file_name,
uid : response.data.data.uid,
followCount : response.data.data.follows_count,
collectionsCount : response.data.data.collections_count,
submitter_request : response.data.data.submitter_request
}
}
)
sessionStorage.setItem('@portalmec/accessToken', response.headers['access-token'])
sessionStorage.setItem('@portalmec/clientToken', response.headers.client)
sessionStorage.setItem('@portalmec/id', response.data.data.id)
sessionStorage.setItem('@portalmec/username', response.data.data.name)
sessionStorage.setItem('@portalmec/uid', response.data.data.uid)
sessionStorage.setItem('@portalmec/senha', senha)
props.handleClose()
}
const handleFailure = () => {
toggleFailSnackbar(false)
}
return (
<>
{/*failure snackbar-----------------------------------------------------------------*/}
<Snackbar open={failSnackbar} autoHideDuration={1000} onClose={() => {toggleFailSnackbar(false)}}
anchorOrigin = {{ vertical:'top', horizontal:'right' }}
>
<Alert severity="error">Ocorreu um erro ao se conectar!</Alert>
</Snackbar>
{/*---------------------------------------------------------------------------------*/}
{/*success snackbar-----------------------------------------------------------------*/}
<Snackbar open={successSnackbar} autoHideDuration={1000}
onClose={() => {toggleSuccessSnackbar(false)}} anchorOrigin = {{ vertical:'top', horizontal:'middle' }}
>
<Alert severity="success" style={{backgroundColor:"#00acc1"}}>Você está conectado(a)!</Alert>
</Snackbar>
{/*---------------------------------------------------------------------------------*/}
<StyledLogin
aria-labelledby="transition-modal-title"
aria-describedby="transition-modal-description"
open={props.open}
animation={true}
centered={true}
onClose={props.handleClose}
closeAfterTransition
BackdropComponent={Backdrop}
BackdropProps={{
timeout: 500,
}}
>
<Zoom in={props.open} style={{ transitionDelay :"0.2ms"}}>
<LoginContainer
handleClose={props.handleClose}
openSignUp={props.openSignUp}
handleLoginInfo={tryLogin}
/>
</Zoom>
</StyledLogin>
</>
)
}
const StyledLogin = styled(Modal)`
margin : 0 !important;
margin-left : 0 !important;
display : flex;
align-items: center;
justify-content : center;
text-align : center;
padding : 10px !important;
border-radius : 4px;
`
...@@ -31,7 +31,7 @@ export default function LoginContainer (props) { ...@@ -31,7 +31,7 @@ export default function LoginContainer (props) {
const [formEmail, setEmail] = useState( const [formEmail, setEmail] = useState(
{ {
key : false, key : false,
value : localStorage.getItem("@portalmec/email") || "", value : localStorage.getItem("@portalmec/uid") || "",
} }
) )
...@@ -59,14 +59,14 @@ export default function LoginContainer (props) { ...@@ -59,14 +59,14 @@ export default function LoginContainer (props) {
key : flag, key : flag,
value : userInput value : userInput
}) })
console.log(formEmail) {/*console.log(formEmail)*/}
} }
else if(type === 'password') { else if(type === 'password') {
setSenha({...formSenha, setSenha({...formSenha,
key : flag, key : flag,
value : userInput value : userInput
}) })
console.log(formSenha) {/*console.log(formSenha)*/}
} }
} }
...@@ -111,7 +111,7 @@ export default function LoginContainer (props) { ...@@ -111,7 +111,7 @@ export default function LoginContainer (props) {
</DialogHeaderStyled> </DialogHeaderStyled>
<DialogContentDiv> <DialogContentDiv>
<SocialConnectDiv> {/*<SocialConnectDiv>
<StyledGoogleLoginButton <StyledGoogleLoginButton
clientId="658977310896-knrl3gka66fldh83dao2rhgbblmd4un9.apps.googleusercontent.com" clientId="658977310896-knrl3gka66fldh83dao2rhgbblmd4un9.apps.googleusercontent.com"
onSuccess={responseGoogle} onSuccess={responseGoogle}
...@@ -120,7 +120,7 @@ export default function LoginContainer (props) { ...@@ -120,7 +120,7 @@ export default function LoginContainer (props) {
> >
<span style={{textTransform:"none", fontSize:"13px", color : "#666"}}>Usando o Google</span> <span style={{textTransform:"none", fontSize:"13px", color : "#666"}}>Usando o Google</span>
</StyledGoogleLoginButton> </StyledGoogleLoginButton>
</SocialConnectDiv> </SocialConnectDiv>*/}
<H3Div> <H3Div>
<H3Styled> <H3Styled>
......
...@@ -64,31 +64,38 @@ export default function LoginModal (props){ ...@@ -64,31 +64,38 @@ export default function LoginModal (props){
password : login.senha password : login.senha
} }
).then( (response) => { ).then( (response) => {
console.log(response)
dispatch ({ dispatch ({
type: "USER_LOGGED_IN", type: "USER_LOGGED_IN",
userLoggedIn: !state.userIsLoggedIn, userLoggedIn: !state.userIsLoggedIn,
login: { login: {
id : response.data.id, id : response.data.data.id,
username : response.data.data.name, username : response.data.data.name,
email : response.data.data.email, email : response.data.data.email,
accessToken : response.headers['access-token'], accessToken : response.headers['access-token'],
clientToken : response.headers.client, clientToken : response.headers.client,
userAvatar : response.data.data.avatar_file_name, userAvatar : response.data.data.avatar_file_name,
userCover : response.data.data.cover_file_name userCover : response.data.data.cover_file_name,
uid : response.data.data.uid,
followCount : response.data.data.follows_count,
collectionsCount : response.data.data.collections_count,
submitter_request : response.data.data.submitter_request
} }
} }
) )
props.handleClose();
props.openSnackbar();
sessionStorage.setItem('@portalmec/accessToken', response.headers['access-token']) sessionStorage.setItem('@portalmec/accessToken', response.headers['access-token'])
sessionStorage.setItem('@portalmec/clientToken', response.headers.client,) sessionStorage.setItem('@portalmec/clientToken', response.headers.client)
sessionStorage.setItem('@portalmec/id', response.data.data.id) sessionStorage.setItem('@portalmec/id', response.data.data.id)
sessionStorage.setItem('@portalmec/username', response.data.data.name) sessionStorage.setItem('@portalmec/username', response.data.data.name)
sessionStorage.setItem('@portalmec/uid', response.data.data.uid) sessionStorage.setItem('@portalmec/uid', response.data.data.uid)
sessionStorage.setItem('@portalmec/senha', login.senha)
if (login.checkboxChecked) { if (login.checkboxChecked) {
localStorage.setItem('@portalmec/email', login.email) localStorage.setItem('@portalmec/email', login.email)
localStorage.setItem('@portalmec/senha', login.senha) //MUDAR ISSO ASAP localStorage.setItem('@portalmec/senha', login.senha) //MUDAR ISSO ASAP
} }
props.handleClose();
props.openSnackbar();
}, (error) => { }, (error) => {
{handleSnackbar(true)} {handleSnackbar(true)}
} }
......
...@@ -114,6 +114,7 @@ export default function MenuBar(props){ ...@@ -114,6 +114,7 @@ export default function MenuBar(props){
{ name: "Favoritos", href: "/perfil", value : '2'}, { name: "Favoritos", href: "/perfil", value : '2'},
{ name: "Coleções", href: "/perfil", value : '3'}, { name: "Coleções", href: "/perfil", value : '3'},
{ name: "Rede", href: "/perfil", value : '4'}, { name: "Rede", href: "/perfil", value : '4'},
{ name: "Curadoria", href: "/perfil", value : '5'},
{ name: "Configurações", href: "/editarperfil"}, { name: "Configurações", href: "/editarperfil"},
] ]
......
...@@ -28,6 +28,7 @@ import { Store } from '../Store'; ...@@ -28,6 +28,7 @@ import { Store } from '../Store';
import { Redirect } from "react-router-dom"; import { Redirect } from "react-router-dom";
import Profile from '../img/default_profile0.png' import Profile from '../img/default_profile0.png'
import styled from 'styled-components' import styled from 'styled-components'
import {apiDomain} from '../env.js'
const iconStyles = { const iconStyles = {
fontSize : "xxx-large", fontSize : "xxx-large",
...@@ -56,6 +57,8 @@ export default function MenuList(props) { ...@@ -56,6 +57,8 @@ export default function MenuList(props) {
const handleLogout = () => { const handleLogout = () => {
localStorage.removeItem('@portalmec/username'); localStorage.removeItem('@portalmec/username');
sessionStorage.removeItem('@portalmec/uid');
sessionStorage.removeItem('@portalmec/senha');
dispatch( { dispatch( {
type: 'USER_LOGGED_OUT', type: 'USER_LOGGED_OUT',
userLoggedOut: !state.userIsLoggedIn, userLoggedOut: !state.userIsLoggedIn,
...@@ -78,16 +81,18 @@ export default function MenuList(props) { ...@@ -78,16 +81,18 @@ export default function MenuList(props) {
onMouseEnter={handleClick} onMouseEnter={handleClick}
> >
<div style={{borderRadius: "50%", border: "2px solid #fff", background: "#fff", overflow: "hidden", maxWidth : "50px", maxHeight : "50px"}}>
{ {
state.currentUser.userAvatar == '' || state.currentUser.userAvatar == null ? state.currentUser.userAvatar == '' || state.currentUser.userAvatar == null ?
( (
<img src={Profile} alt={''} style={{maxWidth:"50px", maxHeight:"50px", borderRadius:"25px"}}/> <img src={Profile} alt={'user avatar'} style={{width:"100%", height:"100%", verticalAlign : "middle", marginLeft : "0"}}/>
): ):
( (
<img src={state.currentUser.userAvatar} alt={''}/> <img src={apiDomain + state.currentUser.userAvatar} alt={'user avatar'} style={{width:"100%", height:"100%", verticalAlign : "middle", marginLeft : "0"}}/>
) )
} }
</div>
<span style={{fontFamily:"inherit", fontWeight:"400", color:"#666"}}>Minha Área </span> <KeyboardArrowDownIcon/> <span style={{fontFamily:"inherit", fontWeight:"400", color:"#666"}}>Minha Área </span> <KeyboardArrowDownIcon/>
</OverrideButton> </OverrideButton>
......
...@@ -40,9 +40,11 @@ const StyledModal = styled(Modal)` ...@@ -40,9 +40,11 @@ const StyledModal = styled(Modal)`
export default function ModarAlterarAvatar (props){ export default function ModarAlterarAvatar (props){
const {state, dispatch} = useContext(Store) const {state, dispatch} = useContext(Store)
const [avatarFile, setFile] = useState('') const [avatarFile, setFile] = useState('')
const handleLoginInfo = (login) => {
const handleUploadAvatar = (img) => {
axios.post(`${apiUrl}`, axios.post(`${apiUrl}`,
{ {
} }
).then( (response) => { ).then( (response) => {
dispatch ({ dispatch ({
...@@ -54,11 +56,6 @@ export default function ModarAlterarAvatar (props){ ...@@ -54,11 +56,6 @@ export default function ModarAlterarAvatar (props){
}) })
} }
const handleFile = (selectorFiles : FileList) => {
console.log(selectorFiles)
{/*setFile()*/}
}
return ( return (
<StyledModal <StyledModal
...@@ -78,7 +75,6 @@ export default function ModarAlterarAvatar (props){ ...@@ -78,7 +75,6 @@ export default function ModarAlterarAvatar (props){
<ComponentAlterarAvatar <ComponentAlterarAvatar
userAvatar={state.currentUser.userAvatar} userAvatar={state.currentUser.userAvatar}
handleFile={handleFile}
handleClose={props.handleClose} handleClose={props.handleClose}
/> />
</Fade> </Fade>
......
import React, {useContext} from 'react';
import Modal from '@material-ui/core/Modal';
import Fade from '@material-ui/core/Fade';
import styled from 'styled-components'
import { Button } from '@material-ui/core';
import Backdrop from '@material-ui/core/Backdrop';
import { Store } from '../Store.js';
import axios from 'axios'
import {apiUrl} from '../env';
import CloseIcon from '@material-ui/icons/Close';
const StyledModal = styled(Modal)`
margin : 0 !important;
margin-left : 0 !important;
display : flex;
align-items: center;
justify-content : center;
text-align : center;
padding : 10px !important;
border-radius : 4px;
max-width : none;
max-height : none;
min-width: 1500px;
min-height: 150px !important;
`
const HeaderDiv = styled.div`
max-width : 100%;
display : flex;
align-items : center;
align-content : center;
`
const ContentContainer = styled.div`
width : 30%;
box-sizing : border-box;
background-color : white;
max-width : none;
align : center;
border-radius : 4px;
font-family : 'Roboto', sans serif;
`
const ButtonCancelar = styled(Button)`
&:hover {
background-color : rgba(158,158,158,0.2) !important;
}
background-color : #fff !important;
color : #666 !important;
text-decoration : none !important;
outline : none !important;
text-align : center !important;
`
const ButtonConfirmar = styled(Button)`
background-color : #00bcd4 !important;
color : #fff !important;
border-radius : 3px !important;
`
export default function IllegalContentModal (props) {
const text = {
header : "Tem certeza que deseja deixar de seguir este usuário?",
explanation : "Este usuário deixará de fazer parte da sua rede."
}
return (
<StyledModal
aria-labelledby="transition-modal-title"
aria-describedby="transition-modal-description"
open={props.open}
animation={true}
centered={true}
onClose={props.handleClose}
closeAfterTransition
BackdropComponent={Backdrop}
BackdropProps={{
timeout: 500,
}}
>
<Fade in={props.open}>
<ContentContainer>
<HeaderDiv>
<span style={{width:"32px"}}/>
<h3 style={{fontSize : "24px", marginTop:"20px", marginBottom:"10px", fontWeight : "normal"}}>
{text.header}
</h3>
<Button style={{marginRight:"0", color:"000"}} onClick={props.handleClose}>
<CloseIcon style={{color:"#666", cursor:"pointer", verticalAlign:"middle"}}/>
</Button>
</HeaderDiv>
<div style={{display : "flex", flexDirection : "column", padding : "20px 30px"}}>
<div style={{marginTop : "0", textAlign : "center", marginBottom : "20px"}}>
<span style={{fontSize : "14px", color : "#666"}}>{text.explanation}</span>
</div>
<div style={{display : "flex", flexDirection : "row", justifyContent: "space-evenly"}}>
<ButtonCancelar onClick={props.handleClose}>CANCELAR</ButtonCancelar>
<ButtonConfirmar onClick={props.handleConfirm}>DEIXAR DE SEGUIR </ButtonConfirmar>
</div>
</div>
</ContentContainer>
</Fade>
</StyledModal>
)
}
import React from 'react' import React from 'react'
import {CompletarCadastroButton} from '../TabPanels/TabPanelSolicitarContaProfessor.js' import {CompletarCadastroButton} from '../TabPanels/UserPageTabs/PanelSolicitarContaProfessor.js'
import FormInput from "../FormInput.js" import FormInput from "../FormInput.js"
export default function Default (props) { export default function Default (props) {
......
import React from 'react' import React from 'react'
import {CompletarCadastroButton} from '../TabPanels/TabPanelSolicitarContaProfessor.js' import {CompletarCadastroButton} from '../TabPanels/UserPageTabs/PanelSolicitarContaProfessor.js'
import FormInput from "../FormInput.js" import FormInput from "../FormInput.js"
export default function Default (props) { export default function Default (props) {
......
import React from 'react' import React from 'react'
import {CompletarCadastroButton} from '../TabPanels/TabPanelSolicitarContaProfessor.js' import {CompletarCadastroButton} from '../TabPanels/UserPageTabs/PanelSolicitarContaProfessor.js'
import FormInput from "../FormInput.js" import FormInput from "../FormInput.js"
export default function Default (props) { export default function Default (props) {
......
/*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
Departamento de Informatica - Universidade Federal do Parana
This file is part of Plataforma Integrada MEC.
Plataforma Integrada MEC is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Plataforma Integrada MEC is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
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, useContext} from 'react'
import styled from 'styled-components'
import Menu from '@material-ui/core/Menu';
import MenuItem from '@material-ui/core/MenuItem';
import ReportIcon from '@material-ui/icons/Error';
import Button from '@material-ui/core/Button';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import ReportModal from './ReportModal.js'
import {Store} from '../Store.js'
export default function ReportButton (props) {
const {state} = useContext(Store)
/*Menu control variables-----------------------------*/
const [anchorEl, setAnchorEl] = React.useState(null);
const handleClick = (event) => {
setAnchorEl(event.currentTarget);
};
const handleClose = () => {
setAnchorEl(null);
};
/*---------------------------------------------------*/
/*modal variables------------------------------------*/
const [reportModal, toggleReportModal] = useState(false)
const [loginModal, toggleLoginModal] = useState(false)
const handleModal = () => {
if (state.currentUser.id) {
toggleReportModal(!reportModal)
}
else {
toggleLoginModal(true)
}
}
/*---------------------------------------------------*/
return (
<>
{
reportModal &&
<ReportModal open={reportModal} handleClose={() => handleModal()} {...props}/>
}
{/*
loginModal &&
<LoginModal open={loginModal} handleClose={() => {toggleLoginModal(false)}}/>
*/}
<Button onClick={handleClick}>
<MoreVertIcon style={{color : "#666"}}/>
</Button>
<StyledMenu
id="simple-menu"
anchorEl={anchorEl}
keepMounted
open={Boolean(anchorEl)}
onClose={handleClose}
style={{borderRadius : "0"}}
>
<MenuItem onClick={() => {handleModal()}} style={{color : "#666"}}>
<ReportIcon/>
<span style={{paddingLeft : "3px"}}>Reportar</span>
</MenuItem>
</StyledMenu>
</>
)
}
const StyledMenu = styled(Menu)`
.MuiPaper-rounded {
border-radius : 0 !important;
}
`