diff --git a/src/components/clientes/ClienteModal.tsx b/src/components/clientes/ClienteModal.tsx index e4c0c7e..3bd7123 100644 --- a/src/components/clientes/ClienteModal.tsx +++ b/src/components/clientes/ClienteModal.tsx @@ -212,25 +212,24 @@ export const ClienteModal: React.FC = ({ ); if (response.data && !response.data.erro) { - // Usar estado local para garantir re-renderização imediata const endereco = response.data.logradouro || ""; const bairro = response.data.bairro || ""; const cidade = response.data.localidade || ""; const estado = response.data.uf || ""; - // Atualizar valores no formulário - setValue("endereco", endereco, { shouldValidate: true }); - setValue("bairro", bairro, { shouldValidate: true }); + // Só preencher endereço/bairro se vier valor da API + if (endereco) setValue("endereco", endereco, { shouldValidate: true }); + if (bairro) setValue("bairro", bairro, { shouldValidate: true }); setValue("cidade", cidade, { shouldValidate: true }); setValue("estado", estado, { shouldValidate: true }); - // Atualizar o estado para re-renderização do componente + // Atualizar estado apenas para cidade/estado (não controlar endereço/bairro) setEnderecoState({ - endereco, - bairro, - cidade, - estado, - preenchido: true, + endereco: endereco, + bairro: bairro, + cidade: cidade, + estado: estado, + preenchido: false, // Não usar mais para travar campos }); // Focar no próximo campo apenas se o usuário não estiver digitando ativamente @@ -251,6 +250,18 @@ export const ClienteModal: React.FC = ({ }, 100); } } else { + // Se CEP não encontrado, limpar campos e permitir edição manual + setEnderecoState({ + endereco: "", + bairro: "", + cidade: "", + estado: "", + preenchido: false, + }); + setValue("endereco", ""); + setValue("bairro", ""); + setValue("cidade", ""); + setValue("estado", ""); console.error("CEP não encontrado"); alert("CEP não encontrado. Por favor, verifique o CEP informado."); } @@ -622,10 +633,9 @@ export const ClienteModal: React.FC = ({ required: "Endereço é obrigatório", })} error={errors.endereco?.message} - value={enderecoState.preenchido ? enderecoState.endereco : undefined} + // Remover value/controlado por enderecoState, deixar react-hook-form controlar onChange={(e) => { - setValue("endereco", e.target.value); - setEnderecoState(prev => ({...prev, endereco: e.target.value})); + setValue("endereco", e.target.value, { shouldValidate: true }); }} /> = ({ required: "Bairro é obrigatório", })} error={errors.bairro?.message} - value={enderecoState.preenchido ? enderecoState.bairro : undefined} + // Remover value/controlado por enderecoState, deixar react-hook-form controlar onChange={(e) => { - setValue("bairro", e.target.value); - setEnderecoState(prev => ({...prev, bairro: e.target.value})); + setValue("bairro", e.target.value, { shouldValidate: true }); }} /> = ({ required: "Cidade é obrigatória", })} error={errors.cidade?.message} - value={enderecoState.preenchido ? enderecoState.cidade : undefined} + value={typeof watch("cidade") === "string" ? watch("cidade") : enderecoState.cidade} onChange={(e) => { - setValue("cidade", e.target.value); + setValue("cidade", e.target.value, { shouldValidate: true }); setEnderecoState(prev => ({...prev, cidade: e.target.value})); }} /> @@ -670,9 +679,9 @@ export const ClienteModal: React.FC = ({ })} options={estadosOptions} error={errors.estado?.message} - value={enderecoState.preenchido ? enderecoState.estado : undefined} + value={typeof watch("estado") === "string" ? watch("estado") : enderecoState.estado} onChange={(e) => { - setValue("estado", e.target.value); + setValue("estado", e.target.value, { shouldValidate: true }); setEnderecoState(prev => ({...prev, estado: e.target.value})); }} />