package-lock.json

@@ -25,7 +25,6 @@
         "react": "^18.2.0",
         "react-apexcharts": "^1.7.0",
         "react-bootstrap": "^2.10.10",
-        "react-bootstrap-icons": "^1.11.6",
         "react-dom": "^18.2.0",
         "react-flatpickr": "^4.0.11",
         "react-input-mask": "^2.0.4",
@@ -30402,18 +30401,6 @@
         }
       }
     },
-    "node_modules/react-bootstrap-icons": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/react-bootstrap-icons/-/react-bootstrap-icons-1.11.6.tgz",
-      "integrity": "sha512-ycXiyeSyzbS1C4+MlPTYe0riB+UlZ7LV7YZQYqlERV2cxDiKtntI0huHmP/3VVvzPt4tGxqK0K+Y6g7We3U6tQ==",
-      "license": "MIT",
-      "dependencies": {
-        "prop-types": "^15.7.2"
-      },
-      "peerDependencies": {
-        "react": ">=16.8.6"
-      }
-    },
     "node_modules/react-dev-utils": {
       "version": "12.0.1",
       "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz",

package.json

@@ -20,7 +20,6 @@
     "react": "^18.2.0",
     "react-apexcharts": "^1.7.0",
     "react-bootstrap": "^2.10.10",
-    "react-bootstrap-icons": "^1.11.6",
     "react-dom": "^18.2.0",
     "react-flatpickr": "^4.0.11",
     "react-input-mask": "^2.0.4",

src/components/patients/PatientForm.jsx

@@ -1,31 +1,43 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState } from 'react';
 import InputMask from "react-input-mask";
 
 function PatientForm({ onSave, onCancel, PatientDict }) {
 
+
   const FormatTelefones = (valor) => {
-    const digits = String(valor).replace(/\D/g, '').slice(0, 11);
+
-    return digits
+   const digits = String(valor).replace(/\D/g, '').slice(0, 11);
-      .replace(/(\d)/, '($1')
+
-      .replace(/(\d{2})(\d)/, '$1) $2' )
+  
-      .replace(/(\d)(\d{4})/, '$1 $2')
+  return digits
-      .replace(/(\d{4})(\d{4})/, '$1-$2')
+    .replace(/(\d)/, '($1')   // 123 -> 123.
+    .replace(/(\d{2})(\d)/, '$1) $2' )
+    .replace(/(\d)(\d{4})/, '$1 $2')
+    .replace(/(\d{4})(\d{4})/, '$1-$2')
   }
 
+
   const FormatCPF = (valor) => {
-    const digits = String(valor).replace(/\D/g, '').slice(0, 11);
+  
-    return digits
+  const digits = String(valor).replace(/\D/g, '').slice(0, 11);
-      .replace(/(\d{3})(\d)/, '$1.$2')
+
-      .replace(/(\d{3})(\d)/, '$1.$2')
+
-      .replace(/(\d{3})(\d{1,2})$/, '$1-$2');
+  
+  return digits
+    .replace(/(\d{3})(\d)/, '$1.$2')   // 123 -> 123.
+    .replace(/(\d{3})(\d)/, '$1.$2')   // 123.456 -> 123.456.
+    .replace(/(\d{3})(\d{1,2})$/, '$1-$2'); // 123.456.789 -> 123.456.789-01
+    
   }
 
+
   const [formData, setFormData] = useState({
-    foto: null,
     nome: PatientDict.nome,
     nomeSocial: PatientDict.nome_social,
     dataNascimento: PatientDict.data_nascimento,
     genero: PatientDict.sexo,
+    documento: '',
+    numeroDocumento: '',
     cpf: PatientDict.cpf,
     profissao: PatientDict.profissao ,
     nomeMae: PatientDict.nome_mae,
@@ -47,102 +59,50 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
     telefone1: PatientDict.celular,
     telefone2: '',
     telefone3: '',
-    observacoes: '',
+    observacoes: ''
-    rg: '',
-    documentoTipo: '',
-    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, // NOVO CAMPO ADICIONADO
-
-    // ANEXO
-    anexos: null,
   });
 
-  // Estado para armazenar a URL da foto do avatar
-  const [avatarUrl, setAvatarUrl] = useState(null);
-
-  // Estado para controlar quais seções estão colapsadas
-  const [collapsedSections, setCollapsedSections] = useState({
-    dadosPessoais: true, // Alterado para true para a seção ficar aberta por padrão
-    infoMedicas: false,
-    infoConvenio: false,
-    endereco: false,
-    contato: false,
-    infoAdicionais: false,
-    anexos: false,
-  });
-
-  // Função para alternar o estado de colapso de uma seção
-  const handleToggleCollapse = (section) => {
-    setCollapsedSections(prevState => ({
-      ...prevState,
-      [section]: !prevState[section]
-    }));
-  };
-
-  // Lógica para calcular o IMC
-  useEffect(() => {
-    const peso = parseFloat(formData.peso);
-    const altura = parseFloat(formData.altura);
-    if (peso > 0 && altura > 0) {
-      const imcCalculado = peso / (altura * altura);
-      setFormData(prev => ({ ...prev, imc: imcCalculado.toFixed(2) }));
-    } else {
-      setFormData(prev => ({ ...prev, imc: '' }));
-    }
-  }, [formData.peso, formData.altura]);
-
-
   const handleChange = (e) => {
-    const { name, value, type, checked, files } = e.target;
+    const { name, value } = e.target;
+    setFormData({
+      ...formData,
+      [name]: value
+    });
+
+
+    if(name.includes('cpf')){
+
+      let cpfFormatado = FormatCPF(e.target.value)
+
+      setFormData({...formData,
+      [name]: cpfFormatado,}
+      )}
+
+      else if(name.includes('telefone')){
+      let telefoneFormatado = FormatTelefones(value)
+
+      console.log(telefoneFormatado)
+      
+
+
+      setFormData({...formData,
+        [name]: telefoneFormatado
+      })
+    }
+
+   else if(name.includes('cep')){
+    const digitsCep = String(value).replace(/\D/g, '').slice(0, 8);
+    setFormData({...formData,
+    [name]: digitsCep
+      })
+     }
+
     
-    if (type === 'checkbox') {
-      setFormData({ ...formData, [name]: checked });
-    } else if (type === 'file') {
-      setFormData({ ...formData, [name]: files[0] });
 
-      // Lógica para pré-visualizar a imagem no avatar
+    };
-      if (name === 'foto' && files[0]) {
-        const reader = new FileReader();
-        reader.onloadend = () => {
-          setAvatarUrl(reader.result);
-        };
-        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 }));
-    }
-  };
  
+  // Função para buscar endereço pelo CEP
   const handleCepBlur = async () => {
     const cep = formData.cep.replace(/\D/g, '');
     if (cep.length === 8) {
@@ -167,423 +127,189 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
   };
 
   const handleSubmit = () => {
-    if (!formData.nome || !formData.cpf || !formData.genero || !formData.dataNascimento){
+    if (!formData.nome || !formData.cpf || !formData.genero || !formData.dataNascimento || !formData.email||!formData.telefone1){
-      alert('Por favor, preencha Nome ,CPF, Gênero e data de nascimento.');
+      alert('Por favor, preencha: Nome ,CPF, Gênero, Data de nascimento, telefone e Email.');
       return;
     }
 
-    onSave({
+    onSave(
-      ...formData,
+    {nome: formData.nome,
-      endereco: {
+  nomeSocial: formData.nomeSocial,
-        cep: formData.cep,
+  dataNascimento: formData.dataNascimento,
-        cidade: formData.cidade,
+  genero: formData.genero,
-        estado: formData.estado,
+  documento: formData.documento,
-        bairro: formData.bairro,
+  numeroDocumento: formData.numeroDocumento,
-        logradouro: formData.rua,
+  cpf: formData.cpf,
-        numero: formData.numero,
+  profissao: formData.profissao,
-        complemento: formData.complemento,
+  nomeMae: formData.nomeMae,
-      },
+  profissaoMae: formData.profissaoMae,
-      contato: {
+  nomePai: formData.nomePai,
-        email: formData.email,
+  profissaoPai: formData.profissaoPai,
-        telefone1: formData.telefone1,
+  nomeResponsavel: formData.nomeResponsavel,
-        telefone2: formData.telefone2,
+  cpfResponsavel: formData.cpfResponsavel,
-        telefone3: formData.telefone3,
+  nomeConjuge: formData.nomeConjuge,
-      },
+  outroId: formData.outroId,
-      infoMedicas: {
+  endereco: {
-        tipoSanguineo: formData.tipoSanguineo,
+    cep: formData.cep,
-        peso: formData.peso,
+    cidade: formData.cidade,
-        altura: formData.altura,
+    estado: formData.estado,
-        imc: formData.imc,
+    bairro: formData.bairro,
-        alergias: formData.alergias,
+    logradouro: formData.rua,
-      },
+    numero: formData.numero,
-      infoConvenio: {
+    complemento: formData.complemento,
-        convenio: formData.convenio,
+  },
-        plano: formData.plano,
+
-        numeroMatricula: formData.numeroMatricula,
+  contato: {
-        validadeCarteira: formData.validadeCarteira,
+    email: formData.email,
-        validadeIndeterminada: formData.validadeIndeterminada,
+    telefone1: formData.telefone1,
-        pacienteVip: formData.pacienteVip, // Adicionando o novo campo
+    telefone2: formData.telefone2,
-      },
+    telefone3: formData.telefone3,
-    });
+  },
+
+  observacoes: formData.observacoes,
+}
+
+      
+    );
   };
 
   return (
     <div className="card p-3">
-      <h3 className="mb-3 text-center">MedicoConnect</h3>
+      <h3 className="mb-3 text-center">MediConnect</h3>
 
-      {/* DADOS PESSOAIS */}
+      {/* ------------------ DADOS PESSOAIS ------------------ */}
-      <div className="mb-3">
+      <h5 className="mb-3">Dados Pessoais</h5>
-        <h5 className="mb-0 cursor-pointer d-flex justify-content-between align-items-center" onClick={() => handleToggleCollapse('dadosPessoais')}>
+      <div className="row">
-          Dados Pessoais
+        <div className="col-md-6 mb-3">
-          <span className="fs-5">
+          <label>Nome: *</label>
-            {collapsedSections.dadosPessoais ? '▲' : '▼'}
+          <input type="text" className="form-control" name="nome" value={formData.nome} onChange={handleChange} />
-          </span>
-        </h5>
-        <div className={`collapse${collapsedSections.dadosPessoais ? ' show' : ''}`}>
-          <div className="row mt-3">
-            {/* AVATAR E INPUT DE FOTO */}
-            <div className="col-md-6 mb-3 d-flex align-items-center">
-              <div className="me-3">
-                {avatarUrl ? (
-                  <img 
-                    src={avatarUrl} 
-                    alt="Avatar do Paciente" 
-                    style={{ width: '80px', height: '80px', borderRadius: '50%', objectFit: 'cover' }} 
-                  />
-                ) : (
-                  <div 
-                    style={{ 
-                      width: '80px', 
-                      height: '80px', 
-                      borderRadius: '50%', 
-                      backgroundColor: '#e0e0e0', 
-                      display: 'flex', 
-                      alignItems: 'center', 
-                      justifyContent: 'center',
-                      fontSize: '3rem',
-                      color: '#9e9e9e'
-                    }}
-                  >
-                    &#x2624; 
-                  </div>
-                )}
-              </div>
-              <div>
-                <label htmlFor="foto-input" className="btn btn-primary">Carregar Foto</label>
-                <input 
-                  type="file" 
-                  className="form-control d-none" 
-                  name="foto" 
-                  id="foto-input" 
-                  onChange={handleChange} 
-                  accept="image/*"
-                />
-                {formData.foto && <span className="ms-2">{formData.foto.name}</span>}
-              </div>
-            </div>
-            {/* CADASTRO */}
-            <div className="col-md-6 mb-3">
-              <label>Nome: *</label>
-              <input type="text" className="form-control" name="nome" value={formData.nome} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Nome social:</label>
-              <input type="text" className="form-control" name="nomeSocial" value={formData.nomeSocial} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Data de nascimento: *</label>
-              <input type="date" className="form-control" name="dataNascimento" value={formData.dataNascimento} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Gênero: *</label>
-              <select className="form-control" name="genero" value={formData.genero} onChange={handleChange}>
-                <option value="">Selecione</option>
-                <option value="Masculino">Masculino</option>
-                <option value="Feminino">Feminino</option>
-                <option value="Outro">Outro</option>
-              </select>
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>CPF: *</label>
-              <input type="text" className="form-control" name="cpf" value={formData.cpf} onChange={ handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>RG:</label>
-              <input type="text" className="form-control" name="rg" value={formData.rg} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Outros documentos:</label>
-              <select className="form-control" name="documentoTipo" value={formData.documentoTipo} onChange={handleChange}>
-                <option value="">Selecione</option>
-                <option value="CNH">CNH</option>
-                <option value="Passaporte">Passaporte</option>
-              </select>
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Número do documento:</label>
-              <input type="text" className="form-control" name="numeroDocumento" value={formData.numeroDocumento} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Etnia e Raça:</label>
-              <select className="form-control" name="etniaRaca" value={formData.etniaRaca} onChange={handleChange}>
-                <option value="">Selecione</option>
-                <option value="Branca">Branca</option>
-                <option value="Preta">Preta</option>
-                <option value="Parda">Parda</option>
-                <option value="Amarela">Amarela</option>
-                <option value="Indígena">Indígena</option>
-              </select>
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Naturalidade:</label>
-              <input type="text" className="form-control" name="naturalidade" value={formData.naturalidade} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Nacionalidade:</label>
-              <input type="text" className="form-control" name="nacionalidade" value={formData.nacionalidade} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Profissão:</label>
-              <input type="text" className="form-control" name="profissao" value={formData.profissao} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Estado civil:</label>
-              <select className="form-control" name="estadoCivil" value={formData.estadoCivil} onChange={handleChange}>
-                <option value="">Selecione</option>
-                <option value="Solteiro">Solteiro(a)</option>
-                <option value="Casado">Casado(a)</option>
-                <option value="Divorciado">Divorciado(a)</option>
-                <option value="Viuvo">Viúvo(a)</option>
-              </select>
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Nome da Mãe:</label>
-              <input type="text" className="form-control" name="nomeMae" value={formData.nomeMae} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Profissão da mãe:</label>
-              <input type="text" className="form-control" name="profissaoMae" value={formData.profissaoMae} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Nome do Pai:</label>
-              <input type="text" className="form-control" name="nomePai" value={formData.nomePai} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Profissão do pai:</label>
-              <input type="text" className="form-control" name="profissaoPai" value={formData.profissaoPai} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Nome do responsável:</label>
-              <input type="text" className="form-control" name="nomeResponsavel" value={formData.nomeResponsavel} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>CPF do responsável:</label>
-              <input type="text" className="form-control" name="cpfResponsavel" value={formData.cpfResponsavel} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Nome do esposo(a):</label>
-              <input type="text" className="form-control" name="nomeConjuge" value={formData.nomeConjuge} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Identificador de outro sistema:</label>
-              <input type="text" className="form-control" name="outroId" value={formData.outroId} onChange={handleChange} />
-            </div>
-            <div className="col-md-12 mb-3">
-              <div className="form-check">
-                <input className="form-check-input" type="checkbox" name="rnConvenio" checked={formData.rnConvenio} onChange={handleChange} id="rnConvenio" />
-                <label className="form-check-label" htmlFor="rnConvenio">
-                  RN na Guia do convênio
-                </label>
-              </div>
-            </div>
-          </div>
         </div>
-      </div>
+        <div className="col-md-6 mb-3">
-      
+          <label>Nome social:</label>
-      {/* INFORMAÇÕES MÉDICAS */}
+          <input type="text" className="form-control" name="nomeSocial" value={formData.nomeSocial} onChange={handleChange} />
-      <div className="mb-3">
+        </div>
-        <h5 className="mb-0 cursor-pointer d-flex justify-content-between align-items-center" onClick={() => handleToggleCollapse('infoMedicas')}>
+        <div className="col-md-6 mb-3">
-          Informações Médicas
+          <label>Data de nascimento: *</label>
-          <span className="fs-5">
+          <input type="date" className="form-control" name="dataNascimento" value={formData.dataNascimento} onChange={handleChange} />
-            {collapsedSections.infoMedicas ? '▲' : '▼'}
+        </div>
-          </span>
+        <div className="col-md-6 mb-3">
-        </h5>
+          <label>Gênero: *</label>
-        <div className={`collapse${collapsedSections.infoMedicas ? ' show' : ''}`}>
+          <select className="form-control" name="genero" value={formData.genero} onChange={handleChange}>
-          <div className="row mt-3">
+            <option value="">Selecione</option>
-            <div className="col-md-6 mb-3">
+            <option value="Masculino">Masculino</option>
-              <label>Tipo Sanguíneo:</label>
+            <option value="Feminino">Feminino</option>
-              <select className="form-control" name="tipoSanguineo" value={formData.tipoSanguineo} onChange={handleChange}>
+            <option value="Outro">Outro</option>
-                <option value="">Selecione</option>
+          </select>
-                <option value="A+">A+</option>
+        </div>
-                <option value="A-">A-</option>
+        <div className="col-md-6 mb-3">
-                <option value="B+">B+</option>
+          <label>Outro documento:</label>
-                <option value="B-">B-</option>
+          <input type="text" className="form-control" name="documento" value={formData.documento} onChange={handleChange} />
-                <option value="AB+">AB+</option>
+        </div>
-                <option value="AB-">AB-</option>
+        <div className="col-md-6 mb-3">
-                <option value="O+">O+</option>
+          <label>Número do documento:</label>
-                <option value="O-">O-</option>
+          <input type="text" className="form-control" name="numeroDocumento" value={formData.numeroDocumento} onChange={handleChange} />
-              </select>
+        </div>
-            </div>
+        <div className="col-md-6 mb-3">
-            <div className="col-md-2 mb-3">
+          <label>CPF: *</label>
-              <label>Peso (kg):</label>
+          <input type="text" className="form-control" name="cpf" value={formData.cpf} onChange={ handleChange} />
-              <input type="number" step="0.1" className="form-control" name="peso" value={formData.peso} onChange={handleChange} />
+        </div>
-            </div>
+        <div className="col-md-6 mb-3">
-            <div className="col-md-2 mb-3">
+          <label>Profissão:</label>
-              <label>Altura (m):</label>
+          <input type="text" className="form-control" name="profissao" value={formData.profissao} onChange={handleChange} />
-              <input type="number" step="0.01" className="form-control" name="altura" value={formData.altura} onChange={handleChange} />
+        </div>
-            </div>
+        <div className="col-md-6 mb-3">
-            <div className="col-md-2 mb-3">
+          <label>Nome da Mãe:</label>
-              <label>IMC (kg/m²):</label>
+          <input type="text" className="form-control" name="nomeMae" value={formData.nomeMae} onChange={handleChange} />
-              <input type="text" className="form-control" name="imc" value={formData.imc} readOnly disabled />
+        </div>
-            </div>
+        <div className="col-md-6 mb-3">
-            <div className="col-md-12 mb-3">
+          <label>Profissão da mãe:</label>
-              <label>Alergias:</label>
+          <input type="text" className="form-control" name="profissaoMae" value={formData.profissaoMae} onChange={handleChange} />
-              <textarea className="form-control" name="alergias" value={formData.alergias} onChange={handleChange} placeholder="Ex: AAS, Dipirona, etc"></textarea>
+        </div>
-            </div>
+        <div className="col-md-6 mb-3">
-          </div>
+          <label>Nome do Pai:</label>
+          <input type="text" className="form-control" name="nomePai" value={formData.nomePai} onChange={handleChange} />
+        </div>
+        <div className="col-md-6 mb-3">
+          <label>Profissão do pai:</label>
+          <input type="text" className="form-control" name="profissaoPai" value={formData.profissaoPai} onChange={handleChange} />
+        </div>
+        <div className="col-md-6 mb-3">
+          <label>Nome do responsável:</label>
+          <input type="text" className="form-control" name="nomeResponsavel" value={formData.nomeResponsavel} onChange={handleChange} />
+        </div>
+        <div className="col-md-6 mb-3">
+          <label>CPF do responsável:</label>
+          <input type="text" className="form-control" name="cpfResponsavel" value={formData.cpfResponsavel} onChange={handleChange} />
+        </div>
+        <div className="col-md-6 mb-3">
+          <label>Nome do esposo(a):</label>
+          <input type="text" className="form-control" name="nomeConjuge" value={formData.nomeConjuge} onChange={handleChange} />
+        </div>
+        <div className="col-md-6 mb-3">
+          <label>Identificador de outro sistema:</label>
+          <input type="text" className="form-control" name="outroId" value={formData.outroId} onChange={handleChange} />
         </div>
       </div>
 
-      {/* INFORMAÇÕES DE CONVÊNIO */}
+      {/* ------------------ ENDEREÇO ------------------ */}
-      <div className="mb-3">
+      <h5>Endereço</h5>
-        <h5 className="mb-0 cursor-pointer d-flex justify-content-between align-items-center" onClick={() => handleToggleCollapse('infoConvenio')}>
+      <div className="row">
-          Informações de convênio
+        <div className="col-md-4 mb-3">
-          <span className="fs-5">
+          <label>CEP:</label>
-            {collapsedSections.infoConvenio ? '▲' : '▼'}
+          <input type="text" className="form-control" name="cep" value={formData.cep} onChange={handleChange} onBlur={handleCepBlur} />
-          </span>
+        </div>
-        </h5>
+        <div className="col-md-8 mb-3">
-        <div className={`collapse${collapsedSections.infoConvenio ? ' show' : ''}`}>
+          <label>Rua:</label>
-          <div className="row mt-3">
+          <input type="text" className="form-control" name="rua" value={formData.rua} onChange={handleChange} />
-            <div className="col-md-6 mb-3">
+        </div>
-              <label>Convênio:</label>
+        <div className="col-md-6 mb-3">
-              <select className="form-control" name="convenio" value={formData.convenio} onChange={handleChange}>
+          <label>Bairro:</label>
-                <option value="">Selecione</option>
+          <input type="text" className="form-control" name="bairro" value={formData.bairro} onChange={handleChange} />
-                <option value="Amil">Amil</option>
+        </div>
-                <option value="Bradesco Saúde">Bradesco Saúde</option>
+        <div className="col-md-4 mb-3">
-                <option value="SulAmérica">SulAmérica</option>
+          <label>Cidade:</label>
-                <option value="Unimed">Unimed</option>
+          <input type="text" className="form-control" name="cidade" value={formData.cidade} onChange={handleChange} />
-              </select>
+        </div>
-            </div>
+        <div className="col-md-2 mb-3">
-            <div className="col-md-6 mb-3">
+          <label>Estado:</label>
-              <label>Plano:</label>
+          <input type="text" className="form-control" name="estado" value={formData.estado} onChange={handleChange} />
-              <input type="text" className="form-control" name="plano" value={formData.plano} onChange={handleChange} />
+        </div>
-            </div>
+        <div className="col-md-4 mb-3">
-            <div className="col-md-6 mb-3">
+          <label>Número:</label>
-              <label>Nº de matrícula:</label>
+          <input type="text" className="form-control" name="numero" value={formData.numero} onChange={handleChange} />
-              <input type="text" className="form-control" name="numeroMatricula" value={formData.numeroMatricula} onChange={handleChange} />
+        </div>
-            </div>
+        <div className="col-md-8 mb-3">
-            <div className="col-md-4 mb-3">
+          <label>Complemento:</label>
-              <label>Validade da Carteira:</label>
+          <input type="text" className="form-control" name="complemento" value={formData.complemento} onChange={handleChange} />
-              <input type="date" className="form-control" name="validadeCarteira" value={formData.validadeCarteira} onChange={handleChange} disabled={formData.validadeIndeterminada} />
-            </div>
-            <div className="col-md-2 d-flex align-items-end mb-3">
-              <div className="form-check">
-                <input className="form-check-input" type="checkbox" name="validadeIndeterminada" checked={formData.validadeIndeterminada} onChange={handleChange} id="validadeIndeterminada" />
-                <label className="form-check-label" htmlFor="validadeIndeterminada">
-                  Validade indeterminada
-                </label>
-              </div>
-            </div>
-            {/* NOVO CAMPO: PACIENTE VIP */}
-            <div className="col-md-12 mb-3 mt-3">
-              <div className="form-check">
-                <input className="form-check-input" type="checkbox" name="pacienteVip" checked={formData.pacienteVip} onChange={handleChange} id="pacienteVip" />
-                <label className="form-check-label" htmlFor="pacienteVip">
-                  Paciente VIP
-                </label>
-              </div>
-            </div>
-          </div>
         </div>
       </div>
 
-      {/* ENDEREÇO */}
+      {/* ------------------ CONTATO ------------------ */}
-      <div className="mb-3">
+      <h5>Contato</h5>
-        <h5 className="mb-0 cursor-pointer d-flex justify-content-between align-items-center" onClick={() => handleToggleCollapse('endereco')}>
+      <div className="row">
-          Endereço
+        <div className="col-md-6 mb-3">
-          <span className="fs-5">
+          <label>Email: *</label>
-            {collapsedSections.endereco ? '▲' : '▼'}
+          <input type="email" className="form-control" name="email" value={formData.email} onChange={handleChange} />
-          </span>
+        </div>
-        </h5>
+        <div className="col-md-6 mb-3">
-        <div className={`collapse${collapsedSections.endereco ? ' show' : ''}`}>
+          <label>Telefone: *</label>
-          <div className="row mt-3">
+          <input type="text" className="form-control" name="telefone1" value={formData.telefone1} onChange={handleChange} />
-            <div className="col-md-4 mb-3">
+        </div>
-              <label>CEP:</label>
+        <div className="col-md-6 mb-3">
-              <input type="text" className="form-control" name="cep" value={formData.cep} onChange={handleChange} onBlur={handleCepBlur} />
+          <label>Telefone 2:</label>
-            </div>
+          <input type="text" className="form-control" name="telefone2" value={formData.telefone2} onChange={handleChange} />
-            <div className="col-md-8 mb-3">
+        </div>
-              <label>Rua:</label>
+        <div className="col-md-6 mb-3">
-              <input type="text" className="form-control" name="rua" value={formData.rua} onChange={handleChange} />
+          <label>Telefone 3:</label>
-            </div>
+          <input type="text" className="form-control" name="telefone3" value={formData.telefone3} onChange={handleChange} />
-            <div className="col-md-6 mb-3">
-              <label>Bairro:</label>
-              <input type="text" className="form-control" name="bairro" value={formData.bairro} onChange={handleChange} />
-            </div>
-            <div className="col-md-4 mb-3">
-              <label>Cidade:</label>
-              <input type="text" className="form-control" name="cidade" value={formData.cidade} onChange={handleChange} />
-            </div>
-            <div className="col-md-2 mb-3">
-              <label>Estado:</label>
-              <input type="text" className="form-control" name="estado" value={formData.estado} onChange={handleChange} />
-            </div>
-            <div className="col-md-4 mb-3">
-              <label>Número:</label>
-              <input type="text" className="form-control" name="numero" value={formData.numero} onChange={handleChange} />
-            </div>
-            <div className="col-md-8 mb-3">
-              <label>Complemento:</label>
-              <input type="text" className="form-control" name="complemento" value={formData.complemento} onChange={handleChange} />
-            </div>
-          </div>
         </div>
       </div>
 
-      {/* CONTATO */}
+      {/* ------------------ INFORMAÇÕES ADICIONAIS ------------------ */}
+      <h5>Informações Adicionais</h5>
       <div className="mb-3">
-        <h5 className="mb-0 cursor-pointer d-flex justify-content-between align-items-center" onClick={() => handleToggleCollapse('contato')}>
+        <label>Observações:</label>
-          Contato
+        <textarea className="form-control" name="observacoes" value={formData.observacoes} onChange={handleChange}></textarea>
-          <span className="fs-5">
-            {collapsedSections.contato ? '▲' : '▼'}
-          </span>
-        </h5>
-        <div className={`collapse${collapsedSections.contato ? ' show' : ''}`}>
-          <div className="row mt-3">
-            <div className="col-md-6 mb-3">
-              <label>Email: *</label>
-              <input type="email" className="form-control" name="email" value={formData.email} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Telefone: *</label>
-              <input type="text" className="form-control" name="telefone1" value={formData.telefone1} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Telefone 2:</label>
-              <input type="text" className="form-control" name="telefone2" value={formData.telefone2} onChange={handleChange} />
-            </div>
-            <div className="col-md-6 mb-3">
-              <label>Telefone 3:</label>
-              <input type="text" className="form-control" name="telefone3" value={formData.telefone3} onChange={handleChange} />
-            </div>
-          </div>
-        </div>
-      </div>
-
-      {/* INFORMAÇÕES ADICIONAIS */}
-      <div className="mb-3">
-        <h5 className="mb-0 cursor-pointer d-flex justify-content-between align-items-center" onClick={() => handleToggleCollapse('infoAdicionais')}>
-          Informações Adicionais
-          <span className="fs-5">
-            {collapsedSections.infoAdicionais ? '▲' : '▼'}
-          </span>
-        </h5>
-        <div className={`collapse${collapsedSections.infoAdicionais ? ' show' : ''}`}>
-          <div className="row mt-3">
-            <div className="mb-3">
-              <label>Observações:</label>
-              <textarea className="form-control" name="observacoes" value={formData.observacoes} onChange={handleChange}></textarea>
-            </div>
-          </div>
-        </div>
-      </div>
-      
-      {/* ANEXOS DO PACIENTE */}
-      <div className="mb-3">
-        <h5 className="mb-0 cursor-pointer d-flex justify-content-between align-items-center" onClick={() => handleToggleCollapse('anexos')}>
-          Anexos do Paciente
-          <span className="fs-5">
-            {collapsedSections.anexos ? '▲' : '▼'}
-          </span>
-        </h5>
-        <div className={`collapse${collapsedSections.anexos ? ' show' : ''}`}>
-          <div className="row mt-3">
-            <div className="mb-3">
-              <label htmlFor="anexos-input" className="btn btn-secondary">Escolher arquivo</label>
-              <input type="file" className="form-control d-none" name="anexos" id="anexos-input" onChange={handleChange} />
-              <span className="ms-2">{formData.anexos ? formData.anexos.name : 'Nenhum arquivo escolhido'}</span>
-            </div>
-          </div>
-        </div>
       </div>
 
       {/* Botões */}
@@ -599,4 +325,4 @@ function PatientForm({ onSave, onCancel, PatientDict }) {
   );
 }
 
-export default PatientForm;
+export default PatientForm;