diff --git a/src/Components/ReportModal.js b/src/Components/ReportModal.js
index 5843515ef66f7226201576bbf327af6563c8ddbf..349eb13ab30e318488d53c69cb30a8e3e65bbbce 100644
--- a/src/Components/ReportModal.js
+++ b/src/Components/ReportModal.js
@@ -27,7 +27,8 @@ import {Store} from '../Store.js'
import axios from 'axios'
import {apiUrl} from '../env';
import CloseIcon from '@material-ui/icons/Close';
-import ReportForm from './ReportForm.js'
+import ReportUserForm from './ReportUserForm.js'
+import ReportRecursoForm from './ReportRecursoForm.js'
function CloseModalButton (props) {
return (
@@ -69,6 +70,20 @@ export default function ReportModal (props) {
*/}
}
+ const renderForm = (formType) => {
+ switch (formType) {
+ case 'recurso':
+ return (
+ <ReportRecursoForm handleClose={props.handleClose} handleSubmit={handleSubmit}/>
+ )
+ break;
+ default:
+ return (
+ <ReportUserForm handleClose={props.handleClose} handleSubmit={handleSubmit}/>
+ )
+ }
+ }
+
return (
<StyledModal
aria-labelledby="transition-modal-title"
@@ -92,7 +107,9 @@ export default function ReportModal (props) {
</Header>
<Content>
- <ReportForm handleClose={props.handleClose} handleSubmit={handleSubmit}/>
+ {
+ renderForm(props.form)
+ }
</Content>
</ReportContainer>
</Fade>
@@ -118,7 +135,7 @@ const Header = styled.div`
h2 {
font-size : 26px;
font-weight : lighter;
-
+ color : #666
}
`
diff --git a/src/Components/ReportRecursoForm.js b/src/Components/ReportRecursoForm.js
new file mode 100644
index 0000000000000000000000000000000000000000..e327503047237c929f0e4167b486d6c8900372eb
--- /dev/null
+++ b/src/Components/ReportRecursoForm.js
@@ -0,0 +1,103 @@
+/*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} from 'react';
+import { Button } from '@material-ui/core';
+import styled from 'styled-components'
+import Radio from '@material-ui/core/Radio';
+import RadioGroup from '@material-ui/core/RadioGroup';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
+import FormControl from '@material-ui/core/FormControl';
+import TextField from '@material-ui/core/TextField';
+import {StyledFormControl, StyledTextField, ButtonsDiv, ButtonCancelar, ButtonEnviar} from './ReportUserForm.js'
+
+export default function ReportRecursoForm (props) {
+ const [value, setValue] = React.useState(-1);
+
+ const handleChange = (event) => {
+ setValue(event.target.value);
+ };
+
+ /*values are set according to backend complaint id*/
+ const [options] = React.useState([
+ {value : "1", text : 'O Recurso viola os direitos autorais.'},
+ {value : "2", text : 'O Recurso contém conteúdo ofensivo/abusivo.'},
+ {value : "5", text : 'A descrição do Recurso não corresponde ao seu conteúdo.'}
+ ])
+
+ const [moreInfo, setMoreInfo] = React.useState({
+ key : false,
+ value : "",
+ })
+
+ const handleChangeMoreInfo = (e) => {
+ const userInput = e.target.value
+
+ const flag = userInput.length > 150 ? true : false
+
+ setMoreInfo({...moreInfo,
+ key : flag,
+ value : userInput
+ })
+ }
+
+ const handleSubmit = (e) => {
+ e.preventDefault()
+ const finalRadioValue = value
+ const finalMoreInfo = moreInfo
+
+ if( finalRadioValue != -1 && !(finalMoreInfo.key)) {
+ props.handleSubmit(finalRadioValue, finalMoreInfo.value)
+ }
+ else {
+ console.log('oops')
+ }
+ }
+
+ return (
+ <form onSubmit={(e) => handleSubmit(e)} style={{textAlign : "left"}}>
+ <StyledFormControl component="fieldset">
+ <RadioGroup value={value} onChange={handleChange}>
+ {
+ options.map(option =>
+ <FormControlLabel value={option.value} control={<Radio color="orange"/>} label={option.text} />
+ )
+ }
+ </RadioGroup>
+ </StyledFormControl>
+
+ <StyledTextField
+ id = {"report-text-field"}
+ label={"Escreva mais sobre o problema"}
+ value = {moreInfo.value}
+ onChange = {e => handleChangeMoreInfo(e)}
+ helperText = {moreInfo.value.length + '/150'}
+ multiline={true}
+ rowsMax = {"5"}
+ error = {moreInfo.key}
+ required = {false}
+ helperText ={moreInfo.value.length + '/150'}
+ style={{width : "100%"}}
+ />
+
+ <ButtonsDiv>
+ <ButtonCancelar onClick={props.handleClose}>CANCELAR</ButtonCancelar>
+ <ButtonEnviar type="submit">ENVIAR</ButtonEnviar>
+ </ButtonsDiv>
+ </form>
+ )
+}
diff --git a/src/Components/ReportForm.js b/src/Components/ReportUserForm.js
similarity index 94%
rename from src/Components/ReportForm.js
rename to src/Components/ReportUserForm.js
index a7ed304a4ed7161b865c0abdd97448c6eb6986b1..d1857f7c04348cc18e03f9a1d1f823a723bf1142 100644
--- a/src/Components/ReportForm.js
+++ b/src/Components/ReportUserForm.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, {useContext} from 'react';
+import React, {useState, useContext} from 'react';
import { Button } from '@material-ui/core';
import styled from 'styled-components'
import Radio from '@material-ui/core/Radio';
@@ -101,14 +101,14 @@ export default function ReportForm (props) {
);
}
-const ButtonsDiv = styled.div`
+export const ButtonsDiv = styled.div`
display : flex;
flex-direction : row;
justify-content : flex-end;
align-items : center;
`
-const ButtonCancelar = styled(Button)`
+export const ButtonCancelar = styled(Button)`
&:hover {
background-color : rgba(158,158,158,0.2) !important;
}
@@ -123,7 +123,7 @@ const ButtonCancelar = styled(Button)`
height : 36px !important;
`
-const ButtonEnviar = styled(Button)`
+export const ButtonEnviar = styled(Button)`
background-color : #ff7f00 !important;
color : #fff !important;
font-size: 14px !important;
@@ -144,7 +144,7 @@ const ButtonEnviar = styled(Button)`
padding-left : 16px;
}
`
-const StyledTextField = styled(TextField)`
+export const StyledTextField = styled(TextField)`
.MuiFormHelperText-root {
text-align : right;
}
@@ -162,16 +162,17 @@ const StyledTextField = styled(TextField)`
}
`
-const StyledFormControl = styled(FormControl)`
+export const StyledFormControl = styled(FormControl)`
.MuiFormControlLabel-root {
color : #666;
}
.MuiIconButton-label {
color : #666;
}
- .PrivateRadioButtonIcon-checked-327 {
+ .PrivateRadioButtonIcon-checked {
color : orange;
}
+
.MuiTypography-body1 {
font-size : 14px;
}