diff --git a/src/Admin/Components/Components/Inputs/NoteVarInputs.js b/src/Admin/Components/Components/Inputs/NoteVarInputs.js index d3024823743e3d3214f7d54c49f702954aa5b20c..653eb1f283a08746551f1de0b2f0a60d0f075ecf 100644 --- a/src/Admin/Components/Components/Inputs/NoteVarInputs.js +++ b/src/Admin/Components/Components/Inputs/NoteVarInputs.js @@ -18,51 +18,103 @@ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/> import React, { useState } from 'react'; import TextField from '@material-ui/core/TextField'; -const NoteVarInputs = ( props ) => { +const NoteVarInputs = (props) => { - const [name , setName] = useState(props.editInfo.name) - const [code , setCode] = useState(props.editInfo.code) - const [weight , setWeight] = useState(props.editInfo.weight) + const [name, setName] = useState(props.editInfo.name) + const [code, setCode] = useState(props.editInfo.code) + const [weight, setWeight] = useState(props.editInfo.weight) + + const [errorInName, setErrorInName] = useState({ + error: false, + message: '' + }) + + const [errorInCode, setErrorInCode] = useState({ + error: false, + message: '' + }) + + const [errorInWeight, setErrorInWeight] = useState({ + error: false, + message: '' + }) + + const NameHandler = (e) => { + if (errorInName.error) { + setErrorInName({ + error: false, + message: '' + }) + } + setName(e.target.value) + } + + const CodeHandler = (e) => { + if (errorInCode.error) { + setErrorInCode({ + error: false, + message: '' + }) + } + setCode(e.target.value) + } + + const WeightHandler = (e) => { + if (errorInWeight.error) { + setErrorInWeight({ + error: false, + message: '' + }) + } + setWeight(e.target.value) + } + + const isEmpty = (text) => { + return text.length === 0 ? true : false; + } + + const fields = [ + { + label: 'Nome', + value: name, + error: errorInName.error, + errorMessage: errorInName.message, + onChange: (event) => NameHandler(event) + }, + { + label: 'Código', + value: code, + error: errorInCode.error, + errorMessage: errorInCode.message, + onChange: (event) => CodeHandler(event) + }, + { + label: 'Peso', + value: weight, + error: errorInWeight.error, + errorMessage: errorInWeight.message, + onChange: (event) => WeightHandler(event) + } + ] return ( - <form style={{width : '25%' , display: 'flex' , flexDirection : 'column'}}> - <TextField - id="outlined-input" - label="ID *não pode mudar" - defaultValue={props.editInfo.id} //valor recebido por prop - variant="outlined" - disabled={true} - /> - <div style={{ height: '1em' }} /> - - <TextField - id="outlined-input" - label="Nome" - value={name} - onChange={e => setName(e.target.value)} - variant="outlined" - /> - <div style={{ height: '1em' }} /> - - <TextField - id="outlined-input" - label="Código" - value={code} - onChange={e => setCode(e.target.value)} - variant="outlined" - /> - <div style={{ height: '1em' }} /> - - <TextField - id="outlined-input" - label="Peso" - value={weight} - onChange={e => setWeight(e.target.value)} - variant="outlined" - /> - <div style={{ height: '1em' }} /> - - </form> + <div> + <form style={{ display: 'flex', flexDirection: 'column' }}> + {fields.map((field, index) => ( + <TextField + key={index} + error={field.error} + helperText={field.error ? field.errorMessage : ''} + style={{ width: '250px', marginBottom: '1em' }} + label={field.label} + value={field.value} + onChange={field.onChange} + type="search" + multiline={true} + /> + ))} + </form> + </div> ) }