사용자 로직 수정

frontend/src/services/authService.js

@@ -6,7 +6,7 @@ import apiClient from './api';
 const authService = {
   /**
    * 로그인
-   * @param {Object} credentials - 로그인 정보 (이메일, 비밀번호)
+   * @param {Object} credentials - 로그인 정보 (사용자명, 비밀번호)
    * @returns {Promise} - 로그인 결과
    */
   login(credentials) {

frontend/src/views/auth/Login.vue

@@ -4,9 +4,9 @@
       <h2>볼링 클럽 매니저 로그인</h2>
       <form @submit.prevent="handleLogin" v-if="!showRegisterForm">
         <div class="form-group">
-          <label for="email">이메일</label>
-          <InputText id="email" v-model="email" class="w-full" :class="{'p-invalid': emailError}" />
-          <small v-if="emailError" class="p-error">{{ emailError }}</small>
+          <label for="username">사용자명</label>
+          <InputText id="username" v-model="username" class="w-full" :class="{'p-invalid': usernameError}" />
+          <small v-if="usernameError" class="p-error">{{ usernameError }}</small>
         </div>
         <div class="form-group">
           <label for="password">비밀번호</label>
@@ -29,6 +29,12 @@
       <!-- 회원가입 폼 -->
       <form @submit.prevent="handleRegister" v-if="showRegisterForm">
         <h3>회원가입</h3>
+        
+        <div class="form-group">
+          <label for="registerUsername">사용자명(로그인 아이디)</label>
+          <InputText id="registerUsername" v-model="registerUsername" class="w-full" :class="{'p-invalid': registerUsernameError}" />
+          <small v-if="registerUsernameError" class="p-error">{{ registerUsernameError }}</small>
+        </div>
         <div class="form-group">
           <label for="registerName">이름</label>
           <InputText id="registerName" v-model="registerName" class="w-full" :class="{'p-invalid': registerNameError}" />
@@ -58,10 +64,7 @@
                    class="w-full" />
           <small v-if="registerPasswordConfirmError" class="p-error">{{ registerPasswordConfirmError }}</small>
         </div>
-        <div class="form-group">
-          <label for="registerPhone">전화번호 (선택)</label>
-          <InputText id="registerPhone" v-model="registerPhone" class="w-full" />
-        </div>
+
         <Button type="submit" label="회원가입" class="w-full" :loading="loading" />
         <div class="login-link">
           <p>이미 계정이 있으신가요? <a href="#" @click.prevent="showRegisterForm = false">로그인</a></p>
@@ -82,21 +85,22 @@ const user = inject('user');
 const router = useRouter();
 const toast = useToast();
 
-const email = ref('');
+const username = ref('');
 const password = ref('');
 const rememberMe = ref(false);
 const loading = ref(false);
-const emailError = ref('');
+const usernameError = ref('');
 const passwordError = ref('');
 
-// 회원가입 관련 상태
+// 회원가입 폼 상태
 const showRegisterForm = ref(false);
 const registerName = ref('');
+const registerUsername = ref('');
 const registerEmail = ref('');
 const registerPassword = ref('');
 const registerPasswordConfirm = ref('');
-const registerPhone = ref('');
 const registerNameError = ref('');
+const registerUsernameError = ref('');
 const registerEmailError = ref('');
 const registerPasswordError = ref('');
 const registerPasswordConfirmError = ref('');
@@ -108,18 +112,16 @@ const passwordHasLowercase = computed(() => /[a-z]/.test(registerPassword.value)
 const passwordHasNumber = computed(() => /[0-9]/.test(registerPassword.value));
 const passwordHasSpecial = computed(() => /[!@#$%^&*(),.?":{}|<>]/.test(registerPassword.value));
 
+// 폼 유효성 검사
 const validateForm = () => {
   let isValid = true;
   
-  // 이메일 유효성 검사
-  if (!email.value) {
-    emailError.value = '이메일을 입력해주세요.';
-    isValid = false;
-  } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email.value)) {
-    emailError.value = '유효한 이메일 주소를 입력해주세요.';
+  // 사용자명 검증
+  if (!username.value) {
+    usernameError.value = '사용자명을 입력해주세요.';
     isValid = false;
   } else {
-    emailError.value = '';
+    usernameError.value = '';
   }
   
   // 비밀번호 유효성 검사
@@ -137,7 +139,7 @@ const validateForm = () => {
 const validateRegisterForm = () => {
   let isValid = true;
   
-  // 이름 유효성 검사
+  // 이름 검증
   if (!registerName.value) {
     registerNameError.value = '이름을 입력해주세요.';
     isValid = false;
@@ -145,11 +147,22 @@ const validateRegisterForm = () => {
     registerNameError.value = '';
   }
   
-  // 이메일 유효성 검사
+  // 사용자명 검증
+  if (!registerUsername.value) {
+    registerUsernameError.value = '사용자명을 입력해주세요.';
+    isValid = false;
+  } else if (registerUsername.value.length < 4) {
+    registerUsernameError.value = '사용자명은 최소 4자 이상이어야 합니다.';
+    isValid = false;
+  } else {
+    registerUsernameError.value = '';
+  }
+  
+  // 이메일 검증
   if (!registerEmail.value) {
     registerEmailError.value = '이메일을 입력해주세요.';
     isValid = false;
-  } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(registerEmail.value)) {
+  } else if (!/^\S+@\S+\.\S+$/.test(registerEmail.value)) {
     registerEmailError.value = '유효한 이메일 주소를 입력해주세요.';
     isValid = false;
   } else {
@@ -193,7 +206,7 @@ const handleLogin = async () => {
   
   try {
     const response = await authService.login({
-      email: email.value,
+      username: username.value,
       password: password.value
     });
     
@@ -239,9 +252,9 @@ const handleRegister = async () => {
   try {
     await authService.register({
       name: registerName.value,
+      username: registerUsername.value,
       email: registerEmail.value,
-      password: registerPassword.value,
-      phone: registerPhone.value
+      password: registerPassword.value
     });
     
     // 회원가입 성공 메시지
@@ -250,16 +263,16 @@ const handleRegister = async () => {
     // 로그인 폼으로 전환
     showRegisterForm.value = false;
     
-    // 입력한 이메일을 로그인 폼에 자동 입력
-    email.value = registerEmail.value;
+    // 입력한 사용자명을 로그인 폼에 자동 입력
+    username.value = registerUsername.value;
     password.value = '';
     
     // 회원가입 폼 초기화
     registerName.value = '';
+    registerUsername.value = '';
     registerEmail.value = '';
     registerPassword.value = '';
     registerPasswordConfirm.value = '';
-    registerPhone.value = '';
   } catch (error) {
     console.error('회원가입 오류:', error);