diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..3c3629e
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+node_modules
diff --git a/frontend/constants/RegExp.js b/frontend/constants/RegExp.js
index fc10ab9..01dd698 100644
--- a/frontend/constants/RegExp.js
+++ b/frontend/constants/RegExp.js
@@ -7,7 +7,8 @@ const RegExp = {
UPPERCASE: /[A-Z]/g,
LOWERCASE: /[a-z]/g,
SPECIAL: /[~!@#$%^&*()_+|<>?:{}]/gi
- }
+ },
+ PHONE_NUMBER: /^010\d{3,4}\d{4}$/
};
export default RegExp;
diff --git a/frontend/constants/message.js b/frontend/constants/message.js
index 4be28e8..6e647f9 100644
--- a/frontend/constants/message.js
+++ b/frontend/constants/message.js
@@ -35,6 +35,12 @@ export const INTERESTS_MESSAGE = {
SUCCESS: `관심사를 최대치까지 등록하셨습니다.`
};
+export const PHONE_NUMBER_MESSAGE = {
+ DEFAULT: `번호를 입력해 주세요.`,
+ ERROR_REGEXP: `형식에 맞지 않는 번호입니다.`,
+ SUCCESS: `번호 입력이 완료 됬습니다.`
+};
+
export const BIRTHDAY_MESSAGE = {
NUMBER: `숫자만 입력해 주세요`,
YEAR: {
diff --git a/frontend/js/signUp.js b/frontend/js/signUp.js
index b5ec575..b452651 100644
--- a/frontend/js/signUp.js
+++ b/frontend/js/signUp.js
@@ -2,10 +2,14 @@ import RegExp from "../constants/RegExp.js";
import {
ID_MESSAGE,
EMAIL_MESSAGE,
- INTERESTS_MESSAGE
+ INTERESTS_MESSAGE,
+ PHONE_NUMBER_MESSAGE
} from "../constants/message.js";
+import validationState from "../js/validationState.js";
+
+console.log(validationState);
-const IDinputDOM = document.querySelector("#id");
+const IDinputDOM = document.querySelector("#user_id");
const IDMessageDOM = document.querySelector(".ID_message");
//--------------------ID 유효성 검사--------------------
@@ -161,6 +165,74 @@ registerEmailInputEventHandler(
EMAIL_MESSAGE,
RegExp
);
+
+//--------------------휴대전화------------------
+const phoneNumberInputDOM = document.querySelector("#phone_number");
+const phoneNumberMessageDOM = document.querySelector(".phone_number_message");
+
+function registerPhoneNumberInputEventHandler(
+ phoneNumberInputDOM,
+ phoneNumberMessageDOM,
+ PHONE_NUMBER_MESSAGE,
+ RegExp
+) {
+ phoneNumberInputDOM.addEventListener("focusout", () => {
+ const targetPhoneNumber = event.target.value;
+
+ if (judgePhoneNumberBlank(targetPhoneNumber)) {
+ insertPhoneNumberBlankDiscriminantMessage(
+ phoneNumberMessageDOM,
+ PHONE_NUMBER_MESSAGE.DEFAULT
+ );
+ } else if (
+ !judgePhoneNumberRegExp(targetPhoneNumber, RegExp.PHONE_NUMBER)
+ ) {
+ insertPhoneNumberRegExpDiscriminantMessage(
+ phoneNumberMessageDOM,
+ PHONE_NUMBER_MESSAGE.ERROR_REGEXP
+ );
+ } else {
+ phoneNumberMessageDOM.style.color = "#00c850";
+ phoneNumberMessageDOM.innerText = PHONE_NUMBER_MESSAGE.SUCCESS;
+ }
+ });
+}
+
+function judgePhoneNumberRegExp(targetPhoneNumber, RegExp) {
+ return RegExp.test(targetPhoneNumber);
+}
+
+function judgePhoneNumberBlank(targetPhoneNumber) {
+ if (targetPhoneNumber === "") {
+ return true;
+ } else {
+ return false;
+ }
+}
+
+function insertPhoneNumberRegExpDiscriminantMessage(
+ phoneNumberMessageDOM,
+ ERROR_REGEXP_MESSAGE
+) {
+ phoneNumberMessageDOM.style.color = "#EB0000";
+ phoneNumberMessageDOM.innerText = ERROR_REGEXP_MESSAGE;
+}
+
+function insertPhoneNumberBlankDiscriminantMessage(
+ phoneNumberMessageDOM,
+ DEFAULT_MESSAGE
+) {
+ phoneNumberMessageDOM.style.color = "#EB0000";
+ phoneNumberMessageDOM.innerText = DEFAULT_MESSAGE;
+}
+
+registerPhoneNumberInputEventHandler(
+ phoneNumberInputDOM,
+ phoneNumberMessageDOM,
+ PHONE_NUMBER_MESSAGE,
+ RegExp
+);
+
//--------------------관심사--------------------
const intersetInputDOM = document.querySelector(".tag-container input");
@@ -271,8 +343,6 @@ const clauseModal = document.querySelector(".madal");
const modalAgreementBtn = document.querySelector(".madal_agree_btn button");
const agreementCheckBox = document.querySelector("#agreement");
-console.dir((agreementCheckBox.disabled = false));
-
agreementBtn.addEventListener("click", () => {
blindArea.className = "blind";
clauseModal.style.visibility = "unset";
diff --git a/frontend/js/signUp_ellin.js b/frontend/js/signUp_ellin.js
index 64787fd..d4d9857 100644
--- a/frontend/js/signUp_ellin.js
+++ b/frontend/js/signUp_ellin.js
@@ -1,10 +1,8 @@
-import RegExp from "/constants/RegExp.js";
-import validationState from "./validationState.js";
+import RegExp from "../constants/RegExp.js";
import {
PASSWORD_MESSAGE,
- PASSWORD_RECONFIRM_MESSAGE,
- BIRTHDAY_MESSAGE
-} from "/constants/message.js";
+ PASSWORD_RECONFIRM_MESSAGE
+} from "../constants/message.js";
(function() {
const singUpForm = document.querySelector(".join");
diff --git a/frontend/js/validationState.js b/frontend/js/validationState.js
index d01b491..f3b3cde 100644
--- a/frontend/js/validationState.js
+++ b/frontend/js/validationState.js
@@ -4,11 +4,7 @@ const validationState = {
email: false,
name: false,
phone_number: false,
- clause: false,
- password: false,
- passwordReconfirm: false,
- birthdayYear: false,
- birthdayMonth: false,
- birthdayDay: false
+ clause: false
};
+
export default validationState;
diff --git a/frontend/login.html b/frontend/login.html
index 6fba38f..f3b0ea4 100644
--- a/frontend/login.html
+++ b/frontend/login.html
@@ -1,33 +1,36 @@
+
+
+
+
+
+ 로그인
+
-
-
-
-
-
- 로그인
-
-
-
-
-
-
-
\ No newline at end of file
+
+
+
+