fix:(ux) ajuste nos inputs

This commit is contained in:
NANDO9322 2026-02-07 00:02:47 -03:00
parent 2fd1e2ece7
commit 1c20b570c0
2 changed files with 36 additions and 3 deletions

View file

@ -8,6 +8,7 @@ import { Button } from "../components/Button";
import { useAuth } from "../contexts/AuthContext";
import { getFunctions, createProfessional, updateProfessional } from "../services/apiService";
import { toast } from "react-hot-toast";
import { formatCPFCNPJ, formatPhone } from "../utils/masks";
// --- Helper Components ---
@ -297,7 +298,7 @@ export const ProfilePage: React.FC = () => {
res = await createProfessional(payload, token);
} else {
// UPDATE
res = await updateProfessional(formData.id, payload, token);
res = await updateProfessional(formData.id, payload, token);
}
if (res.error) throw new Error(res.error);
@ -473,7 +474,8 @@ export const ProfilePage: React.FC = () => {
label="CPF/CNPJ"
icon={FileText}
value={formData.cpf_cnpj_titular || ""}
onChange={(e) => handleChange("cpf_cnpj_titular", e.target.value)}
onChange={(e) => handleChange("cpf_cnpj_titular", formatCPFCNPJ(e.target.value))}
maxLength={18}
/>
</div>
</div>
@ -495,7 +497,8 @@ export const ProfilePage: React.FC = () => {
label="WhatsApp"
icon={Phone}
value={formData.whatsapp || ""}
onChange={(e) => handleChange("whatsapp", e.target.value)}
onChange={(e) => handleChange("whatsapp", formatPhone(e.target.value))}
maxLength={15}
/>
<div className="md:col-span-2 border-t pt-4 mt-2">

30
frontend/utils/masks.ts Normal file
View file

@ -0,0 +1,30 @@
export const formatCPFCNPJ = (value: string) => {
const clean = value.replace(/\D/g, "");
if (clean.length <= 11) {
// CPF
return clean
.replace(/(\d{3})(\d)/, "$1.$2")
.replace(/(\d{3})(\d)/, "$1.$2")
.replace(/(\d{3})(\d{1,2})/, "$1-$2")
.replace(/(-\d{2})\d+?$/, "$1");
} else {
// CNPJ
return clean
.replace(/^(\d{2})(\d)/, "$1.$2")
.replace(/^(\d{2})\.(\d{3})(\d)/, "$1.$2.$3")
.replace(/\.(\d{3})(\d)/, ".$1/$2")
.replace(/(\d{4})(\d)/, "$1-$2")
.replace(/(-\d{2})\d+?$/, "$1");
}
};
export const formatPhone = (value: string) => {
const clean = value.replace(/\D/g, "");
// (11) 99999-9999
return clean
.replace(/^(\d{2})(\d)/, "($1) $2")
.replace(/(\d{5})(\d)/, "$1-$2")
.replace(/(-\d{4})\d+?$/, "$1");
};