hubez-admin partner-git master -> hubez-git transfer 202205241800

frontend/src/modules/login/views/LoginAuth.vue

@@ -0,0 +1,263 @@
+<template>  
+	<!--	s: 문자인증	-->
+  <div class="wrap bg-wrap">
+    <div  class="login-box text-auth">
+        <div class="logo"></div>
+        <div class="wbox">
+            <h3 class="title">2차 휴대폰 문자 인증</h3>
+            <p class="desc">아이디에 등록된 휴대폰번호를 입력해 주세요.</p>
+            <!-- <form action=""> -->
+                <ul class="pw-form">
+                  <div>
+                    <li><input type="text" 
+                               placeholder="휴대폰번호를 입력하세요 (숫자만 입력하세요.)"  
+                               v-model="mdn"
+                               :maxlength="11"
+                               oninput="javascript: this.value = this.value.replace(/[^0-9]/g, '');"
+                               >
+                    <button class="btn-p2color" v-on:click="authNum">인증번호 받기</button></li>
+                  </div>
+                  <div>
+                    <li class="bg-g">
+                      <input type="text" 
+                             placeholder="인증번호를 입력하세요" 
+                             v-model="confirmNum" 
+                             :maxlength="6"
+                             oninput="javascript: this.value = this.value.replace(/[^0-9]/g, '');"
+                             >
+                    <span class="time"> {{ TimerStr }}</span></li>
+                  </div>
+                    <li>
+                        <button class="btn-default" @click="clickMenu('/login')">취소</button>
+                        <button class="btn-pcolor" v-on:click="ajaxAuth">확인</button>
+                    </li>
+                </ul>
+            <!-- </form> -->
+        </div>
+
+      </div>
+        <login-popup ref="LoginPopup"> </login-popup>
+    </div>		 
+
+</template>
+
+<script>
+  import { mapGetters } from 'vuex';
+  import api from '../service/api';
+  import tokenSvc from '@/common/token-service';
+  import LoginPopup from '@/components/LoginPopup.vue'
+  //import * as utils from '@/common/utils';
+
+  export default {
+    data: function() {
+      return {       
+        errors: [],
+        mdn: '',
+        confirmNum: '',
+        userId: '',
+        isAuthNum: false,        
+        isLogin: true,
+        pwd: '',
+        text: '',
+        number: '',
+        Timer: null,
+        TimeCounter: 180,
+        TimerStr: "03:00"
+      };
+    },
+        components: {
+        LoginPopup : LoginPopup
+    },
+    created() {                  
+      if(!!tokenSvc.getToken()){        
+        this.$store.commit("login/isLogin", true);      
+        this.$store.commit("login/isAuthChk", true);
+        this.$router.push({ path: '/' });
+      }else{        
+        if(!this.getLogin){
+          this.$router.push({ path: '/login' });
+        }
+      }  
+    },
+    mounted() {      
+      if (localStorage.hubwebUserId) {  
+        this.userId = localStorage.hubwebUserId;
+      }
+      this.isLogin = this.getLogin;      
+      this.pwd = this.getPwd;
+    },
+    computed: {
+      ...mapGetters({
+        getLogin: 'login/isLogin',
+        getErrorPage: 'login/isErrorPage',
+        getAuthChk: 'login/isAuthChk',
+        getPwd: 'login/getPwd'
+      }), 
+    },
+    watch: {
+      getLogin(data) {        
+        if (data != null && data != '' && data == true) {
+          this.isLogin = true;        
+        } else {
+          this.isLogin = false;                
+        }      
+      },
+      getPwd(data) {
+        if(data != null && data != ''){
+          this.pwd = data;
+        }
+      }
+    },
+    destroyed() {
+      let cont = document.querySelector(".wrap");
+      cont.classList.remove("bg-wrap");
+    },
+    methods: {
+        // 2차 인증번호 요청
+        authNum(){          
+          var vm = this;
+          if(!this.isLogin){
+            var vm = this;
+            vm.$store.commit("login/isLogin", false);
+            vm.$store.commit("login/isAuthChk", false);
+            vm.$router.push({ path: '/'});
+            return;
+          }
+            if (vm.mdn == null || vm.mdn.trim() == ""){
+              vm.ModalOpen('modal08');
+              return false;
+            } else if (vm.mdn.length < 11 || !vm.mdn) {
+              vm.ModalOpen('modal06');
+            }
+          var params = {                
+                "oprtrId": this.userId,
+                "hpNo": this.mdn,
+                "isLogin" : this.isLogin
+            }
+          api.authNum(params).then(response => {
+            console.log(response);
+            var rsp = response.data;
+            if(rsp.retCode == '0000'){              
+              this.Timer = this.timerStart();
+              vm.ModalOpen('modal07');
+              // console.log('시간 3:00 카운트 하기');
+              this.isAuthNum = true;          
+            }else if (!this.Timer) {
+              this.timerStop(this.Timer);
+              this.Timer = null;            
+              // 실패 -> 실패 코드에 따라 실패 팝업 보여주기 
+              //인증시간 초과 후 “시간초과!” 문구로 변경
+            }
+          }).catch(response =>{
+            
+            console.log(response);
+          });
+        },
+
+        // 2차 인증 확인 
+        ajaxAuth: function(){
+            var vm = this;
+            
+            if (!vm.formCheck()){
+              alert(vm.errors[0]);
+              return false;
+            } 
+            if(vm.TimeCounter==0){
+              alert("시간초과");
+              return false;
+            }
+
+            var params = {                
+                "oprtrId": this.userId,
+                "hpNo": this.mdn,
+                "chrVal": this.confirmNum,
+                "isLogin": this.isLogin,
+                "oprtrPw": this.pwd
+            }
+
+            //인증번호 확인
+            api.confirmNum(params).then(function(response){
+                var rsp = response.data;
+                console.log("RESULT_CODE : "+rsp.retCode);
+                if(rsp.retCode == '0000'){
+                   vm.$store.commit("login/isLogin", true);                   
+                   //var nextUrl = rsp.data.nextUrl;
+                   //vm.$router.push({ path: nextUrl});
+                   vm.$router.push({ path: '/'});
+                }else if(rsp.retCode == '4008') { //휴대폰번호 확인 
+                  vm.ModalOpen('modal06');
+                } else if(rsp.retCode == '404') { //인증번호: 입력
+                  vm.ModalOpen('modal08');
+                } else if(rsp.retCode == '4009') { //인증실패: 시간초과
+                  vm.ModalOpen('modal10');
+                } else if(rsp.retCode == '4010') { //인증실패: 인증번호
+                  vm.ModalOpen('modal09');
+                } else if(rsp.retCode == '4011') { //인증실패: 5회
+                  vm.ModalOpen('modal11');
+                } else{
+                   return;
+                }                
+            });
+        },
+        formCheck: function() {
+            this.errors = [];
+            if(!this.isAuthNum){
+              this.errors.push('인증요청을 먼저 해주세요.');
+            }
+            if(!this.mdn){
+              this.errors.push('휴대폰 번호를 확인해주세요.');
+            } 
+            if(!this.confirmNum){
+              this.errors.push('인증번호를 입력하세요.');
+            } 
+            return this.errors.length == 0;
+        },
+
+                  clickMenu(link){
+       this.$router.push({
+            path: link
+        }); 
+        },
+      
+      ModalOpen: function(target){      
+      this.$refs.LoginPopup.ModalOpen(target);
+    },
+    timerStart: function() { 
+    // 1초에 한번씩 start 호출
+      this.TimeCounter = 180; 
+      var interval = setInterval(() => {
+      this.TimeCounter--; 
+      //1초씩 감소 
+      this.TimerStr = this.prettyTime();
+      if (this.TimeCounter <= 0) 
+      {
+        this.timerStop(interval); 
+      //   this.ModalOpen('modal10');
+      }
+      }, 100);
+      
+      return interval; 
+    }, 
+
+      timerStop: function(Timer) 
+       { 
+        clearInterval(Timer);
+       this.TimeCounter = 0; 
+       }, 
+
+       prettyTime: function() { 
+         // 시간 형식으로 변환 리턴
+          let time = this.TimeCounter / 60; 
+          let minutes = parseInt(time);
+          let secondes = Math.round((time - minutes) * 60);
+
+           return ( 
+             minutes.toString().padStart(2, "0") + 
+             ":" 
+             + secondes.toString().padStart(2, "0") 
+                  );
+         },
+
+    }
+  };
+</script>

frontend/src/modules/login/views/LoginMain.vue

@@ -0,0 +1,153 @@
+<template>  
+<div class="wrap bg-wrap">
+		<div class="login-box adm-login">
+			<div class="wbox">
+				<div class="logo"></div>
+				<h3 class="title">관리자 로그인</h3>
+				<!-- <form action=""> -->
+					<div class="login-form">
+						<li><input type="text" placeholder="아이디" v-model="userId"></li>
+						<li><input type="password" placeholder="비밀번호" v-model="userPwd"></li>
+						<li>
+							<span class="lcont"><input type="checkbox" id="id-remember" ref="chkSaveId" checked><label for="id-remember">아이디 저장</label></span>
+							<span class="rcont"><button class="btn-pwreset" @click="clickMenu('/view/login/resetPassword')">비밀번호 초기화</button></span>
+						</li>
+						<li><button class="btn-pcolor" v-on:click="ajaxlogin">로그인</button></li>
+					</div>
+				<!-- </form> -->
+				<div class="login-notice">
+					<div>
+						<li>비밀번호 분실 시 비밀번호 초기화를 이용해주세요.</li>
+						<li>비밀번호는 90일이내 변경하여 안전히 관리해주세요.</li>
+					</div>
+				</div>
+			</div>
+       
+		</div>
+    <login-popup ref="LoginPopup"> </login-popup>
+    </div> 
+</template>
+
+<script>
+  import api from '../service/api';
+  import LoginPopup from '@/components/LoginPopup.vue';
+  import tokenSvc from '@/common/token-service';
+  //import * as utils from '@/common/utils';
+
+  export default {
+    data: function() {
+      return {
+        errors: [],
+        corpId: '',
+        userId: '',
+        userPwd: ''
+      };
+    },
+    created() {      
+      // 로그인 페이지 진입시
+      if(!!tokenSvc.getToken()){        
+        this.$store.commit("login/isLogin", true);      
+        this.$store.commit("login/isAuthChk", true);
+        this.$router.push({ path: '/' });
+      }else{
+        this.$store.commit("login/isLogin", false);
+        this.$store.commit("login/isAuthChk", false);
+        this.$store.commit("login/isErrorPage", false);
+      }
+    },
+    mounted() {    
+      this.$refs.chkSaveId.checked = true;
+
+      if (localStorage.hubwebUserId) {  
+        this.userId = localStorage.hubwebUserId;
+      }
+    },
+    destroyed() {
+      let cont = document.querySelector(".wrap");
+      cont.classList.remove("login-wrap");      
+    },
+    components: {
+        LoginPopup : LoginPopup
+    },
+    methods: {
+      chgChkUserId() {
+        if (this.$refs.chkSaveId.checked == true) {
+          localStorage.hubwebUserId = this.userId;
+        } else {
+          delete localStorage.hubwebUserId;
+        }
+      },
+      toRegister(){
+        this.$router.push({ name: 'register'});
+      },
+      formCheck: function() {
+        this.errors = [];
+        
+
+        if (!this.userId) this.errors.push('아이디를 입력해 주세요.');
+        if (!this.userPwd) this.errors.push('비밀번호를 입력해 주세요.');
+
+        return this.errors.length == 0;
+      },
+      ajaxlogin: function() {
+        
+        var vm = this;
+        vm.errmsg = null;
+
+        if (!vm.formCheck()) return false;
+        
+        let oprtrPw = this.userPwd;
+        
+        // FormData 객체를 파라미터로 넘기면 Content-Type: multipart/form-data; 요청을 한다.
+        // 일반 Object를 파라미터로 넘기면 Content-Type: application/json;charset=UTF-8 요청을 한다.
+        var params = {          
+          "oprtrId": this.userId,
+          "oprtrPw": this.userPwd,
+        }        
+        //로그인버튼을 누를시 상황
+        api.login(params).then(function(response) {    
+          
+          var rsp = response.data;     
+          
+          if(rsp.retCode == '0000'){            
+            var path = rsp.data.nextUrl;
+            console.log(path);
+            vm.chgChkUserId();            
+            vm.$store.commit("login/isLogin", true);
+            vm.$store.commit("login/savePwd", oprtrPw);
+            vm.$router.push({ path: '/view/login/auth'});
+          } else if(rsp.retCode == '4004') { // ID/PWD 불일치
+            vm.errors.push('로그인 실패하였습니다. (5회 실패 시 계정 잠김)');
+            vm.ModalOpen('modal01');
+          } else if(rsp.retCode == '4005') { // ID/PWD 불일치 횟수초과로 계정 잠김
+            // msg = '5회 이상 로그인 실패하여 해당 아이디에 대한 계정이 잠금처리되었습니다.\n관리자에게 문의하세요.';
+            vm.ModalOpen('modal02');
+          } else if(rsp.retCode == '4006') {
+            // msg = '비밀번호를 변경하신지 90일이 지났습니다.\n비밀번호 변경 화면으로 이동합니다.';
+            vm.ModalOpen('modal04');
+          } else if(rsp.retCode == '4007') {
+             // msg = '관리자 승인 후 이용할 수 있습니다.';
+            vm.ModalOpen('modal03');
+         } else {            
+            vm.$store.commit("login/isLogin", false);
+            return;
+          }
+        });
+
+      },
+
+
+      clickMenu(link){
+       
+       this.$router.push({
+            path: link
+        }); 
+    },
+   ModalOpen: function(target){      
+      this.$refs.LoginPopup.ModalOpen(target);
+    },
+    
+    } //method 끝
+  };
+
+</script>

frontend/src/modules/login/views/ResetPassword.vue

@@ -0,0 +1,97 @@
+<template>
+
+    <div class="wrap bg-wrap">
+
+        <!-- s: 패스워드초기화 -->
+        <div class="login-box pw-reset">
+            <div class="logo"></div>
+            <div class="wbox">
+                <h3 class="title">비밀번호 초기화</h3>
+                <!-- <form action=""> -->
+                    <div class="login-form">
+                        <div>
+
+                            <input type="text" placeholder="아이디를 입력하세요"></div>
+                            <div class="button_group">
+                                <button class="btn-default" @click="clickMenu('/login')">취소</button>
+                                <button class="btn-pcolor">비밀번호 초기화 문자 발송하기</button>
+                            </div>
+                        </div>
+                    <!-- </form> -->
+                    <div class="login-notice">
+                        <div>
+                            <li>초기화된 비밀번호는 등록된 휴대폰 문자메시지로 발송됩니다.</li>
+                            <li>휴대폰 번호 변경 시 관리자로 문의해주세요.</li>
+                        </div>
+                    
+                </div>
+            </div>
+            <div>
+                
+            </div>
+            </div>
+        
+        <login-popup ref="LoginPopup"> </login-popup>
+    
+
+</div>
+
+</template>
+
+<script>
+// import api from '../service/api';
+import LoginPopup from '@/components/LoginPopup.vue';
+
+export default {
+    name: 'resetPassword',
+    data() {
+        return {}
+    },
+    created() {
+      this.$store.commit("login/isLogin", false);
+      this.$store.commit("login/isAuthChk", false);
+    },
+    components: {
+        LoginPopup
+    },
+    methods: {
+        // ajaxReset: function(){
+        //     var vm = this;
+        //     vm.errmsg = null;
+        //     // if (!vm.formCheck()) return false;
+
+        // var params = {
+        //   //"corpId": this.corpId,
+        // //   "userPwd": this.userPwd,
+        
+        // }        // 주석으로 인한 
+        //     api.newpwd(params).then(function(response){
+        //         var rsp = response.data;
+        //         console.log("RESULT_CODE : "+rsp.retCode);
+        //         if(rsp.retCode == '000'){
+        //             // vm.$store.commit("login/isLogin", true);
+        //            //vm.$store.commit("login/isAuthChk", true);
+
+        //            vm.ModalOpen('modal12');
+        //         //    vm.$router.push({ path : 'view/login'});
+        //         } else {
+        //             return;
+        //   }
+        //     });
+        // }
+        // ,
+        clickMenu(link) {
+
+            this
+                .$router
+                .push({path: link});
+        },
+
+         ModalOpen: function(target){      
+      this.$refs.LoginPopup.ModalOpen(target);
+    },
+    }
+}
+</script>
+
+<style></style>