File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="login-wrap">
<div class="login-box">
<div class="login-logo">
<img src="../../../resources/img/content/login_logo.svg" alt="로고">
</div>
<div class="login-form">
<div>
<div class="mb10">
<input type="text" id="loginId" class="form-control md" v-model="loginId" required
placeholder="아이디를 입력하세요">
</div>
<div class="mb20">
<input type="password" id="password" class="form-control md" v-model="password" required
placeholder="비밀번호를 입력하세요">
</div>
</div>
<div class="error-message mb20" v-if="!isValid">
<p><img src="../../../resources/img/component/common/ico_invalid_error_20.svg" alt=""> {{ errorMessage }}</p>
</div>
<button class="btn lg primary login-btn mb30" @click="loginProc"><span
class="icon-label lbtn">로그인</span></button>
</div>
<div class="layout center justify-center links">
<router-link :to="{ path: '/find.page', query: { type: 'id' } }">아이디 찾기</router-link>
<router-link :to="{ path: '/find.page', query: { type: 'pw' } }">비밀번호 찾기</router-link>
<router-link to="/join.page">회원가입</router-link>
</div>
</div>
</div>
</template>
<script>
import { loginProc } from '../../../resources/api/auth';
import AppStore from '../AppStore';
export default {
data() {
return {
isValid: true,
loginId: null,
password: null,
errorMessage: "",
};
},
methods: {
// 로그인
async loginProc() {
const vm = this;
vm.isValid = true;
vm.errorMessage = "";
// 사용자 아이디와 비밀번호 입력값 검증
if (!vm.loginId || vm.loginId.trim() === '') {
return;
}
if (!vm.password || vm.password.trim() === '') {
return;
}
const loginData = {
loginId: vm.loginId,
password: vm.password
}
try {
const res = await loginProc(loginData);
if (res.status === 200) {
const accessToken = res.data.accessToken;
AppStore.commit('setAuthorization', accessToken);
const base64String = AppStore.state.authorization.split('.')[1];
const base64 = base64String.replace(/-/g, '+').replace(/_/g, '/');
const jsonPayload = decodeURIComponent(atob(base64).split('').map(c => {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
}).join(''));
const mem = JSON.parse(jsonPayload);
AppStore.commit("setMemId", mem.memberId);
AppStore.commit('setMemNm', mem.memberName);
AppStore.commit('setMemLoginId', mem.loginId);
this.$router.push({ path: "/" });
}
} catch (error) {
vm.isValid = false;
this.errorMessage = error.response?.data?.message || "로그인 중 오류가 발생했습니다.";
}
},
},
watch: {},
computed: {},
components: {},
created() { },
mounted() { },
beforeUnmount() { },
};
</script>