// contact-sections.jsx — 틴트라이프 · CONTACT page. Uses CONTACT (home-data).
const { useState } = React;
const INQUIRY_TYPES = ["가맹·창업 문의", "원데이클래스 문의", "기타 문의"];
const AGE_RANGES = ["20대 이하", "30대", "40대", "50대", "60대 이상"];
const LICENSE_OPTIONS = ["미보유", "보유", "취득 예정"];
function ContactInfo() {
return (
TINTLIFE
전화 또는 폼으로
편하게 문의하세요.
예약·가맹·교육 관련 문의를 남겨주시면 본사에서 순차적으로 유선 연락드립니다. 100% 예약제로 운영됩니다.
);
}
function ContactForm() {
const [f, setF] = useState({ name: "", phone: "", email: "", region: "", license: LICENSE_OPTIONS[0], ageRange: "", type: INQUIRY_TYPES[0], msg: "", agree: false, overseasAgree: false, marketingAgree: false });
const [sent, setSent] = useState(false);
const [loading, setLoading] = useState(false);
const [err, setErr] = useState("");
const set = (k) => (e) => setF((s) => ({ ...s, [k]: e.target.type === "checkbox" ? e.target.checked : e.target.value }));
const setAllAgreements = (e) => {
const checked = e.target.checked;
setF((s) => ({ ...s, agree: checked, overseasAgree: checked, marketingAgree: checked }));
};
const setPhone = (e) => {
const digits = e.target.value.replace(/\D/g, "").slice(0, 11);
let v = digits;
if (digits.startsWith("02")) {
if (digits.length > 6) v = digits.slice(0, 2) + "-" + digits.slice(2, 6) + "-" + digits.slice(6);
else if (digits.length > 2) v = digits.slice(0, 2) + "-" + digits.slice(2);
} else {
if (digits.length > 7) v = digits.slice(0, 3) + "-" + digits.slice(3, 7) + "-" + digits.slice(7);
else if (digits.length > 3) v = digits.slice(0, 3) + "-" + digits.slice(3);
}
setF((s) => ({ ...s, phone: v }));
};
const submit = async (e) => {
e.preventDefault();
if (!f.name.trim() || !f.phone.trim() || !f.email.trim() || !f.region.trim() || !f.msg.trim()) { setErr("이름, 연락처, 이메일, 희망 개설 지역, 문의 내용을 입력해 주세요."); return; }
if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(f.email.trim())) { setErr("올바른 이메일 주소를 입력해 주세요."); return; }
const phoneDigits = f.phone.replace(/\D/g, "");
if (phoneDigits.length < 9 || phoneDigits.length > 11) { setErr("올바른 전화번호를 입력해 주세요. 예: 010-1234-5678"); return; }
if (!f.agree) { setErr("개인정보 수집·이용에 동의해 주세요."); return; }
if (!f.overseasAgree) { setErr("국외 처리(이전) 안내에 동의해 주세요."); return; }
setErr("");
setLoading(true);
try {
const res = await fetch("/api/contact", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ name: f.name, phone: f.phone, email: f.email, region: f.region, license: f.license, ageRange: f.ageRange, type: f.type, msg: f.msg, privacyConsent: f.agree, overseasConsent: f.overseasAgree, marketingConsent: f.marketingAgree, consentAt: new Date().toISOString() }),
});
if (!res.ok) {
const data = await res.json().catch(() => ({}));
throw new Error(data.error || "서버 오류");
}
setSent(true);
} catch (ex) {
setErr(ex.message || "전송 중 오류가 발생했습니다. 잠시 후 다시 시도해 주세요.");
} finally {
setLoading(false);
}
};
if (sent) {
return (
문의가 전송되었습니다
담당자가 확인 후 입력하신 연락처로 답변드리겠습니다.
급하신 분은 전화로 연락 주세요.
{CONTACT.tel}
);
}
return (
);
}
function Contact() {
return (
);
}
window.Contact = Contact;