From 989e56fbce9d5dda98e42936e3a3463972dfd701 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=B5=9C=EC=A4=80=ED=9D=A0?= Date: Tue, 30 Aug 2022 19:53:34 +0900 Subject: [PATCH] =?UTF-8?q?Vue2=5FFrontend=20=EC=88=98=EC=A0=951...?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env | 2 +- src/components/common/LoginComponent.vue | 52 ++++++++++++++---------- src/components/todo/InputComponent.vue | 8 ++-- src/components/todo/ListComponent.vue | 23 ++++++++--- src/router/index.js | 5 +++ 5 files changed, 57 insertions(+), 33 deletions(-) diff --git a/.env b/.env index 68f9b3a..67fbf7d 100644 --- a/.env +++ b/.env @@ -10,4 +10,4 @@ VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin="*" #LocalStorage는 Edge 브라우저의 개발툴 > 응용프로그램 > 로컬 저장소에서 확인가능 VUE_APP_LOCALSTORAGE_NAME="access_token" - +VUE_APP_SESSIONSTORAGE_REDIRECT_NAME = "RedirectPATH" diff --git a/src/components/common/LoginComponent.vue b/src/components/common/LoginComponent.vue index 17a82a5..7420325 100644 --- a/src/components/common/LoginComponent.vue +++ b/src/components/common/LoginComponent.vue @@ -82,43 +82,51 @@ export default { return dirty || validated ? valid : null }, async onSubmit() { - const result = await this.callAPI( - '/auth/login', - JSON.stringify({ - email: this.form.email, - password: this.form.password - }) - ) - if (result.access_token) { - // localStorage를 사용하면, 브라우저에 key-value 값을 Storage에 저장할 수 있습니다 - localStorage.setItem(process.env.VUE_APP_LOCALSTORAGE_NAME, result) - alert('로그인 성공...') - console.log(this.$router) - //this.$router.push(this.$router.path) - } else { + const result = await this.callAPI('/auth/login', { + email: this.form.email, + password: this.form.password + }) + console.log(result) + if (!result) { console.log(result) localStorage.removeItem(process.env.VUE_APP_LOCALSTORAGE_NAME) alert('로그인 실패...') - this.$router.back() + //this.$router.back() + } else { + // localStorage를 사용하면, 브라우저에 key-value 값을 Storage에 저장할 수 있습니다 + localStorage.setItem(process.env.VUE_APP_LOCALSTORAGE_NAME, result) + alert('로그인 성공...') + //저장된 redirect path를 이용 이동시킴 + this.$router.replace( + sessionStorage.getItem( + process.env.VUE_APP_SESSIONSTORAGE_REDIRECT_NAME + ) + ) || '/' + //저장된 정보 CLear + this.onReset() } }, onReset() { // Reset our form values this.form.email = '' this.form.pasword = '' + //저장된 redirect path Clear + sessionStorage.removeItem( + process.env.VUE_APP_SESSIONSTORAGE_REDIRECT_NAME + ) // Trick to reset/clear native browser form validation state - this.$nextTick(() => { - this.$refs.observer.reset() - }) + // this.$nextTick(() => { + // this.$refs.observer.reset() + // }) }, async callAPI(url, params) { console.log('CallAPI..', [url, params]) axios.defaults.baseURL = process.env.VUE_APP_BACKEND_HOST //전송 Header에 CORP정보 추가 - // axios.defaults.headers.post['Content-Type'] = - // process.env.VUE_APP_BACKEND_HEADERS_Content_Type - // axios.defaults.headers.post['Access-Control-Allow-Origin'] = - // process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin + axios.defaults.headers.post['Content-Type'] = + process.env.VUE_APP_BACKEND_HEADERS_Content_Type + axios.defaults.headers.post['Access-Control-Allow-Origin'] = + process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin return await axios .post(url, params) .then((response) => { diff --git a/src/components/todo/InputComponent.vue b/src/components/todo/InputComponent.vue index 79d7083..17de0ea 100644 --- a/src/components/todo/InputComponent.vue +++ b/src/components/todo/InputComponent.vue @@ -141,10 +141,10 @@ export default { console.log('CallAPI..', [url, params]) axios.defaults.baseURL = process.env.VUE_APP_BACKEND_HOST //전송 Header에 CORP정보 추가 - // axios.defaults.headers.post['Content-Type'] = - // process.env.VUE_APP_BACKEND_HEADERS_Content_Type - // axios.defaults.headers.post['Access-Control-Allow-Origin'] = - // process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin + axios.defaults.headers.post['Content-Type'] = + process.env.VUE_APP_BACKEND_HEADERS_Content_Type + axios.defaults.headers.post['Access-Control-Allow-Origin'] = + process.env.VUE_APP_BACKEND_HEADERS_Access_Control_Allow_Origin //전송 Header에 인증키 추가 const headers = { // Authorization: diff --git a/src/components/todo/ListComponent.vue b/src/components/todo/ListComponent.vue index 13f8e87..41822db 100644 --- a/src/components/todo/ListComponent.vue +++ b/src/components/todo/ListComponent.vue @@ -54,6 +54,7 @@ :sort-by.sync="sortBy" :sort-desc.sync="sortDesc" :sort-direction="sortDirection" + @sort-changed="sortClick" label-sort-asc="" label-sort-desc="" label-sort-clear="" @@ -65,6 +66,7 @@ :no-border-collapse="commonTableAttributes.noBorderCollapse" :striped="commonTableAttributes.striped" :hover="commonTableAttributes.hover" + :no-local-sorting="commonTableAttributes.noLocalSorting" :bordered="commonTableAttributes.bordered" :dark="commonTableAttributes.dark" :head-variant="commonTableAttributes.headVariant" @@ -86,7 +88,7 @@