forked from RiseUP/riseup-squad23
atualizar paciente
This commit is contained in:
jp-lima
parent
b9a35be8ee
commit
6e93cb5f14
@ -1,9 +1,7 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
|
||||
|
||||
function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
|
||||
PatientDict = PatientDict || {}
|
||||
function PatientForm({ onSave, onCancel,formData, setFormData }) {
|
||||
|
||||
const FormatTelefones = (valor) => {
|
||||
const digits = String(valor).replace(/\D/g, '').slice(0, 11);
|
||||
@ -66,61 +64,6 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
.replace(/(\d{3})(\d{1,2})$/, '$1-$2');
|
||||
}
|
||||
|
||||
|
||||
const [formData, setFormData] = useState({
|
||||
foto: null,
|
||||
nome:PatientDict.nome,
|
||||
nomeSocial: PatientDict.nome_social,
|
||||
dataNascimento: PatientDict.data_nascimento,
|
||||
genero: PatientDict.sexo,
|
||||
cpf: PatientDict.cpf,
|
||||
profissao: PatientDict.profissao ,
|
||||
nomeMae: PatientDict.nome_mae,
|
||||
profissaoMae: PatientDict.profissao_mae,
|
||||
nomePai: PatientDict.nome_pai,
|
||||
nomeResponsavel: '',
|
||||
cpfResponsavel: '',
|
||||
nomeConjuge: '',
|
||||
outroId: '',
|
||||
cep:PatientDict.endereco?.cep,
|
||||
cidade: PatientDict.endereco?.cidade,
|
||||
estado: PatientDict.endereco?.estado,
|
||||
bairro: PatientDict.endereco?.bairro,
|
||||
rua: PatientDict.endereco?.logradouro,
|
||||
numero: PatientDict.endereco?.numero,
|
||||
complemento: PatientDict.endereco?.complemento,
|
||||
email: PatientDict.contato?.email,
|
||||
telefone1: PatientDict.contato?.telefone1,
|
||||
telefone2: PatientDict.contato?.telefone2,
|
||||
telefone3: PatientDict.contato?.telefone3,
|
||||
observacoes: PatientDict.observacoes,
|
||||
rg: PatientDict.rg,
|
||||
documentoTipo: PatientDict.outros_documentos?.tipo,
|
||||
numeroDocumento: '',
|
||||
etniaRaca: '',
|
||||
naturalidade: '',
|
||||
nacionalidade: '',
|
||||
estadoCivil: '',
|
||||
rnConvenio: false,
|
||||
|
||||
// INFORMAÇÕES MÉDICAS
|
||||
tipoSanguineo: '',
|
||||
peso: '',
|
||||
altura: '',
|
||||
imc: '',
|
||||
alergias: '',
|
||||
|
||||
// INFORMAÇÕES DE CONVÊNIO
|
||||
convenio: '',
|
||||
plano: '',
|
||||
numeroMatricula: '',
|
||||
validadeCarteira: '',
|
||||
validadeIndeterminada: false,
|
||||
pacienteVip: false,
|
||||
|
||||
// ANEXO
|
||||
anexos: null,
|
||||
});
|
||||
|
||||
// Estado para armazenar a URL da foto do avatar
|
||||
const [avatarUrl, setAvatarUrl] = useState(null);
|
||||
@ -155,9 +98,19 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
}, [formData.peso, formData.altura]);
|
||||
|
||||
|
||||
const [enderecoData, setEnderecoData] = useState({})
|
||||
useEffect(() => {setEnderecoData(formData.endereco || {}); console.log(enderecoData)}, [formData.endereco])
|
||||
|
||||
const [contato, setContato] = useState({})
|
||||
|
||||
useEffect(() => {setContato(formData.contato || {})}, [formData.contato])
|
||||
|
||||
|
||||
const handleChange = (e) => {
|
||||
const { name, value, type, checked, files } = e.target;
|
||||
|
||||
|
||||
console.log(enderecoData)
|
||||
|
||||
if (type === 'checkbox') {
|
||||
setFormData({ ...formData, [name]: checked });
|
||||
} else if (type === 'file') {
|
||||
@ -172,19 +125,24 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
reader.readAsDataURL(files[0]);
|
||||
} else if (name === 'foto' && !files[0]) {
|
||||
setAvatarUrl(null); // Limpa o avatar se nenhum arquivo for selecionado
|
||||
}
|
||||
|
||||
} else {
|
||||
setFormData({ ...formData, [name]: value });
|
||||
}
|
||||
}}
|
||||
|
||||
|
||||
if (name.includes('cpf')) {
|
||||
let cpfFormatado = FormatCPF(value);
|
||||
setFormData(prev => ({ ...prev, [name]: cpfFormatado }));
|
||||
|
||||
} else if (name.includes('telefone')) {
|
||||
let telefoneFormatado = FormatTelefones(value);
|
||||
setFormData(prev => ({ ...prev, [name]: telefoneFormatado }));
|
||||
setContato(prev => ({ ...prev, [name]: telefoneFormatado }));
|
||||
}
|
||||
|
||||
if (name === 'email') {
|
||||
setContato(prev => ({ ...prev, email: value }));
|
||||
}else if(name.includes('endereco')) {
|
||||
setEnderecoData(prev => ({ ...prev, [name.split('.')[1]]: value }));
|
||||
}else{
|
||||
setFormData({ ...formData, [name]: value });}
|
||||
};
|
||||
|
||||
const handleCepBlur = async () => {
|
||||
@ -211,35 +169,31 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!formData.nome || !formData.cpf || !formData.genero || !formData.dataNascimento){
|
||||
alert('Por favor, preencha Nome ,CPF, Gênero e data de nascimento.');
|
||||
|
||||
if (!formData.nome || !formData.cpf || !formData.sexo || !formData.data_nascimento){
|
||||
alert('Por favor, preencha Nome ,CPF, Gênero e data de nascimento.');
|
||||
}
|
||||
|
||||
const CPFinvalido = await ValidarCPF(formData.cpf)
|
||||
console.log(CPFinvalido)
|
||||
if(CPFinvalido[0] === true){
|
||||
alert(CPFinvalido[1])
|
||||
return
|
||||
|
||||
}
|
||||
return}
|
||||
|
||||
onSave({
|
||||
...formData,
|
||||
endereco: {
|
||||
cep: formData.cep,
|
||||
cidade: formData.cidade,
|
||||
estado: formData.estado,
|
||||
bairro: formData.bairro,
|
||||
logradouro: formData.rua,
|
||||
numero: formData.numero,
|
||||
complemento: formData.complemento,
|
||||
cep: enderecoData.cep,
|
||||
cidade: enderecoData.cidade,
|
||||
estado: enderecoData.estado,
|
||||
bairro: enderecoData.bairro,
|
||||
logradouro: enderecoData.logradouro,
|
||||
numero: enderecoData.numero,
|
||||
complemento: enderecoData.complemento,
|
||||
},
|
||||
contato: {
|
||||
email: formData.email,
|
||||
telefone1: formData.telefone1,
|
||||
telefone2: formData.telefone2,
|
||||
telefone3: formData.telefone3,
|
||||
email: contato.email,
|
||||
telefone1: contato.telefone1,
|
||||
telefone2: contato.telefone2,
|
||||
telefone3: contato.telefone3,
|
||||
},
|
||||
infoMedicas: {
|
||||
tipoSanguineo: formData.tipoSanguineo,
|
||||
@ -316,19 +270,19 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
{/* CADASTRO */}
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Nome: *</label>
|
||||
<input type="text" className="form-control" name="nome" value={PatientDict.nome} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="nome" value={formData.nome} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Nome social:</label>
|
||||
<input type="text" className="form-control" name="nomeSocial" value={formData.nomeSocial} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="nome_social" value={formData.nome_social} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Data de nascimento: *</label>
|
||||
<input type="date" className="form-control" name="dataNascimento" value={formData.dataNascimento} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="date" className="form-control" name="data_nascimento" value={formData.data_nascimento} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Gênero: *</label>
|
||||
<select className="form-control" name="genero" value={formData.genero} onChange={handleChange} style={{ fontSize: '1.1rem' }}>
|
||||
<select className="form-control" name="sexo" value={formData.sexo} onChange={handleChange} style={{ fontSize: '1.1rem' }}>
|
||||
<option value="">Selecione</option>
|
||||
<option value="Masculino">Masculino</option>
|
||||
<option value="Feminino">Feminino</option>
|
||||
@ -354,7 +308,7 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Número do documento:</label>
|
||||
<input type="text" className="form-control" name="numeroDocumento" value={formData.numeroDocumento} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="numero_documento" value={formData.numero_documento} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Etnia e Raça:</label>
|
||||
@ -381,7 +335,7 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Estado civil:</label>
|
||||
<select className="form-control" name="estadoCivil" value={formData.estadoCivil} onChange={handleChange} style={{ fontSize: '1.1rem' }}>
|
||||
<select className="form-control" name="estado_civil" value={formData.estado_civil} onChange={handleChange} style={{ fontSize: '1.1rem' }}>
|
||||
<option value="">Selecione</option>
|
||||
<option value="Solteiro">Solteiro(a)</option>
|
||||
<option value="Casado">Casado(a)</option>
|
||||
@ -391,31 +345,31 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Nome da Mãe:</label>
|
||||
<input type="text" className="form-control" name="nomeMae" value={formData.nomeMae} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="nomeMae" value={formData.nome_mae} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Profissão da mãe:</label>
|
||||
<input type="text" className="form-control" name="profissaoMae" value={formData.profissaoMae} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="profissaoMae" value={formData.profissao_mae} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Nome do Pai:</label>
|
||||
<input type="text" className="form-control" name="nomePai" value={formData.nomePai} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="nomePai" value={formData.nome_pai} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Profissão do pai:</label>
|
||||
<input type="text" className="form-control" name="profissaoPai" value={formData.profissaoPai} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="profissaoPai" value={formData.profissao_pai} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Nome do responsável:</label>
|
||||
<input type="text" className="form-control" name="nomeResponsavel" value={formData.nomeResponsavel} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="nomeResponsavel" value={formData.nome_responsavel} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>CPF do responsável:</label>
|
||||
<input type="text" className="form-control" name="cpfResponsavel" value={formData.cpfResponsavel} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="cpfResponsavel" value={formData.cpf_responsavel} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Nome do esposo(a):</label>
|
||||
<input type="text" className="form-control" name="nomeConjuge" value={formData.nomeConjuge} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="nomeConjuge" value={formData.nome_conjuge} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Identificador de outro sistema:</label>
|
||||
@ -557,31 +511,31 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
<div className="row mt-3">
|
||||
<div className="col-md-4 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>CEP:</label>
|
||||
<input type="text" className="form-control" name="cep" value={formData.cep} onChange={handleChange} onBlur={handleCepBlur} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="endereco.cep" value={enderecoData.cep} onChange={handleChange} onBlur={handleCepBlur} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-8 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Rua:</label>
|
||||
<input type="text" className="form-control" name="rua" value={formData.rua} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="endereco.logradouro" value={enderecoData.logradouro} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Bairro:</label>
|
||||
<input type="text" className="form-control" name="bairro" value={formData.bairro} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="endereco.bairro" value={enderecoData.bairro} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-4 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Cidade:</label>
|
||||
<input type="text" className="form-control" name="cidade" value={formData.cidade} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="endereco.cidade" value={enderecoData.cidade} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-2 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Estado:</label>
|
||||
<input type="text" className="form-control" name="estado" value={formData.estado} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="endereco.estado" value={enderecoData.estado} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-4 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Número:</label>
|
||||
<input type="text" className="form-control" name="numero" value={formData.numero} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="endereco.numero" value={enderecoData.numero} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-8 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Complemento:</label>
|
||||
<input type="text" className="form-control" name="complemento" value={formData.complemento} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="endereco.complemento" value={enderecoData.complemento} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -598,20 +552,20 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
|
||||
<div className={`collapse${collapsedSections.contato ? ' show' : ''}`}>
|
||||
<div className="row mt-3">
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Email: *</label>
|
||||
<input type="email" className="form-control" name="email" value={formData.email} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<label style={{ fontSize: '1.1rem' }}>Email:</label>
|
||||
<input type="email" className="form-control" name="email" value={contato.email || ''} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Telefone: *</label>
|
||||
<input type="text" className="form-control" name="telefone1" value={formData.telefone1} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<label style={{ fontSize: '1.1rem' }}>Telefone:</label>
|
||||
<input type="text" className="form-control" name="telefone1" value={contato.telefone1 || ''} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Telefone 2:</label>
|
||||
<input type="text" className="form-control" name="telefone2" value={formData.telefone2} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="telefone2" value={contato.telefone2 || ''} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<label style={{ fontSize: '1.1rem' }}>Telefone 3:</label>
|
||||
<input type="text" className="form-control" name="telefone3" value={formData.telefone3} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
<input type="text" className="form-control" name="telefone3" value={contato.telefone3 || ''} onChange={handleChange} style={{ fontSize: '1.1rem' }} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -23,9 +23,28 @@ fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${id}`, requestOpt
|
||||
.catch(error => console.log('error', error));
|
||||
|
||||
}, [])
|
||||
const HandlePutPatient = () => {
|
||||
|
||||
console.log('paciente atualizado')
|
||||
const HandlePutPatient = () => {
|
||||
alert(`Atualizando paciente "${PatientToPUT.nome}" com sucesso`)
|
||||
var myHeaders = new Headers();
|
||||
myHeaders.append("Authorization", "Bearer <token>");
|
||||
myHeaders.append("Content-Type", "application/json");
|
||||
|
||||
var raw = JSON.stringify(PatientToPUT)
|
||||
|
||||
console.log(PatientToPUT)
|
||||
|
||||
var requestOptions = {
|
||||
method: 'PUT',
|
||||
headers: myHeaders,
|
||||
body: raw,
|
||||
redirect: 'follow'
|
||||
};
|
||||
|
||||
fetch("https://mock.apidog.com/m1/1053378-0-default/pacientes/", requestOptions)
|
||||
.then(response => response.text())
|
||||
.then(result => console.log('ATUALIZADO COM SUCESSO',result))
|
||||
.catch(error => console.log('error', error));
|
||||
|
||||
}
|
||||
|
||||
@ -41,8 +60,9 @@ fetch(`https://mock.apidog.com/m1/1053378-0-default/pacientes/${id}`, requestOpt
|
||||
<PatientForm
|
||||
onSave={HandlePutPatient}
|
||||
onCancel={console.log('Não atualizar')}
|
||||
PatientDict={PatientToPUT}
|
||||
|
||||
|
||||
formData={PatientToPUT}
|
||||
setFormData={setPatientPUT}
|
||||
/>
|
||||
|
||||
</div>
|
||||
|
||||
@ -8,7 +8,7 @@ function FormLayout( ) {
|
||||
// Este estado vai controlar qual "tela" mostrar: 'list' (lista) ou 'form' (formulário)
|
||||
const [view, setView] = useState('form');
|
||||
|
||||
|
||||
const [formData, setFormData] = useState({})
|
||||
var myHeaders = new Headers();
|
||||
myHeaders.append("Content-Type", "application/json");
|
||||
|
||||
@ -55,8 +55,8 @@ function FormLayout( ) {
|
||||
<PatientForm
|
||||
onSave={handleSavePatient}
|
||||
onCancel={() => setView('list')}
|
||||
PatientDict={{}}
|
||||
|
||||
formData={formData}
|
||||
setFormData={setFormData}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user