- 시스템관리 > 관리자목록조회, 관리자등록, 관리자수정, 관리자삭제, 관리자상세조회

build.gradle

@@ -105,6 +105,9 @@ dependencies {
 	// https://mvnrepository.com/artifact/commons-dbcp/commons-dbcp
 	implementation group: 'commons-dbcp', name: 'commons-dbcp', version: '1.4'
 
+		// validation
+	implementation 'org.springframework.boot:spring-boot-starter-validation'
+
 }
 
 bootJar {

frontend/package.json

@@ -1,7 +1,7 @@
 {
-  "name": "hub-web-easy",
+  "name": "mhez-admin-web",
   "version": "0.1.0",
-  "private": true,  
+  "private": true,
   "proxy":"http://localhost:7070",
   "scripts": {
     "serve": "vue-cli-service serve --port 3000",

frontend/src/App.vue

@@ -1,3 +1,3 @@
-<template>
+<template>
-    <router-view/>
+    <router-view/>
-</template>
+</template>

frontend/src/assets/css/common.css

@@ -31,6 +31,7 @@ footer,header,hgroup,menu,nav,section {
     display:block;
 }
 table {
+	font-family: 'SpoqaHanSansNeo';
     border-collapse:collapse;
     border:0 none;
 }
@@ -38,16 +39,28 @@ input, select, option{
     font-family: 'SpoqaHanSansNeo'; 
 }
 input:focus{
-    outline: 1px solid #000;
+    border: 1px solid #000 !important;
 }
+
+input:focus + label{
+  color:#000;
+}
+
+input:valid + label{
+  color:#000;
+}
+
+
 select:focus{
-    outline: 1px solid #000;
+    border: 1px solid #000 !important;
 }
+
+
 input[type="checkbox"] + label{
     cursor: pointer;
 }
 input:disabled{
-    background-color: #eeeeee;
+    background-color: #eeeeee; border:1px solid #e7e7e7 !important;
 }
 input[type="radio"]{
     display:none;

frontend/src/assets/css/layout.css

@@ -5,31 +5,58 @@ SpoqaHanSansNeo
 ======================*/
 @font-face {
   font-family: 'SpoqaHanSansNeo';
-  src: url('../font/SpoqaHanSansNeo-Thin.woff') format('woff');
+  src: url('../font/SpoqaHanSansNeo-Thin.woff2') format('woff2');
   font-weight: 100;
   font-style: normal;
 }
 @font-face {
   font-family: 'SpoqaHanSansNeo';
-  src: url('../font/SpoqaHanSansNeo-Light.woff') format('woff');
+  src: url('../font/SpoqaHanSansNeo-Light.woff2') format('woff2');
   font-weight: 300;
   font-style: normal;
 }
 @font-face {
   font-family: 'SpoqaHanSansNeo';
-  src: url('../font/SpoqaHanSansNeo-Regular.woff') format('woff');
+  src: url('../font/SpoqaHanSansNeo-Regular.woff2') format('woff2');
   font-weight: 400;
   font-style: normal;
 }
 @font-face {
   font-family: 'SpoqaHanSansNeo';
-  src: url('../font/SpoqaHanSansNeo-Medium.woff') format('woff');
+  src: url('../font/SpoqaHanSansNeo-Medium.woff2') format('woff2');
   font-weight: 500;
   font-style: normal;
 }
 @font-face {
   font-family: 'SpoqaHanSansNeo';
-  src: url('../font/SpoqaHanSansNeo-Bold.woff') format('woff');
+  src: url('../font/SpoqaHanSansNeo-Bold.woff2') format('woff2');
+  font-weight: 700;
+  font-style: normal;
+}
+/*======================
+LGSmHa
+======================*/
+@font-face {
+  font-family: 'LGSmHa';
+  src: url('../font/LGSmHaL.woff2') format('woff2');
+  font-weight: 300;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'LGSmHa';
+  src: url('../font/LGSmHaR.woff2') format('woff2');
+  font-weight: 400;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'LGSmHa';
+  src: url('../font/LGSmHaSB.woff2') format('woff2');
+  font-weight: 600;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'LGSmHa';
+  src: url('../font/LGSmHaB.woff2') format('woff2');
   font-weight: 700;
   font-style: normal;
 }
@@ -45,6 +72,16 @@ body{
 .div-cont {width: 1200px; padding: 0 30px; box-sizing: border-box; margin: auto;}
 
 
+/*
+#스크롤바
+*/
+::-webkit-scrollbar {width:5px; height: 5px; border: 0px solid #fff;  background: rgba(140, 140, 140, 0.0);}
+::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {display: block; height: 4px; background:rgba(0,0,0,0)}
+::-webkit-scrollbar-track {background: rgba(140,140,140,0.0); -webkit-border-radius: 10px; border-radius:10px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.0)}
+::-webkit-scrollbar-thumb {height: 50px; width: 50px; background: rgba(20,20, 20, .1); -webkit-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,.0)}
+
+
+
 
 /*======================
 	#logo
@@ -81,9 +118,13 @@ body{
 .dimmed.open {display: block !important;}
 .popup-wrap {display: none;}
 .popup-wrap.open {display: block !important;}
-.popup {width: 390px; border-radius: 8px; background: #fff; padding: 0 30px; box-sizing: border-box; border: 1px solid rgba(197,197,197,0.36); box-shadow: 2px 2px 8px rgba(171,171,171,0.30); position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); display: none;}
+.popup {width: 390px; border-radius: 12px; background: #fff; padding: 0 30px; box-sizing: border-box; border: 1px solid rgba(197,197,197,0.36); box-shadow: 2px 2px 8px rgba(171,171,171,0.30); position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); display: none;
+max-height: 90vh; overflow: auto;}/*스크린 height 100%를 벗어나는 긴 팝업의 경우 추가 class*/
+
 .popup.open {display: block !important;}
-.popup .pop-head {padding: 30px 0 25px;}
+.popup .pop-head {padding: 30px 0 25px;
+	position: sticky; z-index: 999; top:0; left:30px; background: #fff; /*팝업 스크롤 시 타이틀 고정 */
+	}
 .popup .pop-head .pop-tit {font-size: 18px; color: #222222; letter-spacing: -1px; line-height: 100%;}
 .popup .btn-close {width: 30px; height: 30px; position: absolute; top: 0; right: 0; background: url("../images/icon-close.png") no-repeat center center; background-size: 11px; border: none;}
 .popup .pop-cont {}
@@ -91,8 +132,8 @@ body{
 .popup .pop-cont p + p {margin-top: 10px;}
 .popup .pop-btn1 {display: flex; justify-content: flex-end; align-items: center; margin: 35px 0 25px;}
 .popup .pop-btn2 {display: flex; justify-content: space-between; align-items: center; margin: 35px 0 25px;}
-.popup .pop-btn1 button {width: 49%; height: 42px; font-size: 16px; font-weight: 400; letter-spacing: -1.1px;}
+.popup .pop-btn1 button {width: 49%; height: 40px; font-size: 16px; font-weight: 400; letter-spacing: -1.1px;}
-.popup .pop-btn2 button {width: 49%; height: 42px; font-size: 16px; font-weight: 400; letter-spacing: -1.1px;}
+.popup .pop-btn2 button {width: 49%; height: 40px; font-size: 16px; font-weight: 400; letter-spacing: -1.1px;}
 
 
 

frontend/src/assets/css/style.css

@@ -307,7 +307,7 @@ header .user_wrap .user_info .logout {
 .main_menu > li.stats.is-current .menu_btn { background-image: url(../images/icon-stats-on.png); }
 .main_menu > li.system.is-current .menu_btn { background-image: url(../images/icon-system-on.png); }
 
-.main_menu > li .sub_menu_wrap { padding:0 10px 10px; display:none; }
+.main_menu > li .sub_menu_wrap { padding:0 10px 10px; display:none; margin-top: 5px; }
 .main_menu > li.is-current .sub_menu_wrap { display: block; }
 
 
@@ -317,7 +317,6 @@ header .user_wrap .user_info .logout {
 
 
 
-
 .contents {
   padding: 0 4.16vw;
   width: 100%;
@@ -332,7 +331,7 @@ header .user_wrap .user_info .logout {
   background-color: #fff;
   width: 100%;
   border-radius: 24px;
-  padding: 15px 0;
+  padding: 0 0 15px 0;
   margin-bottom: 70px;
 }
 
@@ -351,8 +350,8 @@ header .user_wrap .user_info .logout {
       -ms-flex-align: center;
           align-items: center;
   border-bottom: 1px solid #d5d3e6;
-  padding: 0 40px;
+  padding: 21px 0px 0 0px;
-  margin-bottom: 27px;
+  margin: 0 40px 27px 40px;
 }
 
 .contents .top_wrap .title {
@@ -370,6 +369,33 @@ header .user_wrap .user_info .logout {
   letter-spacing: -0.025em;
 }
 
+
+.contents .top_tab {
+  position: relative; margin: 0 40px; height: 45px; border-bottom: 1px solid #ddddeb; margin-bottom: 40px; display: flex;
+  font-size: 16px; text-align: center ; 
+}
+
+
+.contents .top_tab a.on {
+    background: url("../images/tab_arrow.png") #fff no-repeat; background-position: 20px center; border: 1px solid #ddddeb; border-bottom: 1px solid #ffffff;
+	color: #d82e89; font-weight: 500;
+}
+.contents .top_tab a.on:hover {
+    background: url("../images/tab_arrow.png") #fff no-repeat; background-position: 20px center; border: 1px solid #ddddeb; border-bottom: 1px solid #ffffff;
+	color: #d82e89; font-weight: 500;
+}
+
+.contents .top_tab a {
+    background: #ececf3; border: 1px solid #ececf3; border-bottom: 1px solid #ddddeb;  height: 45px;padding: 10px 20px; min-width: 180px; display: inline-block; border-radius:  9px 9px 0 0 ; cursor: pointer;
+	color: #a5a5bd;font-weight: 500;
+}
+
+.contents .top_tab a:hover {
+    background: #bdbde0; border: 1px solid #bdbde0; border-bottom: 1px solid #ddddeb;
+	color: #ffffff;font-weight: 500;
+}
+
+
 .contents .search_wrap {
   background-color: #f6f6f8;
   display: -webkit-box;
@@ -381,6 +407,17 @@ header .user_wrap .user_info .logout {
           align-items: flex-end;
   border-radius: 4px;
   margin-bottom: 50px;
+  flex-wrap: wrap;
+}
+
+.contents .search_wrap .group{
+	width: 100%;
+	display: flex;
+	align-items: flex-end;
+}
+
+.contents .search_wrap .group + .group{
+	margin-top: 20px;
 }
 
 .contents .search_wrap button.grey {
@@ -410,7 +447,7 @@ header .user_wrap .user_info .logout {
   color: #a3a3a3;
 }
 
-.contents .select_box select {
+.contents select {
   width: 100%;
   height: 40px;
   border: 1px solid #c9c9c9;
@@ -430,6 +467,14 @@ header .user_wrap .user_info .logout {
   color: #000;
 }
 
+.contents .NumberSe {
+  float:right;
+  min-width:90px;
+  width:auto;
+  margin-left:10px;
+  margin-top:-7px;	
+}
+
 .contents .input_box {
   display: -webkit-box;
   display: -ms-flexbox;
@@ -449,14 +494,19 @@ header .user_wrap .user_info .logout {
   color: #a3a3a3;
 }
 
+
+.contents .input_box .label:focus {
+  color: #000;
+}
+
+
+
 .contents .input_box input {
   width: 100%;
   height: 40px;
   border: 1px solid #c9c9c9;
   position: relative;
-  background: url(../images/icon-search.png) no-repeat 6% center/14px auto;
   background-color: #fff;
-  padding-left: 43px;
   border-radius: 4px;
 }
 
@@ -476,12 +526,12 @@ header .user_wrap .user_info .logout {
   color: #c9c9c9;
 }
 
-.contents .input_box.id {
+.contents .id {
   position: relative;
   margin-left: 10px;
 }
 
-.contents .input_box.id:before {
+.contents .id:before {
   content: '';
   position: absolute;
   top: 25px;
@@ -491,6 +541,95 @@ header .user_wrap .user_info .logout {
   background-color: #e8e8f1;
 }
 
+/* input cal + search-box*/
+.w35{width:35%;}
+.contents .table.table_form.m50{margin-bottom: 50px;}
+
+.contents .input_box.cal{
+	display: inline-block;
+	width: 27.34%;
+}
+
+.contents .input_box.cal label {
+    display: block;
+} 
+
+.contents .input_box.cal input {
+    display: inline-block;
+    width: 48%;
+    float: left;
+	background: #fff url(../images/icon-calender.png) no-repeat right 6% center;
+}
+.contents .input_box.cal input + input{
+	margin-left: 4%;
+}
+
+.contents .input_box.cal .description{
+	position: absolute; margin: 10px 0 0 10px; color:#666; font-size: 13px; font-weight: 400;
+}
+
+.contents .input_box .search-box {
+  background: #fff url(../images/icon-search.png) no-repeat 6% center/14px auto;	
+  padding-left: 43px;
+}
+
+.input-address input:nth-child(1){
+	width: 98px;
+}
+
+.input-address input:nth-child(2){
+	width: calc(100% - 480px);
+}
+
+.input-address input:nth-child(3){
+	width: 344px;
+}
+
+.input-bnumber input:nth-child(1){
+	width: 62px;
+}
+
+.input-bnumber input:nth-child(2){
+	width: 52px;
+}
+
+.input-bnumber input:nth-child(3){
+	width: 116px;
+}
+
+.input-double{
+	display: flex;
+}
+
+.input-memo{
+	margin: 5px 0;
+	display: flex;
+}
+
+.input-double input, .button-double button{
+	width: calc(37.5% - 5px) !important;
+}
+
+.btn-a{
+	width: auto !important;
+	display: inline-flex !important;
+}
+
+
+.input-memo input{
+	height: 240px !important;
+	width: 86%;
+}
+
+.contents .two-input{
+	display: inline-flex;
+    align-items: flex-end;
+}
+
+.contents .two-input .input_box{
+	width: 100%;
+}
+
 .contents .button {
   height: 40px;
   color: #fff;
@@ -512,6 +651,7 @@ header .user_wrap .user_info .logout {
 .contents .button.grey {
   background-color: #35354f;
   font-size: 16px;
+  padding: 0 15px;
 }
 
 .contents .button.grey:hover {
@@ -539,8 +679,36 @@ header .user_wrap .user_info .logout {
   border-color: #000;
 }
 
+/*icon button*/
+
+.download::before {
+  content:'';
+  background: url(../images/icon-download.png) no-repeat 0 0;
+  width:23px;
+  height:23px;
+  margin-right: 5px;
+}
+
+.add::before {
+  content:'';
+  background: url(../images/icon-add.png) no-repeat center center;
+  width:24px;
+  height:24px;
+  margin-right: 5px;
+  margin-top: 2px;
+}
+
+.del::before {
+  content:'';
+  background: url(../images/icon-del.png) no-repeat center center;
+  width:24px;
+  height:24px;
+  margin-right: 5px;
+  margin-top: 2px;
+}
+
 .contents .info {
-  padding: 0 30px;
+  padding: 0 40px;
   margin-bottom: 10px;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -550,17 +718,23 @@ header .user_wrap .user_info .logout {
           justify-content: space-between;
 }
 
-.contents .info .count {
+.info .count {
   font-size: 16px;
   position: relative;
   padding-left: 10px;
 }
 
-.contents .info .count span {
+.info .count span {
   color: #eb008b;
 }
 
-.contents .info .count:before {
+.info .count p{
+	color: #666666;
+    font-size: 14px;
+    display: inline-flex;
+}
+
+.info .count:before {
   content: '';
   position: absolute;
   top: 10px;
@@ -574,6 +748,7 @@ header .user_wrap .user_info .logout {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
+  margin-top: -7px;
 }
 
 .contents .info .title {
@@ -593,9 +768,129 @@ header .user_wrap .user_info .logout {
   background-color: #eb008b;
 }
 
+/*pagination*/
+
+.contents .pagination .arrow-btn button{
+	border:none;
+    padding: 0 5px;
+}
+
+.btn-first, .btn-prev{
+	background:url(../images/icon-pgn-l.png) no-repeat;
+	width:24px;
+	height:24px;
+}
+
+.btn-next, .btn-last{
+	background:url('../images/icon-pgn-r.png') no-repeat;
+	width:24px;
+	height:24px;
+}
+
+.btn-first,.btn-last{background-position: 0px 0px;}
+.btn-first:hover, .btn-last:hover{background-position: 0px -48px;}
+.btn-prev, .btn-next{background-position: 0px -24px;}
+.btn-prev:hover, .btn-next:hover{background-position: 0px -72px;}
+
+.contents .pagination {
+	display:flex;
+	justify-content: center;
+	margin-bottom: 50px;
+}
+
+.contents .pagination ul{
+  display:flex;
+  align-items:center;
+}
+
+.contents .pagination ul li a{
+  color:#9a9a9a;
+  font-size: 14px;
+  padding: 0 15px;
+}
+.contents .pagination ul li a:hover{
+	color:#000;
+	text-decoration: underline;
+}
+
+/*contents table 추가*/
+
+.contents .table table .arrow_box {
+	display: none;
+	background-color: #fff; 
+	border: #666666 solid 1px; 
+	border-radius: 4px; 
+	color: #666666; 
+	font-size: 14px; 
+	font-weight: 500; 
+	letter-spacing: -0.25px; 
+	margin-top: 16.8px; 
+	padding: 10px 20px; 
+	position: absolute; 
+	min-width: 120px; 
+	z-index: 100;
+	left: 42px;
+}
+
+.contents .table table .arrow_box:before{
+	border-color: #666666 transparent; 
+	border-style: solid; 
+	border-width: 0 6px 8px 6.5px; 
+	content: ''; 
+	display: block; 
+	left: 20px; 
+	position: absolute; 
+	bottom: 100%; 
+	width: 0; 
+	z-index: 0;
+}
+
+.contents .table table .arrow_box:after {
+	border-color: #fff transparent; 
+	border-style: solid;  
+	border-width: 0 6px 8px 6.5px; 
+	content: ''; 
+	display: block; 
+	left: 20px; 
+	position: absolute; 
+	bottom: 99%; 
+	width: 0; 
+	z-index: 1;
+}
+
+.contents .table.calculate table td, .contents .table.calculate table th{
+	border-left: 1px solid #dadae6;
+}
+
+.contents .table.calculate table td:nth-child(1), .contents .table.calculate table tr:nth-child(1) th:nth-child(1){
+	border-left: 0;
+}
+
+.contents .table table .total{
+	background-color: #ececf3;
+}
+
+.contents .table table td span {cursor: pointer;}
+
+.contents .table table td .linkstyle {cursor: pointer; text-decoration: underline;}
+.contents .table table td .linkstyle:hover {color:#eb008b;}
+
+
+.contents .table table td span:hover + p.arrow_box {
+  display: block;
+}
+
+.contents .table.table_form .tr_input td{
+	padding: 0;
+}
+
+.contents .table.table_form .tr_input .td_radio{
+	padding-left: 10px;
+}
+
 .contents .table {
   color: #333333;
-  padding: 0 30px;
+  padding: 0 40px;
   margin-bottom: 65px;
 }
 
@@ -604,6 +899,7 @@ header .user_wrap .user_info .logout {
   text-align: center;
   border-top: 2px solid #69677e;
   border-bottom: 1px solid #a4a4b0;
+  table-layout: fixed;
 }
 
 .contents .table table thead {
@@ -617,7 +913,7 @@ header .user_wrap .user_info .logout {
 .contents .table table th {
   font-weight: 500;
   height: 50px;
-  position: relative;
+  position: relative; font-size: 14px;
 }
 
 .contents .table table tr {
@@ -626,12 +922,12 @@ header .user_wrap .user_info .logout {
   border-bottom: 1px solid #dadae6;
 }
 
-.contents .table table tr:hover {
+.contents .table table tbody tr:not(.table_form table tr):hover {
   background-color: #fafaff;
 }
 
 .contents .table table td {
-  position: relative;
+  position: relative; font-size: 14px;
 }
 
 .contents .table table td a {
@@ -681,15 +977,16 @@ header .user_wrap .user_info .logout {
 }
 
 .contents .table.table_form {
-  font-size: 16px;
+  font-size: 14px;
   margin-bottom: 24px;
 }
 
 .contents .table.table_form th {
   background-color: #f7f7f7;
-  width: 9%;
+  width: 11%;
   text-align: left;
   padding-left: 20px;
+  font-size: 14px;
 }
 
 .contents .table.table_form th.center {
@@ -699,6 +996,7 @@ header .user_wrap .user_info .logout {
 
 .contents .table.table_form td {
   text-align: left;
+  padding-left: 10px;font-size: 14px;
 }
 
 .contents .table.table_form td.check {
@@ -741,14 +1039,15 @@ header .user_wrap .user_info .logout {
   background-color: #f7f7f7;
 }
 
-.contents .table.table_form .tr_input input[type="text"] {
+.contents .table.table_form .tr_input input[type="text"], .contents .table.table_form .tr_input select {
   border: 1px solid #c9c9c9;
   border-radius: 4px;
   height: 40px;
   margin-left: 10px;
+  font-size: 14px;
 }
 
-.contents .table.table_form .tr_input.w30 input[type="text"] {
+.contents .table.table_form .tr_input.w30 input[type="text"], .contents .table.table_form .tr_input.w30 select {
   width: 30%;
 }
 
@@ -760,8 +1059,8 @@ header .user_wrap .user_info .logout {
   width: 98%;
 }
 
-.contents .table.table_form .tr_input input[type="radio"] + label:nth-child(2) {
+.contents .table.table_form input[type="radio"] + label:nth-child(2) {
-  margin: 0 30px 0 10px;
+  margin: 0 30px 0 0;
 }
 
 .contents .pop-btn2 {
@@ -805,10 +1104,18 @@ header .user_wrap .user_info .logout {
   background-color: #c7c7c7;
 }
 
+.popup{
+	font-family: 'SpoqaHanSansNeo';
+}
+
 .popup.popup_form {
   width: 525px;
 }
 
+.popup.popup_form .info .count {
+  margin-bottom: 12px;
+}
+
 .popup.popup_form .pop-head {
   border-bottom: 1px solid #d5d3e6;
   padding-bottom: 0;
@@ -864,7 +1171,7 @@ header .user_wrap .user_info .logout {
   padding: 0 0 0 10px;
 }
 
-.popup.popup_form table td input {
+.popup input {
   width: 100%;
   height: 40px;
   border: 1px solid #c9c9c9;
@@ -872,19 +1179,19 @@ header .user_wrap .user_info .logout {
   font-size: 16px;
 }
 
-.popup.popup_form table td input::-webkit-input-placeholder {
+.popup input::-webkit-input-placeholder {
   color: #c9c9c9;
 }
 
-.popup.popup_form table td input:-ms-input-placeholder {
+.popup input:-ms-input-placeholder {
   color: #c9c9c9;
 }
 
-.popup.popup_form table td input::-ms-input-placeholder {
+.popup input::-ms-input-placeholder {
   color: #c9c9c9;
 }
 
-.popup.popup_form table td input::placeholder {
+.popup input::placeholder {
   color: #c9c9c9;
 }
 
@@ -907,7 +1214,7 @@ header .user_wrap .user_info .logout {
   color: #333333;
 }
 
-.popup.popup_form table .input_search {
+.popup .input_search {
   height: 50px;
   display: -webkit-box;
   display: -ms-flexbox;
@@ -920,7 +1227,7 @@ header .user_wrap .user_info .logout {
           align-items: center;
 }
 
-.popup.popup_form table .input_search input[type="text"] {
+.popup .input_search input[type="text"] {
   position: relative;
   background: url(../images/icon-search.png) no-repeat 6% center/14px auto;
   background-color: #fff;
@@ -929,23 +1236,23 @@ header .user_wrap .user_info .logout {
   width: 72%;
 }
 
-.popup.popup_form table .input_search input[type="text"]::-webkit-input-placeholder {
+.popup .input_search input[type="text"]::-webkit-input-placeholder {
   color: #c9c9c9;
 }
 
-.popup.popup_form table .input_search input[type="text"]:-ms-input-placeholder {
+.popup .input_search input[type="text"]:-ms-input-placeholder {
   color: #c9c9c9;
 }
 
-.popup.popup_form table .input_search input[type="text"]::-ms-input-placeholder {
+.popup .input_search input[type="text"]::-ms-input-placeholder {
   color: #c9c9c9;
 }
 
-.popup.popup_form table .input_search input[type="text"]::placeholder {
+.popup .input_search input[type="text"]::placeholder {
   color: #c9c9c9;
 }
 
-.popup.popup_form table .button {
+.popup .button {
   height: 40px;
   color: #fff;
   border-radius: 4px;
@@ -963,15 +1270,161 @@ header .user_wrap .user_info .logout {
   margin-left: 10px;
 }
 
-.popup.popup_form table .button.grey {
+.popup .button.grey {
   background-color: #35354f;
   font-size: 16px;
 }
 
-.popup.popup_form table .button.grey:hover {
+.popup .button.grey:hover {
   background-color: #0a0b24;
 }
 
+/*customer popup*/
 
+.popup.b-popup{
+	width:700px;
+}
+
+.popup.price table th{
+	width:20%;
+}
+
+.popup label{
+	font-size: 13px;
+    letter-spacing: -0.025em;
+    margin-bottom: 6px;
+    color: #333333;
+}
+
+.popup .number{
+	color:#000000;
+	font-weight: bold;
+}
+.popup .number.blue{color:#0073d4;}
+.popup .number.red{color:#ff3600;}
+
+
+.popup.popup_form .table-c{
+    table-layout: fixed;
+    margin-top: 10px;
+}
+
+.popup.popup_form .table-c th, .popup.popup_form .table-c td{
+	padding: 0;
+	text-align:center;
+}
+
+.popup.b-popup tr th:nth-child(1){
+	width:60%;
+}
+
+.popup.b-popup tr th:nth-child(2){
+	width:10%;
+}
+
+.popup.b-popup tr th:nth-child(3), .popup.b-popup tr th:nth-child(4){
+	width:15%;
+}
+
+.popup.b-popup tr .memo{
+	text-align: left;
+	padding: 0 0 0 10px;
+}
+
+.popup.b-popup tr:nth-child(1) .memo:nth-child(1){
+	height: 100px;
+    display: block;
+    overflow: auto;
+}
+
+.popup .pop-cont.bottom{
+	margin-top: 20px;
+}
+
+.popup.popup_form .pop-btn2 .download {
+	display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.popup.popup_form .pop-btn2.bulk{
+	justify-content: space-between;
+	margin-bottom: 20px;
+}
+
+.popup.popup_form .pop-btn2.bulk button{
+	width: 49%;
+	display: flex;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;	
+	justify-content: normal;
+}
+
+.popup.popup_form .pop-btn2.bulk button:nth-child(1)::before{
+	content: '';
+    background: url(../images/icon-f-download.png) no-repeat 0 0;
+    width: 23px;
+    height: 23px;
+    margin: 2px 5px 0 15px;
+}
+
+.popup.popup_form .pop-btn2.bulk button:nth-child(2)::before{
+	content: '';
+    background: url(../images/icon-f-upload.png) no-repeat 0 0;
+    width: 23px;
+    height: 23px;
+	margin: 2px 5px 0 15px;
+}
+
+.popup.popup_form .btn-default{
+	color: #333333;
+	border-radius: 6px;
+    border: 1px solid #a1a1a1;
+	font-size: 14px;
+}
+
+.popup.popup_form .file{
+	color: #656565;
+    margin-bottom: 18px;
+}
+
+.popup.popup_form .file button{
+	background: #e4e4e4 url(../images/icon-delete.png) no-repeat center center;
+    width: 24px;
+    height: 24px;
+    display: inline-block;
+    border-radius: 50%;
+    position: relative;
+    top: 6px;
+    left: 5px;
+	border: none;
+}
+
+.popup.popup_form.b-popup .input_add{
+	padding: 5px 0px 5px 0px;
+}
+
+.popup.popup_form.b-popup .input_add div{
+	display: flex;
+    justify-content: space-between;
+}
+
+.popup.popup_form.b-popup .input_add div input:nth-child(1){
+	margin-right: 5px;
+    width: 95px;
+}
+
+.input_add .button.add{
+	min-width: 40px;
+    margin-left: 2%;
+}
+
+.popup.popup_form.b-popup .input_add div:nth-child(2){
+	width: 89%;
+    padding-top: 5px;
+}
 
 /*# sourceMappingURL=style.css.map */

frontend/src/assets/js/script.js

@@ -1,6 +1,8 @@
 
-/*(function(){	
+(function(){
 	const menuList = document.querySelectorAll('.main_menu .is-sub');
+
+
 	for(const menu of menuList){
 		menu.addEventListener('click', (e)=> {
 			if(e.target.classList.contains('menu_target') || e.target.classList.contains('menu_btn')){
@@ -16,29 +18,18 @@
 			}
 		})
 	}
-})();*/
+})();
 
-/*const ModalOpen = target =>{
+
-	console.log("ModalOpen");
+function ModalOpen(target) {
 	var dimmed = document.getElementsByClassName('dimmed');
 	var wrap = document.getElementsByClassName('popup-wrap');
 	var obj = document.getElementsByClassName(target);
 	dimmed[0].style.display = 'block';
 	wrap[0].style.display = 'block';
 	obj[0].style.display = 'block';
-}*/
+}
-
+function ModalClose() {
-// eslint-disable-next-line no-unused-vars
-/*function ModalOpen(target) {
-	var dimmed = document.getElementsByClassName('dimmed');
-	var wrap = document.getElementsByClassName('popup-wrap');
-	var obj = document.getElementsByClassName(target);
-	dimmed[0].style.display = 'block';
-	wrap[0].style.display = 'block';
-	obj[0].style.display = 'block';
-}*/
-// eslint-disable-next-line no-unused-vars
-/*function ModalClose() {
 	var dimmed = document.getElementsByClassName('dimmed');
 	var wrap = document.getElementsByClassName('popup-wrap');
 	var obj = wrap[0].childElementCount
@@ -49,7 +40,6 @@
 		target[i].style.display = 'none';
 	}
 }
-// eslint-disable-next-line no-unused-vars
 function userInfoToggle(){
 	var click = "clicked";
 	var userBtn = document.querySelector('.user_wrap .user');
@@ -59,8 +49,4 @@ function userInfoToggle(){
 	else{
 		userBtn.classList.add(click);
 	}
-}*/
-
-export default{
-	ModalOpen
 }

frontend/src/common/comm-api.js

@@ -1,9 +1,9 @@
-import httpClient from '@/common/http-client';
+import httpClient from '@/common/http-client';
-// 주소찾기
+// 주소찾기
-const getAddressList = params => {
+const getAddressList = params => {
-  return httpClient.get('/api/comm/address', { params: params })
+  return httpClient.get('/api/comm/address', { params: params })
-}
+}
-
+
-export default {
+export default {
-  getAddressList
+  getAddressList
-}
+}

frontend/src/common/config.js

@@ -1,10 +1,13 @@
-const { VUE_APP_TEST_PROP, NODE_ENV = '' } = process.env;
+const { VUE_APP_TEST_PROP, NODE_ENV = '' } = process.env;
-
+
-const environment = NODE_ENV.toLowerCase();
+const environment = NODE_ENV.toLowerCase();
-const testProp = VUE_APP_TEST_PROP;
+const testProp = VUE_APP_TEST_PROP;
-
+
-const consts = {
+const consts = {
-    tokenPart1: 'JwtPart1'
+    tokenPart1: 'JwtPart1',
-}
+    tokenPart2: 'JwtPart2',
-
+    tokenPart3: 'JwtPart3',
-export { environment, testProp, consts };
+    tokenPart4: 'JwtPart4'
+}
+
+export { environment, testProp, consts };

frontend/src/common/excel.js

@@ -1,143 +1,143 @@
-import xlsx from 'xlsx';
+import xlsx from 'xlsx';
-
+
-const xlsxUtils = {
+const xlsxUtils = {
-  filename: '',
+  filename: '',
-  data: [],
+  data: [],
-  header: [],
+  header: [],
-  options: {},
+  options: {},
-  summary: {
+  summary: {
-    isUse: false,
+    isUse: false,
-    position: '',
+    position: '',
-    data: null,
+    data: null,
-    title: { replaceKeys: [], name: '' }
+    title: { replaceKeys: [], name: '' }
-  },
+  },
-  visibleDataOrder: [],
+  visibleDataOrder: [],
-  instance: undefined,
+  instance: undefined,
-  createInstance() {
+  createInstance() {
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve, reject) => {
-      this.instance = document.createElement('table');
+      this.instance = document.createElement('table');
-      resolve();
+      resolve();
-    });
+    });
-  },
+  },
-  createHeader() {
+  createHeader() {
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve, reject) => {
-      let header = this.header;
+      let header = this.header;
-      /*
+      /*
-      if (!Array.isArray(this.header[0])) {
+      if (!Array.isArray(this.header[0])) {
-        header.push(this.header);
+        header.push(this.header);
-      } else {
+      } else {
-        header = this.header;
+        header = this.header;
-      }
+      }
-      */
+      */
-
+
-      let thead = document.createElement('thead');
+      let thead = document.createElement('thead');
-      for (let row of header) {
+      for (let row of header) {
-        let tr = document.createElement('tr');
+        let tr = document.createElement('tr');
-        for (let h of row) {
+        for (let h of row) {
-          let rowspan = h.rowspan || '1';
+          let rowspan = h.rowspan || '1';
-          let colspan = h.colspan || '1';
+          let colspan = h.colspan || '1';
-          let th = document.createElement('th');
+          let th = document.createElement('th');
-          th.setAttribute('rowspan', rowspan);
+          th.setAttribute('rowspan', rowspan);
-          th.setAttribute('colspan', colspan);
+          th.setAttribute('colspan', colspan);
-          //th.setAttribute('align', 'center');
+          //th.setAttribute('align', 'center');
-          th.innerText = h.name;
+          th.innerText = h.name;
-          tr.appendChild(th);
+          tr.appendChild(th);
-        }
+        }
-        thead.appendChild(tr);
+        thead.appendChild(tr);
-      }
+      }
-      this.instance.appendChild(thead);
+      this.instance.appendChild(thead);
-      resolve();
+      resolve();
-    });
+    });
-  },
+  },
-  createDataRows() {
+  createDataRows() {
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve, reject) => {
-      let tbody = document.createElement('tbody');
+      let tbody = document.createElement('tbody');
-
+
-      if (this.options.summary != undefined && this.options.summary.isUse) {
+      if (this.options.summary != undefined && this.options.summary.isUse) {
-        this.summary = this.options.summary;
+        this.summary = this.options.summary;
-      }
+      }
-
+
-      if (this.summary.isUse && this.summary.position === 'first') {
+      if (this.summary.isUse && this.summary.position === 'first') {
-        this.appendDataRow(tbody, this.summary.data, true);
+        this.appendDataRow(tbody, this.summary.data, true);
-      }
+      }
-
+
-      this.appendDataRow(tbody, this.data, false);
+      this.appendDataRow(tbody, this.data, false);
-
+
-      if (this.summary.isUse && this.summary.position === 'last') {
+      if (this.summary.isUse && this.summary.position === 'last') {
-        this.appendDataRow(tbody, this.summary.data, true);
+        this.appendDataRow(tbody, this.summary.data, true);
-      }
+      }
-
+
-      this.instance.appendChild(tbody);
+      this.instance.appendChild(tbody);
-      resolve();
+      resolve();
-    });
+    });
-  },
+  },
-
+
-  appendDataRow(tbody, data, isSummary) {
+  appendDataRow(tbody, data, isSummary) {
-    for (let row of data) {
+    for (let row of data) {
-      let tr = document.createElement('tr');
+      let tr = document.createElement('tr');
-
+
-      if (isSummary) {
+      if (isSummary) {
-        let td = document.createElement('td');
+        let td = document.createElement('td');
-        td.innerText = this.summary.title.name;
+        td.innerText = this.summary.title.name;
-        td.setAttribute('colspan', this.summary.title.replaceKeys.length);
+        td.setAttribute('colspan', this.summary.title.replaceKeys.length);
-        //td.setAttribute('align', 'center');
+        //td.setAttribute('align', 'center');
-        tr.appendChild(td);
+        tr.appendChild(td);
-      }
+      }
-
+
-      for (let cellkey of this.visibleDataOrder) {
+      for (let cellkey of this.visibleDataOrder) {
-        if (isSummary && this.summary.title.replaceKeys.indexOf(cellkey) > -1) continue;
+        if (isSummary && this.summary.title.replaceKeys.indexOf(cellkey) > -1) continue;
-
+
-        let td = document.createElement('td');
+        let td = document.createElement('td');
-        td.innerText = row[cellkey];
+        td.innerText = row[cellkey];
-        tr.appendChild(td);
+        tr.appendChild(td);
-      }
+      }
-      tbody.appendChild(tr);
+      tbody.appendChild(tr);
-    }
+    }
-    return tbody;
+    return tbody;
-  },
+  },
-  getVisibleDataOrder() {
+  getVisibleDataOrder() {
-    let dataOrder = [];
+    let dataOrder = [];
-    if (Array.isArray(this.options.dataOrder)) {
+    if (Array.isArray(this.options.dataOrder)) {
-      dataOrder = this.options.dataOrder;
+      dataOrder = this.options.dataOrder;
-    } else if (this.options.dataOrder === 'header') {
+    } else if (this.options.dataOrder === 'header') {
-      for (let row of this.header) {
+      for (let row of this.header) {
-        for (let h of row) {
+        for (let h of row) {
-          if (h.key != undefined && h.key != null && h.key !== '') {
+          if (h.key != undefined && h.key != null && h.key !== '') {
-            dataOrder.push(h.key);
+            dataOrder.push(h.key);
-          }
+          }
-        }
+        }
-      }
+      }
-    } else {
+    } else {
-      dataOrder = Object.keys(this.data[0]);
+      dataOrder = Object.keys(this.data[0]);
-    }
+    }
-    this.visibleDataOrder = dataOrder;
+    this.visibleDataOrder = dataOrder;
-  },
+  },
-  export(data, filename, options) {
+  export(data, filename, options) {
-    this.data = data;
+    this.data = data;
-    this.filename = filename;
+    this.filename = filename;
-    this.header = options.header;
+    this.header = options.header;
-    this.options = options;
+    this.options = options;
-
+
-    this.getVisibleDataOrder();
+    this.getVisibleDataOrder();
-    return new Promise((resolve, reject) => {
+    return new Promise((resolve, reject) => {
-      this.createInstance().then(() => {
+      this.createInstance().then(() => {
-        this.createHeader().then(() => {
+        this.createHeader().then(() => {
-          this.createDataRows().then(() => {
+          this.createDataRows().then(() => {
-            this.exportTableToXlsx();
+            this.exportTableToXlsx();
-            resolve();
+            resolve();
-          });
+          });
-        });
+        });
-      });
+      });
-    });
+    });
-  },
+  },
-  exportTableToXlsx() {
+  exportTableToXlsx() {
-    let config = { raw: true, type: 'string' };
+    let config = { raw: true, type: 'string' };
-    let ws = xlsx.utils.table_to_sheet(this.instance, config);
+    let ws = xlsx.utils.table_to_sheet(this.instance, config);
-    let wb = xlsx.utils.book_new();
+    let wb = xlsx.utils.book_new();
-
+
-    xlsx.utils.book_append_sheet(wb, ws, 'Sheet1');
+    xlsx.utils.book_append_sheet(wb, ws, 'Sheet1');
-    xlsx.writeFile(wb, this.filename);
+    xlsx.writeFile(wb, this.filename);
-  }
+  }
-};
+};
-
+
-export default xlsxUtils;
+export default xlsxUtils;

frontend/src/common/http-client.js

@@ -1,105 +1,122 @@
-import axios from 'axios';
+import axios from 'axios';
-import { testProp } from './config';
+import { testProp } from './config';
-
+import tokenSvc from '@/common/token-service';
-const config = {
+import { consts } from './config';
-  //baseURL: 'http://localhost:7070',
+
-  // baseURL: apiBaseUrl,
+const config = {
-  headers: {
+  //baseURL: 'http://localhost:7070',
-    'X-Requested-With': 'XMLHttpRequest'
+  // baseURL: apiBaseUrl,
-  },  
+  headers: {
-  timeout: 120000 // timeout은 120초로 설정
+    'X-Requested-With': 'XMLHttpRequest'
-};
+  },  
-
+  timeout: 120000 // timeout은 120초로 설정
-const httpClient = axios.create(config);
+};
-
+
-const authInterceptor = config => {
+const httpClient = axios.create(config);
-  // frontend와 backend의 origin이 다른 경우
+
-  // devServer.proxy 설정을 하던지 baseURL과 withCredentials 설정을 해야 한다.
+const authInterceptor = config => {
-  // cookie, header 등에 자격정보 설정이 필요한 api는 true 설정으로 호출해야 하고
+  // frontend와 backend의 origin이 다른 경우
-  // 자격정보 설정이 필요없는 api는 withCredentials=false 설정으로 호출해야 한다.
+  // devServer.proxy 설정을 하던지 baseURL과 withCredentials 설정을 해야 한다.
-  // config.withCredentials = !config.url.startsWith('/api/public/');
+  // cookie, header 등에 자격정보 설정이 필요한 api는 true 설정으로 호출해야 하고
-  console.log("Test Url : "+ config.url);
+  // 자격정보 설정이 필요없는 api는 withCredentials=false 설정으로 호출해야 한다.
-  /*if(config.url == '/api/auth/login'){
+  // config.withCredentials = !config.url.startsWith('/api/public/');
-    config.baseURL = "http://localhost:3000";
+  console.log("Test Url : "+ config.url);
-  }*/
+  /*if(config.url == '/api/auth/login'){
-  return config;
+    config.baseURL = "http://localhost:3000";
-};
+  }*/
-
+  return config;
-const loggerInterceptor = config => {
+};
-  console.log('testProp:', testProp);
+
-  console.log('request url:', config.url, 'params:', config.data);
+const tokenInterceptor = config => {
-  return config;
+  if(tokenSvc.getAuthorization(consts.tokenPart1) != null){
-};
+    config.headers.Authorization = tokenSvc.getAuthorization(consts.tokenPart1);
-
+    //console.log("getToken : "+config.headers.Authorization);
-let loadOverlap = [];
+    //config.headers.Authorization = tokenSvc.getToken();
-const loadingLayer = (type, config) => {
+  }
-  /*
+  return config;
-  get: httpClient.get(url, { params: { ... }, headers: {"show-layer": "Yes"} }) // in 2nd property
+}
-  post: httpClient.post(url, params, { headers: {"show-layer": "Yes"} })  // 3rd property
+
-  */
+const loggerInterceptor = config => {
-  if (config.headers['Show-Layer'] == 'Yes') {
+  //console.log('testProp:', testProp);
-    if (type) {
+  //console.log('request url:', config.url, 'params:', config.data);
-      loadOverlap.push('add');
+  return config;
-    } else {
+};
-      loadOverlap.pop();
+
-    }
+let loadOverlap = [];
-
+const loadingLayer = (type, config) => {
-    if (loadOverlap.length > 0) {
+  /*
-      document.querySelector('html > body').style.overflow = 'hidden'; // 스크롤 block
+  get: httpClient.get(url, { params: { ... }, headers: {"show-layer": "Yes"} }) // in 2nd property
-      document.getElementsByClassName('loading_layer')[0].style.display = 'block';
+  post: httpClient.post(url, params, { headers: {"show-layer": "Yes"} })  // 3rd property
-    } else {
+  */
-      document.querySelector('html > body').style.removeProperty('overflow'); // 스크롤 allow
+  if (config.headers['Show-Layer'] == 'Yes') {
-      document.getElementsByClassName('loading_layer')[0].style.display = 'none';
+    if (type) {
-    }
+      loadOverlap.push('add');
-  }
+    } else {
-};
+      loadOverlap.pop();
-
+    }
-/*const loadingLayerInterceptor = config => {
+
-  loadingLayer(true, config);
+    if (loadOverlap.length > 0) {
-  return config;
+      document.querySelector('html > body').style.overflow = 'hidden'; // 스크롤 block
-};*/
+      document.getElementsByClassName('loading_layer')[0].style.display = 'block';
-
+    } else {
-/** Adding the request interceptors */
+      document.querySelector('html > body').style.removeProperty('overflow'); // 스크롤 allow
-httpClient.interceptors.request.use(authInterceptor);
+      document.getElementsByClassName('loading_layer')[0].style.display = 'none';
-httpClient.interceptors.request.use(loggerInterceptor);
+    }
-//httpClient.interceptors.request.use(loadingLayerInterceptor);
+  }
-
+};
-/** Adding the response interceptors */
+
-httpClient.interceptors.response.use(
+/*const loadingLayerInterceptor = config => {
-  response => {
+  loadingLayer(true, config);
-    //loadingLayer(false, response.config);
+  return config;
-    console.log('response status:', response.status, 'data:', response.data);    
+};*/
-    return response;
+
-  },
+/** Adding the request interceptors */
-  error => {
+httpClient.interceptors.request.use(authInterceptor);
-    console.log(error);
+httpClient.interceptors.request.use(tokenInterceptor);
-    if (error.response != undefined && error.response != null) loadingLayer(false, error.response.config);
+httpClient.interceptors.request.use(loggerInterceptor);
-    else loadingLayer(false, error.config);
+//httpClient.interceptors.request.use(loadingLayerInterceptor);
-
+
-    if (error.code === 'ECONNABORTED') {
+/** Adding the response interceptors */
-      alert('서비스가 지연되고 있습니다. 잠시 후 확인하시고 다시 시도해주세요.');
+httpClient.interceptors.response.use(
-      return Promise.reject(error);
+  response => {
-    } else if (error.response.status == 401 || error.response.status == 418) {
+    //loadingLayer(false, response.config);
-      alert('세션이 만료되었습니다.');
+    console.log('response status:', response.status, 'data:', response.data);    
-      window.top.location.href = '/login';
+    return response;
-    } else if (error.response.status == 500) {
+  },
-      if (error.response.data != null && error.response.data.message == '511 NETWORK_AUTHENTICATION_REQUIRED') {
+  error => {
-        alert('웹템플릿 IP가 브랜드포털에 등록이 필요합니다. 기술지원에 문의해주세요.');
+    console.log(error);
-        return Promise.reject(error);
+    if (error.response != undefined && error.response != null) loadingLayer(false, error.response.config);
-      } else {
+    else loadingLayer(false, error.config);
-        window.top.location.href = '/view/error/500';
+
-      }
+    if (error.code === 'ECONNABORTED') {
-    } else if (error.response.status == 511) {
+      alert('서비스가 지연되고 있습니다. 잠시 후 확인하시고 다시 시도해주세요.');
-      alert('웹템플릿 IP가 브랜드포털에 등록이 필요합니다. 기술지원에 문의해주세요.');
+      return Promise.reject(error);
-      return Promise.reject(error);
+    } else if(error.response.status == 401){
-    } else if (error.message == 'Network Error') {
+      alert('세션이 만료되었습니다.');
-      alert('네트워크 오류가 발생했습니다. 잠시 후 다시 시도해주세요.');
+      tokenSvc.removeToken();
-      return Promise.reject(error);
+      window.top.location.href = '/login';
-    } else {
+    } else if (error.response.status == 418) {
-      console.log('response error:', error);
+       
-      return Promise.reject(error);
+    }else if (error.response.status == 500) {
-    }
+      if (error.response.data != null && error.response.data.message == '511 NETWORK_AUTHENTICATION_REQUIRED') {
-  }
+        alert('웹템플릿 IP가 브랜드포털에 등록이 필요합니다. 기술지원에 문의해주세요.');
-);
+        return Promise.reject(error);
-
+      } else {
-export default httpClient;
+        tokenSvc.removeToken();
+        window.top.location.href = '/login';        
+      }
+    } else if (error.response.status == 511) {
+      alert('웹템플릿 IP가 브랜드포털에 등록이 필요합니다. 기술지원에 문의해주세요.');
+      return Promise.reject(error);
+    } else if (error.message == 'Network Error') {
+      alert('네트워크 오류가 발생했습니다. 잠시 후 다시 시도해주세요.');
+      return Promise.reject(error);
+    } else {
+      alert("else");
+      console.log('response error:', error);
+      return Promise.reject(error);
+    }
+  }
+);
+
+export default httpClient;

frontend/src/common/ko.js

@@ -1 +1 @@
-!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):((t=t||self).vdp_translation_ko=t.vdp_translation_ko||{},t.vdp_translation_ko.js=n())}(this,function(){"use strict";function t(t,n){for(var e=0;e<n.length;e++){var r=n[e];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}var n=new(function(){function n(t,e,r,o){!function(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}(this,n),this.language=t,this.months=e,this.monthsAbbr=r,this.days=o,this.rtl=!1,this.ymd=!1,this.yearSuffix=""}var e,r,o;return e=n,(r=[{key:"language",get:function(){return this._language},set:function(t){if("string"!=typeof t)throw new TypeError("Language must be a string");this._language=t}},{key:"months",get:function(){return this._months},set:function(t){if(12!==t.length)throw new RangeError("There must be 12 months for ".concat(this.language," language"));this._months=t}},{key:"monthsAbbr",get:function(){return this._monthsAbbr},set:function(t){if(12!==t.length)throw new RangeError("There must be 12 abbreviated months for ".concat(this.language," language"));this._monthsAbbr=t}},{key:"days",get:function(){return this._days},set:function(t){if(7!==t.length)throw new RangeError("There must be 7 days for ".concat(this.language," language"));this._days=t}}])&&t(e.prototype,r),o&&t(e,o),n}())("Korean",["1월","2월","3월","4월","5월","6월","7월","8월","9월","10월","11월","12월"],["1월","2월","3월","4월","5월","6월","7월","8월","9월","10월","11월","12월"],["일","월","화","수","목","금","토"]);return n.yearSuffix="년",n.ymd=!0,n});
+!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n():"function"==typeof define&&define.amd?define(n):((t=t||self).vdp_translation_ko=t.vdp_translation_ko||{},t.vdp_translation_ko.js=n())}(this,function(){"use strict";function t(t,n){for(var e=0;e<n.length;e++){var r=n[e];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}var n=new(function(){function n(t,e,r,o){!function(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}(this,n),this.language=t,this.months=e,this.monthsAbbr=r,this.days=o,this.rtl=!1,this.ymd=!1,this.yearSuffix=""}var e,r,o;return e=n,(r=[{key:"language",get:function(){return this._language},set:function(t){if("string"!=typeof t)throw new TypeError("Language must be a string");this._language=t}},{key:"months",get:function(){return this._months},set:function(t){if(12!==t.length)throw new RangeError("There must be 12 months for ".concat(this.language," language"));this._months=t}},{key:"monthsAbbr",get:function(){return this._monthsAbbr},set:function(t){if(12!==t.length)throw new RangeError("There must be 12 abbreviated months for ".concat(this.language," language"));this._monthsAbbr=t}},{key:"days",get:function(){return this._days},set:function(t){if(7!==t.length)throw new RangeError("There must be 7 days for ".concat(this.language," language"));this._days=t}}])&&t(e.prototype,r),o&&t(e,o),n}())("Korean",["1월","2월","3월","4월","5월","6월","7월","8월","9월","10월","11월","12월"],["1월","2월","3월","4월","5월","6월","7월","8월","9월","10월","11월","12월"],["일","월","화","수","목","금","토"]);return n.yearSuffix="년",n.ymd=!0,n});

frontend/src/common/token-service.js

@@ -1,38 +1,53 @@
-import * as utils from './utils';
+import * as utils from './utils';
-import { consts } from './config';
+import { consts } from './config';
-
+
-// const KEY_TOKEN = 'access_token';
+
-
+// const KEY_TOKEN = 'access_token';
-const tokenSvc = {
+
-    getToken() {
+const tokenSvc = {
-        // return store.getters['login/getToken'];
+    getToken() {
-        // var payload = sessionStorage.getItem(KEY_TOKEN);
+        // return store.getters['login/getToken'];
-        var jwtPart1 = utils.getCookie(consts.tokenPart1);
+        // var payload = sessionStorage.getItem(KEY_TOKEN);
-        if (!jwtPart1)
+        var jwtPart1 = utils.getCookie(consts.tokenPart1);
-            return null;
+        if (!jwtPart1)
-        var payload = utils.base64decode(jwtPart1.split('.').pop());
+            return null;
-        return JSON.parse(payload);
+        var payload = utils.base64decode(jwtPart1.split('.').pop());
-    },
+        return JSON.parse(payload);
-    removeToken() {       
+    },
-        var name = consts.tokenPart1; 
+    removeToken() {       
-        document.cookie = name + '=; expires=Thu, 01 Jan 1999 00:00:10 GMT;';
+        var tokenNm1 = consts.tokenPart1; 
-    }
+        var tokenNm2 = consts.tokenPart2; 
-
+        var tokenNm3 = consts.tokenPart3; 
-    // saveToken(jwtPart1) {
+        var tokenNm4 = consts.tokenPart4; 
-    //     if (!jwtPart1)
+        
-    //         return;
+        document.cookie = tokenNm1+'=; expires=Thu, 01 Jan 1970 00:00:01 GMT;';
-
+        document.cookie = tokenNm2+'=; expires=Thu, 01 Jan 1970 00:00:01 GMT;';
-    //     var payload = utils.base64decode(jwtPart1.split('.').pop());
+        document.cookie = tokenNm3+'=; expires=Thu, 01 Jan 1970 00:00:01 GMT;';
-    //     console.log('save token:', payload);
+        document.cookie = tokenNm4+'=; expires=Thu, 01 Jan 1970 00:00:01 GMT;';
-    //     // store.commit('login/saveToken', token);
+    },
-    //     sessionStorage.setItem(KEY_TOKEN, payload);
+    getAuthorization(tokenKey){
-    // },
+        var jwtPart = utils.getCookie(tokenKey);
-
+        if(!jwtPart){
-    // removeToken() {
+            return null;
-    //     // store.commit('login/removeToken');
+        }
-    //     sessionStorage.removeItem(KEY_TOKEN);
+        return jwtPart;
-    // }
+    },
-
+    
-};
+    // saveToken(jwtPart1) {
-
+    //     if (!jwtPart1)
-export default tokenSvc;
+    //         return;
+
+    //     var payload = utils.base64decode(jwtPart1.split('.').pop());
+    //     console.log('save token:', payload);
+    //     // store.commit('login/saveToken', token);
+    //     sessionStorage.setItem(KEY_TOKEN, payload);
+    // },
+
+    // removeToken() {
+    //     // store.commit('login/removeToken');
+    //     sessionStorage.removeItem(KEY_TOKEN);
+    // }
+
+};
+
+export default tokenSvc;

frontend/src/common/utils.js

@@ -1,117 +1,117 @@
-/**
+/**
- * @description This method is responsile for creating the object with mirror key and values
+ * @description This method is responsile for creating the object with mirror key and values
- * and also add prefix to values if available
+ * and also add prefix to values if available
- * @param {Array<string>} arr Array of strings
+ * @param {Array<string>} arr Array of strings
- * @param {string} prefix prefix
+ * @param {string} prefix prefix
- * @returns {Object} object with mirror keys generated from the array of strings
+ * @returns {Object} object with mirror keys generated from the array of strings
- */
+ */
-export const reflectKeys = (arr = [], prefix) =>
+export const reflectKeys = (arr = [], prefix) =>
-  arr.reduce((obj, key) => {
+  arr.reduce((obj, key) => {
-    const value = prefix ? prefix + ' ' + key : key;
+    const value = prefix ? prefix + ' ' + key : key;
-    obj[key] = value;
+    obj[key] = value;
-
+
-    return obj;
+    return obj;
-  }, {});
+  }, {});
-
+
-export const form2obj = function(form) {
+export const form2obj = function(form) {
-  var queryStr = serializeForm(form);
+  var queryStr = serializeForm(form);
-  return qstr2obj(queryStr);
+  return qstr2obj(queryStr);
-};
+};
-
+
-/*!
+/*!
- * Serialize all form data into a query string
+ * Serialize all form data into a query string
- * (c) 2018 Chris Ferdinandi, MIT License, https://gomakethings.com
+ * (c) 2018 Chris Ferdinandi, MIT License, https://gomakethings.com
- * @param  {Node}   form The form to serialize
+ * @param  {Node}   form The form to serialize
- * @return {String}      The serialized form data
+ * @return {String}      The serialized form data
- */
+ */
-export const serializeForm = function(form) {
+export const serializeForm = function(form) {
-  // Setup our serialized data
+  // Setup our serialized data
-  var serialized = [];
+  var serialized = [];
-
+
-  // Loop through each field in the form
+  // Loop through each field in the form
-  for (var i = 0; i < form.elements.length; i++) {
+  for (var i = 0; i < form.elements.length; i++) {
-    var field = form.elements[i];
+    var field = form.elements[i];
-
+
-    // Don't serialize fields without a name, submits, buttons, file and reset inputs, and disabled fields
+    // Don't serialize fields without a name, submits, buttons, file and reset inputs, and disabled fields
-    if (
+    if (
-      !field.name ||
+      !field.name ||
-      field.disabled ||
+      field.disabled ||
-      field.type === 'file' ||
+      field.type === 'file' ||
-      field.type === 'reset' ||
+      field.type === 'reset' ||
-      field.type === 'submit' ||
+      field.type === 'submit' ||
-      field.type === 'button'
+      field.type === 'button'
-    )
+    )
-      continue;
+      continue;
-
+
-    // If a multi-select, get all selections
+    // If a multi-select, get all selections
-    if (field.type === 'select-multiple') {
+    if (field.type === 'select-multiple') {
-      for (var n = 0; n < field.options.length; n++) {
+      for (var n = 0; n < field.options.length; n++) {
-        if (!field.options[n].selected) continue;
+        if (!field.options[n].selected) continue;
-        serialized.push(encodeURIComponent(field.name) + '=' + encodeURIComponent(field.options[n].value));
+        serialized.push(encodeURIComponent(field.name) + '=' + encodeURIComponent(field.options[n].value));
-      }
+      }
-    }
+    }
-
+
-    // Convert field data to a query string
+    // Convert field data to a query string
-    else if ((field.type !== 'checkbox' && field.type !== 'radio') || field.checked) {
+    else if ((field.type !== 'checkbox' && field.type !== 'radio') || field.checked) {
-      serialized.push(encodeURIComponent(field.name) + '=' + encodeURIComponent(field.value));
+      serialized.push(encodeURIComponent(field.name) + '=' + encodeURIComponent(field.value));
-    }
+    }
-  }
+  }
-
+
-  return serialized.join('&');
+  return serialized.join('&');
-};
+};
-
+
-export const qstr2obj = function(qstr) {
+export const qstr2obj = function(qstr) {
-  let obj = {};
+  let obj = {};
-  if (qstr) {
+  if (qstr) {
-    qstr.split('&').map(item => {
+    qstr.split('&').map(item => {
-      const [k, v] = item.split('=');
+      const [k, v] = item.split('=');
-      v ? (obj[k] = v) : null;
+      v ? (obj[k] = v) : null;
-    });
+    });
-  }
+  }
-  return obj;
+  return obj;
-};
+};
-
+
-export const getCookie = function(name) {
+export const getCookie = function(name) {
-  var value = '; ' + document.cookie;
+  var value = '; ' + document.cookie;
-  var parts = value.split('; ' + name + '=');
+  var parts = value.split('; ' + name + '=');
-  if (parts.length == 2)
+  if (parts.length == 2)
-    return parts
+    return parts
-      .pop()
+      .pop()
-      .split(';')
+      .split(';')
-      .shift();
+      .shift();
-};
+};
-
+
-import { Base64 } from 'js-base64';
+import { Base64 } from 'js-base64';
-
+
-export const base64encode = function(str) {
+export const base64encode = function(str) {
-  return Base64.encode(str);
+  return Base64.encode(str);
-};
+};
-
+
-export const base64decode = function(b64) {
+export const base64decode = function(b64) {
-  return Base64.decode(b64);
+  return Base64.decode(b64);
-};
+};
-
+
-export const getGwSuccessCode = function() {
+export const getGwSuccessCode = function() {
-  return '10000';
+  return '10000';
-};
+};
-
+
-export const isGwSuccess = function(code) {
+export const isGwSuccess = function(code) {
-  return getGwSuccessCode() == code;
+  return getGwSuccessCode() == code;
-};
+};
-
+
-let loadOverlap = [];
+let loadOverlap = [];
-export const loadingLayer = (type) => {
+export const loadingLayer = (type) => {
-  if (type) {
+  if (type) {
-    loadOverlap.push('add');
+    loadOverlap.push('add');
-  } else {
+  } else {
-    loadOverlap.pop();
+    loadOverlap.pop();
-  }
+  }
-
+
-  if (loadOverlap.length > 0) {
+  if (loadOverlap.length > 0) {
-    document.querySelector('html > body').style.overflow = 'hidden'; // 스크롤 block
+    document.querySelector('html > body').style.overflow = 'hidden'; // 스크롤 block
-    document.getElementsByClassName('loading_layer')[0].style.display = 'block';
+    document.getElementsByClassName('loading_layer')[0].style.display = 'block';
-  } else {
+  } else {
-    document.querySelector('html > body').style.removeProperty('overflow'); // 스크롤 allow
+    document.querySelector('html > body').style.removeProperty('overflow'); // 스크롤 allow
-    document.getElementsByClassName('loading_layer')[0].style.display = 'none';
+    document.getElementsByClassName('loading_layer')[0].style.display = 'none';
-  }
+  }
-};
+};

frontend/src/common/vue-mixins.js

@@ -1,228 +1,228 @@
-const coreUiMixin = {
+const coreUiMixin = {
-  directives: {
+  directives: {
-    focus: {
+    focus: {
-      inserted: function(el) {
+      inserted: function(el) {
-        el.focus();
+        el.focus();
-      }
+      }
-    }
+    }
-  },
+  },
-  methods: {
+  methods: {
-    clearInput: function(evt) {
+    clearInput: function(evt) {
-      var me = evt.target;
+      var me = evt.target;
-      var vname = me.previousElementSibling.name;
+      var vname = me.previousElementSibling.name;
-      this.$data[vname] = '';
+      this.$data[vname] = '';
-      me.previousElementSibling.focus();
+      me.previousElementSibling.focus();
-    },
+    },
-    showPhoneNumber: function(str) {
+    showPhoneNumber: function(str) {
-      str = str.replace(/[\-\s\/]+/g, '');
+      str = str.replace(/[\-\s\/]+/g, '');
-      if (str.length > 12 || str.length < 10) {
+      if (str.length > 12 || str.length < 10) {
-        return str;
+        return str;
-      }
+      }
-      var result =
+      var result =
-        str.substring(0, str.length - 8) +
+        str.substring(0, str.length - 8) +
-        '-' +
+        '-' +
-        str.substring(str.length - 8, str.length - 4) +
+        str.substring(str.length - 8, str.length - 4) +
-        '-' +
+        '-' +
-        str.substring(str.length - 4, str.length);
+        str.substring(str.length - 4, str.length);
-      return result;
+      return result;
-    },
+    },
-    /*
+    /*
-		openLayer: function(event, callback) {
+		openLayer: function(event, callback) {
-			var myId = event.target.getAttribute('data-id');
+			var myId = event.target.getAttribute('data-id');
-			var myLayer = document.querySelector('[layer-id="' + myId + '"]');
+			var myLayer = document.querySelector('[layer-id="' + myId + '"]');
-			var btnClose = document.querySelector('[layer-id="' + myId + '"] .btn_close');
+			var btnClose = document.querySelector('[layer-id="' + myId + '"] .btn_close');
-			myLayer.classList.add('active');
+			myLayer.classList.add('active');
-			btnClose.addEventListener("click", function() {
+			btnClose.addEventListener("click", function() {
-				myLayer.classList.remove('active');
+				myLayer.classList.remove('active');
-				if (callback != undefined && callback != null) {
+				if (callback != undefined && callback != null) {
-					callback('');
+					callback('');
-				}
+				}
-			});
+			});
-
+
-			if (callback != undefined && callback != null) {
+			if (callback != undefined && callback != null) {
-				callback(myId);
+				callback(myId);
-			}
+			}
-		},
+		},
-		*/
+		*/
-    openLayer: function(layerId) {
+    openLayer: function(layerId) {
-      if (layerId == undefined || layerId == null || layerId == '') {
+      if (layerId == undefined || layerId == null || layerId == '') {
-        alert('layerId를 설정해 주세요.');
+        alert('layerId를 설정해 주세요.');
-      } else {
+      } else {
-        this.$emit('changeLayerId', layerId);
+        this.$emit('changeLayerId', layerId);
-      }
+      }
-    },
+    },
-    closeLayer() {
+    closeLayer() {
-      this.$emit('changeLayerId', '');
+      this.$emit('changeLayerId', '');
-    },
+    },
-    numberComma(num) {
+    numberComma(num) {
-      if (typeof num == undefined || num == null) {
+      if (typeof num == undefined || num == null) {
-        return '';
+        return '';
-      }
+      }
-      num = num + '';
+      num = num + '';
-      let point = num.length % 3;
+      let point = num.length % 3;
-      let len = num.length;
+      let len = num.length;
-
+
-      let str = num.substring(0, point);
+      let str = num.substring(0, point);
-      while (point < len) {
+      while (point < len) {
-        if (str != '') {
+        if (str != '') {
-          str += ',';
+          str += ',';
-        }
+        }
-        str += num.substring(point, point + 3);
+        str += num.substring(point, point + 3);
-        point += 3;
+        point += 3;
-      }
+      }
-
+
-      return str;
+      return str;
-    }
+    }
-  }
+  }
-};
+};
-
+
-var chkPattern = {
+var chkPattern = {
-  data: function() {
+  data: function() {
-    return {};
+    return {};
-  },
+  },
-  methods: {
+  methods: {
-    setLenth: function(e, len) {
+    setLenth: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-    },
+    },
-    onlyNum: function(e, len) {
+    onlyNum: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[0-9]*$/g.exec(str)) {
+      if (!/^[0-9]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^0-9]/gi, '');
+        e.target.value = str.replace(/[^0-9]/gi, '');
-      }
+      }
-    },
+    },
-    only11Num: function(e, len) {
+    only11Num: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[0-9]*$/g.exec(str)) {
+      if (!/^[0-9]*$/g.exec(str)) {
-        str = str.replace(/[^0-9]/gi, '');
+        str = str.replace(/[^0-9]/gi, '');
-      }
+      }
-
+
-      if (str.length > 11) {
+      if (str.length > 11) {
-        str = str.substring(0, 11);
+        str = str.substring(0, 11);
-      }
+      }
-
+
-      e.target.value = str;
+      e.target.value = str;
-    },
+    },
-    onlyEmail: function(e, len) {
+    onlyEmail: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[a-zA-Z0-9_\.\-@._-]*$/g.exec(str)) {
+      if (!/^[a-zA-Z0-9_\.\-@._-]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^a-zA-Z0-9_\.\-@._-]/gi, '');
+        e.target.value = str.replace(/[^a-zA-Z0-9_\.\-@._-]/gi, '');
-      }
+      }
-    },
+    },
-    onlyName: function(e, len) {
+    onlyName: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[ㄱ-힣a-zA-Z]*$/g.exec(str)) {
+      if (!/^[ㄱ-힣a-zA-Z]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^ㄱ-힣a-zA-Z]/gi, '');
+        e.target.value = str.replace(/[^ㄱ-힣a-zA-Z]/gi, '');
-      }
+      }
-    },
+    },
-    onlyTitle: function(e, len) {
+    onlyTitle: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[ㄱ-힣a-zA-Z0-9]*$/g.exec(str)) {
+      if (!/^[ㄱ-힣a-zA-Z0-9]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^ㄱ-힣a-zA-Z0-9]/gi, '');
+        e.target.value = str.replace(/[^ㄱ-힣a-zA-Z0-9]/gi, '');
-      }
+      }
-    },
+    },
-    onlyText: function(e, len) {
+    onlyText: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[ㄱ-힣a-zA-Z0-9_-]*$/g.exec(str)) {
+      if (!/^[ㄱ-힣a-zA-Z0-9_-]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^ㄱ-힣a-zA-Z0-9_-]/gi, '');
+        e.target.value = str.replace(/[^ㄱ-힣a-zA-Z0-9_-]/gi, '');
-      }
+      }
-    },
+    },
-    onlyPassword: function(e, len) {
+    onlyPassword: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[A-Za-z0-9!@#$%^&*]*$/g.exec(str)) {
+      if (!/^[A-Za-z0-9!@#$%^&*]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^A-Za-z0-9!@#$%^&*]/gi, '');
+        e.target.value = str.replace(/[^A-Za-z0-9!@#$%^&*]/gi, '');
-      }
+      }
-    },
+    },
-    onlyId: function(e, len) {
+    onlyId: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[A-Za-z0-9]*$/g.exec(str)) {
+      if (!/^[A-Za-z0-9]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^A-Za-z0-9]/gi, '');
+        e.target.value = str.replace(/[^A-Za-z0-9]/gi, '');
-      }
+      }
-    },
+    },
-    onlyIp: function(e, len) {
+    onlyIp: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[0-9,.*]*$/g.exec(str)) {
+      if (!/^[0-9,.*]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^0-9,.*]/gi, '');
+        e.target.value = str.replace(/[^0-9,.*]/gi, '');
-      }
+      }
-    },
+    },
-    onlyRoleNm_Space: function(e, len) {
+    onlyRoleNm_Space: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[ㄱ-힣a-zA-Z0-9/\s]*$/g.exec(str)) {
+      if (!/^[ㄱ-힣a-zA-Z0-9/\s]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^ㄱ-힣a-zA-Z0-9/\s]/gi, '');
+        e.target.value = str.replace(/[^ㄱ-힣a-zA-Z0-9/\s]/gi, '');
-      }
+      }
-    },
+    },
-    onlyRoleId_UnderBar: function(e, len) {
+    onlyRoleId_UnderBar: function(e, len) {
-      this.cut(e, len);
+      this.cut(e, len);
-      var str = e.target.value;
+      var str = e.target.value;
-      if (!/^[a-zA-Z0-9_]*$/g.exec(str)) {
+      if (!/^[a-zA-Z0-9_]*$/g.exec(str)) {
-        e.target.value = str.replace(/[^a-zA-Z0-9_]/gi, '');
+        e.target.value = str.replace(/[^a-zA-Z0-9_]/gi, '');
-      }
+      }
-    },
+    },
-    cut: function(e, len) {
+    cut: function(e, len) {
-      if (typeof len != 'undefined') {
+      if (typeof len != 'undefined') {
-        var str = e.target.value;
+        var str = e.target.value;
-        if (this.bytes(str) > len) {
+        if (this.bytes(str) > len) {
-          e.target.value = this.cutBytes(str, len);
+          e.target.value = this.cutBytes(str, len);
-        }
+        }
-      }
+      }
-    },
+    },
-    cutBytes: function(str, len) {
+    cutBytes: function(str, len) {
-      var count = 0;
+      var count = 0;
-      for (var i = 0; i < str.length; i++) {
+      for (var i = 0; i < str.length; i++) {
-        if (escape(str.charAt(i)).length >= 4) count += 2;
+        if (escape(str.charAt(i)).length >= 4) count += 2;
-        else if (escape(str.charAt(i)) != '%0D') count++;
+        else if (escape(str.charAt(i)) != '%0D') count++;
-        if (count > len) {
+        if (count > len) {
-          if (escape(str.charAt(i)) == '%0A') i--;
+          if (escape(str.charAt(i)) == '%0A') i--;
-          break;
+          break;
-        }
+        }
-      }
+      }
-      return str.substring(0, i);
+      return str.substring(0, i);
-    },
+    },
-    bytes: function(str) {
+    bytes: function(str) {
-      var length = 0;
+      var length = 0;
-      for (var i = 0; i < str.length; i++) {
+      for (var i = 0; i < str.length; i++) {
-        if (escape(str.charAt(i)).length >= 4) length += 2;
+        if (escape(str.charAt(i)).length >= 4) length += 2;
-        else if (escape(str.charAt(i)) == '%A7') length += 2;
+        else if (escape(str.charAt(i)) == '%A7') length += 2;
-        else {
+        else {
-          if (escape(str.charAt(i)) != '%0D') length++;
+          if (escape(str.charAt(i)) != '%0D') length++;
-        }
+        }
-      }
+      }
-      return length;
+      return length;
-    },
+    },
-    checkPhone: function(str) {
+    checkPhone: function(str) {
-      str = str.replace(/[\-\s\/]+/g, '');
+      str = str.replace(/[\-\s\/]+/g, '');
-      if (str.charAt(0) != '0') {
+      if (str.charAt(0) != '0') {
-        str = '0' + str;
+        str = '0' + str;
-      }
+      }
-      if (str.length < 10 || str.length > 12) {
+      if (str.length < 10 || str.length > 12) {
-        return '';
+        return '';
-      }
+      }
-      if (isNaN(str)) {
+      if (isNaN(str)) {
-        return '';
+        return '';
-      }
+      }
-      //if (str.substr(0,2)!="01" && str.substr(0,3)!="070"  && str.substr(0,4)!="0505" && str.substr(0,4)!="0503"){return "";	}
+      //if (str.substr(0,2)!="01" && str.substr(0,3)!="070"  && str.substr(0,4)!="0505" && str.substr(0,4)!="0503"){return "";	}
-      //sif (str.substr(0,3)!="010"){return "";	}
+      //sif (str.substr(0,3)!="010"){return "";	}
-      return str;
+      return str;
-    },
+    },
-    checkExcelFile: function(fileObj) {
+    checkExcelFile: function(fileObj) {
-      let reg = /(.*?)\.(xls|xlsx)$/;
+      let reg = /(.*?)\.(xls|xlsx)$/;
-      if (fileObj == undefined || fileObj == null)
+      if (fileObj == undefined || fileObj == null)
-        return false;
+        return false;
-      if (!fileObj.name.match(reg)) 
+      if (!fileObj.name.match(reg)) 
-        return false;
+        return false;
-      
+      
-      return true;
+      return true;
-    }    
+    }    
-  }
+  }
-};
+};
-
+
-export { coreUiMixin, chkPattern };
+export { coreUiMixin, chkPattern };

frontend/src/components/ButtonBranch.vue

@@ -1,45 +1,45 @@
-<template>
+<template>
-  <div class="container template_free"> 
+  <div class="container template_free"> 
-    <article id="content" class="content"></article>
+    <article id="content" class="content"></article>
-    <div tabindex="0" class="layer active">
+    <div tabindex="0" class="layer active">
-      <div tabindex="0" class="layer_cont error">
+      <div tabindex="0" class="layer_cont error">
-        <div class="layer_body">
+        <div class="layer_body">
-          <div class="title_wrap center mar_b50">
+          <div class="title_wrap center mar_b50">
-            <h5 class="h5_title" v-html="message">{{ message }}</h5>
+            <h5 class="h5_title" v-html="message">{{ message }}</h5>
-          </div>
+          </div>
-          <div class="btn_wrap mar_t20 center">          
+          <div class="btn_wrap mar_t20 center">          
-            <a v-for="(branch, index) in branchList" :key="index" href="javascript:void(0);" class="btn mid" :class="branch.class" @click="branch.callback"><span>{{ branch.text }}</span></a>
+            <a v-for="(branch, index) in branchList" :key="index" href="javascript:void(0);" class="btn mid" :class="branch.class" @click="branch.callback"><span>{{ branch.text }}</span></a>
-          </div>
+          </div>
-        </div>
+        </div>
-      </div>
+      </div>
-    </div>
+    </div>
-  </div>
+  </div>
-</template>
+</template>
-
+
-<script>
+<script>
-/*
+/*
-  branchList: [
+  branchList: [
-    {
+    {
-      text: "저장",
+      text: "저장",
-      class: "bd_black",
+      class: "bd_black",
-      callback: callback
+      callback: callback
-    },
+    },
-    .....
+    .....
-  ]
+  ]
- */
+ */
-export default {
+export default {
-  name: "buttonBranch",
+  name: "buttonBranch",
-  props: {
+  props: {
-    message: String,
+    message: String,
-    branchList: {
+    branchList: {
-      text: Array,
+      text: Array,
-      class: String,
+      class: String,
-      callback: Function
+      callback: Function
-    }
+    }
-  },
+  },
-  data() {
+  data() {
-    return {
+    return {
-    }
+    }
-  }
+  }
-}
+}
 </script>

frontend/src/components/CreateBrandViewer.vue

@@ -1,199 +1,199 @@
-<template>
+<template>
-  <section>
+  <section>
-  <!-- <div class="emulator_wrap"> -->
+  <!-- <div class="emulator_wrap"> -->
-    <div class="inner_emul">
+    <div class="inner_emul">
-      <strong class="blind">미리보기</strong>
+      <strong class="blind">미리보기</strong>
-      <div class="emulator_area">
+      <div class="emulator_area">
-        <div class="emulator_cont">
+        <div class="emulator_cont">
-        <div class="img_area description">
+        <div class="img_area description">
-          <img :src="bgImageData" v-if="bgImageData && !retrivebgFlag">
+          <img :src="bgImageData" v-if="bgImageData && !retrivebgFlag">
-          <img :src="this.bgImageUrl" v-else-if="retrivebgFlag">
+          <img :src="this.bgImageUrl" v-else-if="retrivebgFlag">
-          <img src="@/assets/images/common/img_placeholder02.png" v-else>
+          <img src="@/assets/images/common/img_placeholder02.png" v-else>
-        </div>
+        </div>
-          <div class="rcs_profile_area">
+          <div class="rcs_profile_area">
-            <img :src="profileImageData" v-if="profileImageData && !retriveProfileFlag">
+            <img :src="profileImageData" v-if="profileImageData && !retriveProfileFlag">
-            <img :src="this.profileImageUrl" v-else-if="retriveProfileFlag">
+            <img :src="this.profileImageUrl" v-else-if="retriveProfileFlag">
-            <img src="@/assets/images/common/img_profile_blank.png" v-else>
+            <img src="@/assets/images/common/img_profile_blank.png" v-else>
-          </div>
+          </div>
-          <strong class="rcs_brand_name">{{this.brandInfoData.name}}</strong>
+          <strong class="rcs_brand_name">{{this.brandInfoData.name}}</strong>
-          <div class="rcs_icon_area">
+          <div class="rcs_icon_area">
-            <span
+            <span
-              v-for="(item, index) in visibleMenuItemList"
+              v-for="(item, index) in visibleMenuItemList"
-              :key="index"
+              :key="index"
-              class="rcs_icon"
+              class="rcs_icon"
-              :class="`icon_${item.code.toLowerCase()}`"
+              :class="`icon_${item.code.toLowerCase()}`"
-            ></span>
+            ></span>
-          </div>
+          </div>
-          <div class="rcs_desc_area" v-html="this.brandInfoData.descr"></div>
+          <div class="rcs_desc_area" v-html="this.brandInfoData.descr"></div>
-          <div class="rcs_detail_area">
+          <div class="rcs_detail_area">
-            <dl>
+            <dl>
-              <dt>전화번호</dt>
+              <dt>전화번호</dt>
-              <dd>{{this.brandInfoData.tel}}</dd>
+              <dd>{{this.brandInfoData.tel}}</dd>
-              <dt>웹사이트</dt>
+              <dt>웹사이트</dt>
-              <dd>{{this.brandInfoData.url}}</dd>
+              <dd>{{this.brandInfoData.url}}</dd>
-              <dt>이메일</dt>
+              <dt>이메일</dt>
-              <dd v-if="this.brandInfoData.email === '@'"></dd>
+              <dd v-if="this.brandInfoData.email === '@'"></dd>
-              <dd v-else>{{this.brandInfoData.email}}</dd>
+              <dd v-else>{{this.brandInfoData.email}}</dd>
-              <dt>주소</dt>
+              <dt>주소</dt>
-              <dd>{{this.brandInfoData.addrRegnNo}}{{this.brandInfoData.addrMngNo}}{{this.brandInfoData.addrDtl}}</dd>
+              <dd>{{this.brandInfoData.addrRegnNo}}{{this.brandInfoData.addrMngNo}}{{this.brandInfoData.addrDtl}}</dd>
-            </dl>
+            </dl>
-          </div>
+          </div>
-        </div>
+        </div>
-      </div>
+      </div>
-    </div>
+    </div>
-  <!-- </div> -->
+  <!-- </div> -->
-  </section>
+  </section>
-</template>
+</template>
-
+
-<script>
+<script>
-// 스크립트를 정의하는 부분
+// 스크립트를 정의하는 부분
-// 개발자 작업 영역
+// 개발자 작업 영역
-//import { getImageUrl } from '@/service/code'
+//import { getImageUrl } from '@/service/code'
-
+
-// [ECMA6] export default 된 부분이 외부에서 import로 사용할 수 있게 된다.
+// [ECMA6] export default 된 부분이 외부에서 import로 사용할 수 있게 된다.
-export default {
+export default {
-  // .vue 내부에서 사용되는 model
+  // .vue 내부에서 사용되는 model
-  // model 기반으로 vue는 동작된다.
+  // model 기반으로 vue는 동작된다.
-  props: {
+  props: {
-    brandInfoData: {
+    brandInfoData: {
-      type: Object
+      type: Object
-    }
+    }
-  },
+  },
-  data() {
+  data() {
-    return {
+    return {
-      bgImageData: '',
+      bgImageData: '',
-      profileImageData: '',
+      profileImageData: '',
-
+
-      profileImageUrl: '',
+      profileImageUrl: '',
-      bgImageUrl: '',
+      bgImageUrl: '',
-      retriveProfileFlag: false,
+      retriveProfileFlag: false,
-      retrivebgFlag: false
+      retrivebgFlag: false
-    }
+    }
-  },
+  },
-  created() {
+  created() {
-    // DOM이 만들어 지기 전 실행 되는 곳
+    // DOM이 만들어 지기 전 실행 되는 곳
-    // Data를 사전에 준비할 경우 사용된다.
+    // Data를 사전에 준비할 경우 사용된다.
-  },
+  },
-  mounted() {
+  mounted() {
-    // DOM에 해당 .vue가 들어가게 되면 실행 되는 곳
+    // DOM에 해당 .vue가 들어가게 되면 실행 되는 곳
-    // onload 상태와 동일하다. DOM 이후에 조작할 경우 이곳에서 수행
+    // onload 상태와 동일하다. DOM 이후에 조작할 경우 이곳에서 수행
-  },
+  },
-  watch: {
+  watch: {
-    'brandInfoData.descr'() {
+    'brandInfoData.descr'() {
-      this.brandInfoData.descr = this.brandInfoData.descr.replace(/\(|\)|on.*\(|eval\(|javascript/gi,'')
+      this.brandInfoData.descr = this.brandInfoData.descr.replace(/\(|\)|on.*\(|eval\(|javascript/gi,'')
-        .split('\n')
+        .split('\n')
-        .join('<br />')
+        .join('<br />')
-    },
+    },
-    'brandInfoData.profileImgFile'() {
+    'brandInfoData.profileImgFile'() {
-      if (this.brandInfoData.profileImgFile) {
+      if (this.brandInfoData.profileImgFile) {
-        let reader = new FileReader()
+        let reader = new FileReader()
-        let vm = this
+        let vm = this
-        let file = this.brandInfoData.profileImgFile
+        let file = this.brandInfoData.profileImgFile
-
+
-        reader.onload = e => {
+        reader.onload = e => {
-          vm.profileImageData = e.target.result
+          vm.profileImageData = e.target.result
-        }
+        }
-        reader.readAsDataURL(file)
+        reader.readAsDataURL(file)
-      } else {
+      } else {
-        this.profileImageData = ''
+        this.profileImageData = ''
-      }
+      }
-    },
+    },
-    'brandInfoData.bgImgFile'() {
+    'brandInfoData.bgImgFile'() {
-      if (this.brandInfoData.bgImgFile) {
+      if (this.brandInfoData.bgImgFile) {
-        let reader = new FileReader()
+        let reader = new FileReader()
-        let vm = this
+        let vm = this
-        let file = this.brandInfoData.bgImgFile
+        let file = this.brandInfoData.bgImgFile
-
+
-        reader.onload = e => {
+        reader.onload = e => {
-          vm.bgImageData = e.target.result
+          vm.bgImageData = e.target.result
-        }
+        }
-        reader.readAsDataURL(file)
+        reader.readAsDataURL(file)
-      } else {
+      } else {
-        this.bgImageData = ''
+        this.bgImageData = ''
-      }
+      }
-    },
+    },
-    'brandInfoData.profileImgFileId'() {
+    'brandInfoData.profileImgFileId'() {
-      if (
+      if (
-        !jglib.isEmpty(this.brandInfoData.profileImgFileId) &&
+        !jglib.isEmpty(this.brandInfoData.profileImgFileId) &&
-        !jglib.isEmpty(this.brandInfoData.profileImgFileNo)
+        !jglib.isEmpty(this.brandInfoData.profileImgFileNo)
-      ) {
+      ) {
-        this.retriveProfileFlag = true
+        this.retriveProfileFlag = true
-        let reqObj = {
+        let reqObj = {
-          fileId: this.brandInfoData.profileImgFileId,
+          fileId: this.brandInfoData.profileImgFileId,
-          fileNo: this.brandInfoData.profileImgFileNo
+          fileNo: this.brandInfoData.profileImgFileNo
-        }
+        }
-        getImageUrl(reqObj).then(res => {
+        getImageUrl(reqObj).then(res => {
-          this.profileImageUrl = res.downloadUrl
+          this.profileImageUrl = res.downloadUrl
-        })
+        })
-      } else {
+      } else {
-        this.retriveProfileFlag = false
+        this.retriveProfileFlag = false
-        this.profileImageUrl = ''
+        this.profileImageUrl = ''
-      }
+      }
-    },
+    },
-    'brandInfoData.bgImgFileId'() {
+    'brandInfoData.bgImgFileId'() {
-      if (
+      if (
-        !jglib.isEmpty(this.brandInfoData.bgImgFileId) &&
+        !jglib.isEmpty(this.brandInfoData.bgImgFileId) &&
-        !jglib.isEmpty(this.brandInfoData.bgImgFileNo)
+        !jglib.isEmpty(this.brandInfoData.bgImgFileNo)
-      ) {
+      ) {
-        this.retrivebgFlag = true
+        this.retrivebgFlag = true
-        let reqObj = {
+        let reqObj = {
-          fileId: this.brandInfoData.bgImgFileId,
+          fileId: this.brandInfoData.bgImgFileId,
-          fileNo: this.brandInfoData.bgImgFileNo
+          fileNo: this.brandInfoData.bgImgFileNo
-        }
+        }
-        getImageUrl(reqObj).then(res => {
+        getImageUrl(reqObj).then(res => {
-          this.bgImageUrl = res.downloadUrl
+          this.bgImageUrl = res.downloadUrl
-        })
+        })
-      } else {
+      } else {
-        this.retrivebgFlag = false
+        this.retrivebgFlag = false
-        this.bgImageUrl = ''
+        this.bgImageUrl = ''
-      }
+      }
-    }
+    }
-  },
+  },
-  computed: {
+  computed: {
-    // 값이 자주 변경됨에 따라, 관련되어 데이터 혹은 view가 바뀌어야 할 경우 사용
+    // 값이 자주 변경됨에 따라, 관련되어 데이터 혹은 view가 바뀌어야 할 경우 사용
-    // method를 바로 연결하면 tic 단위로 계속 실행되기 때문에, 값이 변경할 때만 수행되고,
+    // method를 바로 연결하면 tic 단위로 계속 실행되기 때문에, 값이 변경할 때만 수행되고,
-    // cache로 남는 computed를 활용하는 것이 성능에 좋음
+    // cache로 남는 computed를 활용하는 것이 성능에 좋음
-    visibleMenuItemList() {
+    visibleMenuItemList() {
-      if (this.brandInfoData.menuItemList) {
+      if (this.brandInfoData.menuItemList) {
-        return this.brandInfoData.menuItemList.filter(res => {
+        return this.brandInfoData.menuItemList.filter(res => {
-          return res.visible
+          return res.visible
-        })
+        })
-      } else {
+      } else {
-        return []
+        return []
-      }
+      }
-    }
+    }
-  },
+  },
-  methods: {
+  methods: {
-    // .vue 내부에서 사용되는 함수를 정의한다.
+    // .vue 내부에서 사용되는 함수를 정의한다.
-    // 이벤트에 따라 실행하거나, 내부적으로 사용되는 함수들을 정의한다.
+    // 이벤트에 따라 실행하거나, 내부적으로 사용되는 함수들을 정의한다.
-  getImageUrl: function(reqData) {
+  getImageUrl: function(reqData) {
-      if (!isUseAPI()) {
+      if (!isUseAPI()) {
-        return new Promise((resolve, reject) => {
+        return new Promise((resolve, reject) => {
-          let res = {
+          let res = {
-            code: '99999999',
+            code: '99999999',
-            msg: 'not available in mockup'
+            msg: 'not available in mockup'
-          }
+          }
-          resolve(res)
+          resolve(res)
-        })
+        })
-      }
+      }
-
+
-      return new Promise((resolve, reject) => {
+      return new Promise((resolve, reject) => {
-        request({
+        request({
-          url: `/file/${reqData.fileId}/${reqData.fileNo}`,
+          url: `/file/${reqData.fileId}/${reqData.fileNo}`,
-          method: 'get'
+          method: 'get'
-        })
+        })
-          .then(res => {
+          .then(res => {
-            let imgData = {
+            let imgData = {
-              fileName: res.result.fileName,
+              fileName: res.result.fileName,
-              downloadUrl: res.result.downloadUrl
+              downloadUrl: res.result.downloadUrl
-            }
+            }
-            resolve(imgData)
+            resolve(imgData)
-          })
+          })
-          .catch(res => {
+          .catch(res => {
-            reject('error in filedownload')
+            reject('error in filedownload')
-          })
+          })
-      })
+      })
-    }
+    }
-  }
+  }
-}
+}
-</script>
+</script>

frontend/src/components/Datepicker.vue

@@ -1,139 +1,139 @@
-.rtl {
+.rtl {
-  direction: rtl;
+  direction: rtl;
-}
+}
-.vdp-datepicker {
+.vdp-datepicker {
-  position: relative;
+  position: relative;
-  text-align: left;
+  text-align: left;
-}
+}
-.vdp-datepicker * {
+.vdp-datepicker * {
-  box-sizing: border-box;
+  box-sizing: border-box;
-}
+}
-.vdp-datepicker__calendar {
+.vdp-datepicker__calendar {
-  position: absolute;
+  position: absolute;
-  z-index: 100;
+  z-index: 100;
-  background: #fff;
+  background: #fff;
-  width: 300px;
+  width: 300px;
-  border: 1px solid #ccc;
+  border: 1px solid #ccc;
-}
+}
-.vdp-datepicker__calendar header {
+.vdp-datepicker__calendar header {
-  display: block;
+  display: block;
-  line-height: 40px;
+  line-height: 40px;
-}
+}
-.vdp-datepicker__calendar header span {
+.vdp-datepicker__calendar header span {
-  display: inline-block;
+  display: inline-block;
-  text-align: center;
+  text-align: center;
-  width: 71.42857142857143%;
+  width: 71.42857142857143%;
-  float: left;
+  float: left;
-}
+}
-.vdp-datepicker__calendar header .prev,
+.vdp-datepicker__calendar header .prev,
-.vdp-datepicker__calendar header .next {
+.vdp-datepicker__calendar header .next {
-  width: 14.285714285714286%;
+  width: 14.285714285714286%;
-  float: left;
+  float: left;
-  text-indent: -10000px;
+  text-indent: -10000px;
-  position: relative;
+  position: relative;
-}
+}
-.vdp-datepicker__calendar header .prev:after,
+.vdp-datepicker__calendar header .prev:after,
-.vdp-datepicker__calendar header .next:after {
+.vdp-datepicker__calendar header .next:after {
-  content: '';
+  content: '';
-  position: absolute;
+  position: absolute;
-  left: 50%;
+  left: 50%;
-  top: 50%;
+  top: 50%;
-  transform: translateX(-50%) translateY(-50%);
+  transform: translateX(-50%) translateY(-50%);
-  border: 6px solid transparent;
+  border: 6px solid transparent;
-}
+}
-.vdp-datepicker__calendar header .prev:after {
+.vdp-datepicker__calendar header .prev:after {
-  border-right: 10px solid #000;
+  border-right: 10px solid #000;
-  margin-left: -5px;
+  margin-left: -5px;
-}
+}
-.vdp-datepicker__calendar header .prev.disabled:after {
+.vdp-datepicker__calendar header .prev.disabled:after {
-  border-right: 10px solid #ddd;
+  border-right: 10px solid #ddd;
-}
+}
-.vdp-datepicker__calendar header .next:after {
+.vdp-datepicker__calendar header .next:after {
-  border-left: 10px solid #000;
+  border-left: 10px solid #000;
-  margin-left: 5px;
+  margin-left: 5px;
-}
+}
-.vdp-datepicker__calendar header .next.disabled:after {
+.vdp-datepicker__calendar header .next.disabled:after {
-  border-left: 10px solid #ddd;
+  border-left: 10px solid #ddd;
-}
+}
-.vdp-datepicker__calendar header .prev:not(.disabled),
+.vdp-datepicker__calendar header .prev:not(.disabled),
-.vdp-datepicker__calendar header .next:not(.disabled),
+.vdp-datepicker__calendar header .next:not(.disabled),
-.vdp-datepicker__calendar header .up:not(.disabled) {
+.vdp-datepicker__calendar header .up:not(.disabled) {
-  cursor: pointer;
+  cursor: pointer;
-}
+}
-.vdp-datepicker__calendar header .prev:not(.disabled):hover,
+.vdp-datepicker__calendar header .prev:not(.disabled):hover,
-.vdp-datepicker__calendar header .next:not(.disabled):hover,
+.vdp-datepicker__calendar header .next:not(.disabled):hover,
-.vdp-datepicker__calendar header .up:not(.disabled):hover {
+.vdp-datepicker__calendar header .up:not(.disabled):hover {
-  background: #eee;
+  background: #eee;
-}
+}
-.vdp-datepicker__calendar .disabled {
+.vdp-datepicker__calendar .disabled {
-  color: #ddd;
+  color: #ddd;
-  cursor: default;
+  cursor: default;
-}
+}
-.vdp-datepicker__calendar .flex-rtl {
+.vdp-datepicker__calendar .flex-rtl {
-  display: flex;
+  display: flex;
-  width: inherit;
+  width: inherit;
-  flex-wrap: wrap;
+  flex-wrap: wrap;
-}
+}
-.vdp-datepicker__calendar .cell {
+.vdp-datepicker__calendar .cell {
-  display: inline-block;
+  display: inline-block;
-  padding: 0 5px;
+  padding: 0 5px;
-  width: 14.285714285714286%;
+  width: 14.285714285714286%;
-  height: 40px;
+  height: 40px;
-  line-height: 40px;
+  line-height: 40px;
-  text-align: center;
+  text-align: center;
-  vertical-align: middle;
+  vertical-align: middle;
-  border: 1px solid transparent;
+  border: 1px solid transparent;
-}
+}
-.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).day,
+.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).day,
-.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).month,
+.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).month,
-.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).year {
+.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).year {
-  cursor: pointer;
+  cursor: pointer;
-}
+}
-.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).day:hover,
+.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).day:hover,
-.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).month:hover,
+.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).month:hover,
-.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).year:hover {
+.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).year:hover {
-  border: 1px solid #4bd;
+  border: 1px solid #4bd;
-}
+}
-.vdp-datepicker__calendar .cell.selected {
+.vdp-datepicker__calendar .cell.selected {
-  background: #4bd;
+  background: #4bd;
-}
+}
-.vdp-datepicker__calendar .cell.selected:hover {
+.vdp-datepicker__calendar .cell.selected:hover {
-  background: #4bd;
+  background: #4bd;
-}
+}
-.vdp-datepicker__calendar .cell.selected.highlighted {
+.vdp-datepicker__calendar .cell.selected.highlighted {
-  background: #4bd;
+  background: #4bd;
-}
+}
-.vdp-datepicker__calendar .cell.highlighted {
+.vdp-datepicker__calendar .cell.highlighted {
-  background: #cae5ed;
+  background: #cae5ed;
-}
+}
-.vdp-datepicker__calendar .cell.highlighted.disabled {
+.vdp-datepicker__calendar .cell.highlighted.disabled {
-  color: #a3a3a3;
+  color: #a3a3a3;
-}
+}
-.vdp-datepicker__calendar .cell.grey {
+.vdp-datepicker__calendar .cell.grey {
-  color: #888;
+  color: #888;
-}
+}
-.vdp-datepicker__calendar .cell.grey:hover {
+.vdp-datepicker__calendar .cell.grey:hover {
-  background: inherit;
+  background: inherit;
-}
+}
-.vdp-datepicker__calendar .cell.day-header {
+.vdp-datepicker__calendar .cell.day-header {
-  font-size: 75%;
+  font-size: 75%;
-  white-space: nowrap;
+  white-space: nowrap;
-  cursor: inherit;
+  cursor: inherit;
-}
+}
-.vdp-datepicker__calendar .cell.day-header:hover {
+.vdp-datepicker__calendar .cell.day-header:hover {
-  background: inherit;
+  background: inherit;
-}
+}
-.vdp-datepicker__calendar .month,
+.vdp-datepicker__calendar .month,
-.vdp-datepicker__calendar .year {
+.vdp-datepicker__calendar .year {
-  width: 33.333%;
+  width: 33.333%;
-}
+}
-.vdp-datepicker__clear-button,
+.vdp-datepicker__clear-button,
-.vdp-datepicker__calendar-button {
+.vdp-datepicker__calendar-button {
-  cursor: pointer;
+  cursor: pointer;
-  font-style: normal;
+  font-style: normal;
-}
+}
-.vdp-datepicker__clear-button.disabled,
+.vdp-datepicker__clear-button.disabled,
-.vdp-datepicker__calendar-button.disabled {
+.vdp-datepicker__calendar-button.disabled {
-  color: #999;
+  color: #999;
-  cursor: default;
+  cursor: default;
-}
+}

frontend/src/components/HubWebFooter.vue

@@ -1,25 +1,25 @@
-<template>
+<template>
-    <footer class="footer-wrap">
+    <footer class="footer-wrap">
-        <div class="footer div-cont">
+        <div class="footer div-cont">
-            <div class="f-logo"><a href="/"><img src="../assets/images/flogo.png" alt=""></a></div>
+            <div class="f-logo"><a href="/"><img src="../assets/images/flogo.png" alt=""></a></div>
-            <div class="f-info">
+            <div class="f-info">
-                <ul>
+                <ul>
-                    <li><p>(주)엘지유플러스</p></li>
+                    <li><p>(주)엘지유플러스</p></li>
-                    <li><p>주소 서울특별시 용산구 한강대로 32</p></li>
+                    <li><p>주소 서울특별시 용산구 한강대로 32</p></li>
-                </ul>
+                </ul>
-                <ul>
+                <ul>
-                    <li><p>대표이사  황현식</p></li>
+                    <li><p>대표이사  황현식</p></li>
-                    <li><p>사업자번호 220-81-39938</p></li>
+                    <li><p>사업자번호 220-81-39938</p></li>
-                    <li><p>통신판매신고 제2010-서울중구-0968호</p></li>
+                    <li><p>통신판매신고 제2010-서울중구-0968호</p></li>
-                    <li><p>고객센터 1544-5992</p></li>
+                    <li><p>고객센터 1544-5992</p></li>
-                    <li><p>e-Mail <a href="mailto:smshelp@lguplus.co.kr">smshelp@lguplus.co.kr</a></p></li>
+                    <li><p>e-Mail <a href="mailto:smshelp@lguplus.co.kr">smshelp@lguplus.co.kr</a></p></li>
-                </ul>
+                </ul>
-                <p>Copyright © LG Uplus Corp. All Rights Reserved.</p>
+                <p>Copyright © LG Uplus Corp. All Rights Reserved.</p>
-            </div>
+            </div>
-        </div>
+        </div>
-    </footer>
+    </footer>
-</template>
+</template>
-
+
-<script>
+<script>
-
+
-</script>
+</script>

frontend/src/components/HubWebHeader.vue

@@ -1,87 +1,87 @@
-<template>    
+<template>    
-  <header>
+  <header>
-    <h1 class="logo"><a href="javascript:void(0)">uplus 메시지허브이지<span>BACKOFFICE</span></a></h1>
+    <h1 class="logo"><a href="javascript:void(0)">uplus 메시지허브이지<span>BACKOFFICE</span></a></h1>
-    <div class="user_wrap">
+    <div class="user_wrap">
-      <div class="user" @click="userInfoToggle();">
+      <div class="user" @click="userInfoToggle();">
-        <p>슈퍼관리자</p>
+        <p>슈퍼관리자</p>
-        <a href="javascript:void(0)" class="btn_user">Uplus01</a>
+        <a href="javascript:void(0)" class="btn_user">Uplus01</a>
-      </div>
+      </div>
-      <div class="user_info">
+      <div class="user_info">
-        <a href="superadmin_info.html" class="modify">정보수정</a>
+        <a href="superadmin_info.html" class="modify">정보수정</a>
-        <a href="javascript:void(0)" class="logout" @click="logout();">로그아웃</a>
+        <a href="javascript:void(0)" class="logout" @click="logout();">로그아웃</a>
-      </div>
+      </div>
-    </div>
+    </div>
-  </header>        
+  </header>        
-</template>
+</template>
-
+
-<script>
+<script>
-//import tokenSvc from '@/common/token-service';
+//import tokenSvc from '@/common/token-service';
-import { mapGetters } from 'vuex';
+import { mapGetters } from 'vuex';
-import loginApi from '@/modules/login/service/api';
+import loginApi from '@/modules/login/service/api';
-
+
-export default { 
+export default { 
-  name: "hubWebHeader",  
+  name: "hubWebHeader",  
-  data() {
+  data() {
-    return {
+    return {
-      menuList: null,
+      menuList: null,
-      isLogin: false,
+      isLogin: false,
-      isErrPage: false,
+      isErrPage: false,
-      navActive: false,
+      navActive: false,
-    }
+    }
-  },
+  },
-  created() {    
+  created() {    
-    
+    
-  },  
+  },  
-  computed: {
+  computed: {
-    ...mapGetters({
+    ...mapGetters({
-      getLogin: 'login/isLogin',
+      getLogin: 'login/isLogin',
-      getErrorPage: 'login/isErrorPage',
+      getErrorPage: 'login/isErrorPage',
-    }),
+    }),
-  },
+  },
-  watch: {
+  watch: {
-    getLogin(data) {
+    getLogin(data) {
-      if (data != null && data != '' && data == true) {
+      if (data != null && data != '' && data == true) {
-        this.isLogin = true;
+        this.isLogin = true;
-        //this.setMenuData();
+        //this.setMenuData();
-      } else {
+      } else {
-        this.isLogin = false;
+        this.isLogin = false;
-        //this.menuList = null;
+        //this.menuList = null;
-      }
+      }
-    },
+    },
-    getErrorPage(data) {
+    getErrorPage(data) {
-      if (data != null && data != '' && data == true) {
+      if (data != null && data != '' && data == true) {
-        this.isErrPage = true;
+        this.isErrPage = true;
-      } else {
+      } else {
-        this.isErrPage = false;
+        this.isErrPage = false;
-      }
+      }
-    },
+    },
-  },
+  },
-  methods: {
+  methods: {
-    userInfoToggle(){
+    userInfoToggle(){
-      var click = "clicked";
+      var click = "clicked";
-      var userBtn = document.querySelector('.user_wrap .user');
+      var userBtn = document.querySelector('.user_wrap .user');
-      if(userBtn.classList.contains(click)){
+      if(userBtn.classList.contains(click)){
-        userBtn.classList.remove(click);
+        userBtn.classList.remove(click);
-      }
+      }
-      else{
+      else{
-        userBtn.classList.add(click);
+        userBtn.classList.add(click);
-      }
+      }
-    },
+    },
-    logout(){
+    logout(){
-      let result = confirm("로그아웃 하시겠습니까?");
+      let result = confirm("로그아웃 하시겠습니까?");
-      if (result) {
+      if (result) {
-        loginApi.logout().then(response => {
+        loginApi.logout().then(response => {
-          if(response.data.retCode == '0000'){            
+          if(response.data.retCode == '0000'){            
-            
+            
-            //tokenSvc.removeToken();
+            //tokenSvc.removeToken();
-
+
-            this.$router.push({
+            this.$router.push({
-              path: "/login"
+              path: "/login"
-            });
+            });
-          }
+          }
-        });
+        });
-      }      
+      }      
-    }
+    }
-  }
+  }
-};
+};
-</script>
+</script>

frontend/src/components/Lnb.vue

@@ -1,56 +1,56 @@
-<template>
+<template>
-  <div>
+  <div>
-    <div>role: {{role}}</div><br/>
+    <div>role: {{role}}</div><br/>
-    <TreeMenu :nodes="tree.nodes" :depth="0" :label="tree.label"></TreeMenu>
+    <TreeMenu :nodes="tree.nodes" :depth="0" :label="tree.label"></TreeMenu>
-  </div>
+  </div>
-</template>
+</template>
-
+
-<script>
+<script>
-  import TreeMenu from './TreeMenu';
+  import TreeMenu from './TreeMenu';
-  import tokenSvc from '@/common/token-service';
+  import tokenSvc from '@/common/token-service';
-
+
-  let tree = {
+  let tree = {
-    label: 'root',
+    label: 'root',
-    nodes: [
+    nodes: [
-      {
+      {
-        label: 'item1',
+        label: 'item1',
-        nodes: [
+        nodes: [
-          {
+          {
-            label: 'item1.1'
+            label: 'item1.1'
-          },
+          },
-          {
+          {
-            label: 'item1.2',
+            label: 'item1.2',
-            nodes: [
+            nodes: [
-              {
+              {
-                label: 'item1.2.1'
+                label: 'item1.2.1'
-              }
+              }
-            ]
+            ]
-          }
+          }
-        ]
+        ]
-      },
+      },
-      {
+      {
-        label: 'item2'
+        label: 'item2'
-      }
+      }
-    ]
+    ]
-  };
+  };
-  export default {
+  export default {
-    components: {
+    components: {
-      TreeMenu
+      TreeMenu
-    },
+    },
-    data() {
+    data() {
-      return {
+      return {
-        tree
+        tree
-      };
+      };
-    },
+    },
-    computed: {
+    computed: {
-      role() {
+      role() {
-        return tokenSvc.getToken().principal.authorities[0].authority;
+        return tokenSvc.getToken().principal.authorities[0].authority;
-      }
+      }
-    },
+    },
-    created() {
+    created() {
-      console.log('created Lnb');
+      console.log('created Lnb');
-      console.log('node[0]:', this.tree.nodes[0].label);
+      console.log('node[0]:', this.tree.nodes[0].label);
-      console.log('role:', tokenSvc.getToken().principal.authorities[0].authority);
+      console.log('role:', tokenSvc.getToken().principal.authorities[0].authority);
-    }
+    }
-  };
+  };
-</script>
+</script>

frontend/src/components/LoginPopup.vue

@@ -1,307 +1,308 @@
-<template>
+<template>
-  
+  
-	
+	
-	
+	
-
+
-<!-- 버튼 -->
+<!-- 버튼 -->
-<div class="wrap bg-wrap">
+<div class="wrap bg-wrap">
-
+
-
+
-<!-- <div class="popup-btn-wrap">		
+<!-- <div class="popup-btn-wrap">		
-			<button class="trigger" onclick="ModalOpen('modal01');">로그인실패: 확인</button>
+			<button class="trigger" onclick="ModalOpen('modal01');">로그인실패: 확인</button>
-			<button class="trigger" onclick="ModalOpen('modal02');">로그인실패: 5회</button>
+			<button class="trigger" onclick="ModalOpen('modal02');">로그인실패: 5회</button>
-			<button class="trigger" onclick="ModalOpen('modal03');">로그인실패: 상태</button>
+			<button class="trigger" onclick="ModalOpen('modal03');">로그인실패: 상태</button>
-			<button class="trigger" onclick="ModalOpen('modal04');">보안 알림</button>
+			<button class="trigger" onclick="ModalOpen('modal04');">보안 알림</button>
-			<button class="trigger" onclick="ModalOpen('modal05');">중복 로그인</button>
+			<button class="trigger" onclick="ModalOpen('modal05');">중복 로그인</button>
-			<button class="trigger" onclick="ModalOpen('modal06');">휴대폰번호 확인</button>
+			<button class="trigger" onclick="ModalOpen('modal06');">휴대폰번호 확인</button>
-			<button class="trigger" onclick="ModalOpen('modal07');">인증번호: 발송</button>
+			<button class="trigger" onclick="ModalOpen('modal07');">인증번호: 발송</button>
-			<button class="trigger" onclick="ModalOpen('modal08');">인증번호: 입력</button>
+			<button class="trigger" onclick="ModalOpen('modal08');">인증번호: 입력</button>
-			<button class="trigger" onclick="ModalOpen('modal09');">인증실패: 인증번호</button>
+			<button class="trigger" onclick="ModalOpen('modal09');">인증실패: 인증번호</button>
-			<button class="trigger" onclick="ModalOpen('modal10');">인증실패: 시간초과</button>
+			<button class="trigger" onclick="ModalOpen('modal10');">인증실패: 시간초과</button>
-			<button class="trigger" onclick="ModalOpen('modal11');">인증실패: 5회</button>
+			<button class="trigger" onclick="ModalOpen('modal11');">인증실패: 5회</button>
-			<button class="trigger" onclick="ModalOpen('modal12');">비밀번호 초기화 문자 발송</button>
+			<button class="trigger" onclick="ModalOpen('modal12');">비밀번호 초기화 문자 발송</button>
-			<button class="trigger" onclick="ModalOpen('modal13');">아이디 오류</button>
+			<button class="trigger" onclick="ModalOpen('modal13');">아이디 오류</button>
-			<button class="trigger" onclick="ModalOpen('modal14');">비밀번호 오류</button>
+			<button class="trigger" onclick="ModalOpen('modal14');">비밀번호 오류</button>
-			<button class="trigger" onclick="ModalOpen('modal15');">비밀번호 패턴 오류</button>
+			<button class="trigger" onclick="ModalOpen('modal15');">비밀번호 패턴 오류</button>
-			<button class="trigger" onclick="ModalOpen('modal16');">비밀번호 정상 변경</button>
+			<button class="trigger" onclick="ModalOpen('modal16');">비밀번호 정상 변경</button>
-		</div> -->
+		</div> -->
-
+
-<!--	s: 팝업	-->
+<!--	s: 팝업	-->
-		<div class="dimmed" @click="ModalClose();"></div>
+		<div class="dimmed" @click="ModalClose();"></div>
-		<div class="popup-wrap">
+		<div class="popup-wrap">
-
+
-
+
-			<!-- 로그인실패: 확인 -->
+			<!-- 로그인실패: 확인 -->
-			<div class="popup modal01">
+			<div class="popup modal01">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">로그인 실패</h3>
+					<h3 class="pop-tit">로그인 실패</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>아이디,비밀번호를 확인해주세요.</p>
+					<p>아이디,비밀번호를 확인해주세요.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 로그인실패: 5회 -->
+			<!-- 로그인실패: 5회 -->
-			<div class="popup modal02">
+			<div class="popup modal02">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">로그인 실패</h3>
+					<h3 class="pop-tit">로그인 실패</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>로그인 5회 실패하였습니다.</p>
+					<p>로그인 5회 실패하였습니다.</p>
-					<p>비밀번호 초기화 후 비밀번호를 변경해 주세요.</p>
+					<p>비밀번호 초기화 후 비밀번호를 변경해 주세요.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 로그인실패: 상태 -->
+			<!-- 로그인실패: 상태 -->
-			<div class="popup modal03">
+			<div class="popup modal03">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">로그인 실패</h3>
+					<h3 class="pop-tit">로그인 실패</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>아이디 상태를 확인해 주세요.</p>
+					<p>아이디 상태를 확인해 주세요.</p>
-					<p>(사용중인 상태만 로그인 가능합니다.)</p>
+					<p>(사용중인 상태만 로그인 가능합니다.)</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 보안 알림 -->
+			<!-- 보안 알림 -->
-			<div class="popup modal04">
+			<div class="popup modal04">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">보안 알림</h3>
+					<h3 class="pop-tit">보안 알림</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>비밀번호를 변경하지 않은지 90일이</p>
+					<p>비밀번호를 변경하지 않은지 90일이</p>
-					<p>지났습니다. 비밀번호를 변경하여</p>
+					<p>지났습니다. 비밀번호를 변경하여</p>
-					<p>이용 부탁드립니다.</p>
+					<p>이용 부탁드립니다.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">비밀번호 변경하기</button>
+					<button class="btn-pcolor" @click="$router.push({ path: '/view/login/updatePassword' })">비밀번호 변경하기</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 중복 로그인 -->
+			<!-- 중복 로그인 -->
-			<div class="popup modal05">
+			<div class="popup modal05">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">중복 로그인</h3>
+					<h3 class="pop-tit">중복 로그인</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>동일한 아이디로 로그인 되어 있습니다.</p>
+					<p>동일한 아이디로 로그인 되어 있습니다.</p>
-					<p>이전 로그인 세션 종료 후 로그인하시겠습니까?</p>
+					<p>이전 로그인 세션 종료 후 로그인하시겠습니까?</p>
-					<p>확인 시 이전 로그인한 상태는 로그아웃됩니다.</p>
+					<p>확인 시 이전 로그인한 상태는 로그아웃됩니다.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 휴대폰번호 확인 -->
+			<!-- 휴대폰번호 확인 -->
-			<div class="popup modal06">
+			<div class="popup modal06">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">휴대폰번호 확인</h3>
+					<h3 class="pop-tit">휴대폰번호 확인</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>휴대폰번호를 확인해주세요.</p>
+					<p>휴대폰번호를 확인해주세요.</p>
-					<p>아이디에 등록된 휴대폰번호로만 인증이 가능합니다.</p>
+					<p>아이디에 등록된 휴대폰번호로만 인증이 가능합니다.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 인증번호: 발송 -->
+			<!-- 인증번호: 발송 -->
-			<div class="popup modal07">
+			<div class="popup modal07">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">인증번호 발송</h3>
+					<h3 class="pop-tit">인증번호 발송</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>인증번호를 발송하였습니다.</p>
+					<p>인증번호를 발송하였습니다.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 인증번호: 입력 -->
+			<!-- 인증번호: 입력 -->
-			<div class="popup modal08">
+			<div class="popup modal08">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">인증번호 입력</h3>
+					<h3 class="pop-tit">인증번호 입력</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>인증번호를 입력하세요.</p>
+					<p>인증번호를 입력하세요.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 인증실패: 인증번호 -->
+			<!-- 인증실패: 인증번호 -->
-			<div class="popup modal09">
+			<div class="popup modal09">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">인증실패</h3>
+					<h3 class="pop-tit">인증실패</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>잘못된 인증번호입니다.</p>
+					<p>잘못된 인증번호입니다.</p>
-					<p>5회 실패 시 로그아웃됩니다.</p>
+					<p>5회 실패 시 로그아웃됩니다.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 인증실패: 시간초과 -->
+			<!-- 인증실패: 시간초과 -->
-			<div class="popup modal10">
+			<div class="popup modal10">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">인증실패</h3>
+					<h3 class="pop-tit">인증실패</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>인증시간 초과되었습니다.</p>
+					<p>인증시간 초과되었습니다.</p>
-					<p>다시 휴대폰번호를 입력해주세요.</p>
+					<p>다시 휴대폰번호를 입력해주세요.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 인증실패: 5회 -->
+			<!-- 인증실패: 5회 -->
-			<div class="popup modal11">
+			<div class="popup modal11">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">인증실패</h3>
+					<h3 class="pop-tit">인증실패</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>인증번호 5회 실패하였습니다.</p>
+					<p>인증번호 5회 실패하였습니다.</p>
-					<p>로그아웃되어 다시 로그인해주세요.</p>
+					<p>로그아웃되어 다시 로그인해주세요.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="$router.go(-1)">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 비밀번호 초기화 발송 -->
+			<!-- 비밀번호 초기화 발송 -->
-			<div class="popup modal12">
+			<div class="popup modal12">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">비밀번호 초기화</h3>
+					<h3 class="pop-tit">비밀번호 초기화</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>해당 아이디에 저장되어 있는 핸드폰번호로</p>
+					<p>해당 아이디에 저장되어 있는 핸드폰번호로</p>
-					<p>비밀번호 초기화 문자가 발송되었습니다.</p>
+					<p>비밀번호 초기화 문자가 발송되었습니다.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 아이디 오류 -->
+			<!-- 아이디 오류 -->
-			<div class="popup modal13">
+			<div class="popup modal13">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">아이디 오류</h3>
+					<h3 class="pop-tit">아이디 오류</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>등록되지 않은 아이디입니다.</p>
+					<p>등록되지 않은 아이디입니다.</p>
-					<p>아이디를 다시 확인하세요</p>
+					<p>아이디를 다시 확인하세요</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 비밀번호 오류 -->
+			<!-- 비밀번호 오류 -->
-			<div class="popup modal14">
+			<div class="popup modal14">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">비밀번호 오류</h3>
+					<h3 class="pop-tit">비밀번호 오류</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>비밀번호를 확인해주세요.</p>
+					<p>비밀번호를 확인해주세요.</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 비밀번호 패턴 오류 -->
+			<!-- 비밀번호 패턴 오류 -->
-			<div class="popup modal15">
+			<div class="popup modal15">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">비밀번호 오류</h3>
+					<h3 class="pop-tit">비밀번호 오류</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>비밀번호를 사용할 수 없습니다.</p>
+					<p>비밀번호를 사용할 수 없습니다.</p>
-					<p>비밀번호는 영문/숫자/특수기호를 혼합하여</p>
+					<p>비밀번호는 영문/숫자/특수기호를 혼합하여</p>
-					<p>8~16자리로 설정해주세요</p>
+					<p>8~16자리로 설정해주세요</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="ModalClose();">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			
+			
-			<!-- 비밀번호 정상 변경 -->
+			<!-- 비밀번호 정상 변경 -->
-			<div class="popup modal16">
+			<div class="popup modal16">
-				<div class="pop-head">
+				<div class="pop-head">
-					<h3 class="pop-tit">비밀번호 오류</h3>
+					<h3 class="pop-tit">비밀번호 오류</h3>
-				</div>
+				</div>
-				<div class="pop-cont">
+				<div class="pop-cont">
-					<p>비밀번호가 정상적으로 변경되었습니다.</p>
+					<p>비밀번호가 정상적으로 변경되었습니다.</p>
-					<p>변경된 비밀번호로 다시 로그인 해주세요</p>
+					<p>변경된 비밀번호로 다시 로그인 해주세요</p>
-				</div>
+				</div>
-				<div class="pop-btn1">
+				<div class="pop-btn1">
-					<button class="btn-pcolor" @click="ModalClose();">확인</button>
+					<button class="btn-pcolor" @click="$router.go(-1)">확인</button>
-				</div>
+				</div>
-			</div>
+			</div>
-
+
-			
+			
-		</div>
+		</div>
-<!--	e: 팝업	-->
+<!--	e: 팝업	-->
-	</div>
+	</div>
-
+
-
+
-</template>
+</template>
-
+
-<script>
+<script>
-
+
-export default {
+
-	data(){
+export default {
-		return{
+	data(){
-
+		return{
-		}
+
-		},
+		}
-		methods: {
+		},
-		//모달 켜기
+		methods: {
-		ModalOpen(target){
+		//모달 켜기
-			console.log("ModalOpen");
+		ModalOpen(target){
-			var dimmed = document.getElementsByClassName('dimmed');
+			console.log("ModalOpen");
-			var wrap = document.getElementsByClassName('popup-wrap');
+			var dimmed = document.getElementsByClassName('dimmed');
-			var obj = document.getElementsByClassName(target);
+			var wrap = document.getElementsByClassName('popup-wrap');
-			dimmed[0].style.display = 'block';
+			var obj = document.getElementsByClassName(target);
-			wrap[0].style.display = 'block';
+			dimmed[0].style.display = 'block';
-			obj[0].style.display = 'block';
+			wrap[0].style.display = 'block';
-		},
+			obj[0].style.display = 'block';
-		// 모달 끄기
+		},
-		ModalClose(){
+		// 모달 끄기
-			var dimmed = document.getElementsByClassName('dimmed');
+		ModalClose(){
-			var wrap = document.getElementsByClassName('popup-wrap');
+			var dimmed = document.getElementsByClassName('dimmed');
-			var obj = wrap[0].childElementCount
+			var wrap = document.getElementsByClassName('popup-wrap');
-			dimmed[0].style.display = 'none';
+			var obj = wrap[0].childElementCount
-			wrap[0].style.display = 'none';
+			dimmed[0].style.display = 'none';
-			for(var i = 0; i < obj; i++) {
+			wrap[0].style.display = 'none';
-				var target = document.getElementsByClassName('popup');
+			for(var i = 0; i < obj; i++) {
-				target[i].style.display = 'none';
+				var target = document.getElementsByClassName('popup');
-			}
+				target[i].style.display = 'none';
-		},
+			}
-	}
+		},
-
+	}
-}
+
-</script>
+}
-
+</script>
-<style>
+
-
+<style>
-		.popup-btn-wrap {width: 500px; margin: auto; padding: 100px 0;}
+
-		.popup-btn-wrap button {width: 100%; margin-bottom: 10px; height: 50px; border-radius: 5px; box-shadow: none; border: 1px solid #000; }
+		.popup-btn-wrap {width: 500px; margin: auto; padding: 100px 0;}
-		.popup-btn-wrap button:hover {background: #000; color: #fff;}
+		.popup-btn-wrap button {width: 100%; margin-bottom: 10px; height: 50px; border-radius: 5px; box-shadow: none; border: 1px solid #000; }
-
+		.popup-btn-wrap button:hover {background: #000; color: #fff;}
+
 </style>

frontend/src/components/NavBar.vue

@@ -1,132 +1,121 @@
-<template>
+<template>
-    <nav>
+    <nav>
-        <ul v-if="menuList.length > 0" class="main_menu">
+        <ul v-if="menuList.length > 0" class="main_menu">
-            <!-- 선택한 메뉴 li.is-current -->
+            <!-- 선택한 메뉴 li.is-current -->
-            <li v-for="child in menuList" :key="child.menuNo" :class="child.classNm">
+            <li v-for="child in menuList" :key="child.menuNo" :class="child.classNm">
-                <div class="menu_btn" ></div>
+                <div class="menu_btn" ></div>
-                <a class="menu_target"  @click="clickTest" :data-menu-no="child.menuNo">{{child.menuNm}}</a>
+                <a class="menu_target"  @click="actionMenu" :data-menu-no="child.menuNo">{{child.menuNm}}</a>
-                <div class="sub_menu_wrap">
+                <div class="sub_menu_wrap">
-                    <ul class="sub_menu" v-if="child.children.length > 0">
+                    <ul class="sub_menu" v-if="child.children.length > 0">
-                        <li v-for="child2 in child.children" :key="child2.menuNo">
+                        <li v-for="child2 in child.children" :key="child2.menuNo">
-                            <a href="javascript:void(0);" @click="clickMenu(child2.menuUrl)" :data-menu-no="child2.menuNo">{{child2.menuNm}}</a>
+                            <a href="javascript:void(0);" @click="clickMenu(child2.menuUrl)" :data-menu-no="child2.menuNo">{{child2.menuNm}}</a>
-                        </li>                        
+                        </li>                        
-                    </ul>
+                    </ul>
-                </div>
+                </div>
-            </li>        
+            </li>        
-        </ul>
+        </ul>
-    </nav>
+    </nav>
-</template>
+</template>
-
+
-<script>
+<script>
-//import "../assets/js/script.js";
+//import "../assets/js/script.js";
-import api from '@/service/api.js';
+import api from '@/service/api.js';
-
+
-export default {
+export default {
-  name: 'Nav',
+  name: 'Nav',
-  props: {
+  props: {
-    
+    
-  },
+  },
-  data() {
+  data() {
-    return {
+    return {
-      isLogin : false,
+      isLogin : false,
-      isAuthChk : false,
+      isAuthChk : false,
-      menuList: null,
+      menuList: [],
-      tempList: null
+      tempList: []
-    }
+    }
-  },
+  },
-  created() {  
+  created() {  
-      // 메뉴 가져오기    
+      // 메뉴 가져오기    
-      this.setMenuData();
+      this.setMenuData();
-      
+      
-  },
+  },
-  mounted() {},
+  mounted() {},
-  computed: {
+  computed: {
-     
+     
-  },
+  },
-  watch: {
+  watch: {
-       
+       
-  },
+  },
-  methods: {
+  methods: {
-    setMenuData() {
+    setMenuData() {
-      api.menus().then(response => {
+      api.menus().then(response => {
-        const rootMenu = response.data.data;
+        const rootMenu = response.data.data;
-        console.log(rootMenu);        
+        console.log(rootMenu);        
-        if (rootMenu != null && rootMenu.children != null && rootMenu.children.length > 0) {
+        if (rootMenu != null && rootMenu.children != null && rootMenu.children.length > 0) {
-            this.tempList = rootMenu.children;
+            this.tempList = rootMenu.children;
-            for(var i=0; i<this.tempList.length; i++){
+            for(var i=0; i<this.tempList.length; i++){
-                var menuNo = this.tempList[i].menuNo;
+                var menuNo = this.tempList[i].menuNo;
-                var classNm = '';
+                var classNm = '';
-                switch(menuNo){
+                switch(menuNo){
-                    case 1001 :  classNm = 'customer'; break;
+                    case 1001 :  classNm = 'customer'; break;
-                    case 1002 :  classNm = 'attract'; break;
+                    case 1002 :  classNm = 'attract'; break;
-                    case 1003 :  classNm = 'service'; break;
+                    case 1003 :  classNm = 'service'; break;
-                    case 1004 :  classNm = 'calculate'; break;
+                    case 1004 :  classNm = 'calculate'; break;
-                    case 1005 :  classNm = 'channel'; break;
+                    case 1005 :  classNm = 'channel'; break;
-                    case 1006 :  classNm = 'key'; break;
+                    case 1006 :  classNm = 'key'; break;
-                    case 1007 :  classNm = 'moniter'; break;
+                    case 1007 :  classNm = 'moniter'; break;
-                    case 1008 :  classNm = 'risk'; break;
+                    case 1008 :  classNm = 'risk'; break;
-                    case 1009 :  classNm = 'stats'; break;
+                    case 1009 :  classNm = 'stats'; break;
-                    case 1010 :  classNm = 'system'; break;
+                    case 1010 :  classNm = 'system'; break;
-                    default : classNm = 'customer';
+                    default : classNm = 'customer';
-                }
+                }
-                this.tempList[i].classNm = classNm;
+                this.tempList[i].classNm = classNm;
-                //console.log(classNm);
+                //console.log(classNm);
-            }
+            }
-
+
-
+
-            //this.menuList = rootMenu.children;            
+            //this.menuList = rootMenu.children;            
-            this.menuList = this.tempList;
+            this.menuList = this.tempList;
-            //this.$store.commit("login/isLogin", true);      
+            //this.$store.commit("login/isLogin", true);      
-            //this.$store.commit("login/isAuthChk", true);
+            //this.$store.commit("login/isAuthChk", true);
-        } else {
+        } else {          
-          this.$store.commit("login/isLogin", false);      
+          window.top.location.href = '/';
-          this.$store.commit("login/isAuthChk", false);      
+        }
-          this.menuList = null;
+      });
-          this.$router.push({ path: '/login' });
+    },    
-        }
+    clickMenu(link){
-      }).catch(response => {        
+       
-        this.$store.commit("login/isLogin", false);      
+       this.$router.push({
-        this.$store.commit("login/isAuthChk", false);      
+            path: link
-        this.menuList = null;
+        }); 
-        this.$router.push({ path: '/login' });
+    },
-        console.log(response);
+
-      });
+    
-    },
+    actionMenu(e){
-    clickMenu(link){
+      const menuList = document.querySelectorAll('.main_menu .is-current');        
-       
+
-       this.$router.push({
+      if(e.target.classList.contains('menu_target') || e.target.classList.contains('menu_btn')){
-            path: link
+        const menuListCheck = e.target.parentNode;
-        }); 
+        if(menuListCheck.classList.contains('is-current')){
-    },
+            menuListCheck.classList.remove('is-current');
-
+            
-    
+            for(const menu of menuList){
-    clickTest(e){
+                menu.classList.remove('is-current');
-        const menuList = document.querySelectorAll('.main_menu .is-current');
+            }
-
+        } else {
-        
+            for(const other of menuList){
-
+                other.classList.remove('is-current');
-     if(e.target.classList.contains('menu_target') || e.target.classList.contains('menu_btn')){
+
-                    const menuListCheck = e.target.parentNode;
+            }	
-                    if(menuListCheck.classList.contains('is-current')){
+            menuListCheck.classList.add('is-current');
-                        menuListCheck.classList.remove('is-current');
+        }
-                       
+      }
-                       for(const menu of menuList){
+    },
-                           menu.classList.remove('is-current');
+   
-                         }
+
-                    } else {
+
-                        for(const other of menuList){
+
-                            other.classList.remove('is-current');
+
-
+  }
-                        }	
+}
-                        menuListCheck.classList.add('is-current');
-                    }
-                }
-    },
-   
-
-
-
-
-  }
-}
 </script>

frontend/src/components/Pagination.vue

@@ -1,133 +1,133 @@
-<template>
+<template>
-  <div class="paging" :class="{className: true}">
+  <div class="paging" :class="{className: true}">
-    <a href="javascript:void(0);" class="btn_arrow first" @click="changePageFirst">처음으로</a>
+    <a href="javascript:void(0);" class="btn_arrow first" @click="changePageFirst">처음으로</a>
-    <a href="javascript:void(0);" class="btn_arrow prev" @click="changeRangePrev">이전으로</a>
+    <a href="javascript:void(0);" class="btn_arrow prev" @click="changeRangePrev">이전으로</a>
-    <a
+    <a
-      href="javascript:void(0);"
+      href="javascript:void(0);"
-      v-for="page in visiblePage"
+      v-for="page in visiblePage"
-      :key="`page-${page}`"
+      :key="`page-${page}`"
-      :class="{'active': parseInt(currentPage) === page}"
+      :class="{'active': parseInt(currentPage) === page}"
-      @click="changePage(page)"
+      @click="changePage(page)"
-    >{{ page }}</a>
+    >{{ page }}</a>
-    <a href="javascript:void(0);" class="btn_arrow next" @click="changeRangeNext">다음으로</a>
+    <a href="javascript:void(0);" class="btn_arrow next" @click="changeRangeNext">다음으로</a>
-    <a href="javascript:void(0);" class="btn_arrow last" @click="changePageLast">마지막으로</a>
+    <a href="javascript:void(0);" class="btn_arrow last" @click="changePageLast">마지막으로</a>
-  </div>
+  </div>
-</template>
+</template>
-
+
-<script>
+<script>
-export default {
+export default {
-  name: 'Pagination',
+  name: 'Pagination',
-  props: {
+  props: {
-    total: {
+    total: {
-      type: [Number, String],
+      type: [Number, String],
-      default: 0
+      default: 0
-    },
+    },
-    pageSize: {
+    pageSize: {
-      type: [Number, String],
+      type: [Number, String],
-      default: 10
+      default: 10
-    },
+    },
-    currentPage: {
+    currentPage: {
-      type: [Number, String],
+      type: [Number, String],
-      default: 1
+      default: 1
-    },
+    },
-    className: {
+    className: {
-      type: String,
+      type: String,
-      default: ''
+      default: ''
-    },
+    },
-    rangeMax: {
+    rangeMax: {
-      type: [Number, String],
+      type: [Number, String],
-      default: 10
+      default: 10
-    }
+    }
-  },
+  },
-  data() {
+  data() {
-    return {
+    return {
-      range: 0
+      range: 0
-    }
+    }
-  },
+  },
-  created() {},
+  created() {},
-  mounted() {},
+  mounted() {},
-  computed: {
+  computed: {
-    visiblePage() {
+    visiblePage() {
-      let range = []
+      let range = []
-      for (let i = this.rangeStart; i <= this.rangeEnd; i++) {
+      for (let i = this.rangeStart; i <= this.rangeEnd; i++) {
-        range.push(i)
+        range.push(i)
-      }
+      }
-      return range
+      return range
-    },
+    },
-    lastPage() {
+    lastPage() {
-      return parseInt(this.total) > 0
+      return parseInt(this.total) > 0
-        ? Math.ceil(parseInt(this.total) / parseInt(this.pageSize))
+        ? Math.ceil(parseInt(this.total) / parseInt(this.pageSize))
-        : 1
+        : 1
-    },
+    },
-    rangeStart() {
+    rangeStart() {
-      return parseInt(this.rangeMax) * this.range + 1
+      return parseInt(this.rangeMax) * this.range + 1
-    },
+    },
-    rangeEnd() {
+    rangeEnd() {
-      return parseInt(this.rangeMax) * (this.range + 1) < this.lastPage
+      return parseInt(this.rangeMax) * (this.range + 1) < this.lastPage
-        ? parseInt(this.rangeMax) * (this.range + 1)
+        ? parseInt(this.rangeMax) * (this.range + 1)
-        : this.lastPage
+        : this.lastPage
-    },
+    },
-    lastRange() {
+    lastRange() {
-      return parseInt(this.total) > 0
+      return parseInt(this.total) > 0
-        ? Math.ceil(
+        ? Math.ceil(
-            parseInt(this.total) /
+            parseInt(this.total) /
-              (parseInt(this.pageSize) * parseInt(this.rangeMax))
+              (parseInt(this.pageSize) * parseInt(this.rangeMax))
-          )
+          )
-        : 0
+        : 0
-    }
+    }
-  },
+  },
-  watch: {
+  watch: {
-    total() {
+    total() {
-      this.init()
+      this.init()
-    },
+    },
-    currentPage() {
+    currentPage() {
-      this.setRange()
+      this.setRange()
-    }
+    }
-  },
+  },
-  methods: {
+  methods: {
-    init() {
+    init() {
-      this.range = 0
+      this.range = 0
-    },
+    },
-    setRange() {
+    setRange() {
-      this.range = Math.floor(
+      this.range = Math.floor(
-        (parseInt(this.currentPage) - 1) / parseInt(this.rangeMax)
+        (parseInt(this.currentPage) - 1) / parseInt(this.rangeMax)
-      )
+      )
-    },
+    },
-    changePage(page) {
+    changePage(page) {
-      this.$emit('update:currentPage', page)
+      this.$emit('update:currentPage', page)
-      this.$emit('change', page)
+      this.$emit('change', page)
-    },
+    },
-    changeRangePrev() {
+    changeRangePrev() {
-      if (this.range > 0) {
+      if (this.range > 0) {
-        this.range -= 1
+        this.range -= 1
-        this.$emit('update:currentPage', this.rangeStart)
+        this.$emit('update:currentPage', this.rangeStart)
-        this.$emit('change', this.rangeStart)
+        this.$emit('change', this.rangeStart)
-      }
+      }
-    },
+    },
-    changeRangeNext() {
+    changeRangeNext() {
-      if (this.range < this.lastRange - 1) {
+      if (this.range < this.lastRange - 1) {
-        this.range += 1
+        this.range += 1
-        this.$emit('update:currentPage', this.rangeStart)
+        this.$emit('update:currentPage', this.rangeStart)
-        this.$emit('change', this.rangeStart)
+        this.$emit('change', this.rangeStart)
-      }
+      }
-    },
+    },
-    changePageFirst() {
+    changePageFirst() {
-      this.range = 0
+      this.range = 0
-      this.$emit('update:currentPage', 1)
+      this.$emit('update:currentPage', 1)
-      this.$emit('change', 1)
+      this.$emit('change', 1)
-    },
+    },
-    changePageLast() {
+    changePageLast() {
-      if (parseInt(this.total) > 0) {
+      if (parseInt(this.total) > 0) {
-        this.range = this.lastRange - 1
+        this.range = this.lastRange - 1
-      } else {
+      } else {
-        this.range = 0
+        this.range = 0
-      }
+      }
-      this.$emit('update:currentPage', this.lastPage)
+      this.$emit('update:currentPage', this.lastPage)
-      this.$emit('change', this.lastPage)
+      this.$emit('change', this.lastPage)
-    }
+    }
-  }
+  }
-}
+}
-</script>
+</script>
-
+
-<style>
+<style>
-</style>
+</style>

frontend/src/components/TreeMenu.vue

@@ -1,61 +1,61 @@
-<template>
+<template>
-  <div class="tree-menu">
+  <div class="tree-menu">
-    <div class="label-wrapper" v-if="depth > 0" @click="toggleChildren">
+    <div class="label-wrapper" v-if="depth > 0" @click="toggleChildren">
-      <div :style="indent" :class="labelClasses">
+      <div :style="indent" :class="labelClasses">
-        {{ label }}
+        {{ label }}
-        <b v-if="nodes">[{{showChildren ? '-' : '+'}}]</b>
+        <b v-if="nodes">[{{showChildren ? '-' : '+'}}]</b>
-      </div>
+      </div>
-    </div>
+    </div>
-    <span v-if="showChildren">
+    <span v-if="showChildren">
-      <TreeMenu
+      <TreeMenu
-        v-for="node in nodes"
+        v-for="node in nodes"
-        :key="node.label"
+        :key="node.label"
-        :nodes="node.nodes"
+        :nodes="node.nodes"
-        :label="node.label"
+        :label="node.label"
-        :depth="depth + 1"
+        :depth="depth + 1"
-      ></TreeMenu>
+      ></TreeMenu>
-    </span>
+    </span>
-  </div>
+  </div>
-</template>
+</template>
-
+
-<script>
+<script>
-export default {
+export default {
-  name: "TreeMenu", // recursive component에는 name 설정 필수.
+  name: "TreeMenu", // recursive component에는 name 설정 필수.
-  props: ["nodes", "label", "depth"],
+  props: ["nodes", "label", "depth"],
-  data() {
+  data() {
-    return {
+    return {
-      showChildren: true
+      showChildren: true
-    };
+    };
-  },
+  },
-  computed: {
+  computed: {
-    labelClasses() {
+    labelClasses() {
-      return { "has-children": this.nodes };
+      return { "has-children": this.nodes };
-    },
+    },
-    indent() {
+    indent() {
-      return { transform: `translate(${(this.depth-1) * 50}px)` };
+      return { transform: `translate(${(this.depth-1) * 50}px)` };
-    }
+    }
-  },
+  },
-  methods: {
+  methods: {
-    toggleChildren() {
+    toggleChildren() {
-      this.showChildren = !this.showChildren;
+      this.showChildren = !this.showChildren;
-    }
+    }
-  }
+  }
-};
+};
-</script>
+</script>
-
+
-<style lang="scss" scoped>
+<style lang="scss" scoped>
-.container {
+.container {
-  width: 300px;
+  width: 300px;
-  margin: 0 auto;
+  margin: 0 auto;
-}
+}
-
+
-.tree-menu {
+.tree-menu {
-  .label-wrapper {
+  .label-wrapper {
-    padding-bottom: 10px;
+    padding-bottom: 10px;
-    margin-bottom: 10px;
+    margin-bottom: 10px;
-    .has-children {
+    .has-children {
-      cursor: pointer;
+      cursor: pointer;
-    }
+    }
-  }
+  }
-}
+}
-</style>
+</style>

frontend/src/components/TuiGrid.vue

@@ -1,293 +1,293 @@
-<template>
+<template>
-  <grid
+  <grid
-    ref="tuiGrid"
+    ref="tuiGrid"
-    :class="addClass"
+    :class="addClass"
-    :data="gridProps.data"
+    :data="gridProps.data"
-    :columns="gridProps.columns"
+    :columns="gridProps.columns"
-    :options="gridProps.options"
+    :options="gridProps.options"
-    :language="gridProps.language"
+    :language="gridProps.language"
-    @click="clicked"
+    @click="clicked"
-    @response="response"
+    @response="response"
-    @beforeRequest="beforeRequest"
+    @beforeRequest="beforeRequest"
-    :summary="gridProps.summary"
+    :summary="gridProps.summary"
-  />
+  />
-  <!--
+  <!--
-    - 공식홈: https://ui.toast.com/tui-grid
+    - 공식홈: https://ui.toast.com/tui-grid
-    - vue git: https://github.com/nhn/toast-ui.vue-grid
+    - vue git: https://github.com/nhn/toast-ui.vue-grid
-    - api & sample: https://nhn.github.io/tui.grid/latest/
+    - api & sample: https://nhn.github.io/tui.grid/latest/
-    - 연동 결과는 아래 포맷에 맞추어 주세요. 
+    - 연동 결과는 아래 포맷에 맞추어 주세요. 
-      TuiGrid.java VO 참고
+      TuiGrid.java VO 참고
-      적용 예: UserController > user
+      적용 예: UserController > user
-      {
+      {
-        "result": true,
+        "result": true,
-        "data": {
+        "data": {
-          "contents": [],
+          "contents": [],
-          "pagination": {
+          "pagination": {
-            "page": 1,
+            "page": 1,
-            "totalCount": 100
+            "totalCount": 100
-          }
+          }
-        }
+        }
-      }
+      }
-  -->
+  -->
-</template>
+</template>
-
+
-<script>
+<script>
-import 'tui-grid/dist/tui-grid.css';
+import 'tui-grid/dist/tui-grid.css';
-import 'tui-pagination/dist/tui-pagination.css';
+import 'tui-pagination/dist/tui-pagination.css';
-import TuiGrid from 'tui-grid';
+import TuiGrid from 'tui-grid';
-import { Grid } from '@toast-ui/vue-grid';
+import { Grid } from '@toast-ui/vue-grid';
-
+
-export default {
+export default {
-  name: 'tuiGrid',
+  name: 'tuiGrid',
-  props: [
+  props: [
-    'url', // 연동 url
+    'url', // 연동 url
-    'initialRequest', // false일 시 초기 렌더링 시 백엔드에 요청 하지 않음. 이 경우 readData를 호출하여 그리드 데이터를 할당해 줘야 함
+    'initialRequest', // false일 시 초기 렌더링 시 백엔드에 요청 하지 않음. 이 경우 readData를 호출하여 그리드 데이터를 할당해 줘야 함
-    'rowHeaders', // 체크 박스 등 헤더에 필요한 타입 ex) ["checkbox"]
+    'rowHeaders', // 체크 박스 등 헤더에 필요한 타입 ex) ["checkbox"]
-    'header', // 옵션 (헤더 병합 등)
+    'header', // 옵션 (헤더 병합 등)
-    'minRowHeight', // 리스트 row 높이
+    'minRowHeight', // 리스트 row 높이
-    'minBodyHeight', // 테이블 높이
+    'minBodyHeight', // 테이블 높이
-    'pagination', // 페이지 네비게이션 사용 여부
+    'pagination', // 페이지 네비게이션 사용 여부
-    'perPage', // 페이지 당 개수
+    'perPage', // 페이지 당 개수
-    'totalItems', // 부모창에 표시할 총 컨텐츠 개수 변수 명 (더 좋은 방법 있으면 알려주세요.)
+    'totalItems', // 부모창에 표시할 총 컨텐츠 개수 변수 명 (더 좋은 방법 있으면 알려주세요.)
-    'columns', // 컬럼 정보
+    'columns', // 컬럼 정보
-    'showVerticalBorder', // cell 세로라인 표시
+    'showVerticalBorder', // cell 세로라인 표시
-    'noDataStr', // 데이터가 없을 때
+    'noDataStr', // 데이터가 없을 때
-    'noSearchStr', // 검색 결과가 없을 때
+    'noSearchStr', // 검색 결과가 없을 때
-    'scrollX', // 가로 스크롤 사용 여부
+    'scrollX', // 가로 스크롤 사용 여부
-    'scrollY', // 세로 스크롤 사용 여부
+    'scrollY', // 세로 스크롤 사용 여부
-    'addClass', // table에 추가할 클래스
+    'addClass', // table에 추가할 클래스
-    'evtClick', // 클릭 이벤트 정보, 해당 커럼을 클릭하면 callback 수행, 이때 해당 row의 데이터를 파라미터로 반환한다. Object Or Array
+    'evtClick', // 클릭 이벤트 정보, 해당 커럼을 클릭하면 callback 수행, 이때 해당 row의 데이터를 파라미터로 반환한다. Object Or Array
-    // ex) evtClick: { column: "idx", callback: clickIdx }
+    // ex) evtClick: { column: "idx", callback: clickIdx }
-    //     or  evtClick: [ { column: "idx", callback: this.myFnc }, { column: "name", ...  } ]
+    //     or  evtClick: [ { column: "idx", callback: this.myFnc }, { column: "name", ...  } ]
-    'summary'
+    'summary'
-  ],
+  ],
-  components: {
+  components: {
-    grid: Grid
+    grid: Grid
-  },
+  },
-  data() {
+  data() {
-    return {
+    return {
-      instance: null,
+      instance: null,
-      gridProps: null,
+      gridProps: null,
-      currEventListener: null,
+      currEventListener: null,
-      currGridEle: null,
+      currGridEle: null,
-      currMode: 'normal'
+      currMode: 'normal'
-    };
+    };
-  },
+  },
-  mounted() {
+  mounted() {
-    this.saveGridEventListner();
+    this.saveGridEventListner();
-    //if(this.currMode != 'normal')
+    //if(this.currMode != 'normal')
-    //this.initGridEventListner();
+    //this.initGridEventListner();
-  },
+  },
-  beforeDestroy() {
+  beforeDestroy() {
-    this.addGridEventListner();
+    this.addGridEventListner();
-  },
+  },
-  created() {
+  created() {
-    /**
+    /**
-     * Use the static method as below
+     * Use the static method as below
-     */
+     */
-    TuiGrid.applyTheme('default', {
+    TuiGrid.applyTheme('default', {
-      outline: {
+      outline: {
-        border: '#333 !important' // 테이블 위아래 선의 색깔 지정
+        border: '#333 !important' // 테이블 위아래 선의 색깔 지정
-      },
+      },
-      row: {
+      row: {
-        hover: {
+        hover: {
-          background: '#fafafa !important' // row 마우스 오버 시 색깔 지정
+          background: '#fafafa !important' // row 마우스 오버 시 색깔 지정
-        }
+        }
-      },
+      },
-      area: {
+      area: {
-        header: {
+        header: {
-          border: '#aaaaaa !important' // header 아래 선의 색깔 지정
+          border: '#aaaaaa !important' // header 아래 선의 색깔 지정
-        }
+        }
-      },
+      },
-      cell: {
+      cell: {
-        normal: {
+        normal: {
-          showVerticalBorder: this.showVerticalBorder === true // 각 셀의 세로 선 노출
+          showVerticalBorder: this.showVerticalBorder === true // 각 셀의 세로 선 노출
-        }
+        }
-      }
+      }
-    });
+    });
-
+
-    this.gridProps = {
+    this.gridProps = {
-      data: {
+      data: {
-        api: {
+        api: {
-          readData: { url: this.url, method: 'GET' }
+          readData: { url: this.url, method: 'GET' }
-        },
+        },
-        initialRequest: typeof this.initialRequest == 'undefined' ? true : this.initialRequest
+        initialRequest: typeof this.initialRequest == 'undefined' ? true : this.initialRequest
-      },
+      },
-      options: {
+      options: {
-        rowHeaders: this.rowHeaders,
+        rowHeaders: this.rowHeaders,
-        header: this.header ? this.header : { height: 47 },
+        header: this.header ? this.header : { height: 47 },
-        minRowHeight: this.minRowHeight ? this.minRowHeight : 56,
+        minRowHeight: this.minRowHeight ? this.minRowHeight : 56,
-        minBodyHeight: this.minBodyHeight ? this.minBodyHeight : 56,
+        minBodyHeight: this.minBodyHeight ? this.minBodyHeight : 56,
-        showDummyRows: true,
+        showDummyRows: true,
-        scrollX: this.scrollX === true,
+        scrollX: this.scrollX === true,
-        scrollY: this.scrollY === true,
+        scrollY: this.scrollY === true,
-        pagination: this.pagination,
+        pagination: this.pagination,
-        pageOptions: {
+        pageOptions: {
-          perPage: this.perPage
+          perPage: this.perPage
-        }
+        }
-      },
+      },
-      language: {
+      language: {
-        name: 'ko',
+        name: 'ko',
-        value: {
+        value: {
-          display: {
+          display: {
-            noData: this.noDataStr
+            noData: this.noDataStr
-          }
+          }
-        }
+        }
-      },
+      },
-      columns: this.columns,
+      columns: this.columns,
-      summary: this.summary
+      summary: this.summary
-    };
+    };
-  },
+  },
-  methods: {
+  methods: {
-    clicked: function(v) {
+    clicked: function(v) {
-      if (typeof this.evtClick != 'undefined' && this.evtClick != null) {
+      if (typeof this.evtClick != 'undefined' && this.evtClick != null) {
-        let data = this.$refs.tuiGrid.invoke('getRow', v.rowKey);
+        let data = this.$refs.tuiGrid.invoke('getRow', v.rowKey);
-
+
-        if (Array.isArray(this.evtClick)) {
+        if (Array.isArray(this.evtClick)) {
-          for (var i = 0; i < this.evtClick.length; i++) {
+          for (var i = 0; i < this.evtClick.length; i++) {
-            if (v.columnName == this.evtClick[i].column && typeof this.evtClick[i].callback == 'function') {
+            if (v.columnName == this.evtClick[i].column && typeof this.evtClick[i].callback == 'function') {
-              this.evtClick[i].callback(data);
+              this.evtClick[i].callback(data);
-            }
+            }
-          }
+          }
-        } else if (
+        } else if (
-          this.evtClick.column != null &&
+          this.evtClick.column != null &&
-          v.columnName == this.evtClick.column &&
+          v.columnName == this.evtClick.column &&
-          typeof this.evtClick.callback == 'function'
+          typeof this.evtClick.callback == 'function'
-        ) {
+        ) {
-          this.evtClick.callback(data);
+          this.evtClick.callback(data);
-        }
+        }
-      }
+      }
-    },
+    },
-    response: function(event) {
+    response: function(event) {
-      let xhr = event.xhr;
+      let xhr = event.xhr;
-      let statusCode = xhr.status;
+      let statusCode = xhr.status;
-      if (statusCode == 200) {
+      if (statusCode == 200) {
-        let respData = JSON.parse(xhr.response).data;
+        let respData = JSON.parse(xhr.response).data;
-        this.$parent[this.totalItems] = respData.pagination.totalCount;
+        this.$parent[this.totalItems] = respData.pagination.totalCount;
-
+
-        let len = respData.contents.length;
+        let len = respData.contents.length;
-        if (this.scrollY == false) {
+        if (this.scrollY == false) {
-          if (len > 0) {
+          if (len > 0) {
-            let divLen = 6;
+            let divLen = 6;
-            if (this.scrollX == true) {
+            if (this.scrollX == true) {
-              divLen = 5;
+              divLen = 5;
-            }
+            }
-            // header의 height를 구할 수 있는 방법은? 일단 48
+            // header의 height를 구할 수 있는 방법은? 일단 48
-            let addLen = len / divLen;
+            let addLen = len / divLen;
-            this.getGridInstance().setBodyHeight((len + addLen) * 48);
+            this.getGridInstance().setBodyHeight((len + addLen) * 48);
-          } else {
+          } else {
-            this.getGridInstance().setBodyHeight(48);
+            this.getGridInstance().setBodyHeight(48);
-          }
+          }
-        }
+        }
-      } else if (statusCode == 401 || statusCode == 418) {
+      } else if (statusCode == 401 || statusCode == 418) {
-        alert('세션이 만료되었습니다.');
+        alert('세션이 만료되었습니다.');
-        window.top.location.href = '/login';
+        window.top.location.href = '/login';
-      } else {
+      } else {
-        window.top.location.href = '/view/error/' + statusCode;
+        window.top.location.href = '/view/error/' + statusCode;
-      }
+      }
-    },
+    },
-    beforeRequest: function(event) {
+    beforeRequest: function(event) {
-      if (this.scrollY == false) {
+      if (this.scrollY == false) {
-        this.getGridInstance().setBodyHeight(90);
+        this.getGridInstance().setBodyHeight(90);
-      }
+      }
-    },
+    },
-    getData: function() {
+    getData: function() {
-      // 전체 Row 데이터를 가져온다.
+      // 전체 Row 데이터를 가져온다.
-      return this.getGridInstance().getData();
+      return this.getGridInstance().getData();
-    },
+    },
-    getRow: function(rowKey) {
+    getRow: function(rowKey) {
-      // 해당 Row의 데이터를 가져온다.
+      // 해당 Row의 데이터를 가져온다.
-      return this.getGridInstance().getRow(rowKey);
+      return this.getGridInstance().getRow(rowKey);
-    },
+    },
-    getPagination: function() {
+    getPagination: function() {
-      // 페이지 정보
+      // 페이지 정보
-      return this.getGridInstance().getPagination();
+      return this.getGridInstance().getPagination();
-    },
+    },
-    setPerPage: function(count) {
+    setPerPage: function(count) {
-      // 페이지 당 표시 개수 변경
+      // 페이지 당 표시 개수 변경
-      this.getGridInstance().setPerPage(count);
+      this.getGridInstance().setPerPage(count);
-    },
+    },
-    readData: function(page, param) {
+    readData: function(page, param) {
-      // 페이지 데이터 갱신 (initialRequest가 false일 경우 초기 데이터 로드시에도 사용)
+      // 페이지 데이터 갱신 (initialRequest가 false일 경우 초기 데이터 로드시에도 사용)
-      this.getGridInstance().readData(page, param, true);
+      this.getGridInstance().readData(page, param, true);
-    },
+    },
-    appendRow: function(rowData, rownum) {
+    appendRow: function(rowData, rownum) {
-      var optionsOpt = {
+      var optionsOpt = {
-        at: rownum || 0,
+        at: rownum || 0,
-        extendPrevRowSpan: false,
+        extendPrevRowSpan: false,
-        focus: false
+        focus: false
-      };
+      };
-      this.getGridInstance().appendRow(rowData, optionsOpt);
+      this.getGridInstance().appendRow(rowData, optionsOpt);
-    },
+    },
-    search: function(param) {
+    search: function(param) {
-      // 검색 결과가 없을 경우 텍스트 변경
+      // 검색 결과가 없을 경우 텍스트 변경
-      let noSearchStr = '';
+      let noSearchStr = '';
-      if (typeof this.noSearchStr == 'undefined') {
+      if (typeof this.noSearchStr == 'undefined') {
-        noSearchStr = '검색 결과가 없습니다.';
+        noSearchStr = '검색 결과가 없습니다.';
-      }
+      }
-      this.$refs.tuiGrid.language.value.display.noData = noSearchStr;
+      this.$refs.tuiGrid.language.value.display.noData = noSearchStr;
-      this.$refs.tuiGrid.setLanguage();
+      this.$refs.tuiGrid.setLanguage();
-
+
-      // param을 기반으로 리스트 갱신
+      // param을 기반으로 리스트 갱신
-      this.readData(1, param);
+      this.readData(1, param);
-    },
+    },
-    gridMethod: function(params) {
+    gridMethod: function(params) {
-      return this.$refs.tuiGrid.invoke(...params);
+      return this.$refs.tuiGrid.invoke(...params);
-    },
+    },
-    getGridInstance() {
+    getGridInstance() {
-      if (this.instance == null) {
+      if (this.instance == null) {
-        this.instance = this.$refs.tuiGrid.gridInstance;
+        this.instance = this.$refs.tuiGrid.gridInstance;
-      }
+      }
-      return this.instance;
+      return this.instance;
-    },
+    },
-    saveGridEventListner() {
+    saveGridEventListner() {
-      // this.currGridEle = document.querySelector(`div.tui-grid-container.tui-grid-show-lside-area`);
+      // this.currGridEle = document.querySelector(`div.tui-grid-container.tui-grid-show-lside-area`);
-      this.currGridEle = document.querySelector(`div.tui-grid-container`);
+      this.currGridEle = document.querySelector(`div.tui-grid-container`);
-
+
-      if (this.currGridEle != null && window.getEventListeners(this.currGridEle).mousedown) {
+      if (this.currGridEle != null && window.getEventListeners(this.currGridEle).mousedown) {
-        this.currEventListener = window.getEventListeners(this.currGridEle).mousedown[0].listener;
+        this.currEventListener = window.getEventListeners(this.currGridEle).mousedown[0].listener;
-      }
+      }
-    },
+    },
-    removeGridEventListner() {
+    removeGridEventListner() {
-      this.currMode = 'edit';
+      this.currMode = 'edit';
-      this.currGridEle.removeEventListener('mousedown', this.currEventListener);
+      this.currGridEle.removeEventListener('mousedown', this.currEventListener);
-      this.currGridEle.setAttribute('tabindex', '0');
+      this.currGridEle.setAttribute('tabindex', '0');
-      this.currGridEle.style.outline = 'none';
+      this.currGridEle.style.outline = 'none';
-      this.currGridEle.addEventListener('keydown', this.copyEvent, false);
+      this.currGridEle.addEventListener('keydown', this.copyEvent, false);
-    },
+    },
-    addGridEventListner() {
+    addGridEventListner() {
-      this.currMode = 'normal';
+      this.currMode = 'normal';
-      this.currGridEle.removeAttribute('tabindex');
+      this.currGridEle.removeAttribute('tabindex');
-      this.currGridEle.removeEventListener('keydown', this.copyEvent);
+      this.currGridEle.removeEventListener('keydown', this.copyEvent);
-      this.currGridEle.addEventListener('mousedown', this.currEventListener);
+      this.currGridEle.addEventListener('mousedown', this.currEventListener);
-    },
+    },
-    initGridEventListner() {
+    initGridEventListner() {
-      document.querySelector(`div.tui-grid-container`).removeAttribute('tabindex');
+      document.querySelector(`div.tui-grid-container`).removeAttribute('tabindex');
-      document.querySelector(`div.tui-grid-container`).removeEventListener('keydown', this.copyEvent);
+      document.querySelector(`div.tui-grid-container`).removeEventListener('keydown', this.copyEvent);
-      document.querySelector(`div.tui-grid-container`).addEventListener('mousedown', this.currEventListener);
+      document.querySelector(`div.tui-grid-container`).addEventListener('mousedown', this.currEventListener);
-    },
+    },
-    copyEvent(ev) {
+    copyEvent(ev) {
-      ev = ev || window.event;
+      ev = ev || window.event;
-      var key = ev.which || ev.keyCode; // keyCode detection
+      var key = ev.which || ev.keyCode; // keyCode detection
-      var ctrl = ev.ctrlKey ? ev.ctrlKey : key === 17 ? true : false; // ctrl detection
+      var ctrl = ev.ctrlKey ? ev.ctrlKey : key === 17 ? true : false; // ctrl detection
-
+
-      if (key == 67 && ctrl) {
+      if (key == 67 && ctrl) {
-        var clipboard = document.querySelector('.tui-grid-clipboard');
+        var clipboard = document.querySelector('.tui-grid-clipboard');
-        clipboard.innerHTML = this.getGridInstance().getFocusedCell().value;
+        clipboard.innerHTML = this.getGridInstance().getFocusedCell().value;
-        clipboard.focus();
+        clipboard.focus();
-        document.execCommand('copy');
+        document.execCommand('copy');
-      }
+      }
-    }
+    }
-  }
+  }
-};
+};
-</script>
+</script>
-
+
-<!-- 스타일 추가 시 CSS 우선순위를 높이기 위해 아래과 같이 .tui-grid-cell를 CSS 선택자에 포함시켜서 사용해야 적용 됨 -->
+<!-- 스타일 추가 시 CSS 우선순위를 높이기 위해 아래과 같이 .tui-grid-cell를 CSS 선택자에 포함시켜서 사용해야 적용 됨 -->
-<style>
+<style>
-.tui-grid-cell.cell-red {
+.tui-grid-cell.cell-red {
-  background-color: red;
+  background-color: red;
-}
+}
-.tui-grid-table {
+.tui-grid-table {
-  width: 100% !important;
+  width: 100% !important;
-}
+}
-</style>
+</style>

frontend/src/components/TuiGridPerPage.vue

@@ -1,27 +1,27 @@
-<template>
+<template>
-  <select v-model="perCnt" @change="perPage">
+  <select v-model="perCnt" @change="perPage">
-    <option v-for="(cnt, index) in perList" :key="index" :value="cnt">{{cnt}}개</option>
+    <option v-for="(cnt, index) in perList" :key="index" :value="cnt">{{cnt}}개</option>
-  </select>
+  </select>
-</template>
+</template>
-
+
-<script>
+<script>
-
+
-export default {
+export default {
-  name: "tuiGridPerPage",
+  name: "tuiGridPerPage",
-  props: [
+  props: [
-    "grid",   // tuiGrid의 ref 값
+    "grid",   // tuiGrid의 ref 값
-    "per",    // 초기 tuiGrid의 페이지 당 개수
+    "per",    // 초기 tuiGrid의 페이지 당 개수
-    "perList" // 페이지 당 개수 정보 ex: countList: [5, 10, 50, 100]
+    "perList" // 페이지 당 개수 정보 ex: countList: [5, 10, 50, 100]
-  ],
+  ],
-  data() {
+  data() {
-    return {
+    return {
-      perCnt: this.per
+      perCnt: this.per
-    }
+    }
-  },
+  },
-  methods: {
+  methods: {
-    perPage: function() {
+    perPage: function() {
-      this.$parent.$refs[this.grid].setPerPage(this.perCnt);
+      this.$parent.$refs[this.grid].setPerPage(this.perCnt);
-    }
+    }
-  }
+  }
-}
+}
 </script>

frontend/src/components/TuiGridSample_it_will_be_delete.vue

@@ -1,116 +1,116 @@
-`
+`
-  샘플 문서, 추후 삭제 예정 입니다.
+  샘플 문서, 추후 삭제 예정 입니다.
-`
+`
-<template>
+<template>
-  <grid ref="tuiGrid"
+  <grid ref="tuiGrid"
-    :data="gridProps.data"
+    :data="gridProps.data"
-    :columns="gridProps.columns"
+    :columns="gridProps.columns"
-    :options="gridProps.options"
+    :options="gridProps.options"
-    @click="clicked"
+    @click="clicked"
-  />
+  />
-</template>
+</template>
-
+
-<script>
+<script>
-  import 'tui-grid/dist/tui-grid.css'
+  import 'tui-grid/dist/tui-grid.css'
-  import { Grid } from '@toast-ui/vue-grid'
+  import { Grid } from '@toast-ui/vue-grid'
-
+
-  class inputTag {
+  class inputTag {
-    constructor(props) {
+    constructor(props) {
-      const el = document.createElement('input');
+      const el = document.createElement('input');
-      el.type = "text";
+      el.type = "text";
-      el.style.width = "80%";
+      el.style.width = "80%";
-      
+      
-      this.el = el;
+      this.el = el;
-      this.render(props);
+      this.render(props);
-    }
+    }
-    getElement() {
+    getElement() {
-      return this.el;
+      return this.el;
-    }
+    }
-    render(props) {
+    render(props) {
-      this.el.value = "test";
+      this.el.value = "test";
-      //this.el.value = String(props.value.chatbotId);
+      //this.el.value = String(props.value.chatbotId);
-    }
+    }
-  }
+  }
-
+
-  class divTag {
+  class divTag {
-    constructor(props) {
+    constructor(props) {
-      const div = document.createElement("div");
+      const div = document.createElement("div");
-      // props >> 컬럼 데이터. 하위 데이터가 있다면 props.value.xxx로 접근 가능하다.
+      // props >> 컬럼 데이터. 하위 데이터가 있다면 props.value.xxx로 접근 가능하다.
-      div.appendChild(document.createElement("div")).textContent = "id: " + props.value.chatbotId
+      div.appendChild(document.createElement("div")).textContent = "id: " + props.value.chatbotId
-      div.appendChild(document.createElement("div")).textContent = "snum: " + props.value.subNum
+      div.appendChild(document.createElement("div")).textContent = "snum: " + props.value.subNum
-
+
-      
+      
-      
+      
-      this.el = div;
+      this.el = div;
-    }
+    }
-    getElement() {
+    getElement() {
-      return this.el;
+      return this.el;
-    }
+    }
-  }
+  }
-
+
-  export default {
+  export default {
-    components: {
+    components: {
-      'grid': Grid
+      'grid': Grid
-    },
+    },
-    data() {
+    data() {
-      return {
+      return {
-        gridProps: null
+        gridProps: null
-      }
+      }
-    },
+    },
-    created() {
+    created() {
-      this.gridProps = {
+      this.gridProps = {
-        data: {
+        data: {
-          api: {
+          api: {
-            readData: { url: '/api/test/test', method: 'GET' },
+            readData: { url: '/api/test/test', method: 'GET' },
-          }
+          }
-        },
+        },
-        pageOptions: {
+        pageOptions: {
-          perPage: 5
+          perPage: 5
-        },
+        },
-        options: {
+        options: {
-          header: {
+          header: {
-            height: 100,
+            height: 100,
-            // 헤더 merge
+            // 헤더 merge
-            complexColumns: [
+            complexColumns: [
-              { header: "브랜드 모음", name: 'mergeColumn1', childNames: ["corpId", "mergeBrand", "mergeInfo"] },
+              { header: "브랜드 모음", name: 'mergeColumn1', childNames: ["corpId", "mergeBrand", "mergeInfo"] },
-              { header: "브랜드", name: 'mergeBrand', childNames: ["brId", "brNm"] },
+              { header: "브랜드", name: 'mergeBrand', childNames: ["brId", "brNm"] },
-              { header: "정보", name: 'mergeInfo', childNames: ["useYn", "apprYn", "apprReqYmd", "apprYmd"] }
+              { header: "정보", name: 'mergeInfo', childNames: ["useYn", "apprYn", "apprReqYmd", "apprYmd"] }
-            ]
+            ]
-          }
+          }
-        },
+        },
-        // 헤더
+        // 헤더
-        columns: [
+        columns: [
-          { name: "corpId", header: "회사 아이디", align: "center" },
+          { name: "corpId", header: "회사 아이디", align: "center" },
-          { name: "brId", header: "브랜드 아이디", align: "center" },
+          { name: "brId", header: "브랜드 아이디", align: "center" },
-          { name: "brNm", header: "브랜드 명", align: "center", sortable: true },
+          { name: "brNm", header: "브랜드 명", align: "center", sortable: true },
-          { name: "useYn", header: "사용 여부", align: "center" },
+          { name: "useYn", header: "사용 여부", align: "center" },
-          { name: "apprYn", header: "승인 여부", align: "center" },
+          { name: "apprYn", header: "승인 여부", align: "center" },
-          { name: "apprReqYmd", header: "승인요청 날짜", align: "center", sortable: true },
+          { name: "apprReqYmd", header: "승인요청 날짜", align: "center", sortable: true },
-          { name: "apprYmd", header: "승인 날짜", align: "center", sortable: true },
+          { name: "apprYmd", header: "승인 날짜", align: "center", sortable: true },
-          { name: "noname", header: "커스텀 1", align: "center", renderer: {
+          { name: "noname", header: "커스텀 1", align: "center", renderer: {
-            type: inputTag  // 별도의 컬럼 구성이 필요한 경우
+            type: inputTag  // 별도의 컬럼 구성이 필요한 경우
-          }},
+          }},
-          { name: "chatbot", header: "커스텀 2", align: "center", renderer: {
+          { name: "chatbot", header: "커스텀 2", align: "center", renderer: {
-            type: divTag  // 별도의 컬럼 구성이 필요한 경우
+            type: divTag  // 별도의 컬럼 구성이 필요한 경우
-          }}
+          }}
-        ]
+        ]
-      }
+      }
-    },
+    },
-    mounted() {
+    mounted() {
-      this.linkTo();
+      this.linkTo();
-    },
+    },
-    methods: {
+    methods: {
-      linkTo: function() {
+      linkTo: function() {
-        this.$refs.tuiGrid.invoke("addCellClassName", "0", "corpId", "cell-red");
+        this.$refs.tuiGrid.invoke("addCellClassName", "0", "corpId", "cell-red");
-      },
+      },
-      clicked: function(v) {
+      clicked: function(v) {
-        var data = this.$refs.tuiGrid.invoke("getRow", v.rowKey);
+        var data = this.$refs.tuiGrid.invoke("getRow", v.rowKey);
-        alert("브랜드 아이디(" + data.brId + ") 클릭");
+        alert("브랜드 아이디(" + data.brId + ") 클릭");
-      }
+      }
-    }
+    }
-  }
+  }
-</script>
+</script>
-
+
-<style>
+<style>
-.tui-grid-cell.cell-red {background-color: red}
+.tui-grid-cell.cell-red {background-color: red}
-</style>
+</style>

frontend/src/main.js

@@ -1,19 +1,19 @@
-import Vue from 'vue';
+import Vue from 'vue';
-import App from './App.vue';
+import App from './App.vue';
-import router from './router';
+import router from './router';
-import store from './store';
+import store from './store';
-import { coreUiMixin } from "@/common/vue-mixins";
+import { coreUiMixin } from "@/common/vue-mixins";
-import jglib from '@/utils/jglib';
+import jglib from '@/utils/jglib';
-
+
-Vue.config.productionTip = false;
+Vue.config.productionTip = false;
-
+
-Vue.mixin(coreUiMixin);
+Vue.mixin(coreUiMixin);
-Vue.prototype.runModeType = "LIVE";
+Vue.prototype.runModeType = "LIVE";
-
+
-new Vue({
+new Vue({
-  router,
+  router,
-  store,
+  store,
-  jglib,
+  jglib,
-  render: h => h(App)
+  render: h => h(App)
-}).$mount('#app')
+}).$mount('#app')
-
+

frontend/src/modules/custMgt/router/index.js

@@ -1,33 +1,33 @@
-import CustList from '../views/CustList'
+import CustList from '../views/CustList'
-import MemberList from '../views/MemberList'
+import MemberList from '../views/MemberList'
-import SubsDetail from '../views/SubsDetail'
+import SubsDetail from '../views/SubsDetail'
-import MemberDetail from '../views/MemberDetail'
+import MemberDetail from '../views/MemberDetail'
-
+
-export default [
+export default [
-  {
+  {
-    path: '/custMgt/subsList',    
+    path: '/custMgt/subsList',    
-    component: CustList,    
+    component: CustList,    
-    name: 'subsList',     
+    name: 'subsList',     
-    meta: { public: true }
+    meta: { public: true }
-  },
+  },
-  {
+  {
-    path: '/custMgt/memberList',    
+    path: '/custMgt/memberList',    
-    component: MemberList,    
+    component: MemberList,    
-    name: 'memberList',     
+    name: 'memberList',     
-    meta: { public: true }
+    meta: { public: true }
-  },
+  },
-  {
+  {
-    path: '/custMgt/subsDetail',    
+    path: '/custMgt/subsDetail',    
-    component: SubsDetail,    
+    component: SubsDetail,    
-    name: 'subsDetail',     
+    name: 'subsDetail',     
-    meta: { public: true }
+    meta: { public: true }
-  },
+  },
-  {
+  {
-    path: '/custMgt/memberDetail',    
+    path: '/custMgt/memberDetail',    
-    component: MemberDetail,    
+    component: MemberDetail,    
-    name: 'memberDetail',     
+    name: 'memberDetail',     
-    meta: { public: true }
+    meta: { public: true }
-  },
+  },
-  
+  
-]
+]
-
+

frontend/src/modules/custMgt/views/CustList.vue

@@ -1,211 +1,285 @@
-<template>
+<template>
- 
+ 
-		<div class="contents">
+		<div class="contents">
-			<div class="contents_wrap">
+			<div class="contents_wrap">
-				<div class="top_wrap">
+				<div class="top_wrap">
-					<h3 class="title">청약고객정보목록조회</h3>
+					<h3 class="title">청약고객관리</h3>
-					<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
+					<p class="breadcrumb">고객관리 &gt; 청약고객관리 &gt; 회원관리</p>
-				</div>
+				</div>
-				<!-- <form autocomplete="off" class="search_form"> -->
+				
-        <div class="search_form">
+				<div class="top_tab">
-					<div class="search_wrap">
+					<a href="customer_01_list.html" class="on">청약고객관리</a><a href="customer_02_list.html">회원관리</a>
-						<div class="select_box">
+				</div>								
-							<label for="right" class="label">권한</label>
+				
-							<select name="" id="right" v-model="grid.params.searchType1">
+				
-								<option value="">전체</option>
+
-								<option value="대리점">대리점</option>
+				<div class="search_form">
-								<option value="운영자">운영자</option>
+					<div class="search_wrap">
-							</select>
+						<div class="group">
-						</div>
+						<div class="input_box cal">
-						<div class="select_box">
+							<label for="right" class="label">조회기간</label>
-							<label for="right" class="label">상태</label>
+							<input class="" type="text" id="" v-model="grid.params.startDt"/>
-							<select name="" id="right" v-model="grid.params.searchType2">
+							<input class="" type="text" id="" v-model="grid.params.endDt"/>
-								<option value="">전체</option>
+						</div>
-								<option value="사용">사용</option>
+						<div class="select_box id">
-								<option value="중지">중지</option>
+							<label for="right" class="label">상태</label>
-							</select>
+							<select name="" id="" v-model="grid.params.searchType1">
-						</div>
+								<option value="">전체</option>
-						<div class="input_box id">
+								<option value="사용">사용</option>
-							<label for="id1" class="label">ID</label>
+								<option value="정지">정지</option>
-                            <input type="text" id="id1" placeholder="검색어 입력" v-model="grid.params.searchText1"/>
+							</select>
-						</div>
+						</div>
-						<div class="input_box">
+						<div class="select_box">
-							<label for="name" class="label">이름(대리점명)</label>
+							<label for="right" class="label">구분</label>
-                            <input type="text" id="name" placeholder="검색어 입력" v-model="grid.params.searchText2"/>
+							<select name="" id="" v-model="grid.params.searchType2">
-						</div>
+                <option value="">전체</option>
-						<button type="button" class="button grey" v-on:click="search">조회</button>
+								<option value="관리자">관리자</option>
-					</div>
+								<option value="사용자">사용자</option>
-        </div>
+								<option value="테스트">테스트</option>
-        <!-- </form> -->
+							</select>
-				<div class="info">
+						</div>
-					<!-- <div class="count">총 <span>100</span>건</div> -->
+						</div>
-          <div class="count">총 <span>{{ totalItems }}</span>건</div>
+						<div class="group">
-					<div class="button_group"> 
+						<div class="select_box">
-						<button type="button" class="button blue admin"  @click="ModalOpen('modal20')">관리자 등록</button>
+							<label for="right" class="label">상세검색</label>
-						<button type="button" class="button blue channel" @click="ModalOpen('modal23')">유지채널 등록</button>
+							<select name="" id="" v-model="grid.params.searchType3">
-						<button type="button" class="button white delete" @click="deleteRow()">삭제</button>
+                <option value="">전체</option>
-					</div>
+								<option value="ID">ID</option>
-				</div>
+								<option value="이름">이름</option>
-				<!-- <div class="table">
+								<option value="관리자ID">관리자ID</option>
-					<table>
+							</select>
-						<colgroup>
+						</div>
-                            <col width="5%"/>
+						<div class="input_box">
-                            <col width="15%"/>
+							<input class="search-box" type="text" id="search" placeholder="검색어 입력" v-model="grid.params.searchText1"/>
-                            <col width="15%"/>
+						</div>
-                            <col width="20%"/>
+						<button type="button" class="button grey" @click="search">조회</button>
-                            <col width="20%"/>
+						</div>
-                            <col width="5%"/>
+					</div>
-                            <col width="20%"/>
+				</div>
-                        </colgroup>
+				
-						<thead>
+				<div class="info">
-							<tr>
+					<div class="count">총 <span>{{ totalItems }}</span>건
-								<th><input type="checkbox" id="admin_check1"><label for="admin_check1"></label></th>
+						<div class="select_box NumberSe">
-								<th>NO</th>
+							<select name="" id="" v-model="perPageCnt" @change="changePerPage()">
-								<th>권한</th>
+								<option v-for="option in options" v-bind:value="option.value" v-bind:key="option.value">{{ option.text }}</option>								
-								<th>이름(대리점명)</th>
+							</select>
-								<th>ID</th>
+					    </div>					
-								<th>상태</th>
+					</div>
-								<th>등록일</th>
+					<div class="button_group">
-							</tr>
+						<button type="button" class="button blue">테스트 ID 생성</button>
-						</thead>
+					</div>
-						<tbody>
+					
-							<tr>
+				</div>			
-								<td><input type="checkbox" checked id="admin_check2"><label for="admin_check2"></label></td>
+				<div class="table">    
-								<td>10</td>
+					<custom-grid
-								<td>대리점</td>
+						ref="table"
-								<td>유플러스</td>
+						:totalItems="'totalItems'"
-								<td><a href="javascript:void(0)">uplus1</a></td>
+						:url="grid.url"
-								<td>사용</td>
+						:pagePerRows="grid.pagePerRows"
-								<td>2022-03-10</td>
+						:initialRequest="grid.initialRequest"
-							</tr>							
+						:pagination="grid.pagination"
-						</tbody>
+						:isCheckbox="grid.isCheckbox"
-					</table>
+						:columns="grid.columns"
-				</div> -->
+						:noDataStr="grid.noDataStr"
-      
+						:addCls="grid.addCls"
-        <div class="table">    
+						:header="grid.headder"        
-          <custom-grid
+					></custom-grid>
-              ref="table"
+				</div>         
-              :totalItems="'totalItems'"
+			</div>
-              :url="grid.url"
+		</div>
-              :perPage="grid.perPage"
+</template>
-              :initialRequest="grid.initialRequest"
+
-              :pagination="grid.pagination"
+<script>
-              :isCheckbox="grid.isCheckbox"
+import customGrid from '@/components/CustomGrid';
-              :columns="grid.columns"
+import moment from 'moment';
-              :noDataStr="grid.noDataStr"
+//import api from '../service/api';
-              :addCls="grid.addCls"
+
-              :header="grid.headder"        
+export default {
-          ></custom-grid>
+  name: 'custList',
-        </div>
+  data() {
-            <system-popup ref="systemModal"></system-popup>          
+    return {
-			</div>
+	  // 달력 데이터      
-		</div>
+      sDateDiv: 'day',
-</template>
+      eDateDiv: 'year',      
-
+	  startDate: null,
-<script>
+      endDate: null,
-import customGrid from '@/components/CustomGrid';
+      disabledSDate: { from: new Date()},
-import SystemPopup from '@/components/SystemPopup.vue';
+      disabledEDate: { to: new Date()}, 
-
+      
-//import api from '../service/api';
+	  // 테이블 리스트 데이터
-export default {
+	  perPageCnt: 20,
-  name: 'custList',
+	  options: [
-  data() {
+		{ text: '20', value: 20},
-    return {
+		{ text: '50', value: 50},
-      totalItems: 0,
+		{ text: '100', value: 100}
-      grid: {
+	  ],
-        url: '/api/v1/bo/sysMgt/adminList',
+      totalItems: 0,	  
-        perPage: 20,
+      grid: {
-        pagination: true,
+        url: '/api/v1/bo/custMgt/subsList',
-        isCheckbox: true,
+        pagePerRows: 20,
-        initialRequest: false,
+        pagination: true,           
-        addCls: 'box_OFvis',
+        isCheckbox: false,        // true:첫번째 컬럼 앞에 체크박스 생성 / false:체크박스 제거
-
+        initialRequest: false,
-
+        addCls: 'box_OFvis',
-        header: [
+
-          [
+        /*
-            { header: 'NO', childNames: [] },
+        header: [
-            { header: '권한', childNames: [] },
+          [
-            { header: '이름(대리점명)', childNames: [] },
+            { header: 'NO', childNames: [] },
-            { header: 'ID', childNames: [] },
+            { header: '서비스 ID\n(관리자 ID)', childNames: [] },
-            { header: '상태', childNames: [] },
+            { header: '고객사명', childNames: [] },
-            { header: '등록일', childNames: [] }
+            { header: '가입번호', childNames: [] },
-          ]
+            { header: '가입일', childNames: [] },
-        ],
+            { header: '상태', childNames: [] },
-
+            { header: '유치채널', childNames: [] },
-        columns: [          
+            { header: '요금제', childNames: [] },
-          { name: 'no', header: 'NO', align: 'center', width: 60},
+            { header: '이월누적금액', childNames: [] }            
-          { name: 'auth', header: '권한', align: 'center', width: 160 },
+          ]
-          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130},
+        ],
-          { name: 'adminId', header: 'ID', align: 'center', width: 130},
+        */
-          { name: 'adminStat', header: '상태', align: 'center', width: 130},      
+
-          { name: 'regDt', header: '등록일', width: 90, cls: 'td_line' }
+        columns: [          
-        ],
+          { name: 'no', header: 'No', align: 'center', width: 60},
-        noDataStr: '검색 결과가 없습니다.',        
+          { name: 'serviceId', header: '서비스 ID\n(관리자 ID)', align: 'center', width: 160 },
-        params: {
+          { name: 'custNm', header: '고객사명', align: 'center', width: 130},
-          searchType1: '',
+          { name: 'regNo', header: '가입번호', align: 'center', width: 130},
-          searchType2: '',
+          { name: 'regDt', header: '가입일', align: 'center', width: 130, cls: 'td_line'},
-          searchText1: '',
+          { name: 'stat', header: '상태', align: 'center', width: 130},
-          searchText2: ''
+          { name: 'channel', header: '유치채널', align: 'center', width: 130},
-        },
+          { name: 'plan', header: '요금제', align: 'center', width: 130},
-        excelHeader: []
+          { name: 'carryOver', header: '이월누적금액', align: 'center', width: 130}
-      }    
+        ],
-    };
+        noDataStr: '검색 결과가 없습니다.',        
-  },  
+        params: {
-  components: {
+          searchType1: '',
-    customGrid: customGrid,      
+          searchType2: '',
-    SystemPopup
+		  searchType3: '',
-  },
+          searchText1: '',          
-  created(){            
+		  startDt: '',
-    this.$store.commit("login/isLogin", true);
+		  endDt: ''
-    this.$store.commit("login/isAuthChk", true);      
+        },
-    //let cont = document.querySelector(".wrap");      
+        excelHeader: []
-    //cont.classList.add("main_wrap");
+      }    
-  },
+    };
-  destroyed() {
+  },  
-      
+  components: {
-  },
+    customGrid: customGrid,  
-  mounted() {
+  },
-    let page = 1;
+  created(){            
-    // 페이지 정보 및 검색 조건
+    this.$store.commit("login/isLogin", true);
-    const getCondition = this.$store.getters['searchcondition/getSearchCondition'];
+    this.$store.commit("login/isAuthChk", true);      	
-    let isKeep = false;
+    //let cont = document.querySelector(".wrap");      
-    if (getCondition) {
+    //cont.classList.add("main_wrap");
-      this.grid.perPage = getCondition.perPage;
+  },  
-      this.grid.params = getCondition.params;
+  destroyed() {
-      if (getCondition.sort != undefined && getCondition.sort != null) {
+      
-        this.grid.params.sort = getCondition.sort;
+  },
-      }
+  mounted() {
-      page = getCondition.page;
+	// 달력 세팅
-      isKeep = true;
+	this.grid.params.startDt = this.customFormatter(new Date());
-    }
+	this.grid.params.endDt = this.customFormatter(new Date());
-    this.search(isKeep);
+
-  },
+    let page = 1;
-  methods: {
+    // 페이지 정보 및 검색 조건
-    search: function(isKeep) {
+    const getCondition = this.$store.getters['searchcondition/getSearchCondition'];
-      console.log(this.grid.params);
+    console.log('getCondition : '+getCondition);
-      this.$refs.table.search(this.grid.params, isKeep);
+
-    },
+	// store에 저장된 페이지 정보 및 검색 조건을 불러오기
-    ModalOpen: function(target){      
+    let isKeep = false;
-      this.$refs.systemModal.ModalOpen(target);
+    if (getCondition) {
-    },
+      this.grid.pagePerRows = getCondition.perPage;
-    deleteRow: function(){ //로우데이터 삭제하도록 수정
+      this.grid.params = getCondition.params;      
-      var checkTest = this.$refs.table.checkedElementDatas();
+      page = getCondition.page;
-      if(checkTest.length == 0){
+      isKeep = true;
-        alert('체크박스에 체크를 해주세요.')
+    }
-      }
+    this.search(isKeep);
-      for(var i = 0; i < checkTest.length; i++){
+  },  
-        alert(checkTest[i].adminId);
+  methods: {
-      }
+    search: function(isKeep) {
-    },
+      console.log('this.perPageCnt'+this.perPageCnt);
-    memberDetail: function(data) {
+      //console.log(this.grid.params);	  
-      if(data.adminId == 'free'){
+      this.$refs.table.search(this.grid.params, isKeep);
-        this.$router.push({
+	  this.sendStoreData();
-          path: `./views/MemberDetail`
+    },
-        });
+    ModalOpen: function(target){      
-      }
+      this.$refs.systemModal.ModalOpen(target);
-    },
+    },
-
+    deleteRow: function(){ //로우데이터 삭제하도록 수정
-    
+      var checkTest = this.$refs.table.checkedElementDatas();
-  }
+      if(checkTest.length == 0){
-};
+        alert('체크박스에 체크를 해주세요.')
+      }
+      for(var i = 0; i < checkTest.length; i++){
+        alert(checkTest[i].adminId);
+      }
+    },
+    memberDetail: function(data) {
+      if(data.adminId == 'free'){
+        this.$router.push({
+          path: `./views/MemberDetail`
+        });
+      }
+    },
+	changePerPage: function(){ 	// 페이지당 조회할 개수
+		this.grid.pagePerRows = this.perPageCnt;
+		this.search(true);
+	},
+	sendStoreData: function() {
+      const getP = this.$refs.table.getPagination();
+	  console.log("==========getP : " + getP._currentPage);
+      this.$store.commit('searchcondition/updateSearchCondition', {
+        page: getP._currentPage,        
+		perPage: this.perPageCnt,        
+        params: this.grid.params
+      });
+
+	  const getCondition = this.$store.getters['searchcondition/getSearchCondition'];
+	  console.log("getCondition : "+ getCondition.perPage);
+    },
+	
+	customFormatter: function(date) {
+      // 달력 관련
+      if (this.sDateDiv == 'month') {
+        return moment(date).format('YYYY-MM');
+      } else if (this.sDateDiv == 'year') {
+        return moment(date).format('YYYY');
+      } else {
+        return moment(date).format('YYYY-MM-DD');
+      }
+    },
+    selectedStartDate(day) {
+      if (this.startDate > this.endDate) {
+        this.startDate = this.endDate;
+      }
+    },
+    selectedEndDate(day) {
+      if (day != undefined && day != null) {
+        this.periodDay = day;
+      }
+    },
+    closeDate(type) {
+      if (type != undefined && type != null) {
+        if (type == 'start') {
+          this.disabledSDate = { from: this.endDate };
+          this.disabledEDate = { to: this.startDate, from: this.endDate };
+        } else if (type == 'end') {
+          this.disabledSDate = { from: this.endDate };
+          this.disabledEDate = { to: this.startDate, from: new Date() };
+        }
+      }
+    },
+  },
+  beforeRouteLeave(to, from, next) {
+	
+	const getP = this.$refs.table.getPagination();
+	console.log("==========getP : " + getP._currentPage);
+	this.$store.commit('searchcondition/updateSearchCondition', {
+	page: getP._currentPage,        
+	perPage: this.perPageCnt,        
+	params: this.grid.params
+	});  
+	// 라우트 하기전 실행 
+	next();
+  }
+};
 </script>

frontend/src/modules/custMgt/views/MemberDetail.vue

@@ -1,165 +1,165 @@
-<template>
+<template>
- 
+ 
-		<div class="contents">
+		<div class="contents">
-			<div class="contents_wrap">
+			<div class="contents_wrap">
-				<div class="top_wrap">
+				<div class="top_wrap">
-					<h3 class="title">회원 정보 상세 조회</h3>
+					<h3 class="title">회원 정보 상세 조회</h3>
-					<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
+					<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
-				</div>
+				</div>
-				<form autocomplete="off" class="search_form">
+				<form autocomplete="off" class="search_form">
-					<div class="search_wrap">
+					<div class="search_wrap">
-						<div class="select_box">
+						<div class="select_box">
-							<label for="right" class="label">권한</label>
+							<label for="right" class="label">권한</label>
-							<select name="" id="right">
+							<select name="" id="right">
-								<option value="전체">전체</option>
+								<option value="전체">전체</option>
-								<option value="대리점">대리점</option>
+								<option value="대리점">대리점</option>
-								<option value="운영자">운영자</option>
+								<option value="운영자">운영자</option>
-							</select>
+							</select>
-						</div>
+						</div>
-						<div class="select_box">
+						<div class="select_box">
-							<label for="right" class="label">상태</label>
+							<label for="right" class="label">상태</label>
-							<select name="" id="right">
+							<select name="" id="right">
-								<option value="전체">전체</option>
+								<option value="전체">전체</option>
-								<option value="사용">사용</option>
+								<option value="사용">사용</option>
-								<option value="중지">중지</option>
+								<option value="중지">중지</option>
-							</select>
+							</select>
-						</div>
+						</div>
-						<div class="input_box id">
+						<div class="input_box id">
-							<label for="id1" class="label">ID</label>
+							<label for="id1" class="label">ID</label>
-                            <input type="text" id="id1" placeholder="검색어 입력"/>
+                            <input type="text" id="id1" placeholder="검색어 입력"/>
-						</div>
+						</div>
-						<div class="input_box">
+						<div class="input_box">
-							<label for="name" class="label">이름(대리점명)</label>
+							<label for="name" class="label">이름(대리점명)</label>
-                            <input type="text" id="name" placeholder="검색어 입력"/>
+                            <input type="text" id="name" placeholder="검색어 입력"/>
-						</div>
+						</div>
-						<button type="button" class="button grey">조회</button>
+						<button type="button" class="button grey">조회</button>
-					</div>
+					</div>
-				</form>
+				</form>
-				<div class="info">
+				<div class="info">
-					<div class="count">총 <span>100</span>건</div>
+					<div class="count">총 <span>100</span>건</div>
-					<div class="button_group">
+					<div class="button_group">
-						<button type="button" class="button blue admin">관리자 등록</button>
+						<button type="button" class="button blue admin">관리자 등록</button>
-						<button type="button" class="button blue channel">유지채널 등록</button>
+						<button type="button" class="button blue channel">유지채널 등록</button>
-						<button type="button" class="button white delete">삭제</button>
+						<button type="button" class="button white delete">삭제</button>
-					</div>
+					</div>
-				</div>
+				</div>
-				<!-- <div class="table">
+				<!-- <div class="table">
-					<table>
+					<table>
-						<colgroup>
+						<colgroup>
-                            <col width="5%"/>
+                            <col width="5%"/>
-                            <col width="15%"/>
+                            <col width="15%"/>
-                            <col width="15%"/>
+                            <col width="15%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                            <col width="5%"/>
+                            <col width="5%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                        </colgroup>
+                        </colgroup>
-						<thead>
+						<thead>
-							<tr>
+							<tr>
-								<th><input type="checkbox" id="admin_check1"><label for="admin_check1"></label></th>
+								<th><input type="checkbox" id="admin_check1"><label for="admin_check1"></label></th>
-								<th>NO</th>
+								<th>NO</th>
-								<th>권한</th>
+								<th>권한</th>
-								<th>이름(대리점명)</th>
+								<th>이름(대리점명)</th>
-								<th>ID</th>
+								<th>ID</th>
-								<th>상태</th>
+								<th>상태</th>
-								<th>등록일</th>
+								<th>등록일</th>
-							</tr>
+							</tr>
-						</thead>
+						</thead>
-						<tbody>
+						<tbody>
-							<tr>
+							<tr>
-								<td><input type="checkbox" checked id="admin_check2"><label for="admin_check2"></label></td>
+								<td><input type="checkbox" checked id="admin_check2"><label for="admin_check2"></label></td>
-								<td>10</td>
+								<td>10</td>
-								<td>대리점</td>
+								<td>대리점</td>
-								<td>유플러스</td>
+								<td>유플러스</td>
-								<td><a href="javascript:void(0)">uplus1</a></td>
+								<td><a href="javascript:void(0)">uplus1</a></td>
-								<td>사용</td>
+								<td>사용</td>
-								<td>2022-03-10</td>
+								<td>2022-03-10</td>
-							</tr>							
+							</tr>							
-						</tbody>
+						</tbody>
-					</table>
+					</table>
-				</div> -->
+				</div> -->
-            <div class="table">    
+            <div class="table">    
-                    <custom-grid
+                    <custom-grid
-                        ref="table"
+                        ref="table"
-                        :totalItems="'totalItems'"
+                        :totalItems="'totalItems'"
-                        :url="testList.url"
+                        :url="testList.url"
-                        :perPage="testList.perPage"
+                        :perPage="testList.perPage"
-                        :initialRequest="testList.initialRequest"
+                        :initialRequest="testList.initialRequest"
-                        :pagination="testList.pagination"
+                        :pagination="testList.pagination"
-                        :isCheckbox="testList.isCheckbox"
+                        :isCheckbox="testList.isCheckbox"
-                        :columns="testList.columns"
+                        :columns="testList.columns"
-                        :noDataStr="testList.noDataStr"
+                        :noDataStr="testList.noDataStr"
-                        :addCls="testList.addCls"
+                        :addCls="testList.addCls"
-                        :header="testList.header"        
+                        :header="testList.header"        
-                    ></custom-grid>
+                    ></custom-grid>
-            </div>
+            </div>
-			</div>
+			</div>
-		</div>
+		</div>
-</template>
+</template>
-
+
-<script>
+<script>
-import customGrid from '@/components/CustomGrid';
+import customGrid from '@/components/CustomGrid';
-//import api from '../service/api';
+//import api from '../service/api';
-export default {
+export default {
-  name: 'custList',
+  name: 'custList',
-  data() {
+  data() {
-    return {
+    return {
-      testList: {
+      testList: {
-        url: '/api/v1/bo/sysMgt/adminList',
+        url: '/api/v1/bo/sysMgt/adminList',
-        perPage: 20,
+        perPage: 20,
-        pagination: true,
+        pagination: true,
-        isCheckbox: true,
+        isCheckbox: true,
-        initialRequest: false,
+        initialRequest: false,
-        addCls: 'box_OFvis',
+        addCls: 'box_OFvis',
-
+
-
+
-        header: [
+        header: [
-          [
+          [
-            { header: 'NO', childNames: [] },
+            { header: 'NO', childNames: [] },
-            { header: '권한', childNames: [] },
+            { header: '권한', childNames: [] },
-            { header: '이름(대리점명)', childNames: [] },
+            { header: '이름(대리점명)', childNames: [] },
-            { header: 'ID', childNames: [] },
+            { header: 'ID', childNames: [] },
-            { header: '상태', childNames: [] },
+            { header: '상태', childNames: [] },
-            { header: '등록일', childNames: [] }
+            { header: '등록일', childNames: [] }
-          ]
+          ]
-        ],
+        ],
-
+
-        columns: [          
+        columns: [          
-          { name: 'no', header: 'NO', align: 'center', width: 60 },
+          { name: 'no', header: 'NO', align: 'center', width: 60 },
-          { name: 'auth', header: '권한', align: 'left', width: 160 },
+          { name: 'auth', header: '권한', align: 'left', width: 160 },
-          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130},
+          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130},
-          { name: 'adminId', header: 'ID', align: 'center', width: 130},
+          { name: 'adminId', header: 'ID', align: 'center', width: 130},
-          { name: 'adminStat', header: '상태', align: 'center', width: 130},      
+          { name: 'adminStat', header: '상태', align: 'center', width: 130},      
-          { name: 'regDt', header: '등록일', width: 90, cls: 'td_line' }
+          { name: 'regDt', header: '등록일', width: 90, cls: 'td_line' }
-        ],
+        ],
-        noDataStr: '검색 결과가 없습니다.',        
+        noDataStr: '검색 결과가 없습니다.',        
-        // params: {
+        // params: {
-        //   apprResult: '',
+        //   apprResult: '',
-        //   searchType: '',
+        //   searchType: '',
-        //   searchText: '',
+        //   searchText: '',
-        //   startDate: '',
+        //   startDate: '',
-        //   endDate: ''
+        //   endDate: ''
-        // },
+        // },
-        excelHeader: []
+        excelHeader: []
-      }    
+      }    
-    };
+    };
-  },  
+  },  
-  components: {
+  components: {
-    customGrid: customGrid
+    customGrid: customGrid
-  },
+  },
-  destroyed() {
+  destroyed() {
-      
+      
-  },
+  },
-  mounted() {
+  mounted() {
-    let isKeep = false;
+    let isKeep = false;
-    isKeep = true;
+    isKeep = true;
-    this.search(isKeep);
+    this.search(isKeep);
-  },
+  },
-  methods: {
+  methods: {
-    search: function(isKeep) {
+    search: function(isKeep) {
-      console.log(this.testList.params);
+      console.log(this.testList.params);
-      this.$refs.table.search(this.testList.params, isKeep);
+      this.$refs.table.search(this.testList.params, isKeep);
-    },
+    },
-  }
+  }
-};
+};
 </script>

frontend/src/modules/custMgt/views/MemberList.vue

@@ -1,165 +1,165 @@
-<template>
+<template>
- 
+ 
-		<div class="contents">
+		<div class="contents">
-			<div class="contents_wrap">
+			<div class="contents_wrap">
-				<div class="top_wrap">
+				<div class="top_wrap">
-					<h3 class="title">회원목록조회</h3>
+					<h3 class="title">회원목록조회</h3>
-					<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
+					<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
-				</div>
+				</div>
-				<form autocomplete="off" class="search_form">
+				<form autocomplete="off" class="search_form">
-					<div class="search_wrap">
+					<div class="search_wrap">
-						<div class="select_box">
+						<div class="select_box">
-							<label for="right" class="label">권한</label>
+							<label for="right" class="label">권한</label>
-							<select name="" id="right">
+							<select name="" id="right">
-								<option value="전체">전체</option>
+								<option value="전체">전체</option>
-								<option value="대리점">대리점</option>
+								<option value="대리점">대리점</option>
-								<option value="운영자">운영자</option>
+								<option value="운영자">운영자</option>
-							</select>
+							</select>
-						</div>
+						</div>
-						<div class="select_box">
+						<div class="select_box">
-							<label for="right" class="label">상태</label>
+							<label for="right" class="label">상태</label>
-							<select name="" id="right">
+							<select name="" id="right">
-								<option value="전체">전체</option>
+								<option value="전체">전체</option>
-								<option value="사용">사용</option>
+								<option value="사용">사용</option>
-								<option value="중지">중지</option>
+								<option value="중지">중지</option>
-							</select>
+							</select>
-						</div>
+						</div>
-						<div class="input_box id">
+						<div class="input_box id">
-							<label for="id1" class="label">ID</label>
+							<label for="id1" class="label">ID</label>
-                            <input type="text" id="id1" placeholder="검색어 입력"/>
+                            <input type="text" id="id1" placeholder="검색어 입력"/>
-						</div>
+						</div>
-						<div class="input_box">
+						<div class="input_box">
-							<label for="name" class="label">이름(대리점명)</label>
+							<label for="name" class="label">이름(대리점명)</label>
-                            <input type="text" id="name" placeholder="검색어 입력"/>
+                            <input type="text" id="name" placeholder="검색어 입력"/>
-						</div>
+						</div>
-						<button type="button" class="button grey">조회</button>
+						<button type="button" class="button grey">조회</button>
-					</div>
+					</div>
-				</form>
+				</form>
-				<div class="info">
+				<div class="info">
-					<div class="count">총 <span>100</span>건</div>
+					<div class="count">총 <span>100</span>건</div>
-					<div class="button_group">
+					<div class="button_group">
-						<button type="button" class="button blue admin">관리자 등록</button>
+						<button type="button" class="button blue admin">관리자 등록</button>
-						<button type="button" class="button blue channel">유지채널 등록</button>
+						<button type="button" class="button blue channel">유지채널 등록</button>
-						<button type="button" class="button white delete">삭제</button>
+						<button type="button" class="button white delete">삭제</button>
-					</div>
+					</div>
-				</div>
+				</div>
-				<!-- <div class="table">
+				<!-- <div class="table">
-					<table>
+					<table>
-						<colgroup>
+						<colgroup>
-                            <col width="5%"/>
+                            <col width="5%"/>
-                            <col width="15%"/>
+                            <col width="15%"/>
-                            <col width="15%"/>
+                            <col width="15%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                            <col width="5%"/>
+                            <col width="5%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                        </colgroup>
+                        </colgroup>
-						<thead>
+						<thead>
-							<tr>
+							<tr>
-								<th><input type="checkbox" id="admin_check1"><label for="admin_check1"></label></th>
+								<th><input type="checkbox" id="admin_check1"><label for="admin_check1"></label></th>
-								<th>NO</th>
+								<th>NO</th>
-								<th>권한</th>
+								<th>권한</th>
-								<th>이름(대리점명)</th>
+								<th>이름(대리점명)</th>
-								<th>ID</th>
+								<th>ID</th>
-								<th>상태</th>
+								<th>상태</th>
-								<th>등록일</th>
+								<th>등록일</th>
-							</tr>
+							</tr>
-						</thead>
+						</thead>
-						<tbody>
+						<tbody>
-							<tr>
+							<tr>
-								<td><input type="checkbox" checked id="admin_check2"><label for="admin_check2"></label></td>
+								<td><input type="checkbox" checked id="admin_check2"><label for="admin_check2"></label></td>
-								<td>10</td>
+								<td>10</td>
-								<td>대리점</td>
+								<td>대리점</td>
-								<td>유플러스</td>
+								<td>유플러스</td>
-								<td><a href="javascript:void(0)">uplus1</a></td>
+								<td><a href="javascript:void(0)">uplus1</a></td>
-								<td>사용</td>
+								<td>사용</td>
-								<td>2022-03-10</td>
+								<td>2022-03-10</td>
-							</tr>							
+							</tr>							
-						</tbody>
+						</tbody>
-					</table>
+					</table>
-				</div> -->
+				</div> -->
-            <div class="table">    
+            <div class="table">    
-                    <custom-grid
+                    <custom-grid
-                        ref="table"
+                        ref="table"
-                        :totalItems="'totalItems'"
+                        :totalItems="'totalItems'"
-                        :url="testList.url"
+                        :url="testList.url"
-                        :perPage="testList.perPage"
+                        :perPage="testList.perPage"
-                        :initialRequest="testList.initialRequest"
+                        :initialRequest="testList.initialRequest"
-                        :pagination="testList.pagination"
+                        :pagination="testList.pagination"
-                        :isCheckbox="testList.isCheckbox"
+                        :isCheckbox="testList.isCheckbox"
-                        :columns="testList.columns"
+                        :columns="testList.columns"
-                        :noDataStr="testList.noDataStr"
+                        :noDataStr="testList.noDataStr"
-                        :addCls="testList.addCls"
+                        :addCls="testList.addCls"
-                        :header="testList.header"        
+                        :header="testList.header"        
-                    ></custom-grid>
+                    ></custom-grid>
-            </div>
+            </div>
-			</div>
+			</div>
-		</div>
+		</div>
-</template>
+</template>
-
+
-<script>
+<script>
-import customGrid from '@/components/CustomGrid';
+import customGrid from '@/components/CustomGrid';
-//import api from '../service/api';
+//import api from '../service/api';
-export default {
+export default {
-  name: 'custList',
+  name: 'custList',
-  data() {
+  data() {
-    return {
+    return {
-      testList: {
+      testList: {
-        url: '/api/v1/bo/sysMgt/adminList',
+        url: '/api/v1/bo/sysMgt/adminList',
-        perPage: 20,
+        perPage: 20,
-        pagination: true,
+        pagination: true,
-        isCheckbox: true,
+        isCheckbox: true,
-        initialRequest: false,
+        initialRequest: false,
-        addCls: 'box_OFvis',
+        addCls: 'box_OFvis',
-
+
-
+
-        header: [
+        header: [
-          [
+          [
-            { header: 'NO', childNames: [] },
+            { header: 'NO', childNames: [] },
-            { header: '권한', childNames: [] },
+            { header: '권한', childNames: [] },
-            { header: '이름(대리점명)', childNames: [] },
+            { header: '이름(대리점명)', childNames: [] },
-            { header: 'ID', childNames: [] },
+            { header: 'ID', childNames: [] },
-            { header: '상태', childNames: [] },
+            { header: '상태', childNames: [] },
-            { header: '등록일', childNames: [] }
+            { header: '등록일', childNames: [] }
-          ]
+          ]
-        ],
+        ],
-
+
-        columns: [          
+        columns: [          
-          { name: 'no', header: 'NO', align: 'center', width: 60 },
+          { name: 'no', header: 'NO', align: 'center', width: 60 },
-          { name: 'auth', header: '권한', align: 'left', width: 160 },
+          { name: 'auth', header: '권한', align: 'left', width: 160 },
-          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130},
+          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130},
-          { name: 'adminId', header: 'ID', align: 'center', width: 130},
+          { name: 'adminId', header: 'ID', align: 'center', width: 130},
-          { name: 'adminStat', header: '상태', align: 'center', width: 130},      
+          { name: 'adminStat', header: '상태', align: 'center', width: 130},      
-          { name: 'regDt', header: '등록일', width: 90, cls: 'td_line' }
+          { name: 'regDt', header: '등록일', width: 90, cls: 'td_line' }
-        ],
+        ],
-        noDataStr: '검색 결과가 없습니다.',        
+        noDataStr: '검색 결과가 없습니다.',        
-        // params: {
+        // params: {
-        //   apprResult: '',
+        //   apprResult: '',
-        //   searchType: '',
+        //   searchType: '',
-        //   searchText: '',
+        //   searchText: '',
-        //   startDate: '',
+        //   startDate: '',
-        //   endDate: ''
+        //   endDate: ''
-        // },
+        // },
-        excelHeader: []
+        excelHeader: []
-      }    
+      }    
-    };
+    };
-  },  
+  },  
-  components: {
+  components: {
-    customGrid: customGrid
+    customGrid: customGrid
-  },
+  },
-  destroyed() {
+  destroyed() {
-      
+      
-  },
+  },
-  mounted() {
+  mounted() {
-    let isKeep = false;
+    let isKeep = false;
-    isKeep = true;
+    isKeep = true;
-    this.search(isKeep);
+    this.search(isKeep);
-  },
+  },
-  methods: {
+  methods: {
-    search: function(isKeep) {
+    search: function(isKeep) {
-      console.log(this.testList.params);
+      console.log(this.testList.params);
-      this.$refs.table.search(this.testList.params, isKeep);
+      this.$refs.table.search(this.testList.params, isKeep);
-    },
+    },
-  }
+  }
-};
+};
 </script>

frontend/src/modules/custMgt/views/SubsDetail.vue

@@ -1,165 +1,165 @@
-<template>
+<template>
- 
+ 
-		<div class="contents">
+		<div class="contents">
-			<div class="contents_wrap">
+			<div class="contents_wrap">
-				<div class="top_wrap">
+				<div class="top_wrap">
-					<h3 class="title">청약 정보 상세 조회</h3>
+					<h3 class="title">청약 정보 상세 조회</h3>
-					<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
+					<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
-				</div>
+				</div>
-				<form autocomplete="off" class="search_form">
+				<form autocomplete="off" class="search_form">
-					<div class="search_wrap">
+					<div class="search_wrap">
-						<div class="select_box">
+						<div class="select_box">
-							<label for="right" class="label">권한</label>
+							<label for="right" class="label">권한</label>
-							<select name="" id="right">
+							<select name="" id="right">
-								<option value="전체">전체</option>
+								<option value="전체">전체</option>
-								<option value="대리점">대리점</option>
+								<option value="대리점">대리점</option>
-								<option value="운영자">운영자</option>
+								<option value="운영자">운영자</option>
-							</select>
+							</select>
-						</div>
+						</div>
-						<div class="select_box">
+						<div class="select_box">
-							<label for="right" class="label">상태</label>
+							<label for="right" class="label">상태</label>
-							<select name="" id="right">
+							<select name="" id="right">
-								<option value="전체">전체</option>
+								<option value="전체">전체</option>
-								<option value="사용">사용</option>
+								<option value="사용">사용</option>
-								<option value="중지">중지</option>
+								<option value="중지">중지</option>
-							</select>
+							</select>
-						</div>
+						</div>
-						<div class="input_box id">
+						<div class="input_box id">
-							<label for="id1" class="label">ID</label>
+							<label for="id1" class="label">ID</label>
-                            <input type="text" id="id1" placeholder="검색어 입력"/>
+                            <input type="text" id="id1" placeholder="검색어 입력"/>
-						</div>
+						</div>
-						<div class="input_box">
+						<div class="input_box">
-							<label for="name" class="label">이름(대리점명)</label>
+							<label for="name" class="label">이름(대리점명)</label>
-                            <input type="text" id="name" placeholder="검색어 입력"/>
+                            <input type="text" id="name" placeholder="검색어 입력"/>
-						</div>
+						</div>
-						<button type="button" class="button grey">조회</button>
+						<button type="button" class="button grey">조회</button>
-					</div>
+					</div>
-				</form>
+				</form>
-				<div class="info">
+				<div class="info">
-					<div class="count">총 <span>100</span>건</div>
+					<div class="count">총 <span>100</span>건</div>
-					<div class="button_group">
+					<div class="button_group">
-						<button type="button" class="button blue admin">관리자 등록</button>
+						<button type="button" class="button blue admin">관리자 등록</button>
-						<button type="button" class="button blue channel">유지채널 등록</button>
+						<button type="button" class="button blue channel">유지채널 등록</button>
-						<button type="button" class="button white delete">삭제</button>
+						<button type="button" class="button white delete">삭제</button>
-					</div>
+					</div>
-				</div>
+				</div>
-				<!-- <div class="table">
+				<!-- <div class="table">
-					<table>
+					<table>
-						<colgroup>
+						<colgroup>
-                            <col width="5%"/>
+                            <col width="5%"/>
-                            <col width="15%"/>
+                            <col width="15%"/>
-                            <col width="15%"/>
+                            <col width="15%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                            <col width="5%"/>
+                            <col width="5%"/>
-                            <col width="20%"/>
+                            <col width="20%"/>
-                        </colgroup>
+                        </colgroup>
-						<thead>
+						<thead>
-							<tr>
+							<tr>
-								<th><input type="checkbox" id="admin_check1"><label for="admin_check1"></label></th>
+								<th><input type="checkbox" id="admin_check1"><label for="admin_check1"></label></th>
-								<th>NO</th>
+								<th>NO</th>
-								<th>권한</th>
+								<th>권한</th>
-								<th>이름(대리점명)</th>
+								<th>이름(대리점명)</th>
-								<th>ID</th>
+								<th>ID</th>
-								<th>상태</th>
+								<th>상태</th>
-								<th>등록일</th>
+								<th>등록일</th>
-							</tr>
+							</tr>
-						</thead>
+						</thead>
-						<tbody>
+						<tbody>
-							<tr>
+							<tr>
-								<td><input type="checkbox" checked id="admin_check2"><label for="admin_check2"></label></td>
+								<td><input type="checkbox" checked id="admin_check2"><label for="admin_check2"></label></td>
-								<td>10</td>
+								<td>10</td>
-								<td>대리점</td>
+								<td>대리점</td>
-								<td>유플러스</td>
+								<td>유플러스</td>
-								<td><a href="javascript:void(0)">uplus1</a></td>
+								<td><a href="javascript:void(0)">uplus1</a></td>
-								<td>사용</td>
+								<td>사용</td>
-								<td>2022-03-10</td>
+								<td>2022-03-10</td>
-							</tr>							
+							</tr>							
-						</tbody>
+						</tbody>
-					</table>
+					</table>
-				</div> -->
+				</div> -->
-            <div class="table">    
+            <div class="table">    
-                    <custom-grid
+                    <custom-grid
-                        ref="table"
+                        ref="table"
-                        :totalItems="'totalItems'"
+                        :totalItems="'totalItems'"
-                        :url="testList.url"
+                        :url="testList.url"
-                        :perPage="testList.perPage"
+                        :perPage="testList.perPage"
-                        :initialRequest="testList.initialRequest"
+                        :initialRequest="testList.initialRequest"
-                        :pagination="testList.pagination"
+                        :pagination="testList.pagination"
-                        :isCheckbox="testList.isCheckbox"
+                        :isCheckbox="testList.isCheckbox"
-                        :columns="testList.columns"
+                        :columns="testList.columns"
-                        :noDataStr="testList.noDataStr"
+                        :noDataStr="testList.noDataStr"
-                        :addCls="testList.addCls"
+                        :addCls="testList.addCls"
-                        :header="testList.header"        
+                        :header="testList.header"        
-                    ></custom-grid>
+                    ></custom-grid>
-            </div>
+            </div>
-			</div>
+			</div>
-		</div>
+		</div>
-</template>
+</template>
-
+
-<script>
+<script>
-import customGrid from '@/components/CustomGrid';
+import customGrid from '@/components/CustomGrid';
-//import api from '../service/api';
+//import api from '../service/api';
-export default {
+export default {
-  name: 'custList',
+  name: 'custList',
-  data() {
+  data() {
-    return {
+    return {
-      testList: {
+      testList: {
-        url: '/api/v1/bo/sysMgt/adminList',
+        url: '/api/v1/bo/sysMgt/adminList',
-        perPage: 20,
+        perPage: 20,
-        pagination: true,
+        pagination: true,
-        isCheckbox: true,
+        isCheckbox: true,
-        initialRequest: false,
+        initialRequest: false,
-        addCls: 'box_OFvis',
+        addCls: 'box_OFvis',
-
+
-
+
-        header: [
+        header: [
-          [
+          [
-            { header: 'NO', childNames: [] },
+            { header: 'NO', childNames: [] },
-            { header: '권한', childNames: [] },
+            { header: '권한', childNames: [] },
-            { header: '이름(대리점명)', childNames: [] },
+            { header: '이름(대리점명)', childNames: [] },
-            { header: 'ID', childNames: [] },
+            { header: 'ID', childNames: [] },
-            { header: '상태', childNames: [] },
+            { header: '상태', childNames: [] },
-            { header: '등록일', childNames: [] }
+            { header: '등록일', childNames: [] }
-          ]
+          ]
-        ],
+        ],
-
+
-        columns: [          
+        columns: [          
-          { name: 'no', header: 'NO', align: 'center', width: 60 },
+          { name: 'no', header: 'NO', align: 'center', width: 60 },
-          { name: 'auth', header: '권한', align: 'left', width: 160 },
+          { name: 'auth', header: '권한', align: 'left', width: 160 },
-          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130},
+          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130},
-          { name: 'adminId', header: 'ID', align: 'center', width: 130},
+          { name: 'adminId', header: 'ID', align: 'center', width: 130},
-          { name: 'adminStat', header: '상태', align: 'center', width: 130},      
+          { name: 'adminStat', header: '상태', align: 'center', width: 130},      
-          { name: 'regDt', header: '등록일', width: 90, cls: 'td_line' }
+          { name: 'regDt', header: '등록일', width: 90, cls: 'td_line' }
-        ],
+        ],
-        noDataStr: '검색 결과가 없습니다.',        
+        noDataStr: '검색 결과가 없습니다.',        
-        // params: {
+        // params: {
-        //   apprResult: '',
+        //   apprResult: '',
-        //   searchType: '',
+        //   searchType: '',
-        //   searchText: '',
+        //   searchText: '',
-        //   startDate: '',
+        //   startDate: '',
-        //   endDate: ''
+        //   endDate: ''
-        // },
+        // },
-        excelHeader: []
+        excelHeader: []
-      }    
+      }    
-    };
+    };
-  },  
+  },  
-  components: {
+  components: {
-    customGrid: customGrid
+    customGrid: customGrid
-  },
+  },
-  destroyed() {
+  destroyed() {
-      
+      
-  },
+  },
-  mounted() {
+  mounted() {
-    let isKeep = false;
+    let isKeep = false;
-    isKeep = true;
+    isKeep = true;
-    this.search(isKeep);
+    this.search(isKeep);
-  },
+  },
-  methods: {
+  methods: {
-    search: function(isKeep) {
+    search: function(isKeep) {
-      console.log(this.testList.params);
+      console.log(this.testList.params);
-      this.$refs.table.search(this.testList.params, isKeep);
+      this.$refs.table.search(this.testList.params, isKeep);
-    },
+    },
-  }
+  }
-};
+};
 </script>

frontend/src/modules/login/router/index.js

@@ -1,24 +1,31 @@
-import LoginMain from '../views/LoginMain'
+import LoginMain from '../views/LoginMain'
-import LoginAuth from '../views/LoginAuth'
+import LoginAuth from '../views/LoginAuth'
-import ResetPassword from '../views/ResetPassword'
+import ResetPassword from '../views/ResetPassword'
-
+import UpdatePassword from '../views/UpdatePassword'
-export default [
+
-  {
+export default [
-    path: '/login',
+  {
-    name: 'login',
+    path: '/login',
-    component: LoginMain,
+    name: 'login',
-    meta: { public: true }
+    component: LoginMain,
-  },
+    meta: { public: true }
-  {
+  },
-    path: '/view/login/auth',
+  {
-    name: 'loginAuth',
+    path: '/view/login/auth',
-    component: LoginAuth,
+    name: 'loginAuth',
-    meta: { public: true }
+    component: LoginAuth,
-  },
+    meta: { public: true }
-  {
+  },
-    path: '/view/login/resetPassword',
+  {
-    name: 'resetPassword',
+    path: '/view/login/resetPassword',
-    component: ResetPassword,
+    name: 'resetPassword',
-    meta: { public: true }
+    component: ResetPassword,
-  },
+    meta: { public: true }
+  },
+  {
+    path: '/view/login/updatePassword',
+    name: 'updatePassword',
+    component: UpdatePassword,
+    meta: { public: true }
+  },
 ]

frontend/src/modules/login/service/api.js

@@ -1,53 +1,63 @@
-import httpClient from '@/common/http-client';
+import httpClient from '@/common/http-client';
-
+
-const login = (params) => {    
+const login = (params) => {    
-    return httpClient.post('api/v1/bo/login/login', params, { headers: {"show-layer": "Yes"} },{ withCredentials: false });
+    return httpClient.post('api/v1/bo/login/login', params, { headers: {"show-layer": "Yes"} },{ withCredentials: false });
-};
+};
-
+
-const chgpwd = (params) => {
+const chgpwd = (params) => {
-    return httpClient.post('/api/oper/user/chgpwd', params);
+    return httpClient.post('/api/oper/user/chgpwd', params);
-};
+};
-
+
-const myphone = () => {
+const myphone = () => {
-    return httpClient.get('/api/oper/user/phone/self');
+    return httpClient.get('/api/oper/user/phone/self');
-};
+};
-
+
-const phone = (params) => {
+const phone = (params) => {
-    return httpClient.get('/api/public/auth/phone', { params: params });
+    return httpClient.get('/api/public/auth/phone', { params: params });
-};
+};
-
+
-// 삭제 예정
+// 삭제 예정
-const reqnum = (params) => {
+const reqnum = (params) => {
-    return httpClient.get('/api/public/auth/reqnum', { params: params });
+    return httpClient.get('/api/public/auth/reqnum', { params: params });
-};
+};
-
+
-const authNum = (params) => {
+const authNum = (params) => {
-    return httpClient.post('/api/v1/bo/login/authNum', params);
+    return httpClient.post('/api/v1/bo/login/authNum', params);
-};
+};
-
+
-const confirmNum = (params) => {
+const confirmNum = (params) => {
-    //return httpClient.get('/api/public/auth/chknum', { params: params });
+    //return httpClient.get('/api/public/auth/chknum', { params: params });
-    return httpClient.post('/api/v1/bo/login/confirmNum', params);
+    return httpClient.post('/api/v1/bo/login/confirmNum', params);
-};
+};
-
+
-
+const resetPassword = (params) => {
-const newpwd = (params) => {
+    return httpClient.post('/api/v1/bo/login/resetPassword', params);
-    return httpClient.post('/api/public/auth/newpwd', params);
+};
-};
+
-
+const updatePassword = (params) => {
-const logout = () => {
+    return httpClient.post('/api/v1/bo/login/updatePassword', params);
-    //return httpClient.get('/api/auth/logout', {headers: {"show-layer": "Yes"}});
+};
-    return httpClient.post('/api/v1/bo/login/logout', {headers: {"show-layer": "Yes"}});
+
-};
+
-
+const newpwd = (params) => {
-export default {
+    return httpClient.post('/api/public/auth/newpwd', params);
-    login,
+};
-    logout,
+
-    chgpwd,
+const logout = () => {
-    myphone,
+    //return httpClient.get('/api/auth/logout', {headers: {"show-layer": "Yes"}});
-    phone,
+    return httpClient.post('/api/v1/bo/login/logout', {headers: {"show-layer": "Yes"}});
-    reqnum,
+};
-    confirmNum,
+
-    newpwd,
+export default {
-    authNum
+    login,
+    logout,
+    chgpwd,
+    myphone,
+    phone,
+    reqnum,
+    confirmNum,
+    newpwd,
+    authNum,
+    resetPassword,
+    updatePassword
 };

frontend/src/modules/login/service/mixins.js

@@ -1,257 +1,258 @@
-var commonPwdView = {
+var commonPwdView = {
-    data: function() {
+    data: function() {
-        return {
+        return {
-            err_msg: null,
+            err_msg: null,
-            message: {
+            message: {
-                curPwd: '', newPwd: '', cfmPwd: ''
+                oldPw: '', newPw: '',
-            },
+            },
-            param: {
+            param: {
-                userId: null, phone: null
+                userId: null,
-            },
+            },
-            curPwd: '', newPwd: '', cfmPwd: ''
+            oldPw: '', newPw: '',
-        };
+        };
-    },
+    },
-    methods: {
+    methods: {
-        verifyNewPwd: function (evt) {
+        verifyNewPw: function (evt) {
-            var valid = this.checkPassword(evt.target.value);
+            var valid = this.checkPassword(evt.target.value);
-            if (valid) {
+            if (valid) {
-                this.err_msg = '';
+                this.err_msg = '';
-            }
+            }
-            this.message.newPwd = this.err_msg;
+            this.message.newPw = this.err_msg;
-        },
+        },
-        verifyCfmPwd: function() {
+        
-            this.message.cfmPwd = '';
+        verifyCfmPwd: function() {
-            if (this.newPwd != this.cfmPwd) {
+            this.message.cfmPw = '';
-                this.message.cfmPwd = this.cfmPwdFailMsg();
+            if (this.newPw != this.cfmPw) {
-                return false;
+                this.message.cfmPw = this.cfmPwdFailMsg();
-            }
+                return false;
-            return true;
+            }
-        }
+            return true;
-    }
+        }
-};
+    }
-
+};
-var validation = {
+
-    methods: {
+var validation = {
-        checkId: function (id) {
+    methods: {
-            if (id == null || id.trim() == "") {
+        checkId: function (id) {
-                this.err_msg = "아이디를 입력해 주세요.";
+            if (id == null || id.trim() == "") {
-                return false;
+                this.err_msg = "아이디를 입력해 주세요.";
-            }
+                return false;
-            if (id.length < 4 || id.length > 15) {
+            }
-                this.err_msg = "아이디는 영문, 숫자를 이용하여 4자리 이상 15자리 이하이어야 합니다.";
+            if (id.length < 8 || id.length > 16) {
-                return false;
+                this.err_msg = "아이디는 영문, 숫자를 이용하여 4자리 이상 15자리 이하이어야 합니다.";
-            }
+                return false;
-            if (!id.match(/^[0-9a-zA-Z]+$/)) {
+            }
-                this.err_msg = "아이디는 영문, 숫자를 이용하여야 합니다.";
+            if (!id.match(/^[0-9a-zA-Z]+$/)) {
-                return false;
+                this.err_msg = "아이디는 영문, 숫자를 이용하여야 합니다.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkPassword: function (pw) {
+        },
-            if (pw == null || pw.trim() == "") {
+        checkPassword: function (pw) {
-                this.err_msg = "비밀번호를 입력해 주세요.";
+            if (pw == null || pw.trim() == "") {
-                return false;
+                this.err_msg = "비밀번호를 입력해 주세요.";
-            }
+                return false;
-
+            }
-            if (typeof this.param.userId != "undefined") {
+
-                if (pw.indexOf(this.param.userId) >= 0) {
+            if (typeof this.param.userId != "undefined") {
-                    this.err_msg = "아이디가 포함된 문자열은 사용할 수 없습니다.";
+                if (pw.indexOf(this.param.userId) >= 0) {
-                    return false;
+                    this.err_msg = "아이디가 포함된 문자열은 사용할 수 없습니다.";
-                }
+                    return false;
-            }
+                }
-
+            }
-            for (var i = 0; i < pw.length; i++) {
+
-                var ch1 = pw.charAt(i);
+            for (var i = 0; i < pw.length; i++) {
-                var ch2 = pw.charAt(i + 1);
+                var ch1 = pw.charAt(i);
-                var ch3 = pw.charAt(i + 2);
+                var ch2 = pw.charAt(i + 1);
-                var ch4 = pw.charAt(i + 3);
+                var ch3 = pw.charAt(i + 2);
-                if (ch1 == ch2 && ch2 == ch3 && ch3 == ch4) {
+                var ch4 = pw.charAt(i + 3);
-                    //console.log(ch1 + "" + ch2 + "" + ch3 + ch4 + " is equality");
+                if (ch1 == ch2 && ch2 == ch3 && ch3 == ch4) {
-                    this.err_msg = "연속적인 숫자 또는 문자열은 사용할 수 없습니다.";
+                    //console.log(ch1 + "" + ch2 + "" + ch3 + ch4 + " is equality");
-                    return false;
+                    this.err_msg = "연속적인 숫자 또는 문자열은 사용할 수 없습니다.";
-                }
+                    return false;
-                if (ch1.charCodeAt(0) - ch2.charCodeAt(0) == 1 && ch2.charCodeAt(0) - ch3.charCodeAt(0) == 1 && ch3.charCodeAt(0) - ch4.charCodeAt(0) == 1) {
+                }
-                    //console.log(ch1 + "" + ch2 + "" + ch3 + ch4 + " is continuity");
+                if (ch1.charCodeAt(0) - ch2.charCodeAt(0) == 1 && ch2.charCodeAt(0) - ch3.charCodeAt(0) == 1 && ch3.charCodeAt(0) - ch4.charCodeAt(0) == 1) {
-                    this.err_msg = "연속적인 숫자 또는 문자열은 사용할 수 없습니다.";
+                    //console.log(ch1 + "" + ch2 + "" + ch3 + ch4 + " is continuity");
-                    return false;
+                    this.err_msg = "연속적인 숫자 또는 문자열은 사용할 수 없습니다.";
-                }
+                    return false;
-                if (ch1.charCodeAt(0) - ch2.charCodeAt(0) == -1 && ch2.charCodeAt(0) - ch3.charCodeAt(0) == -1 && ch3.charCodeAt(0) - ch4.charCodeAt(0) == -1) {
+                }
-                    //console.log(ch1 + "" + ch2 + "" + ch3 + ch4 + " is continuity");
+                if (ch1.charCodeAt(0) - ch2.charCodeAt(0) == -1 && ch2.charCodeAt(0) - ch3.charCodeAt(0) == -1 && ch3.charCodeAt(0) - ch4.charCodeAt(0) == -1) {
-                    this.err_msg = "연속적인 숫자 또는 문자열은 사용할 수 없습니다.";
+                    //console.log(ch1 + "" + ch2 + "" + ch3 + ch4 + " is continuity");
-                    return false;
+                    this.err_msg = "연속적인 숫자 또는 문자열은 사용할 수 없습니다.";
-                }
+                    return false;
-            }
+                }
-
+            }
-            if (typeof this.param.phone != "undefined" && this.param.phone != null) {
+
-                var phone = this.param.phone;
+            if (typeof this.param.phone != "undefined" && this.param.phone != null) {
-                phone = phone.substring(3, phone.length);	// 앞 3자리 제거
+                var phone = this.param.phone;
-
+                phone = phone.substring(3, phone.length);	// 앞 3자리 제거
-                var last = phone.substring(phone.length - 4, phone.length);	// 뒤 4자리 추출
+
-                var middle = phone.substring(0, phone.length - 4);			// 뒤 4자리 제거 == 국번
+                var last = phone.substring(phone.length - 4, phone.length);	// 뒤 4자리 추출
-
+                var middle = phone.substring(0, phone.length - 4);			// 뒤 4자리 제거 == 국번
-                if (pw.indexOf(middle) >= 0 || pw.indexOf(last) >= 0) {
+
-                    this.err_msg = "휴대폰번호가 포함된 문자열은 사용할 수 없습니다.";
+                if (pw.indexOf(middle) >= 0 || pw.indexOf(last) >= 0) {
-                    return false
+                    this.err_msg = "휴대폰번호가 포함된 문자열은 사용할 수 없습니다.";
-                }
+                    return false
-            }
+                }
-
+            }
-            if (pw.length >= 10) {
+
-                if (pw.match(/^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[!@#$%^&*])([a-zA-Z0-9!@#$%^&*]+)$/)) {
+            if (pw.length >= 10) {
-                    return true;
+                if (pw.match(/^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[!@#$%^&*])([a-zA-Z0-9!@#$%^&*]+)$/)) {
-                } else if (!pw.match(/^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$/)
+                    return true;
-                    && !pw.match(/^(?=.*[0-9])(?=.*[!@#$%^&*])([0-9!@#$%^&*]+)$/)
+                } else if (!pw.match(/^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$/)
-                    && !pw.match(/^(?=.*[a-zA-Z])(?=.*[!@#$%^&*])([a-zA-Z!@#$%^&*]+)$/)) {
+                    && !pw.match(/^(?=.*[0-9])(?=.*[!@#$%^&*])([0-9!@#$%^&*]+)$/)
-                    this.err_msg = "영문, 숫자, 특수문자 중 2가지 이상 조합하여 10자리 이상 또는 3가지 이상 조합하여 8자리 이상이어야 합니다.";
+                    && !pw.match(/^(?=.*[a-zA-Z])(?=.*[!@#$%^&*])([a-zA-Z!@#$%^&*]+)$/)) {
-                    return false;
+                    this.err_msg = "영문, 숫자, 특수문자 중 2가지 이상 조합하여 10자리 이상 또는 3가지 이상 조합하여 8자리 이상이어야 합니다.";
-                }
+                    return false;
-            } else if (pw.length >= 8) {
+                }
-                if (!pw.match(/^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[!@#$%^&*])([a-zA-Z0-9!@#$%^&*]+)$/)) {
+            } else if (pw.length >= 8) {
-                    this.err_msg = "영문, 숫자, 특수문자 중 2가지 이상 조합하여 10자리 이상 또는 3가지 이상 조합하여 8자리 이상이어야 합니다.";
+                if (!pw.match(/^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[!@#$%^&*])([a-zA-Z0-9!@#$%^&*]+)$/)) {
-                    return false;
+                    this.err_msg = "영문, 숫자, 특수문자 중 2가지 이상 조합하여 10자리 이상 또는 3가지 이상 조합하여 8자리 이상이어야 합니다.";
-                }
+                    return false;
-            } else {
+                }
-                this.err_msg = "영문, 숫자, 특수문자 중 2가지 이상 조합하여 10자리 이상 또는 3가지 이상 조합하여 8자리 이상이어야 합니다.";
+            } else {
-                return false;
+                this.err_msg = "영문, 숫자, 특수문자 중 2가지 이상 조합하여 10자리 이상 또는 3가지 이상 조합하여 8자리 이상이어야 합니다.";
-            }
+                return false;
-
+            }
-            return true;
+
-        },
+            return true;
-        checkName: function (name) {
+        },
-            if (name == null || name.trim() == "") {
+        checkName: function (name) {
-                this.err_msg = "이름을 입력해 주세요.";
+            if (name == null || name.trim() == "") {
-                return false;
+                this.err_msg = "이름을 입력해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkDeptNm: function (dept) {
+        },
-            if (dept == null || dept.trim() == "") {
+        checkDeptNm: function (dept) {
-                this.err_msg = "부서명을 입력해 주세요.";
+            if (dept == null || dept.trim() == "") {
-                return false;
+                this.err_msg = "부서명을 입력해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkPhone: function (phone) {
+        },
-            if (phone == null || phone.trim() == "") {
+        checkPhone: function (phone) {
-                this.err_msg = "휴대폰번호를 입력해 주세요.";
+            if (phone == null || phone.trim() == "") {
-                return false;
+                this.err_msg = "휴대폰번호를 입력해 주세요.";
-            }
+                return false;
-            if (phone.length < 10) {
+            }
-                this.err_msg = "휴대폰번호를 정확히 입력해 주세요.";
+            if (phone.length < 10) {
-                return false;
+                this.err_msg = "휴대폰번호를 정확히 입력해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkEmail: function (email) {
+        },
-            if (email == null || email.trim() == "") {
+        checkEmail: function (email) {
-                this.err_msg = "이메일을 입력해 주세요.";
+            if (email == null || email.trim() == "") {
-                return false;
+                this.err_msg = "이메일을 입력해 주세요.";
-            }
+                return false;
-            // eslint-disable-next-line
+            }
-            if (!email.match(/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/)) {
+            // eslint-disable-next-line
-                this.err_msg = "이메일을 정확히 입력해 주세요.";
+            if (!email.match(/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/)) {
-                return false;
+                this.err_msg = "이메일을 정확히 입력해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkIp: function (param) {
+        },
-            if ((param.ip1 == null || param.ip1 == "") && (param.ip2 == null || param.ip2 == "") && (param.ip3 == null || param.ip3 == "") && (param.ip4 == null || param.ip4 == "")) {
+        checkIp: function (param) {
-                this.err_msg = "접근허용 IP를 입력해 주세요.";
+            if ((param.ip1 == null || param.ip1 == "") && (param.ip2 == null || param.ip2 == "") && (param.ip3 == null || param.ip3 == "") && (param.ip4 == null || param.ip4 == "")) {
-                return false;
+                this.err_msg = "접근허용 IP를 입력해 주세요.";
-            }
+                return false;
-            if ((param.ip1 == null || param.ip1 == "")
+            }
-                || (param.ip2 == null || param.ip2 == "")
+            if ((param.ip1 == null || param.ip1 == "")
-                || (param.ip3 == null || param.ip3 == "")
+                || (param.ip2 == null || param.ip2 == "")
-                || (param.ip4 == null || param.ip4 == "")) {
+                || (param.ip3 == null || param.ip3 == "")
-                this.err_msg = "IP 주소를 정확히 입력해 주세요.";
+                || (param.ip4 == null || param.ip4 == "")) {
-                return false;
+                this.err_msg = "IP 주소를 정확히 입력해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkIpEach: function (ip, msg) {
+        },
-            if (ip == null || ip == "") {
+        checkIpEach: function (ip, msg) {
-                this.err_msg = typeof msg != "undefined" ? msg : "접근허용 IP를 입력해 주세요.";
+            if (ip == null || ip == "") {
-                return false;
+                this.err_msg = typeof msg != "undefined" ? msg : "접근허용 IP를 입력해 주세요.";
-            }
+                return false;
-            if (!ip.match(/^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/)) {
+            }
-                this.err_msg = "IP 주소를 정확히 입력해 주세요.";
+            if (!ip.match(/^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/)) {
-                return false;
+                this.err_msg = "IP 주소를 정확히 입력해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkIpWithAsterisk: function (ip, msg) {
+        },
-            if (ip == null || ip == "") {
+        checkIpWithAsterisk: function (ip, msg) {
-                this.err_msg = typeof msg != "undefined" ? msg : "접근허용 IP를 입력해 주세요.";
+            if (ip == null || ip == "") {
-                return false;
+                this.err_msg = typeof msg != "undefined" ? msg : "접근허용 IP를 입력해 주세요.";
-            }
+                return false;
-            // 3레벨 이후 * 허용... 2레벨 이후 시 {2,3}  1레벨 이후시 {1,3} 필요 시 구문 추가
+            }
-            if (!ip.match(/^((((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))|(((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}\*))$/)) {
+            // 3레벨 이후 * 허용... 2레벨 이후 시 {2,3}  1레벨 이후시 {1,3} 필요 시 구문 추가
-                this.err_msg = "IP 주소를 정확히 입력해 주세요.";
+            if (!ip.match(/^((((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?))|(((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}\*))$/)) {
-                return false;
+                this.err_msg = "IP 주소를 정확히 입력해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkRole: function (role) {
+        },
-            if (role == null || role == "") {
+        checkRole: function (role) {
-                this.err_msg = "권한을 선택해 주세요.";
+            if (role == null || role == "") {
-                return false;
+                this.err_msg = "권한을 선택해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        //리스크관리 
+        },
-        checkSpamCliId: function (comnId, spamCliId) {
+        //리스크관리 
-            if (comnId == "N") {
+        checkSpamCliId: function (comnId, spamCliId) {
-                if (spamCliId == null || spamCliId.trim() == "") {
+            if (comnId == "N") {
-                    this.err_msg = "SMID를 입력해 주세요.";
+                if (spamCliId == null || spamCliId.trim() == "") {
-                    return false;
+                    this.err_msg = "SMID를 입력해 주세요.";
-                }
+                    return false;
-            }
+                }
-            return true;
+            }
-        },
+            return true;
-        checkReqType: function (reqType) {
+        },
-            if (reqType == null || reqType.trim() == "") {
+        checkReqType: function (reqType) {
-                this.err_msg = "요청자를 선택해 주세요.";
+            if (reqType == null || reqType.trim() == "") {
-                return false;
+                this.err_msg = "요청자를 선택해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkSpamType: function (spamType) {
+        },
-            if (spamType == null || spamType.trim() == "") {
+        checkSpamType: function (spamType) {
-                this.err_msg = "차단사유를 선택해 주세요.";
+            if (spamType == null || spamType.trim() == "") {
-                return false;
+                this.err_msg = "차단사유를 선택해 주세요.";
-            }
+                return false;
-            return true;
+            }
-        },
+            return true;
-        checkSpamContents: function (blockType) {
+        },
-            var str = "";
+        checkSpamContents: function (blockType) {
-            for (var k in this.callBacks) {
+            var str = "";
-                str = this.callBacks[k].spamContent;
+            for (var k in this.callBacks) {
-
+                str = this.callBacks[k].spamContent;
-
+
-                if (blockType == "CLB") {
+
-                    if (str == null || str.trim() == "") {
+                if (blockType == "CLB") {
-                        this.err_msg = "발신번호를 입력해 주세요.";
+                    if (str == null || str.trim() == "") {
-                        return false;
+                        this.err_msg = "발신번호를 입력해 주세요.";
-                    } else {
+                        return false;
-                        if (this.bytes(str) < 8) {
+                    } else {
-                            this.err_msg = "발신번호가 8자리 미만입니다.";
+                        if (this.bytes(str) < 8) {
-                            return false;
+                            this.err_msg = "발신번호가 8자리 미만입니다.";
-                        }
+                            return false;
-
+                        }
-                        if (this.bytes(str) > 11) {
+
-                            this.err_msg = "발신번호가 11자리 초과입니다.";
+                        if (this.bytes(str) > 11) {
-                            return false;
+                            this.err_msg = "발신번호가 11자리 초과입니다.";
-                        }
+                            return false;
-                    }
+                        }
-                } else {
+                    }
-                    if (str == null || str.trim() == "") {
+                } else {
-                        this.err_msg = "차단메시지를 입력해 주세요.";
+                    if (str == null || str.trim() == "") {
-                        return false;
+                        this.err_msg = "차단메시지를 입력해 주세요.";
-                    }
+                        return false;
-                }
+                    }
-            }
+                }
-            return true;
+            }
-        }
+            return true;
-    }
+        }
-};
+    }
-
+};
+
 export { commonPwdView, validation };

frontend/src/modules/login/store/index.js

@@ -1,52 +1,52 @@
-const state = {
+const state = {
-  token: null,
+  token: null,
-  isLogin: false,
+  isLogin: false,
-  isErrorPage: false,
+  isErrorPage: false,
-  isAuthChk: false,
+  isAuthChk: false,
-  pwd: null
+  pwd: null
-};
+};
-
+
-const getters = {
+const getters = {
-  getToken: state => state.token,
+  getToken: state => state.token,
-  isLogin: state => state.isLogin,
+  isLogin: state => state.isLogin,
-  isErrorPage: state => state.isErrorPage,
+  isErrorPage: state => state.isErrorPage,
-  isAuthChk: state => state.isAuthChk,
+  isAuthChk: state => state.isAuthChk,
-  getPwd: state => state.pwd,
+  getPwd: state => state.pwd,
-};
+};
-
+
-const mutations = {
+const mutations = {
-  saveToken: (state, token) => {
+  saveToken: (state, token) => {
-    console.log('saveToken:', token);
+    console.log('saveToken:', token);
-    state.token = token;
+    state.token = token;
-  },
+  },
-  removeToken: (state) => {
+  removeToken: (state) => {
-    console.log('removeToken:');
+    console.log('removeToken:');
-    state.token = null;
+    state.token = null;
-  },
+  },
-  isLogin: (state, value) => {
+  isLogin: (state, value) => {
-    console.log("isLogin mutation : " + value);
+    console.log("isLogin mutation : " + value);
-    state.isLogin = value;
+    state.isLogin = value;
-  },
+  },
-  isErrorPage: (state, value) => {
+  isErrorPage: (state, value) => {
-    console.log("isErrorPage mutation : " + value);
+    console.log("isErrorPage mutation : " + value);
-    state.isErrorPage = value;
+    state.isErrorPage = value;
-  },
+  },
-  isAuthChk: (state, value) => {
+  isAuthChk: (state, value) => {
-    console.log("isAuthChk mutation : "+ value);
+    console.log("isAuthChk mutation : "+ value);
-    state.isAuthChk = value;
+    state.isAuthChk = value;
-  },
+  },
-  savePwd: (state, value) => {
+  savePwd: (state, value) => {
-    state.pwd = value;
+    state.pwd = value;
-  },
+  },
-};
+};
-
+
-const actions = {
+const actions = {
-};
+};
-
+
-export default {
+export default {
-  namespaced: true,
+  namespaced: true,
-  state,
+  state,
-  getters,
+  getters,
-  mutations,
+  mutations,
-  actions
+  actions
-};
+};

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

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

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

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

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

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

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

@@ -0,0 +1,163 @@
+<template>
+<div class="wrap bg-wrap">
+<!--	s: 비밀번호변경	-->
+		<div id="cpf" class="login-box pw-change">
+			<div class="logo"></div>
+			<div class="wbox">
+				<h3 class="title">비밀번호 변경</h3>
+				<p class="desc">임시비밀번호로 로그인할 경우 비밀번호를 변경 후<br>서비스 이용이 가능합니다.</p>
+				<form @submit.prevent="changedPwd">
+					<ul class="pw-form">
+						<div><input id="oldPw" type="text" placeholder="기존 비밀번호를 입력하세요" v-model="oldPw" ref="oldPw"></div>
+						<div>
+              <input id="newPw" type="text" placeholder="새로운 비밀번호를 입력하세요" v-model="newPw" ref="newPw" maxlength="16">
+            </div>
+						<div><input type="text" placeholder="새로운 비밀번호를 다시 한 번 입력하세요" ></div>
+						<div><button class="btn-pcolor" @click="changedPwd()">비밀번호 변경하기</button></div>
+					</ul>
+				</form>
+			</div>
+		</div>	
+        <login-popup ref="LoginPopup"> </login-popup>
+    </div>
+  
+
+</template>
+
+<script>
+import api from '../service/api';
+import { mapGetters } from 'vuex';
+import LoginPopup from '@/components/LoginPopup.vue';
+import tokenSvc from '@/common/token-service';
+import { commonPwdView, validation } from '../service/mixins';
+  // import { chkPattern } from '@/common/vue-mixins';
+  // import * as utils from '@/common/utils';
+export default {
+  mixins: [commonPwdView, validation],
+  data: function() {
+      return {
+        userId: '',
+        oldPw: '',
+        newPw: '',
+        passwordValidFlag: true,
+      };
+    },
+
+    created: function() {
+      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() {    
+      // this.$refs.chkSaveId.checked = true;
+
+          if (localStorage.hubwebUserId) {  
+            this.userId = localStorage.hubwebUserId;
+          }
+          this.isLogin = this.getLogin;
+          this.oldPw = this.getPwd;
+       },
+
+        computed: {
+         ...mapGetters({
+           getLogin: 'login/isLogin',
+           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;
+              }
+            }
+          },
+
+    components: {
+        LoginPopup : LoginPopup
+    },
+
+    methods: {
+      verifyNewPw: function() {
+        this.message.newPw = '';
+      },
+
+      formCheck: function() {
+        this.errors = [];
+        
+
+        if (!this.oldPw) this.errors.push('기존비밀번호');
+        if (!this.newPw) this.errors.push('새로운비밀번호');
+
+        return this.errors.length == 0;
+      },
+
+
+      changedPwd: function() {
+        
+        var vm = this;
+   
+        var params = {
+          
+          "userId": this.userId,
+          "oldPw": this.oldPw,
+          "newPw": this.newPw
+        }
+
+        api.updatePassword(params).then(function(response) {
+          var rsp = response.data;
+          // var pofo = document.getElementById('oldPw');
+
+          if(rsp.retCode == '0000') {
+            // vm.chgChkUserId();
+
+            if(vm.ModalOpen('modal16')){
+              vm.$router.push({ path: '/login' });
+            }
+          } else if(rsp.retCode == '4016') {
+            vm.ModalOpen('modal14')
+          } else if(rsp.retCode == '4017') {
+            vm.ModalOpen('modal15')
+          } else if(rsp.retCode == '4003') {
+            if(vm.ModalOpen('modal14')) {
+              //수정사항 : 모달오픈 -> 기존비밀번호 포커스
+              alert('1');
+            }
+            
+            //   //this.$refs.oldPw.focus();
+              // alert('비밀번호 유효성체크'); 
+              // vm.$refs.oldPw.focus();
+            }
+            else { 
+            return;
+          }
+        });
+      },
+
+      ModalOpen: function(target){      
+        this.$refs.LoginPopup.ModalOpen(target);
+        // this.$refs.oldPw.focus(target);
+      },
+
+
+
+    
+
+
+    }
+
+}
+</script>

frontend/src/modules/sysMgt/AdminList.vue

@@ -0,0 +1,273 @@
+<template>
+	<div class="contents">
+		<div class="contents_wrap">
+			<div class="top_wrap">
+				<h3 class="title">관리자/유치채널 관리</h3>
+				<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
+			</div>
+			<form autocomplete="off" class="search_form">
+					<div class="search_wrap">
+						<div class="select_box">
+							<label for="right" class="label">권한</label>
+							<select name="" id="right" v-model="grid.params.searchType1" @keyup.enter="search">
+								<option value="">전체</option>
+								<option v-for="(option, i) in authType" v-bind:value="option.autCd" v-bind:key="i">
+									{{ option.autNm }}
+								</option>
+							</select>
+						</div>
+						<div class="select_box">
+							<label for="right" class="label">상태</label>
+							<select name="" id="" v-model="grid.params.searchType2" @keyup.enter="search">
+								<option value="" selected>전체</option>
+								<option v-for="(option, i) in statType" v-bind:value="option.code" v-bind:key="i">
+									{{ option.codeNm }}
+								</option>
+							</select>
+						</div>
+						<div class="input_box id">
+							<label for="id1" class="label">ID</label>
+                            <input type="text" id="id1" placeholder="검색어 입력" v-model="grid.params.searchText1" @keyup.enter="search"/>
+						</div>
+						<div class="input_box">
+							<label for="name" class="label">이름(대리점명)</label>
+                            <input type="text" id="name" placeholder="검색어 입력" v-model="grid.params.searchText2" @keyup.enter="search"/>
+						</div>
+						<button type="button" class="button grey" @click="search">조회</button>
+					</div>
+				</form>
+				<div class="info">
+					<div class="count">총 <span>{{ totalItems }}</span>건</div>
+					<div class="button_group">
+						<button type="button" class="button blue admin add" @click="adminRegPopOpen();">관리자 등록</button>
+						<button type="button" class="button blue channel add" @click="adminReg2PopOpen();">유치채널 등록</button>
+						<button type="button" class="button white delete del" @click="deleteRow();">삭제</button>
+					</div>
+				</div>
+				<div class="table">
+					<custom-grid
+						ref="table"
+						:totalItems="'totalItems'"
+						:url="grid.url"
+						:pagePerRows="grid.pagePerRows"
+						:initialRequest="grid.initialRequest"
+						:pagination="grid.pagination"
+						:isCheckbox="grid.isCheckbox"
+						:columns="grid.columns"
+						:noDataStr="grid.noDataStr"
+						:addCls="grid.addCls"
+						:header="grid.headder"        
+					></custom-grid>
+				</div>
+		    <admin-reg-pop ref="adminRegModal"> </admin-reg-pop>
+        <!-- <admin-reg2-pop ref="adminReg2Modal"> </admin-reg2-pop> -->
+        <admin-detail-pop ref="adminDetailModal"> </admin-detail-pop>
+		</div>
+	</div>
+</template>
+
+<script>
+import customGrid from '@/components/CustomGrid';
+import AdminRegPop from '../components/AdminRegPop';
+//import AdminReg2Pop from '../components/AdminReg2Pop';
+import AdminDetailPop from '../components/AdminDetailPop';
+import api from '@/service/api.js';
+import sysMgtApi from "../service/sysMgtApi.js";
+
+
+class CustomATagRenderer {
+    constructor(props) {
+        this.props = props;
+        const el = document.createElement('a');
+        el.href = 'javascript:void(0);';
+        el.className = 'btn_text';
+        el.innerText= String(props.colValue)
+        this.el = el;
+    }
+
+    getElement() {
+        return this.el;
+    }
+
+    addEvent(selEl) {
+        selEl.addEventListener("click", () => {
+            const { callback } = this.props["cgrido" + this.props.colName].options;
+            callback(this.props);
+        });
+    }
+}
+
+export default {
+  name: 'adminList',
+  data() {
+    return {
+	    row: {},
+      authType: [],
+	    statType: [],
+      cate2Code: "",
+      totalItems: 0,
+      // 테이블 리스트 데이터
+      perPageCnt: 20,
+      grid: {
+        url: '/api/v1/bo/sysMgt/adminList',
+        pagePerRows: 20,
+        pagination: true,           
+        isCheckbox: true,        // true:첫번째 컬럼 앞에 체크박스 생성 / false:체크박스 제거
+        initialRequest: false,
+        addCls: 'box_OFvis',
+
+        columns: [          
+          { name: 'no', header: 'No', align: 'center', width: 60},
+          { name: 'auth', header: '권한', align: 'center', width: 160 },
+          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130, renderer: {
+              type: CustomATagRenderer
+              , options: {
+                  callback: this.detailPop,
+              }
+            }
+          },
+          { name: 'adminId', header: 'ID', align: 'center', width: 130},
+          { name: 'adminStat', header: '상태', align: 'center', width: 130, cls: 'td_line'},
+          { name: 'regDt', header: '등록일', align: 'center', width: 130}
+        ],
+        noDataStr: '검색 결과가 없습니다.',        
+        params: {
+          searchType1: '',
+          searchType2: '',
+          searchText1: '',
+          searchText2: ''
+		},
+        excelHeader: []
+      }    
+    };
+  },  
+  components: {
+	customGrid: customGrid, 
+   // SystemPopup,
+    AdminRegPop,
+    //AdminReg2Pop,
+    AdminDetailPop
+  },
+  created(){            
+    this.$store.commit("login/isLogin", true);
+    this.$store.commit("login/isAuthChk", true);
+	  this.setCodeData();    	
+    //let cont = document.querySelector(".wrap");      
+    //cont.classList.add("main_wrap");
+  }, 
+  destroyed() {
+      
+  },
+  mounted() {
+    let page = 1;
+    // 페이지 정보 및 검색 조건
+    const getCondition = this.$store.getters['searchcondition/getSearchCondition'];
+    console.log('getCondition : '+getCondition);
+
+	// store에 저장된 페이지 정보 및 검색 조건을 불러오기
+    let isKeep = false;
+    if (getCondition) {
+      this.grid.pagePerRows = getCondition.perPage;
+      this.grid.params = getCondition.params;      
+      page = getCondition.page;
+      isKeep = true;
+    }
+    this.search(isKeep);   
+  },
+  methods: {
+	search: function(isKeep) {
+      console.log('this.perPageCnt'+this.perPageCnt);
+      //console.log(this.grid.params);	  
+      this.$refs.table.search(this.grid.params, isKeep);
+      this.sendStoreData();
+    },
+    detailPop(props) {
+        // this.getMainSlot().popupView(4);
+        // this.setDtlPpPrm(props);
+        this.$refs.adminDetailModal.adminDetailModalOpen(props);
+    },
+    ModalOpen: function(target){      
+      //this.$refs.systemModal.ModalOpen(target);
+    },
+    adminRegPopOpen: function(){
+      this.$refs.adminRegModal.ModalOpen(1);
+    },
+    adminReg2PopOpen: function(){
+      this.$refs.adminRegModal.ModalOpen(2);
+      //this.$refs.adminReg2Modal.adminReg2ModalOpen();//
+    },
+    doValidate(){ //로우데이터 삭제하도록 수정
+      
+      console.log("totalItems >> " + this.totalItems);
+      if(this.totalItems == 0){
+        alert('검색 결과가 없습니다.');
+        return false;
+      }
+      var chkList = this.$refs.table.checkedElementDatas();
+      if(chkList.length == 0){
+        alert('체크박스에 체크를 해주세요.');
+        return false;
+      }
+        // for(var i = 0; i < chkList.length; i++){
+        //   alert(chkList[i].adminId);
+        // }
+      const param = chkList.map((row)=>({adminId:row.adminId}));
+      this.row.list = param;
+      console.log(this.row);
+      return true;
+    },
+	sendStoreData: function() {
+      const getP = this.$refs.table.getPagination();
+      console.log("==========getP : " + getP);
+      this.$store.commit('searchcondition/updateSearchCondition', {
+        page: getP._currentPage,        
+		perPage: this.perPageCnt,        
+        params: this.grid.params
+      });
+
+      const getCondition = this.$store.getters['searchcondition/getSearchCondition'];
+      //console.log("getCondition : "+ getCondition.perPage);
+    },
+	setCodeData() {
+
+	  // 상태 옵션 셋팅.
+      api.commCode({'grpCd' : 'ADM_STTUS_CD'}).then(response => {
+		    this.statType = response.data.data.list;
+      });
+	  api.commAuth().then(response => {
+		    this.authType = response.data.data.list;
+      });
+    },
+    async deleteRow(){
+      if(this.doValidate() && window.confirm('삭제 하시겠습니까?')){
+        try {
+            let response = await sysMgtApi.deleteAdmin(this.row);
+            const result = response.data;
+            if (result != null && result.retCode == "0000") {
+              alert('삭제 하였습니다.');
+              // grid.reloadData();
+              this.$refs.table.reloadData();
+              return;
+            }
+            alert("실패 하였습니다.");
+        } catch(err) {
+            alert("실패 하였습니다.");
+        }
+      }
+    },
+  },
+  
+  beforeRouteLeave(to, from, next) {
+	
+	const getP = this.$refs.table.getPagination();
+	console.log("==========getP : " + getP._currentPage);
+	this.$store.commit('searchcondition/updateSearchCondition', {
+	  page: getP._currentPage,        
+	  perPage: this.perPageCnt,        
+	  params: this.grid.params
+	});  
+	// 라우트 하기전 실행 
+	next();
+  }
+};
+</script>

frontend/src/modules/sysMgt/AuthList.vue

@@ -0,0 +1,107 @@
+<template>
+	<div class="contents">
+		<div class="contents_wrap">
+			<div class="top_wrap">
+				<h3 class="title">권한 관리</h3>
+				<p class="breadcrumb">시스템관리 &gt; 권한 관리</p>
+			</div>
+			<div class="info">
+				<div class="count">총 <span>4</span>건</div>
+				<div class="button_group">
+					<button type="button" class="button blue add" onclick="location.href='system_right_add.html';">권한 추가</button>
+				</div>
+			</div>
+			<div class="table">
+				<table>
+					<colgroup>
+						<col width="10%"/>
+						<col width="20%"/>
+						<col width="20%"/>
+						<col width="15%"/>
+						<col width="20%"/>
+						<col width="15%"/>
+					</colgroup>
+					<thead>
+						<tr>
+							<th>NO</th>
+							<th>코드</th>
+							<th>권한명</th>
+							<th>상태</th>
+							<th>등록일</th>
+							<th></th>
+						</tr>
+					</thead>
+					<tbody>
+						<tr>
+							<td>4</td>
+							<td>Admin_01</td>
+							<td>슈퍼관리자</td>
+							<td>사용</td>
+							<td>2022-03-10</td>
+							<td class="two_btn_group">
+								<button type="button" class="button grey" onclick="location.href='system_right_modify.html';">수정</button>
+								<button type="button" class="button white delete">삭제</button>
+							</td>
+						</tr>
+						<tr>
+							<td>3</td>
+							<td>Admin_01</td>
+							<td>슈퍼관리자</td>
+							<td>사용</td>
+							<td>2022-03-10</td>
+							<td class="two_btn_group">
+								<button type="button" class="button grey">수정</button>
+								<button type="button" class="button white delete">삭제</button>
+							</td>
+						</tr>
+						<tr>
+							<td>2</td>
+							<td>Admin_01</td>
+							<td>슈퍼관리자</td>
+							<td>사용</td>
+							<td>2022-03-10</td>
+							<td class="two_btn_group">
+								<button type="button" class="button grey">수정</button>
+								<button type="button" class="button white delete">삭제</button>
+							</td>
+						</tr>
+						<tr>
+							<td>1</td>
+							<td>Admin_01</td>
+							<td>슈퍼관리자</td>
+							<td>사용</td>
+							<td>2022-03-10</td>
+							<td class="two_btn_group">
+								<button type="button" class="button grey">수정</button>
+								<button type="button" class="button white delete">삭제</button>
+							</td>
+						</tr>
+					</tbody>
+				</table>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+export default {
+  name: 'authList',
+  data() {
+    return {
+      
+    };
+  },  
+  components: {
+    
+  },
+  destroyed() {
+      
+  },
+  mounted() {
+    
+  },
+  methods: {
+    
+  }
+};
+</script>

frontend/src/modules/sysMgt/components/AdminDetailPop.vue

@@ -0,0 +1,237 @@
+<template>    
+
+	<div>
+		<div class="dimmed modal21" @click="adminDetailModalClose();"></div>
+		<div class="popup-wrap modal21">
+			<!-- 관리자/유치채널 상세정보 -->
+			<div class="popup modal21 popup_form">
+				<div class="pop-head">
+					<h3 class="pop-tit" v-if="code === null || code === ''">관리자 상세정보</h3>
+					<h3 class="pop-tit" v-else>유치채널 상세정보</h3>
+				</div>
+				<form autocomplete="off" ref="adminDetailForm">
+					<table>
+						<tbody>
+							<tr>
+								<th>ID</th>
+								<td><input type="text" disabled v-model.trim="madangId" ref="_madangId2"></td>
+							</tr>
+							<tr>
+								<th>비밀번호</th>
+								<td><input type="password" @keypress="onlyPassword" @input="onlyPassword" required minlength="8" maxlength="16" ref="_pwd1" v-model.trim="userPwd1"></td>
+							</tr>
+							<tr>
+								<th>비밀번호 확인</th>
+								<td><input type="password" @keypress="onlyPassword" @input="onlyPassword" required minlength="8" maxlength="16" ref="_pwd2" v-model.trim="userPwd2"></td>
+							</tr>
+							<tr>
+								<th>이름</th>
+								<td><input type="text" disabled v-model.trim="userNm" ref="_userNm"></td>
+							</tr>
+							<tr>
+								<th>휴대폰번호</th>
+								<td><input type="number" disabled v-model.trim="mdn" ref="_phone"></td>
+							</tr>
+							<tr>
+								<th>이메일</th>
+								<td><input type="email" disabled v-model.trim="email" ref="_email"></td>
+							</tr>
+							<tr>
+								<th>권한</th>
+								<td v-if="code === null || code === ''">
+									<div v:class="select_box">
+										<select name="" id="right" v-model="auth" ref="_auth">
+											<option value="">선택</option>
+											<option 
+												v-for="(option, i) in authType" 
+												v-bind:value="option.autCd" 
+												v-bind:key="i"
+												:selected="auth === option.autCd">
+												{{ option.autNm }}
+											</option>
+										</select>
+									</div>
+								</td>
+								<td v-else><input type="text" disabled value="대리점"></td>
+							</tr>
+							<tr>
+								<th class="center">상태</th>
+								<td>
+									<input type="radio" name="state" value="01" id="popup_radio1" 
+										v-model="stat"
+										:checked="stat == '1'">
+									<label for="popup_radio1">사용</label>
+									<input type="radio" name="state" value="02" id="popup_radio2" 
+										v-model="stat"
+										:checked="stat == '02'">
+									<label for="popup_radio2">정지</label>
+								</td>
+							</tr>
+						</tbody>
+					</table>
+				</form>
+				<div class="pop-btn2">
+					<button class="btn-default" @click="adminDetailModalClose();">취소</button>
+					<button class="btn-pcolor" @click="doInsert">저장</button>
+				</div>
+			</div>			
+			<!-- 관리자 상세정보 팝업 끝-->
+		</div>
+	</div>
+</template>
+
+
+<script>
+import api from '@/service/api';
+import sysMgtApi from "../service/sysMgtApi.js";
+import { utils_mixin, chkPattern2 } from '../service/mixins';
+import lodash from "lodash";
+
+export default {
+	name: "adminDetailPop",
+	mixins: [utils_mixin, chkPattern2],
+	watch:{
+		stat(){
+			console.log('watch : ', this.stat)
+		}
+	},
+	data(){
+        return{
+			row: {},
+			authType: [],
+			
+			madangId:'',
+			name:'',
+			mdn:'',
+			email:'',
+			auth:'',
+			stat: '',
+			userNm:"",
+            userPwd1:"",
+            userPwd2:"",
+			code:"",
+        }
+    },
+	model: {
+		prop: 'sendData',
+		event: 'event-data'
+	},
+	props: ['sendData'],
+	created(){
+		//this.formReset();
+		this.setAuthData();
+    }, 
+	methods :{
+		doPwdValidate(){
+			if(this.isNull(this.userPwd2)){
+				alert("비밀번호 확인을 입력해 주세요.");
+				this.$refs._pwd2.focus();
+				return false;
+			}
+			if(!lodash.isEqual(this.userPwd1, this.userPwd2)){
+				alert("비밀번호가 일치하지 않습니다.");
+				this.$refs._pwd2.focus();
+				return false;
+			}
+			const pwdLen = this.bytes(this.userPwd1);
+			if(!(pwdLen >= 8 && pwdLen <= 16)){
+				alert("비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.");
+				this.$refs._pwd1.focus();
+				return false;
+			}
+			const pEng = /[A-Za-z]/g;	// 영문자 
+			const pNum = /[0-9]/g;	// 숫자 
+			const pSpc = /[!@$%^&*]/g; // 특수문자
+			if(!(pEng.test(this.userPwd1) && pNum.test(this.userPwd1) && pSpc.test(this.userPwd1))) {
+				alert("비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.");
+				this.$refs._pwd1.focus();
+				return;
+			}
+			this.row.adminPw=this.userPwd1;
+			return true;
+		},
+		doValidate(){
+			if(!this.isNull(this.userPwd1)){
+				if(!this.doPwdValidate()){
+					return false;
+				}
+			}
+			if(!this.isNull(this.auth)){
+				if(this.code == ''){
+					this.row.auth = this.auth;
+				}else{
+					this.row.auth=this.auth;
+				}
+			}
+			if(!this.isNull(this.stat)){
+				this.row.stat=this.stat;	
+			}
+			this.row.adminId=this.madangId;
+			return true;
+		},
+		// 모달 띄우기
+		async adminDetailModalOpen(props){
+			this.row.adminId = props.adminId;
+			try {
+				const response = await sysMgtApi.adminDetail(this.row);
+				const result = response.data;
+				console.log(result);
+				if (result != null && result.retCode == "0000") {
+					this.madangId = result.data.adminId;
+					this.auth = result.data.auth;
+					this.userNm = result.data.name;
+					this.email = result.data.email;
+					this.mdn = result.data.mdn;
+					this.stat = result.data.stat;
+				}
+			} catch(err) {
+				alert("실패 하였습니다.");
+			}
+			var dimmed = document.getElementsByClassName('modal21');
+			for(var i = 0; i < dimmed.length; i++){
+				dimmed[i].style.display = 'block';
+			}
+		},
+		// 모달 끄기
+		adminDetailModalClose(){
+			this.formReset();
+			var dimmed = document.getElementsByClassName('modal21');
+			for(var i = 0; i < dimmed.length; i++){
+				dimmed[i].style.display = 'none';
+			}
+		},
+		toComplete(){
+			this.getParent('adminList').$refs.table.reloadData();
+			this.adminDetailModalClose();
+        },
+		async doInsert(){
+            if(this.doValidate() && window.confirm('등록 하시겠습니까?')){
+                try {
+					const response = await sysMgtApi.updateAdmin(this.row);
+					const result = response.data;
+					if (result != null && result.retCode == "0000") {
+						alert('저장 하였습니다.');
+						this.toComplete();
+					}
+                } catch(err) {
+                	alert("실패 하였습니다.");
+                }
+            }
+        },
+        setAuthData() {
+			// 권한 옵션.
+			api.commAuth().then(response => {
+				this.authType = response.data.data.list;
+			});
+		},
+		formReset(){
+			this.$refs.adminDetailForm.reset();
+		},
+	}
+}
+</script>
+<style>
+	.popup-btn-wrap {width: 500px; margin: auto; padding: 100px 0;}
+	.popup-btn-wrap button {width: 100%; margin-bottom: 10px; height: 50px; border-radius: 5px; box-shadow: none; border: 1px solid #000; }
+	.popup-btn-wrap button:hover {background: #000; color: #fff;}
+</style>

frontend/src/modules/sysMgt/components/AdminRegPop.vue

@@ -0,0 +1,265 @@
+<template>
+	<!-- <div class="wrap bg-wrap"> -->
+	<div>
+		<div class="dimmed" @click="ModalClose();"></div>
+		<div class="popup-wrap">
+			<!-- 관리자/유치채널 등록 -->
+			<div class="popup modal20 popup_form">
+				<div class="pop-head">
+					<h3 class="pop-tit" v-if="insertType === 1">관리자 등록</h3>
+					<h3 class="pop-tit" v-else>유치채널 사용자 등록</h3>
+				</div>
+				<form autocomplete="off" ref="adminRegForm">
+					<table>
+						<tbody>
+							<tr>
+								<th>마당 ID</th>
+								<td class="input_search">
+									<input type="text" placeholder="아이디 입력" v-model.trim="madangId" ref="madangId">
+									<button type="button" class="button grey" >조회</button>
+								</td>
+							</tr>
+							<tr>
+								<th>비밀번호</th>
+								<td><input type="password" @keypress="onlyPassword" @input="onlyPassword" required minlength="8" maxlength="16" ref="_pwd1" v-model.trim="userPwd1"></td>
+							</tr>
+							<tr>
+								<th>비밀번호 확인</th>
+								<td><input type="password" @keypress="onlyPassword" @input="onlyPassword" required minlength="8" maxlength="16" ref="_pwd2" v-model.trim="userPwd2"></td>
+							</tr>
+							<tr>
+								<th>이름</th>
+								<td><input type="text" @keypress="onlyName" @input="onlyName" v-model.trim="userNm" ref="_userNm" required maxlength="40"></td>
+							</tr>
+							<tr>
+								<th>휴대폰번호</th>
+								<td><input type="number" placeholder="- 자 제외 숫자만 입력" v-model.trim="mdn" v-on:keyup="onlyNum" @input="onlyNum" minlength="10" maxlength="11" ref="_phone"></td>
+							</tr>
+							<tr>
+								<th>이메일</th>
+								<td><input type="email" v-model.trim="email" @keypress="onlyEmail" @input="onlyEmail" maxlength="20" ref="_email"></td>
+							</tr>
+							<tr v-if="insertType === 2">
+								<th>코드</th>
+								<td><input type="text" disabled ref="_code" v-model.trim="code"></td>
+							</tr>
+							<tr>
+								<th>권한</th>
+								<td v-if="insertType === 1">
+									<div v:class="select_box">
+										<select name="" id="right" v-model="auth" ref="_auth">
+											<option value="">선택</option>
+											<option v-for="(option, i) in authType" v-bind:value="option.autCd" v-bind:key="i">
+												{{ option.autNm }}
+											</option>
+										</select>
+									</div>
+								</td>
+								<td v-else><input type="text" disabled value="대리점"></td>
+							</tr>
+							<tr>
+								<th class="center">상태</th>
+								<td>
+									<input type="radio" name="state" value="01" id="popup_radio1" v-model="stat">
+									<label for="popup_radio1">사용</label>
+									<input type="radio" name="state" value="02" id="popup_radio2" v-model="stat">
+									<label for="popup_radio2">정지</label>
+								</td>
+							</tr>
+						</tbody>
+					</table>
+				</form>
+				<div class="pop-btn2">
+					<button class="btn-default" @click="ModalClose();">취소</button>
+					<button class="btn-pcolor" @click="doInsert">저장</button>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+import api from '@/service/api';
+import sysMgtApi from "../service/sysMgtApi.js";
+import { utils_mixin, chkPattern2 } from '../service/mixins';
+import lodash from "lodash";
+
+export default {
+	name: "adminRegPop",
+	mixins: [utils_mixin, chkPattern2],
+	watch:{
+		stat(){
+			console.log('watch : ', this.stat)
+		}
+	},
+	data(){
+        return{
+			row: {},
+			authType: [],
+			insertType:0,
+			madangId:'',
+			name:'',
+			mdn:'',
+			email:'',
+			auth:'',
+			stat: '',
+			userNm:"",
+            userPwd1:"",
+            userPwd2:"",
+			code:"",
+        }
+    },
+	model: {
+		prop: 'sendData',
+		event: 'event-data'
+	},
+	props: ['sendData'],
+	created(){            
+		this.formReset();
+		this.setAuthData();
+    }, 
+	methods :{
+		doPwdValidate(){			
+			if(this.isNull(this.userPwd1)){
+				alert("비밀번호를 입력해 주세요.");
+				this.$refs._pwd1.focus();
+				return false;
+			}
+			if(this.isNull(this.userPwd2)){
+				alert("비밀번호 확인을 입력해 주세요.");
+				this.$refs._pwd2.focus();
+				return false;
+			}
+			if(!lodash.isEqual(this.userPwd1, this.userPwd2)){
+				alert("비밀번호가 일치하지 않습니다.");
+				this.$refs._pwd2.focus();
+				return false;
+			}
+			const pwdLen = this.bytes(this.userPwd1);
+			if(!(pwdLen >= 8 && pwdLen <= 16)){
+				alert("비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.");
+				this.$refs._pwd1.focus();
+				return false;
+			}
+			const pEng = /[A-Za-z]/g;	// 영문자 
+			const pNum = /[0-9]/g;	// 숫자 
+			const pSpc = /[!@$%^&*]/g; // 특수문자
+			if(!(pEng.test(this.userPwd1) && pNum.test(this.userPwd1) && pSpc.test(this.userPwd1))) {
+				alert("비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.");
+				this.$refs._pwd1.focus();
+				return;
+			}
+			this.row.adminPw=this.userPwd1;
+			return true;
+		},
+		doValidate(){
+			if(!this.doPwdValidate()){
+				return false;
+			}
+			if(this.isNull(this.userNm)){
+				alert("이름을 입력해 주세요");
+				this.$refs._userNm.focus();
+				return false;
+			}
+			if(this.isNull(this.mdn)){
+				alert('휴대폰번호를 입력해주세요.');
+				this.$refs._phone.focus();
+				return false;
+			}
+			const hp = this.mdn;
+			if(!this.isNull(hp) && !this.isMobile(hp)){
+				alert("휴대폰 번호 형식이 잘못되었습니다. 확인해 주세요");
+				this.$refs._phone.focus();
+				return false;
+			}
+			if(this.isNull(this.email)){
+				alert('이메일을 입력해주세요.');
+				this.$refs._email.focus();
+				return false;
+			}
+			const email = this.email;
+			if(!this.isNull(email) && !lodash.isEqual(email,'@') && !this.emailCheck(email)){
+				alert("이메일 형식이 잘못되었습니다. 확인해 주세요");
+				this.$refs._email.focus();
+				return false;
+			}
+			if(this.isNull(this.auth)){
+				alert('권한을 선택 해주세요.');
+				this.$refs._auth.focus();
+				return false;
+			}
+			if(this.isNull(this.stat)){
+				alert('상태를 선택 해주세요.');
+				// this.$refs._auth.focus();
+				return false;
+			}
+			this.row.madangId=this.madangId;
+			this.row.name=this.userNm;
+			this.row.mdn=hp;
+			this.row.email=email;
+			if(this.insertType == 2){
+				this.row.auth='1003';
+			}else{
+				this.row.auth=this.auth;
+			}
+			this.row.stat=this.stat;
+			return true;
+		},
+		// 모달 띄우기
+		ModalOpen(insertType){
+			this.insertType=insertType;
+			var dimmed = document.getElementsByClassName('dimmed');
+			dimmed[0].style.display = 'block';
+			var wrap = document.getElementsByClassName('popup-wrap');
+			wrap[0].style.display = 'block';
+			var obj = document.getElementsByClassName('modal20');
+			obj[0].style.display = 'block';
+		},
+		// 모달 끄기
+		ModalClose(){
+			this.formReset();
+			var dimmed = document.getElementsByClassName('dimmed');
+			dimmed[0].style.display = 'none';
+			var wrap = document.getElementsByClassName('popup-wrap');
+			wrap[0].style.display = 'none';
+			var popup = document.getElementsByClassName('modal20');
+			popup[0].style.display = 'none';
+			
+		},
+		// 저장 후 부모창 호출.
+		toComplete(){
+			this.getParent('adminList').$refs.table.reloadData();
+			this.ModalClose();
+        },
+		async doInsert(){
+            if(this.doValidate() && window.confirm('등록 하시겠습니까?')){
+                try {
+					const response = await sysMgtApi.insertAdmin(this.row);
+					const result = response.data;
+					if (result != null && result.retCode == "0000") {
+						alert('저장 하였습니다.');
+						this.toComplete();
+					}
+                } catch(err) {
+                	alert("실패 하였습니다.");
+                }
+            }
+        },
+        setAuthData() {
+			// 권한 옵션.
+			api.commAuth().then(response => {
+				this.authType = response.data.data.list;
+			});
+		},
+		formReset(){
+			this.$refs.adminRegForm.reset();
+		},
+	}
+}
+</script>
+
+<style>
+	.popup-btn-wrap {width: 500px; margin: auto; padding: 100px 0;}
+	.popup-btn-wrap button {width: 100%; margin-bottom: 10px; height: 50px; border-radius: 5px; box-shadow: none; border: 1px solid #000; }
+	.popup-btn-wrap button:hover {background: #000; color: #fff;}
+</style>

frontend/src/modules/sysMgt/router/index.js

@@ -1,18 +1,18 @@
-import AustList from '../views/AuthList'
+import AustList from '../views/AuthList'
-import AdminList from '../views/AdminList'
+import AdminList from '../views/AdminList'
-
+
-export default [
+export default [
-  {
+  {
-    path: '/sysMgt/authList',    
+    path: '/sysMgt/authList',    
-    component: AustList,    
+    component: AustList,    
-    name: 'authList',     
+    name: 'authList',     
-    meta: { public: true }
+    meta: { public: true }
-  },
+  },
-  {
+  {
-    path: '/sysMgt/adminList',    
+    path: '/sysMgt/adminList',    
-    component: AdminList,    
+    component: AdminList,    
-    name: 'adminList',     
+    name: 'adminList',     
-    meta: { public: true }
+    meta: { public: true }
-  }
+  }
-]
+]
-
+

frontend/src/modules/sysMgt/service/mixins.js

@@ -0,0 +1,353 @@
+import lodash from "lodash";
+
+const utils_mixin = {
+      methods:{
+      /** * 이메일 형식 체크 * * @param 데이터 */
+      emailCheck(email,rtnArrYn) {
+          if(this.isNull(rtnArrYn)){
+            rtnArrYn='N';
+          }
+          // var regExp = /(^[A-Za-z0-9_\.\-]+)@([A-Za-z0-9\-]+\.[A-Za-z0-9\-]+)/;
+          var regExp = /^([0-9a-zA-Z_\.\-]([-_.]?[0-9a-zA-Z_\.\-])*)@([0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$)/i;//이메일 정규식
+  
+          if(regExp.test(email) == false) {
+            // 이메일 형식이 알파벳+숫자@알파벳+숫자.알파벳+숫자 형식이 아닐경우
+            if(rtnArrYn == 'Y'){
+                return email;
+              }
+            return false;
+          }else{
+              var myArray = regExp.exec(email);
+              if(rtnArrYn == 'Y'){
+                return myArray;
+              }
+              return true;
+          }
+  
+        },
+        /** * 전화번호 포맷으로 변환 * * @param 데이터 */
+        formatPhone(phoneNum,fmt,rtnArrYn) {
+          if(this.isNull(fmt)){
+            fmt='';
+          }
+          if(this.isNull(rtnArrYn)){
+            fmt='N';
+          }
+          if(this.isPhone(phoneNum)) {
+            var rtnNum;
+            var regExp =/(02)([0-9]{3,4})([0-9]{4})$/;
+            var myArray;
+            if(regExp.test(phoneNum)){
+              myArray = regExp.exec(phoneNum);
+              rtnNum = myArray[1]+fmt + myArray[2]+fmt+myArray[3];
+              if(rtnArrYn == 'Y'){
+                return myArray;
+              }
+              return rtnNum;
+            } else {
+              regExp =/(0[3-9]{1}[0-9]{1})([0-9]{3,4})([0-9]{4})$/;
+              if(regExp.test(phoneNum)){
+                myArray = regExp.exec(phoneNum);
+                rtnNum = myArray[1]+fmt+myArray[2]+fmt+myArray[3];
+                if(rtnArrYn == 'Y'){
+                  return myArray;
+                }
+                return rtnNum;
+              } else {
+                return phoneNum;
+              }
+            }
+          } else {
+            return phoneNum;
+          }
+        },
+        /** * 핸드폰번호 포맷으로 변환 * * @param 데이터 */
+        formatMobile(phoneNum,fmt,rtnArrYn) {
+  
+          if(this.isNull(fmt)){
+            fmt='';
+          }
+          if(this.isNull(rtnArrYn)){
+            fmt='N';
+          }
+          if(this.isMobile(phoneNum)) {
+  
+            var rtnNum;
+            var regExp =/(01[016789])([0-9]{3,4})([0-9]{4})$/;
+            var myArray;
+  
+            if(regExp.test(phoneNum)){
+  
+              myArray = regExp.exec(phoneNum);
+              rtnNum = myArray[1]+fmt+myArray[2]+fmt+myArray[3];
+              if(rtnArrYn == 'Y'){
+                return myArray;
+              }
+              return rtnNum;
+            } else {
+              return phoneNum;
+            }
+          } else {
+            return phoneNum;
+          }
+        },
+  
+        /** * 전화번호 형식 체크 * * @param 데이터 */
+        isPhone(phoneNum) {
+          var regExp =/(02)([0-9]{3,4})([0-9]{4})$/;
+          if(regExp.test(phoneNum)){
+            return true;
+            } else {
+              regExp =/(0[3-9]{1}[0-9]{1})([0-9]{3,4})([0-9]{4})$/;
+              if(regExp.test(phoneNum)){
+                return true;
+              } else {
+                return false;
+              }
+          }
+        },
+  
+        /** * 핸드폰번호 형식 체크 * * @param 데이터 */
+        isMobile(phoneNum) {
+          var regExp =/(01[016789])([0-9]{3,4})([0-9]{4})$/;
+          var myArray;
+          if(regExp.test(phoneNum)){
+            myArray = regExp.exec(phoneNum);
+            return true;
+          } else {
+            return false;
+          }
+        },
+        isMobile2(phoneNum) {
+          var regExp =/(1[016789])([0-9]{3,4})([0-9]{4})$/;
+          var myArray;
+          if(regExp.test(phoneNum)){
+            myArray = regExp.exec(phoneNum);
+            return true;
+          } else {
+            return false;
+          }
+        },
+  
+        isNull(obj){
+          if(lodash.isNil(obj) || lodash.trim(obj) == ''){
+            return true;
+          }
+          return false;
+        },
+        getParent(name){
+          let p = this.$parent;
+          while(typeof p !== 'undefined'){
+              if(p.$options.name == name) {
+              return p;
+              }else {
+              p = p.$parent;
+              }
+          }
+          return false;
+        },
+        getJsonObj(str){
+          return JSON.parse(JSON.stringify(str));
+        },
+      }
+  };
+  
+  var chkPattern2 = {
+      data: function () {
+          return {      
+          }
+      },
+      methods: {
+      selSesStorage(keyLike){
+        if(this.isNull(keyLike)){
+          return null;
+        }
+        if(sessionStorage.length > 0){
+          let keyList = [];
+          for(let i=0;i<sessionStorage.length;i++){
+            const keyNm = sessionStorage.key(i);
+            if(keyNm.indexOf(keyLike) > -1){
+              keyList.push({name : keyNm, value : sessionStorage.getItem(keyNm)});
+            }
+          }
+          if(keyList.length > 0){
+            return keyList;
+          }
+          return null;
+        }
+        return null;
+      },
+  
+      delSesStorage(keyList){
+        if(this.isNull(keyList)){
+          return null;
+        }
+        if(keyList.length > 0){
+          keyList.map((o) => (sessionStorage.removeItem(o.name)));
+          return true;
+        }
+      },
+  
+      setGridMouseDownActive(){
+          const ele = document.querySelector(`div.tui-grid-container.tui-grid-show-lside-area`);
+          if(window.getEventListeners(ele).mousedown){
+            ele.removeEventListener('mousedown',window.getEventListeners(ele).mousedown[0].listener);
+          }
+      },
+          restrictChars : function($event,regExp,hanYn){
+  
+        if(this.isNull(hanYn)){
+          hanYn='N';
+        }
+        if(hanYn === 'N' && $event.type === 'keydown'){
+          if($event.keyCode === 229){
+            $event.preventDefault();
+            return false;
+          }
+        }
+  
+        if($event.type === 'keypress'){
+          //한글 처리 불가
+          if(regExp.test(String.fromCharCode($event.charCode))) {
+            return true;
+          }else{
+            $event.preventDefault();
+            return false;
+          }
+        }
+  
+        if(hanYn === 'N' && ( $event.type === 'keyup' || $event.type === 'input' || $event.type === 'change' || $event.type === 'blur')){
+          $event.target.value = $event.target.value.replace(/[ㄱ-ㅎㅏ-ㅣ가-힣]/g,'');
+          $event.preventDefault();
+          return false;
+        }
+        return true;
+      },
+          setLenth: function (e, len) {
+              this.cut(e, len);
+      },
+      onlyCustom: function (e,strRegExp,hanYn) {
+        var regExp_g = new RegExp(strRegExp,'g');
+        this.cut(e);
+              return this.restrictChars(e,regExp_g,hanYn);
+      },
+      onlyCommon: function(strRegExp, e, len, isEventCall, hanYn) {
+        var regExp_g = new RegExp(strRegExp,'g');         
+        if(isEventCall === 'N'){
+          if(!this.cut(e, len, isEventCall)){
+            return false;
+          }
+          if(!regExp_g.test(e.value)){
+            return false;
+          }
+          return true;
+        }
+        this.cut(e, len);
+              return this.restrictChars(e,regExp_g,hanYn);
+      },
+          onlyNum: function (e, len, isEventCall) {
+        var strRegExp = '^[0-9]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+          },
+          onlyEng: function (e, len, isEventCall) {
+        var strRegExp = '^[A-Za-z]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+      },
+      onlyLowerEng: function (e, len, isEventCall) {
+        var strRegExp = '^[a-z]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+      },
+      onlyUpperEng: function (e, len, isEventCall) {
+        var strRegExp = '^[A-Z]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+          },
+          onlyEmail: function (e, len, isEventCall) {
+        var strRegExp = '^[a-zA-Z0-9_\.\-@._-]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+          },
+          onlyName: function (e, len, isEventCall) {
+        var strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall,'Y');
+          },
+          onlyTitle: function (e, len, isEventCall) {
+        var strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z0-9]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall,'Y');
+          },
+          onlyText: function (e, len, isEventCall) {
+        var strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z0-9_-]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall,'Y');
+          },
+          onlyPassword: function (e, len, isEventCall) {
+        var strRegExp = '^[A-Za-z0-9!@#$%^&*]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+          },
+          onlyId: function (e, len, isEventCall) {
+        var strRegExp = '^[A-Za-z0-9_\.\-]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+          },
+          onlyIp: function (e, len, isEventCall) {
+        var strRegExp = '^[0-9,.*]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+          },
+          onlyRoleNm_Space: function (e, len, isEventCall) {
+        var strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z0-9]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall,'Y');
+          },
+          onlyRoleId_UnderBar: function (e, len, isEventCall) {
+        var strRegExp = '^[a-zA-Z0-9_]*$';
+        return this.onlyCommon(strRegExp, e, len, isEventCall);
+      },    
+          cut: function (ele, len, isValidChk) {
+        let e=ele;
+        if (typeof ele.target != "undefined") {
+          e=ele.target;
+        }
+        let max = this.isNull(len) ? e.attributes.maxlength.value : len;      
+        let str = e.value;
+  
+        if (this.bytes(str) > max) {
+          if(this.isNull(isValidChk)){
+            e.value = this.cutBytes(str, max);
+          }
+          return false;
+        }			
+        return true;
+          },
+          cutBytes: function (str, len) {
+        while(1 === 1){
+          if(this.bytes(str) <= len){
+            return str;
+          }
+          str = str.slice(0,-1);
+        }
+          },
+          bytes: function (str) {
+              var length = ((s,b,i,c) => {
+            // for(b=i=0;c=s.charCodeAt(i++);b+=c>>11?3:c>>7?2:1);  // 한글 3바이트
+            // for(b=i=0;c=s.charCodeAt(i++);b+=c>>11?2:c>>7?1:1);     //한글 2바이트
+          b=0,i=0;
+          while(1 === 1){          
+            c = s.charCodeAt(i++);
+            if (isNaN(c)) {
+              break;
+            }
+            b += c >> 11 ? 2 : c >> 7 ? 1 : 1;
+          }
+          return b
+        })(str);
+              return length;
+          },
+          checkPhone: function(str) {
+              str = str.replace(/[-\s]+/g, '');
+              if (str.charAt(0)!="0"){
+                  str = "0"+str;
+              }
+              if (str.length<10||str.length>12){return "";}
+              if (isNaN(str)){return "";	}
+              if (str.substr(0,2)!="01" && str.substr(0,3)!="070"  && str.substr(0,4)!="0505" && str.substr(0,4)!="0503"){return "";	}
+              return str;
+  
+          },
+      }
+  };
+  export { utils_mixin, chkPattern2 };

frontend/src/modules/sysMgt/service/sysMgtApi.js

@@ -0,0 +1,28 @@
+import httpClient from '@/common/http-client';
+
+// HUBEZ_BO_API_4003 - 관리자 등록.
+const insertAdmin = (params) => {
+    return httpClient.post('/api/v1/bo/sysMgt/insertAdmin', params, { withCredentials: false });
+}
+
+// HUBEZ_BO_API_4004 - 관리자 수정.
+const updateAdmin = (params) => {
+    return httpClient.post('/api/v1/bo/sysMgt/updateAdmin', params, { withCredentials: false });
+}
+
+// HUBEZ_BO_API_4005 - 관리자 삭제
+const deleteAdmin = (params) => {
+    return httpClient.post('/api/v1/bo/sysMgt/deleteAdmin', params, { withCredentials: false });
+}
+
+// HUBEZ_BO_API_4006 - 관리자 정보 상세 조회.
+const adminDetail = (params) => {
+    return httpClient.post('/api/v1/bo/sysMgt/adminDetail', params, { withCredentials: false });
+}
+
+export default {
+    insertAdmin,
+    updateAdmin,
+    deleteAdmin,
+    adminDetail
+  }

frontend/src/modules/sysMgt/service/utils_mixin.js

@@ -0,0 +1,373 @@
+import lodash from "lodash";
+import moment from "moment";
+import '@/modules/mgt/components/eventlisteners.js';
+
+const filter_mixin = {
+  filters: {
+    _yyyy_mm_dd(val){
+      if(lodash.isNil(val) || lodash.trim(val) == '') return '';
+      const orgin = val;
+      if(orgin.length < 8) {
+        return orgin;
+      }
+      if(!Number(orgin)) return orgin;
+      const date = orgin.substring(0,8);
+      if(moment(date).isValid()){
+        return moment(date).format('YYYY[-]MM[-]DD');
+      }
+      return orgin;
+    }
+  },
+}
+
+const utils_mixin = {
+    methods:{
+    /** * 이메일 형식 체크 * * @param 데이터 */
+    emailCheck(email,rtnArrYn) {
+        if(this.isNull(rtnArrYn)){
+          rtnArrYn='N';
+        }
+        // var regExp = /(^[A-Za-z0-9_\.\-]+)@([A-Za-z0-9\-]+\.[A-Za-z0-9\-]+)/;
+        var regExp = /^([0-9a-zA-Z_\.\-]([-_.]?[0-9a-zA-Z_\.\-])*)@([0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$)/i;//이메일 정규식
+
+        if(regExp.test(email) == false) {
+          // 이메일 형식이 알파벳+숫자@알파벳+숫자.알파벳+숫자 형식이 아닐경우
+          if(rtnArrYn == 'Y'){
+              return email;
+            }
+          return false;
+        }else{
+            var myArray = regExp.exec(email);
+            if(rtnArrYn == 'Y'){
+              return myArray;
+            }
+            return true;
+        }
+
+      },
+      /** * 전화번호 포맷으로 변환 * * @param 데이터 */
+      formatPhone(phoneNum,fmt,rtnArrYn) {
+        if(this.isNull(fmt)){
+          fmt='';
+        }
+        if(this.isNull(rtnArrYn)){
+          fmt='N';
+        }
+        if(this.isPhone(phoneNum)) {
+          var rtnNum;
+          var regExp =/(02)([0-9]{3,4})([0-9]{4})$/;
+          var myArray;
+          if(regExp.test(phoneNum)){
+            myArray = regExp.exec(phoneNum);
+            rtnNum = myArray[1]+fmt + myArray[2]+fmt+myArray[3];
+            if(rtnArrYn == 'Y'){
+              return myArray;
+            }
+            return rtnNum;
+          } else {
+            regExp =/(0[3-9]{1}[0-9]{1})([0-9]{3,4})([0-9]{4})$/;
+            if(regExp.test(phoneNum)){
+              myArray = regExp.exec(phoneNum);
+              rtnNum = myArray[1]+fmt+myArray[2]+fmt+myArray[3];
+              if(rtnArrYn == 'Y'){
+                return myArray;
+              }
+              return rtnNum;
+            } else {
+              return phoneNum;
+            }
+          }
+        } else {
+          return phoneNum;
+        }
+      },
+      /** * 핸드폰번호 포맷으로 변환 * * @param 데이터 */
+      formatMobile(phoneNum,fmt,rtnArrYn) {
+
+        if(this.isNull(fmt)){
+          fmt='';
+        }
+        if(this.isNull(rtnArrYn)){
+          fmt='N';
+        }
+        if(this.isMobile(phoneNum)) {
+
+          var rtnNum;
+          var regExp =/(01[016789])([0-9]{3,4})([0-9]{4})$/;
+          var myArray;
+
+          if(regExp.test(phoneNum)){
+
+            myArray = regExp.exec(phoneNum);
+            rtnNum = myArray[1]+fmt+myArray[2]+fmt+myArray[3];
+            if(rtnArrYn == 'Y'){
+              return myArray;
+            }
+            return rtnNum;
+          } else {
+            return phoneNum;
+          }
+        } else {
+          return phoneNum;
+        }
+      },
+
+      /** * 전화번호 형식 체크 * * @param 데이터 */
+      isPhone(phoneNum) {
+        var regExp =/(02)([0-9]{3,4})([0-9]{4})$/;
+        if(regExp.test(phoneNum)){
+          return true;
+          } else {
+            regExp =/(0[3-9]{1}[0-9]{1})([0-9]{3,4})([0-9]{4})$/;
+            if(regExp.test(phoneNum)){
+              return true;
+            } else {
+              return false;
+            }
+        }
+      },
+
+      /** * 핸드폰번호 형식 체크 * * @param 데이터 */
+      isMobile(phoneNum) {
+        var regExp =/(01[016789])([0-9]{3,4})([0-9]{4})$/;
+        var myArray;
+        if(regExp.test(phoneNum)){
+          myArray = regExp.exec(phoneNum);
+          return true;
+        } else {
+          return false;
+        }
+      },
+      isMobile2(phoneNum) {
+        var regExp =/(1[016789])([0-9]{3,4})([0-9]{4})$/;
+        var myArray;
+        if(regExp.test(phoneNum)){
+          myArray = regExp.exec(phoneNum);
+          return true;
+        } else {
+          return false;
+        }
+      },
+
+      isNull(obj){
+        if(lodash.isNil(obj) || lodash.trim(obj) == ''){
+          return true;
+        }
+        return false;
+      },
+      getParent(name){
+        let p = this.$parent;
+        while(typeof p !== 'undefined'){
+            if(p.$options.name == name) {
+            return p;
+            }else {
+            p = p.$parent;
+            }
+        }
+        return false;
+      },
+      getJsonObj(str){
+        return JSON.parse(JSON.stringify(str));
+      },
+    }
+};
+
+var chkPattern2 = {
+	data: function () {
+		return {      
+		}
+	},
+	methods: {
+    selSesStorage(keyLike){
+      if(this.isNull(keyLike)){
+        return null;
+      }
+      if(sessionStorage.length > 0){
+        let keyList = [];
+        for(let i=0;i<sessionStorage.length;i++){
+          const keyNm = sessionStorage.key(i);
+          if(keyNm.indexOf(keyLike) > -1){
+            keyList.push({name : keyNm, value : sessionStorage.getItem(keyNm)});
+          }
+        }
+        if(keyList.length > 0){
+          return keyList;
+        }
+        return null;
+      }
+      return null;
+    },
+
+    delSesStorage(keyList){
+      if(this.isNull(keyList)){
+        return null;
+      }
+      if(keyList.length > 0){
+        keyList.map((o) => (sessionStorage.removeItem(o.name)));
+        return true;
+      }
+    },
+
+    setGridMouseDownActive(){
+        const ele = document.querySelector(`div.tui-grid-container.tui-grid-show-lside-area`);
+        if(window.getEventListeners(ele).mousedown){
+          ele.removeEventListener('mousedown',window.getEventListeners(ele).mousedown[0].listener);
+        }
+    },
+		restrictChars : function($event,regExp,hanYn){
+
+      if(this.isNull(hanYn)){
+        hanYn='N';
+      }
+      if(hanYn === 'N' && $event.type === 'keydown'){
+        if($event.keyCode === 229){
+          $event.preventDefault();
+          return false;
+        }
+      }
+
+      if($event.type === 'keypress'){
+        //한글 처리 불가
+        if(regExp.test(String.fromCharCode($event.charCode))) {
+          return true;
+        }else{
+          $event.preventDefault();
+          return false;
+        }
+      }
+
+      if(hanYn === 'N' && ( $event.type === 'keyup' || $event.type === 'input' || $event.type === 'change' || $event.type === 'blur')){
+        $event.target.value = $event.target.value.replace(/[ㄱ-ㅎㅏ-ㅣ가-힣]/g,'');
+        $event.preventDefault();
+        return false;
+      }
+      return true;
+    },
+		setLenth: function (e, len) {
+			this.cut(e, len);
+    },
+    onlyCustom: function (e,strRegExp,hanYn) {
+      var regExp_g = new RegExp(strRegExp,'g');
+      this.cut(e);
+			return this.restrictChars(e,regExp_g,hanYn);
+    },
+    onlyCommon: function(strRegExp, e, len, isEventCall, hanYn) {
+      var regExp_g = new RegExp(strRegExp,'g');         
+      if(isEventCall === 'N'){
+        if(!this.cut(e, len, isEventCall)){
+          return false;
+        }
+        if(!regExp_g.test(e.value)){
+          return false;
+        }
+        return true;
+      }
+      this.cut(e, len);
+			return this.restrictChars(e,regExp_g,hanYn);
+    },
+		onlyNum: function (e, len, isEventCall) {
+      var strRegExp = '^[0-9]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+		},
+		onlyEng: function (e, len, isEventCall) {
+      var strRegExp = '^[A-Za-z]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+    },
+    onlyLowerEng: function (e, len, isEventCall) {
+      var strRegExp = '^[a-z]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+    },
+    onlyUpperEng: function (e, len, isEventCall) {
+      var strRegExp = '^[A-Z]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+		},
+		onlyEmail: function (e, len, isEventCall) {
+      var strRegExp = '^[a-zA-Z0-9_\.\-@._-]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+		},
+		onlyName: function (e, len, isEventCall) {
+      var strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall,'Y');
+		},
+		onlyTitle: function (e, len, isEventCall) {
+      var strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z0-9]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall,'Y');
+		},
+		onlyText: function (e, len, isEventCall) {
+      var strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z0-9_-]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall,'Y');
+		},
+		onlyPassword: function (e, len, isEventCall) {
+      var strRegExp = '^[A-Za-z0-9!@#$%^&*]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+		},
+		onlyId: function (e, len, isEventCall) {
+      var strRegExp = '^[A-Za-z0-9_\.\-]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+		},
+		onlyIp: function (e, len, isEventCall) {
+      var strRegExp = '^[0-9,.*]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+		},
+		onlyRoleNm_Space: function (e, len, isEventCall) {
+      var strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z0-9]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall,'Y');
+		},
+		onlyRoleId_UnderBar: function (e, len, isEventCall) {
+      var strRegExp = '^[a-zA-Z0-9_]*$';
+      return this.onlyCommon(strRegExp, e, len, isEventCall);
+    },    
+		cut: function (ele, len, isValidChk) {
+      let e=ele;
+      if (typeof ele.target != "undefined") {
+        e=ele.target;
+      }
+      let max = this.isNull(len) ? e.attributes.maxlength.value : len;      
+      let str = e.value;
+
+      if (this.bytes(str) > max) {
+        if(this.isNull(isValidChk)){
+          e.value = this.cutBytes(str, max);
+        }
+        return false;
+      }			
+      return true;
+		},
+		cutBytes: function (str, len) {
+      while(1 === 1){
+        if(this.bytes(str) <= len){
+          return str;
+        }
+        str = str.slice(0,-1);
+      }
+		},
+		bytes: function (str) {
+			var length = ((s,b,i,c) => {
+          // for(b=i=0;c=s.charCodeAt(i++);b+=c>>11?3:c>>7?2:1);  // 한글 3바이트
+          // for(b=i=0;c=s.charCodeAt(i++);b+=c>>11?2:c>>7?1:1);     //한글 2바이트
+        b=0,i=0;
+        while(1 === 1){          
+          c = s.charCodeAt(i++);
+          if (isNaN(c)) {
+            break;
+          }
+          b += c >> 11 ? 2 : c >> 7 ? 1 : 1;
+        }
+        return b
+      })(str);
+			return length;
+		},
+		checkPhone: function(str) {
+			str = str.replace(/[-\s]+/g, '');
+			if (str.charAt(0)!="0"){
+				str = "0"+str;
+			}
+			if (str.length<10||str.length>12){return "";}
+			if (isNaN(str)){return "";	}
+			if (str.substr(0,2)!="01" && str.substr(0,3)!="070"  && str.substr(0,4)!="0505" && str.substr(0,4)!="0503"){return "";	}
+			return str;
+
+		},
+	}
+};
+export { utils_mixin, chkPattern2, filter_mixin };

frontend/src/modules/sysMgt/views/AdminList.vue

@@ -1,107 +1,273 @@
-<template>
+<template>
-	<div class="contents">
+	<div class="contents">
-		<div class="contents_wrap">
+		<div class="contents_wrap">
-			<div class="top_wrap">
+			<div class="top_wrap">
-				<h3 class="title">관리자 목록 조회</h3>
+				<h3 class="title">관리자/유치채널 관리</h3>
-				<p class="breadcrumb">시스템관리 &gt; 권한 관리</p>
+				<p class="breadcrumb">시스템관리 &gt; 관리자/유치채널 관리</p>
-			</div>
+			</div>
-			<div class="info">
+			<form autocomplete="off" class="search_form">
-				<div class="count">총 <span>4</span>건</div>
+					<div class="search_wrap">
-				<div class="button_group">
+						<div class="select_box">
-					<button type="button" class="button blue add" onclick="location.href='system_right_add.html';">권한 추가</button>
+							<label for="right" class="label">권한</label>
-				</div>
+							<select name="" id="right" v-model="grid.params.searchType1" @keyup.enter="search">
-			</div>
+								<option value="">전체</option>
-			<div class="table">
+								<option v-for="(option, i) in authType" v-bind:value="option.autCd" v-bind:key="i">
-				<table>
+									{{ option.autNm }}
-					<colgroup>
+								</option>
-						<col width="10%"/>
+							</select>
-						<col width="20%"/>
+						</div>
-						<col width="20%"/>
+						<div class="select_box">
-						<col width="15%"/>
+							<label for="right" class="label">상태</label>
-						<col width="20%"/>
+							<select name="" id="" v-model="grid.params.searchType2" @keyup.enter="search">
-						<col width="15%"/>
+								<option value="" selected>전체</option>
-					</colgroup>
+								<option v-for="(option, i) in statType" v-bind:value="option.code" v-bind:key="i">
-					<thead>
+									{{ option.codeNm }}
-						<tr>
+								</option>
-							<th>NO</th>
+							</select>
-							<th>코드</th>
+						</div>
-							<th>권한명</th>
+						<div class="input_box id">
-							<th>상태</th>
+							<label for="id1" class="label">ID</label>
-							<th>등록일</th>
+                            <input type="text" id="id1" placeholder="검색어 입력" v-model="grid.params.searchText1" @keyup.enter="search"/>
-							<th></th>
+						</div>
-						</tr>
+						<div class="input_box">
-					</thead>
+							<label for="name" class="label">이름(대리점명)</label>
-					<tbody>
+                            <input type="text" id="name" placeholder="검색어 입력" v-model="grid.params.searchText2" @keyup.enter="search"/>
-						<tr>
+						</div>
-							<td>4</td>
+						<button type="button" class="button grey" @click="search">조회</button>
-							<td>Admin_01</td>
+					</div>
-							<td>슈퍼관리자</td>
+				</form>
-							<td>사용</td>
+				<div class="info">
-							<td>2022-03-10</td>
+					<div class="count">총 <span>{{ totalItems }}</span>건</div>
-							<td class="two_btn_group">
+					<div class="button_group">
-								<button type="button" class="button grey" onclick="location.href='system_right_modify.html';">수정</button>
+						<button type="button" class="button blue admin add" @click="adminRegPopOpen();">관리자 등록</button>
-								<button type="button" class="button white delete">삭제</button>
+						<button type="button" class="button blue channel add" @click="adminReg2PopOpen();">유치채널 등록</button>
-							</td>
+						<button type="button" class="button white delete del" @click="deleteRow();">삭제</button>
-						</tr>
+					</div>
-						<tr>
+				</div>
-							<td>3</td>
+				<div class="table">
-							<td>Admin_01</td>
+					<custom-grid
-							<td>슈퍼관리자</td>
+						ref="table"
-							<td>사용</td>
+						:totalItems="'totalItems'"
-							<td>2022-03-10</td>
+						:url="grid.url"
-							<td class="two_btn_group">
+						:pagePerRows="grid.pagePerRows"
-								<button type="button" class="button grey">수정</button>
+						:initialRequest="grid.initialRequest"
-								<button type="button" class="button white delete">삭제</button>
+						:pagination="grid.pagination"
-							</td>
+						:isCheckbox="grid.isCheckbox"
-						</tr>
+						:columns="grid.columns"
-						<tr>
+						:noDataStr="grid.noDataStr"
-							<td>2</td>
+						:addCls="grid.addCls"
-							<td>Admin_01</td>
+						:header="grid.headder"        
-							<td>슈퍼관리자</td>
+					></custom-grid>
-							<td>사용</td>
+				</div>
-							<td>2022-03-10</td>
+		    <admin-reg-pop ref="adminRegModal"> </admin-reg-pop>
-							<td class="two_btn_group">
+        <!-- <admin-reg2-pop ref="adminReg2Modal"> </admin-reg2-pop> -->
-								<button type="button" class="button grey">수정</button>
+        <admin-detail-pop ref="adminDetailModal"> </admin-detail-pop>
-								<button type="button" class="button white delete">삭제</button>
+		</div>
-							</td>
+	</div>
-						</tr>
+</template>
-						<tr>
+
-							<td>1</td>
+<script>
-							<td>Admin_01</td>
+import customGrid from '@/components/CustomGrid';
-							<td>슈퍼관리자</td>
+import AdminRegPop from '../components/AdminRegPop';
-							<td>사용</td>
+//import AdminReg2Pop from '../components/AdminReg2Pop';
-							<td>2022-03-10</td>
+import AdminDetailPop from '../components/AdminDetailPop';
-							<td class="two_btn_group">
+import api from '@/service/api.js';
-								<button type="button" class="button grey">수정</button>
+import sysMgtApi from "../service/sysMgtApi.js";
-								<button type="button" class="button white delete">삭제</button>
+
-							</td>
+
-						</tr>
+class CustomATagRenderer {
-					</tbody>
+    constructor(props) {
-				</table>
+        this.props = props;
-			</div>
+        const el = document.createElement('a');
-		</div>
+        el.href = 'javascript:void(0);';
-	</div>
+        el.className = 'btn_text';
-</template>
+        el.innerText= String(props.colValue)
-
+        this.el = el;
-<script>
+    }
-export default {
+
-  name: 'authList',
+    getElement() {
-  data() {
+        return this.el;
-    return {
+    }
-      
+
-    };
+    addEvent(selEl) {
-  },  
+        selEl.addEventListener("click", () => {
-  components: {
+            const { callback } = this.props["cgrido" + this.props.colName].options;
-    
+            callback(this.props);
-  },
+        });
-  destroyed() {
+    }
-      
+}
-  },
+
-  mounted() {
+export default {
-    
+  name: 'adminList',
-  },
+  data() {
-  methods: {
+    return {
-    
+	    row: {},
-  }
+      authType: [],
-};
+	    statType: [],
+      cate2Code: "",
+      totalItems: 0,
+      // 테이블 리스트 데이터
+      perPageCnt: 20,
+      grid: {
+        url: '/api/v1/bo/sysMgt/adminList',
+        pagePerRows: 20,
+        pagination: true,           
+        isCheckbox: true,        // true:첫번째 컬럼 앞에 체크박스 생성 / false:체크박스 제거
+        initialRequest: false,
+        addCls: 'box_OFvis',
+
+        columns: [          
+          { name: 'no', header: 'No', align: 'center', width: 60},
+          { name: 'auth', header: '권한', align: 'center', width: 160 },
+          { name: 'name', header: '이름(대리점명)', align: 'center', width: 130, renderer: {
+              type: CustomATagRenderer
+              , options: {
+                  callback: this.detailPop,
+              }
+            }
+          },
+          { name: 'adminId', header: 'ID', align: 'center', width: 130},
+          { name: 'adminStat', header: '상태', align: 'center', width: 130, cls: 'td_line'},
+          { name: 'regDt', header: '등록일', align: 'center', width: 130}
+        ],
+        noDataStr: '검색 결과가 없습니다.',        
+        params: {
+          searchType1: '',
+          searchType2: '',
+          searchText1: '',
+          searchText2: ''
+		},
+        excelHeader: []
+      }    
+    };
+  },  
+  components: {
+	customGrid: customGrid, 
+   // SystemPopup,
+    AdminRegPop,
+    //AdminReg2Pop,
+    AdminDetailPop
+  },
+  created(){            
+    this.$store.commit("login/isLogin", true);
+    this.$store.commit("login/isAuthChk", true);
+	  this.setCodeData();    	
+    //let cont = document.querySelector(".wrap");      
+    //cont.classList.add("main_wrap");
+  }, 
+  destroyed() {
+      
+  },
+  mounted() {
+    let page = 1;
+    // 페이지 정보 및 검색 조건
+    const getCondition = this.$store.getters['searchcondition/getSearchCondition'];
+    console.log('getCondition : '+getCondition);
+
+	// store에 저장된 페이지 정보 및 검색 조건을 불러오기
+    let isKeep = false;
+    if (getCondition) {
+      this.grid.pagePerRows = getCondition.perPage;
+      this.grid.params = getCondition.params;      
+      page = getCondition.page;
+      isKeep = true;
+    }
+    this.search(isKeep);   
+  },
+  methods: {
+	search: function(isKeep) {
+      console.log('this.perPageCnt'+this.perPageCnt);
+      //console.log(this.grid.params);	  
+      this.$refs.table.search(this.grid.params, isKeep);
+      this.sendStoreData();
+    },
+    detailPop(props) {
+        // this.getMainSlot().popupView(4);
+        // this.setDtlPpPrm(props);
+        this.$refs.adminDetailModal.adminDetailModalOpen(props);
+    },
+    ModalOpen: function(target){      
+      //this.$refs.systemModal.ModalOpen(target);
+    },
+    adminRegPopOpen: function(){
+      this.$refs.adminRegModal.ModalOpen(1);
+    },
+    adminReg2PopOpen: function(){
+      this.$refs.adminRegModal.ModalOpen(2);
+      //this.$refs.adminReg2Modal.adminReg2ModalOpen();//
+    },
+    doValidate(){ //로우데이터 삭제하도록 수정
+      
+      console.log("totalItems >> " + this.totalItems);
+      if(this.totalItems == 0){
+        alert('검색 결과가 없습니다.');
+        return false;
+      }
+      var chkList = this.$refs.table.checkedElementDatas();
+      if(chkList.length == 0){
+        alert('체크박스에 체크를 해주세요.');
+        return false;
+      }
+        // for(var i = 0; i < chkList.length; i++){
+        //   alert(chkList[i].adminId);
+        // }
+      const param = chkList.map((row)=>({adminId:row.adminId}));
+      this.row.list = param;
+      console.log(this.row);
+      return true;
+    },
+	sendStoreData: function() {
+      const getP = this.$refs.table.getPagination();
+      console.log("==========getP : " + getP);
+      this.$store.commit('searchcondition/updateSearchCondition', {
+        page: getP._currentPage,        
+		perPage: this.perPageCnt,        
+        params: this.grid.params
+      });
+
+      const getCondition = this.$store.getters['searchcondition/getSearchCondition'];
+      //console.log("getCondition : "+ getCondition.perPage);
+    },
+	setCodeData() {
+
+	  // 상태 옵션 셋팅.
+      api.commCode({'grpCd' : 'ADM_STTUS_CD'}).then(response => {
+		    this.statType = response.data.data.list;
+      });
+	  api.commAuth().then(response => {
+		    this.authType = response.data.data.list;
+      });
+    },
+    async deleteRow(){
+      if(this.doValidate() && window.confirm('삭제 하시겠습니까?')){
+        try {
+            let response = await sysMgtApi.deleteAdmin(this.row);
+            const result = response.data;
+            if (result != null && result.retCode == "0000") {
+              alert('삭제 하였습니다.');
+              // grid.reloadData();
+              this.$refs.table.reloadData();
+              return;
+            }
+            alert("실패 하였습니다.");
+        } catch(err) {
+            alert("실패 하였습니다.");
+        }
+      }
+    },
+  },
+  
+  beforeRouteLeave(to, from, next) {
+	
+	const getP = this.$refs.table.getPagination();
+	console.log("==========getP : " + getP._currentPage);
+	this.$store.commit('searchcondition/updateSearchCondition', {
+	  page: getP._currentPage,        
+	  perPage: this.perPageCnt,        
+	  params: this.grid.params
+	});  
+	// 라우트 하기전 실행 
+	next();
+  }
+};
 </script>

frontend/src/modules/sysMgt/views/AuthList.vue

@@ -1,107 +1,107 @@
-<template>
+<template>
-	<div class="contents">
+	<div class="contents">
-		<div class="contents_wrap">
+		<div class="contents_wrap">
-			<div class="top_wrap">
+			<div class="top_wrap">
-				<h3 class="title">권한 관리</h3>
+				<h3 class="title">권한 관리</h3>
-				<p class="breadcrumb">시스템관리 &gt; 권한 관리</p>
+				<p class="breadcrumb">시스템관리 &gt; 권한 관리</p>
-			</div>
+			</div>
-			<div class="info">
+			<div class="info">
-				<div class="count">총 <span>4</span>건</div>
+				<div class="count">총 <span>4</span>건</div>
-				<div class="button_group">
+				<div class="button_group">
-					<button type="button" class="button blue add" onclick="location.href='system_right_add.html';">권한 추가</button>
+					<button type="button" class="button blue add" onclick="location.href='system_right_add.html';">권한 추가</button>
-				</div>
+				</div>
-			</div>
+			</div>
-			<div class="table">
+			<div class="table">
-				<table>
+				<table>
-					<colgroup>
+					<colgroup>
-						<col width="10%"/>
+						<col width="10%"/>
-						<col width="20%"/>
+						<col width="20%"/>
-						<col width="20%"/>
+						<col width="20%"/>
-						<col width="15%"/>
+						<col width="15%"/>
-						<col width="20%"/>
+						<col width="20%"/>
-						<col width="15%"/>
+						<col width="15%"/>
-					</colgroup>
+					</colgroup>
-					<thead>
+					<thead>
-						<tr>
+						<tr>
-							<th>NO</th>
+							<th>NO</th>
-							<th>코드</th>
+							<th>코드</th>
-							<th>권한명</th>
+							<th>권한명</th>
-							<th>상태</th>
+							<th>상태</th>
-							<th>등록일</th>
+							<th>등록일</th>
-							<th></th>
+							<th></th>
-						</tr>
+						</tr>
-					</thead>
+					</thead>
-					<tbody>
+					<tbody>
-						<tr>
+						<tr>
-							<td>4</td>
+							<td>4</td>
-							<td>Admin_01</td>
+							<td>Admin_01</td>
-							<td>슈퍼관리자</td>
+							<td>슈퍼관리자</td>
-							<td>사용</td>
+							<td>사용</td>
-							<td>2022-03-10</td>
+							<td>2022-03-10</td>
-							<td class="two_btn_group">
+							<td class="two_btn_group">
-								<button type="button" class="button grey" onclick="location.href='system_right_modify.html';">수정</button>
+								<button type="button" class="button grey" onclick="location.href='system_right_modify.html';">수정</button>
-								<button type="button" class="button white delete">삭제</button>
+								<button type="button" class="button white delete">삭제</button>
-							</td>
+							</td>
-						</tr>
+						</tr>
-						<tr>
+						<tr>
-							<td>3</td>
+							<td>3</td>
-							<td>Admin_01</td>
+							<td>Admin_01</td>
-							<td>슈퍼관리자</td>
+							<td>슈퍼관리자</td>
-							<td>사용</td>
+							<td>사용</td>
-							<td>2022-03-10</td>
+							<td>2022-03-10</td>
-							<td class="two_btn_group">
+							<td class="two_btn_group">
-								<button type="button" class="button grey">수정</button>
+								<button type="button" class="button grey">수정</button>
-								<button type="button" class="button white delete">삭제</button>
+								<button type="button" class="button white delete">삭제</button>
-							</td>
+							</td>
-						</tr>
+						</tr>
-						<tr>
+						<tr>
-							<td>2</td>
+							<td>2</td>
-							<td>Admin_01</td>
+							<td>Admin_01</td>
-							<td>슈퍼관리자</td>
+							<td>슈퍼관리자</td>
-							<td>사용</td>
+							<td>사용</td>
-							<td>2022-03-10</td>
+							<td>2022-03-10</td>
-							<td class="two_btn_group">
+							<td class="two_btn_group">
-								<button type="button" class="button grey">수정</button>
+								<button type="button" class="button grey">수정</button>
-								<button type="button" class="button white delete">삭제</button>
+								<button type="button" class="button white delete">삭제</button>
-							</td>
+							</td>
-						</tr>
+						</tr>
-						<tr>
+						<tr>
-							<td>1</td>
+							<td>1</td>
-							<td>Admin_01</td>
+							<td>Admin_01</td>
-							<td>슈퍼관리자</td>
+							<td>슈퍼관리자</td>
-							<td>사용</td>
+							<td>사용</td>
-							<td>2022-03-10</td>
+							<td>2022-03-10</td>
-							<td class="two_btn_group">
+							<td class="two_btn_group">
-								<button type="button" class="button grey">수정</button>
+								<button type="button" class="button grey">수정</button>
-								<button type="button" class="button white delete">삭제</button>
+								<button type="button" class="button white delete">삭제</button>
-							</td>
+							</td>
-						</tr>
+						</tr>
-					</tbody>
+					</tbody>
-				</table>
+				</table>
-			</div>
+			</div>
-		</div>
+		</div>
-	</div>
+	</div>
-</template>
+</template>
-
+
-<script>
+<script>
-export default {
+export default {
-  name: 'authList',
+  name: 'authList',
-  data() {
+  data() {
-    return {
+    return {
-      
+      
-    };
+    };
-  },  
+  },  
-  components: {
+  components: {
-    
+    
-  },
+  },
-  destroyed() {
+  destroyed() {
-      
+      
-  },
+  },
-  mounted() {
+  mounted() {
-    
+    
-  },
+  },
-  methods: {
+  methods: {
-    
+    
-  }
+  }
-};
+};
 </script>

frontend/src/router.js

@@ -1,97 +1,97 @@
-import Vue from 'vue';
+import Vue from 'vue';
-import Router from 'vue-router';
+import Router from 'vue-router';
-import searchcondition from './store'
+import searchcondition from './store'
-import tokenSvc from '@/common/token-service';
+import tokenSvc from '@/common/token-service';
-
+
-import HubwebLayout from './views/HubwebLayout.vue';
+import HubwebLayout from './views/HubwebLayout.vue';
-
+
-
+
-import loginRoutes from './modules/login/router';
+import loginRoutes from './modules/login/router';
-import custRoutes from './modules/custMgt/router';
+import custRoutes from './modules/custMgt/router';
-import authRoutes from './modules/sysMgt/router';
+import authRoutes from './modules/sysMgt/router';
-
+
-import custList from './modules/custMgt/views/CustList';
+import custList from './modules/custMgt/views/CustList';
-import channelRoutes from './modules/attractMgt/router';
+import channelRoutes from './modules/attractMgt/router';
-import rejectRoutes from './modules/servMgt/router';
+import rejectRoutes from './modules/servMgt/router';
-import clacRoutes from './modules/calculate/router';
+import clacRoutes from './modules/calculate/router';
-import templtRoutes from './modules/channelMgt/router';
+import templtRoutes from './modules/channelMgt/router';
-import profileRoutes from './modules/sendNumMgt/router';
+import profileRoutes from './modules/sendNumMgt/router';
-import mntrngRoutes from './modules/mntrng/router';
+import mntrngRoutes from './modules/mntrng/router';
-import riskmgtRoutes from './modules/riskMgt/router';
+import riskmgtRoutes from './modules/riskMgt/router';
-import monthRoutes from './modules/stats/router';
+import monthRoutes from './modules/stats/router';
-// import channelList from './modules/attractMgt/views/ChannelList';
+// import channelList from './modules/attractMgt/views/ChannelList';
-
+
-Vue.use(Router)
+Vue.use(Router)
-
+
-const router = new Router({
+const router = new Router({
-  mode: 'history',
+  mode: 'history',
-  base: process.env.BASE_URL,
+  base: process.env.BASE_URL,
-  routes: [
+  routes: [
-    {
+    {
-      path: '/',
+      path: '/',
-      component: HubwebLayout,
+      component: HubwebLayout,
-      children: [
+      children: [
-          {
+          {
-            path: '',
+            path: '',
-            component: custList
+            component: custList
-          },
+          },
-        //  {
+        //  {
-        //    path: '/attractMgt/views',
+        //    path: '/attractMgt/views',
-        //    component: channelList
+        //    component: channelList
-        //  },
+        //  },
-        {
+        {
-          path: '/view/error/404',
+          path: '/view/error/404',
-          component: () => import('./views/ErrorPage404.vue'),
+          component: () => import('./views/ErrorPage404.vue'),
-          meta: { public: true }
+          meta: { public: true }
-        },
+        },
-        {
+        {
-          path: '/view/error/500',
+          path: '/view/error/500',
-          component: () => import('./views/ErrorPage500.vue'),
+          component: () => import('./views/ErrorPage500.vue'),
-          meta: { public: true }
+          meta: { public: true }
-        },
+        },
-        ...loginRoutes,
+        ...loginRoutes,
-        ...custRoutes,
+        ...custRoutes,
-        ...authRoutes,   
+        ...authRoutes,   
-        ...channelRoutes, 
+        ...channelRoutes, 
-        ...rejectRoutes,
+        ...rejectRoutes,
-        ...clacRoutes,
+        ...clacRoutes,
-        ...templtRoutes,
+        ...templtRoutes,
-        ...profileRoutes,
+        ...profileRoutes,
-        ...mntrngRoutes,
+        ...mntrngRoutes,
-        ...riskmgtRoutes,
+        ...riskmgtRoutes,
-        ...monthRoutes,
+        ...monthRoutes,
-        
+        
-
+
-
+
-
+
-      ]
+      ]
-    },
+    },
-    {path: '*', redirect: '/view/error/404'}
+    {path: '*', redirect: '/view/error/404'}
-  ]
+  ]
-});
+});
-
+
-router.beforeEach((to, from, next) => {
+router.beforeEach((to, from, next) => {
-  const isPublic = to.matched.some(record => record.meta.public);
+  const isPublic = to.matched.some(record => record.meta.public);
-  const loggedIn = !!tokenSvc.getToken();
+  const loggedIn = !!tokenSvc.getToken();
-
+
-  if (!isPublic && !loggedIn) {
+  if (!isPublic && !loggedIn) {
-    return next('/login');
+    return next('/login');
-  }
+  }
-
+
-  to.matched.some(record => {
+  to.matched.some(record => {
-    if (record.meta.usingSearchCondition) {
+    if (record.meta.usingSearchCondition) {
-      const shareList = record.meta.shareList;
+      const shareList = record.meta.shareList;
-      if (from.name && shareList && shareList.includes(from.name)) {
+      if (from.name && shareList && shareList.includes(from.name)) {
-        // shareList에 포함되어 있는 라우터에서 온 경우 검색 조건을 유지한다.
+        // shareList에 포함되어 있는 라우터에서 온 경우 검색 조건을 유지한다.
-        // console.log("패밀리");
+        // console.log("패밀리");
-      } else {
+      } else {
-        // 그 외의 경우 검색 조건 초기화
+        // 그 외의 경우 검색 조건 초기화
-        searchcondition.commit("searchcondition/updateSearchCondition", null);
+        searchcondition.commit("searchcondition/updateSearchCondition", null);
-        // console.log("낫패밀리");
+        // console.log("낫패밀리");
-      }
+      }
-    }
+    }
-    next();
+    next();
-  });
+  });
-});
+});
-
+
-export default router;
+export default router;

frontend/src/service/api.js

@@ -1,46 +1,56 @@
-import httpClient from '@/common/http-client';
+import httpClient from '@/common/http-client';
-
+
-/* ckr - old
+/* ckr - old
-const menus = () => {
+const menus = () => {
-    return httpClient.get('/api/view/menus');
+    return httpClient.get('/api/view/menus');
-};
+};
-*/
+*/
-// new 
+// new 
-const menus = () => {
+const menus = () => { 
-  return httpClient.post('/api/v1/bo/comm/getMenu',{ withCredentials: false });
+  return httpClient.post('/api/v1/bo/comm/getMenu', { withCredentials: false });
-};
+};
-
+
-const generateStr = (length) => {
+const commCode = (params) => { 
-    const chars = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
+  return httpClient.post('/api/v1/bo/comm/getCode', params, { withCredentials: false });
-    var result = "";
+};
-    for (var i = length; i > 0; --i) result += chars[Math.floor(Math.random() * chars.length)];
+
-    return result;
+const commAuth = () => { 
-}
+  return httpClient.post('/api/v1/bo/comm/getAuth', { withCredentials: false });
-
+};
-/**
+
- * httpClient.get(url, { params, responseType: "blob" }).then(response => { commonApiService.downloadBlob(response); })
+const generateStr = (length) => {
- */
+    const chars = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
-const downloadBlob = (response) => {
+    var result = "";
-    let blob = new Blob([response.data], { type: "application/vnd.ms-excel;charset=UTF-8" });
+    for (var i = length; i > 0; --i) result += chars[Math.floor(Math.random() * chars.length)];
-    let filename = response.headers["content-disposition"].split(";")
+    return result;
-                    .filter(function(ele) { return ele.indexOf("filename") > -1 })
+}
-                    .map(function(ele) { return ele.replace(/"/g, '').split("=")[1] });
+
-    filename = decodeURI(filename);
+/**
-    if (typeof window.navigator.msSaveBlob !== "undefined") {
+ * httpClient.get(url, { params, responseType: "blob" }).then(response => { commonApiService.downloadBlob(response); })
-      // IE
+ */
-      window.navigator.msSaveBlob(blob, filename);
+const downloadBlob = (response) => {
-    } else {
+    let blob = new Blob([response.data], { type: "application/vnd.ms-excel;charset=UTF-8" });
-      let link = document.createElement("a")
+    let filename = response.headers["content-disposition"].split(";")
-      link.href = window.URL.createObjectURL(blob);
+                    .filter(function(ele) { return ele.indexOf("filename") > -1 })
-      link.download = filename;
+                    .map(function(ele) { return ele.replace(/"/g, '').split("=")[1] });
-      link.click();
+    filename = decodeURI(filename);
-    }
+    if (typeof window.navigator.msSaveBlob !== "undefined") {
-  }
+      // IE
-
+      window.navigator.msSaveBlob(blob, filename);
-
+    } else {
-
+      let link = document.createElement("a")
-export default {
+      link.href = window.URL.createObjectURL(blob);
-    menus,
+      link.download = filename;
-    generateStr,
+      link.click();
-    downloadBlob
+    }
+  }
+
+
+
+export default {
+    menus,
+    generateStr,
+    downloadBlob,
+    commCode,
+    commAuth
 };

frontend/src/service/upload-file.js

@@ -1,31 +1,31 @@
-import httpClient from '@/common/http-client';
+import httpClient from '@/common/http-client';
-
+
-const commonUpload = file => {
+const commonUpload = file => {
-  let formData = new FormData();
+  let formData = new FormData();
-  formData.append('sourceFile', file);
+  formData.append('sourceFile', file);
-
+
-  return httpClient.post('/api/file/common/upload', formData, {
+  return httpClient.post('/api/file/common/upload', formData, {
-    headers: {
+    headers: {
-      'Content-Type': 'multipart/form-data'
+      'Content-Type': 'multipart/form-data'
-    }
+    }
-  });
+  });
-};
+};
-
+
-const commonMultiUpload = files => {
+const commonMultiUpload = files => {
-  let formData = new FormData();
+  let formData = new FormData();
-
+
-  for (let x = 0; x < files.length; x++) {
+  for (let x = 0; x < files.length; x++) {
-    formData.append('sourceFiles', files[x]);
+    formData.append('sourceFiles', files[x]);
-  }
+  }
-
+
-  return httpClient.post('/api/file/common/upload/multi', formData, {
+  return httpClient.post('/api/file/common/upload/multi', formData, {
-    headers: {
+    headers: {
-      'Content-Type': 'multipart/form-data'
+      'Content-Type': 'multipart/form-data'
-    }
+    }
-  });
+  });
-};
+};
-
+
-export default {
+export default {
-  commonUpload,
+  commonUpload,
-  commonMultiUpload
+  commonMultiUpload
-};
+};

frontend/src/store.js

@@ -1,13 +1,13 @@
-import Vue from 'vue'
+import Vue from 'vue'
-import Vuex from 'vuex'
+import Vuex from 'vuex'
-import searchcondition from './store/search-condition'
+import searchcondition from './store/search-condition'
-import login from './modules/login/store/index'
+import login from './modules/login/store/index'
-
+
-Vue.use(Vuex)
+Vue.use(Vuex)
-
+
-export default new Vuex.Store({
+export default new Vuex.Store({
-  modules: {
+  modules: {
-    searchcondition,
+    searchcondition,
-    login
+    login
-  }
+  }
-})
+})

frontend/src/store/search-condition.js

@@ -1,24 +1,24 @@
-const state = {
+const state = {
-  searchCondition: null
+  searchCondition: null
-}
+}
-
+
-const getters = {
+const getters = {
-  getSearchCondition: state => state.searchCondition,
+  getSearchCondition: state => state.searchCondition,
-}
+}
-
+
-const mutations = {
+const mutations = {
-  updateSearchCondition: (state, data) => {
+  updateSearchCondition: (state, data) => {
-    state.searchCondition = data;
+    state.searchCondition = data;
-  }
+  }
-}
+}
-
+
-const actions = {
+const actions = {
-}
+}
-
+
-export default {
+export default {
-  namespaced: true,
+  namespaced: true,
-  state,
+  state,
-  getters,
+  getters,
-  mutations,
+  mutations,
-  actions
+  actions
 };

frontend/src/views/ErrorPage404.vue

@@ -1,37 +1,37 @@
-<template>
+<template>
-
+
-  <article id="content" class="content error_page"> 
+  <article id="content" class="content error_page"> 
-    <div class="error_wrap center">
+    <div class="error_wrap center">
-      <div class="title_area rcs_icon icon_error404">
+      <div class="title_area rcs_icon icon_error404">
-        <h2 class="h2_title">죄송합니다.<br>요청하신 페이지를 찾을 수 없습니다. (404 Error)</h2><span class="h2_desc mar_t20">존재하지 않는 주소를 입력하셨거나 기술적인 문제로 일시적으로 접속되지 않았습니다.<br>잠시 후 다시 이용 부탁드리며 이용에 불편을 드려 사과드립니다.</span>
+        <h2 class="h2_title">죄송합니다.<br>요청하신 페이지를 찾을 수 없습니다. (404 Error)</h2><span class="h2_desc mar_t20">존재하지 않는 주소를 입력하셨거나 기술적인 문제로 일시적으로 접속되지 않았습니다.<br>잠시 후 다시 이용 부탁드리며 이용에 불편을 드려 사과드립니다.</span>
-      </div>
+      </div>
-      <div class="btn_wrap center mar_t60"><a href="javascript:void(0);" class="btn big cd_black" @click="backGo"><span>이전</span></a><a href="/" class="btn big point"><span>메인</span></a></div>
+      <div class="btn_wrap center mar_t60"><a href="javascript:void(0);" class="btn big cd_black" @click="backGo"><span>이전</span></a><a href="/" class="btn big point"><span>메인</span></a></div>
-    </div>
+    </div>
-  </article>
+  </article>
-
+
-</template>
+</template>
-
+
-<script>
+<script>
-  
+  
-  export default {
+  export default {
-    data: function() {
+    data: function() {
-      return {
+      return {
-        
+        
-      };
+      };
-    },
+    },
-    created() {
+    created() {
-      this.$store.commit("login/isErrorPage", true);
+      this.$store.commit("login/isErrorPage", true);
-    },
+    },
-    mounted() {
+    mounted() {
-      
+      
-    },
+    },
-    destroyed() {
+    destroyed() {
-      this.$store.commit("login/isErrorPage", false);
+      this.$store.commit("login/isErrorPage", false);
-    },
+    },
-    methods: {
+    methods: {
-      backGo() {
+      backGo() {
-        this.$router.go(-1);
+        this.$router.go(-1);
-      }
+      }
-    }
+    }
-  };
+  };
-</script>
+</script>

frontend/src/views/ErrorPage500.vue

@@ -1,37 +1,37 @@
-<template>
+<template>
-
+
-  <article id="content" class="content error_page">
+  <article id="content" class="content error_page">
-    <div class="error_wrap center">
+    <div class="error_wrap center">
-      <div class="title_area rcs_icon icon_error500">
+      <div class="title_area rcs_icon icon_error500">
-        <h2 class="h2_title">죄송합니다.<br>서비스가 일시적으로 중단되었습니다. (500 Error)</h2><span class="h2_desc mar_t20">일시적으로 페이지 접근이 불가능합니다.<br>잠시 후 다시 이용 부탁드리며 이용에 불편을 드려 사과드립니다.</span>
+        <h2 class="h2_title">죄송합니다.<br>서비스가 일시적으로 중단되었습니다. (500 Error)</h2><span class="h2_desc mar_t20">일시적으로 페이지 접근이 불가능합니다.<br>잠시 후 다시 이용 부탁드리며 이용에 불편을 드려 사과드립니다.</span>
-      </div>
+      </div>
-      <div class="btn_wrap center mar_t60"><a href="javascript:void(0);" class="btn big cd_black" @click="backGo"><span>이전</span></a><a href="/" class="btn big point"><span>메인</span></a></div>
+      <div class="btn_wrap center mar_t60"><a href="javascript:void(0);" class="btn big cd_black" @click="backGo"><span>이전</span></a><a href="/" class="btn big point"><span>메인</span></a></div>
-    </div>
+    </div>
-  </article>
+  </article>
-
+
-</template>
+</template>
-
+
-<script>
+<script>
-  
+  
-  export default {
+  export default {
-    data: function() {
+    data: function() {
-      return {
+      return {
-        
+        
-      };
+      };
-    },
+    },
-    created() {
+    created() {
-      this.$store.commit("login/isErrorPage", true);
+      this.$store.commit("login/isErrorPage", true);
-    },
+    },
-    mounted() {
+    mounted() {
-      
+      
-    },
+    },
-    destroyed() {
+    destroyed() {
-      this.$store.commit("login/isErrorPage", false);
+      this.$store.commit("login/isErrorPage", false);
-    },
+    },
-    methods: {
+    methods: {
-      backGo() {
+      backGo() {
-        this.$router.go(-1);
+        this.$router.go(-1);
-      }
+      }
-    }
+    }
-  };
+  };
 </script>

frontend/src/views/HubwebLayout.vue

@@ -1,78 +1,79 @@
-<template>
+<template>
-  <body>
+  <body>
-      <div class="wrap" v-bind:class="{'main_wrap': (isLogin && isAuthChk), 'login-wrap': (!isLogin && !isAuthChk), 'bg-wrap': (isLogin && !isAuthChk) }" >      
+      <div class="wrap" v-bind:class="{'main_wrap': (isLogin && isAuthChk), 'login-wrap': (!isLogin && !isAuthChk), 'bg-wrap': (isLogin && !isAuthChk) }" >      
-        <hub-web-header v-if="isAuthChk == true"></hub-web-header>
+        <hub-web-header v-if="isAuthChk == true"></hub-web-header>
-        <nav-bar v-if="isAuthChk == true"></nav-bar>
+        <nav-bar v-if="isAuthChk == true"></nav-bar>
-        <router-view :key="$route.fullPath"></router-view>  
+        <router-view :key="$route.fullPath"></router-view>  
-        <hub-web-footer  v-if="isAuthChk == false"></hub-web-footer>          
+        <hub-web-footer  v-if="isAuthChk == false"></hub-web-footer>          
-      </div>        
+      </div>        
-  </body>
+  </body>
-</template>
+</template>
-
+
-<script>
+<script>
-import NavBar from "../components/NavBar.vue";
+import NavBar from "../components/NavBar.vue";
-//import vuejsDatepicker from "../components/vuejs-datepicker";
+//import vuejsDatepicker from "../components/vuejs-datepicker";
-import HubWebHeader from "../components/HubWebHeader.vue";
+import HubWebHeader from "../components/HubWebHeader.vue";
-import HubWebFooter from "../components/HubWebFooter.vue";
+import HubWebFooter from "../components/HubWebFooter.vue";
-import "../common/ko.js";
+
-
+import "../common/ko.js";
-import "../assets/css/layout.css";
+
-import "../assets/css/contents.css";
+import "../assets/css/layout.css";
-import "../assets/css/common.css";
+import "../assets/css/contents.css";
-import "../assets/css/style.css";
+import "../assets/css/common.css";
-import { mapGetters } from 'vuex';
+import "../assets/css/style.css";
-
+import { mapGetters } from 'vuex';
-export default {
+
-  name: "hubwebLayout",
+export default {
-  components: {   
+  name: "hubwebLayout",
-    NavBar,
+  components: {   
-    //vuejsDatepicker,
+    NavBar,
-    HubWebHeader,
+    //vuejsDatepicker,
-    HubWebFooter,    
+    HubWebHeader,
-  },
+    HubWebFooter,    
-  data(){
+  },
-    return{
+  data(){
-      isLogin: false,
+    return{
-      isErrPage: false,
+      isLogin: false,
-      isAuthChk: false,
+      isErrPage: false,
-    }
+      isAuthChk: false,
-  },
+    }
-  created() {           
+  },
-   this.getLogin;
+  created() {           
-   this.getAuthChk;
+   this.getLogin;
-  },
+   this.getAuthChk;
-  mounted() {
+  },
-      
+  mounted() {
-  }
+      
-  ,computed: {
+  }
-    ...mapGetters({
+  ,computed: {
-      getLogin: 'login/isLogin',
+    ...mapGetters({
-      getErrorPage: 'login/isErrorPage',
+      getLogin: 'login/isLogin',
-      getAuthChk: 'login/isAuthChk',
+      getErrorPage: 'login/isErrorPage',
-    }),
+      getAuthChk: 'login/isAuthChk',
-  },
+    }),
-  watch: {
+  },
-    getLogin(data) {
+  watch: {
-      if (data != null && data != '' && data == true) {
+    getLogin(data) {
-        this.isLogin = true;        
+      if (data != null && data != '' && data == true) {
-      } else {
+        this.isLogin = true;        
-        this.isLogin = false;                
+      } else {
-      }      
+        this.isLogin = false;                
-    },
+      }      
-    getErrorPage(data) {
+    },
-      if (data != null && data != '' && data == true) {
+    getErrorPage(data) {
-        this.isErrPage = true;
+      if (data != null && data != '' && data == true) {
-      } else {
+        this.isErrPage = true;
-        this.isErrPage = false;
+      } else {
-      }
+        this.isErrPage = false;
-    },
+      }
-    getAuthChk(data) {      
+    },
-      if (data != null && data != '' && data == true) {
+    getAuthChk(data) {      
-        this.isAuthChk = true;        
+      if (data != null && data != '' && data == true) {
-      } else {
+        this.isAuthChk = true;        
-        this.isAuthChk = false;                
+      } else {
-      }      
+        this.isAuthChk = false;                
-    },
+      }      
-  }
+    },
-};
+  }
+};
 </script>

src/main/java/kr/co/uplus/ez/Scheduler.java

@@ -1,21 +1,21 @@
-package kr.co.uplus.ez;
+package kr.co.uplus.ez;
-
+
-import org.slf4j.Logger;
+import org.slf4j.Logger;
-import org.slf4j.LoggerFactory;
+import org.slf4j.LoggerFactory;
-import org.springframework.scheduling.annotation.Scheduled;
+import org.springframework.scheduling.annotation.Scheduled;
-import org.springframework.stereotype.Component;
+import org.springframework.stereotype.Component;
-
+
-@Component
+@Component
-public class Scheduler {
+public class Scheduler {
-	
+	
-	private static final Logger log = LoggerFactory.getLogger(Scheduler.class);
+	private static final Logger log = LoggerFactory.getLogger(Scheduler.class);
-
+
-	/**
+	/**
-	 * 스케줄러 트리거는 해당영역에 선언 / 서비스영역은 별도 
+	 * 스케줄러 트리거는 해당영역에 선언 / 서비스영역은 별도 
-	 */
+	 */
-	@Scheduled(initialDelay = 60000, fixedRateString = "${schedule.sample.init:60000}")
+	@Scheduled(initialDelay = 60000, fixedRateString = "${schedule.sample.init:60000}")
-	public void init() {
+	public void init() {
-		// 스케줄 서비스 정의
+		// 스케줄 서비스 정의
-		log.info("schduler trigger");
+		log.info("schduler trigger");
-	}
+	}
-}
+}

src/main/java/kr/co/uplus/ez/WebApplication.java

@@ -1,73 +1,73 @@
-package kr.co.uplus.ez;
+package kr.co.uplus.ez;
-
+
-import javax.annotation.PostConstruct;
+import javax.annotation.PostConstruct;
-import javax.annotation.PreDestroy;
+import javax.annotation.PreDestroy;
-
+
-import org.slf4j.Logger;
+import org.slf4j.Logger;
-import org.slf4j.LoggerFactory;
+import org.slf4j.LoggerFactory;
-import org.springframework.boot.SpringApplication;
+import org.springframework.boot.SpringApplication;
-import org.springframework.boot.autoconfigure.SpringBootApplication;
+import org.springframework.boot.autoconfigure.SpringBootApplication;
-import org.springframework.boot.autoconfigure.security.servlet.SecurityAutoConfiguration;
+import org.springframework.boot.autoconfigure.security.servlet.SecurityAutoConfiguration;
-import org.springframework.boot.builder.SpringApplicationBuilder;
+import org.springframework.boot.builder.SpringApplicationBuilder;
-import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;
+import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;
-import org.springframework.core.env.AbstractEnvironment;
+import org.springframework.core.env.AbstractEnvironment;
-
+
-@SpringBootApplication(exclude = { SecurityAutoConfiguration.class })
+@SpringBootApplication(exclude = { SecurityAutoConfiguration.class })
-public class WebApplication extends SpringBootServletInitializer {
+public class WebApplication extends SpringBootServletInitializer {
-
+
-	private static final Logger log = LoggerFactory.getLogger(WebApplication.class);
+	private static final Logger log = LoggerFactory.getLogger(WebApplication.class);
-
+
-	@Override
+	@Override
-	protected SpringApplicationBuilder configure(SpringApplicationBuilder application) {
+	protected SpringApplicationBuilder configure(SpringApplicationBuilder application) {
-		return application.sources(WebApplication.class);
+		return application.sources(WebApplication.class);
-	}
+	}
-
+
-	public static void main(String[] args) throws Exception {
+	public static void main(String[] args) throws Exception {
-		if (System.getProperty(AbstractEnvironment.ACTIVE_PROFILES_PROPERTY_NAME) == null) {
+		if (System.getProperty(AbstractEnvironment.ACTIVE_PROFILES_PROPERTY_NAME) == null) {
-			System.setProperty(AbstractEnvironment.ACTIVE_PROFILES_PROPERTY_NAME, "local");
+			System.setProperty(AbstractEnvironment.ACTIVE_PROFILES_PROPERTY_NAME, "local");
-		}
+		}
-
+
-		SpringApplication.run(WebApplication.class, args);
+		SpringApplication.run(WebApplication.class, args);
-	}
+	}
-
+
-	@PostConstruct
+	@PostConstruct
-	public void onStartup() {
+	public void onStartup() {
-		Thread checkThread = new Thread(new CheckProcess());
+		Thread checkThread = new Thread(new CheckProcess());
-		checkThread.setDaemon(true);
+		checkThread.setDaemon(true);
-		checkThread.start();
+		checkThread.start();
-		log.info("################ System-up start ################");
+		log.info("################ System-up start ################");
-	}
+	}
-
+
-	@PreDestroy
+	@PreDestroy
-	public void onExit() {
+	public void onExit() {
-		log.info("################ System-down start ################");
+		log.info("################ System-down start ################");
-	}
+	}
-}
+}
-
+
-class CheckProcess implements Runnable {
+class CheckProcess implements Runnable {
-
+
-	private static final Logger log = LoggerFactory.getLogger(CheckProcess.class);
+	private static final Logger log = LoggerFactory.getLogger(CheckProcess.class);
-
+
-	private static final String PROC_NAME = "mhez-admin";
+	private static final String PROC_NAME = "mhez-admin";
-	@Override
+	@Override
-	public void run() {
+	public void run() {
-		while (true) {
+		while (true) {
-			try {
+			try {
-				process();
+				process();
-				Thread.sleep(1000 * 60);
+				Thread.sleep(1000 * 60);
-			} catch (InterruptedException e) {
+			} catch (InterruptedException e) {
-			}
+			}
-		}
+		}
-	}
+	}
-
+
-	private void process() {
+	private void process() {
-		Runtime runtime = Runtime.getRuntime();
+		Runtime runtime = Runtime.getRuntime();
-		long totalMemory = runtime.totalMemory() / (1024 * 1024);
+		long totalMemory = runtime.totalMemory() / (1024 * 1024);
-		long freeMemory = runtime.freeMemory() / (1024 * 1024);
+		long freeMemory = runtime.freeMemory() / (1024 * 1024);
-		long maxMemory = runtime.maxMemory() / (1024 * 1024);
+		long maxMemory = runtime.maxMemory() / (1024 * 1024);
-		long usedMemory = totalMemory - freeMemory;
+		long usedMemory = totalMemory - freeMemory;
-
+
-		log.info("{} Process Monitoring : maxMemory -> {}MB, totalMemory -> {}MB, usedMemory -> {}MB, freeMemory -> {}MB, ActiveThread -> {}",
+		log.info("{} Process Monitoring : maxMemory -> {}MB, totalMemory -> {}MB, usedMemory -> {}MB, freeMemory -> {}MB, ActiveThread -> {}",
-				PROC_NAME, maxMemory, totalMemory, usedMemory, freeMemory, Thread.activeCount());
+				PROC_NAME, maxMemory, totalMemory, usedMemory, freeMemory, Thread.activeCount());
-	}
+	}
 }

src/main/java/kr/co/uplus/ez/api/attractMgt/AttractMgtController.java

@@ -1,80 +1,81 @@
-/**
+/**
- * date : 2022. 4. 26.
+ * date : 2022. 4. 26.
- * auth : ckr
+ * auth : ckr
- * desc : 유치 현황 관리
+ * desc : 유치 현황 관리
- */
+ */
-package kr.co.uplus.ez.api.attractMgt;
+package kr.co.uplus.ez.api.attractMgt;
-
+
-import java.util.Map;
+import java.util.Map;
-
+
-import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestBody;
-import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RequestMethod;
+import org.springframework.web.bind.annotation.RequestMethod;
-import org.springframework.web.bind.annotation.ResponseBody;
+import org.springframework.web.bind.annotation.ResponseBody;
-import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.bind.annotation.RestController;
-
+
-import kr.co.uplus.ez.common.data.ApiResponseMessage;
+import kr.co.uplus.ez.common.data.ApiResponseMessage;
-
+
-@RestController
+@RestController
-@RequestMapping(value = "api/v1/bo/attractMgt")
+@RequestMapping(value = "api/v1/bo/attractMgt")
-public class AttractMgtController {
+public class AttractMgtController {
-	@Autowired
+
-	AttractMgtService attractService;
+	@Autowired
-
+	AttractMgtService attractService;
-	/**
+
-	 * date : 2022. 4. 26.
+	/**
-	 * auth : ckr
+	 * date : 2022. 4. 26.
-	 * desc : 유치채널 목록조회
+	 * auth : ckr
-	 * @param paramMap
+	 * desc : 유치채널 목록조회
-	 * @return
+	 * @param paramMap
-	 * @throws Exception
+	 * @return
-	 */
+	 * @throws Exception
-	@RequestMapping(value = "/channelList" , method = {RequestMethod.POST})
+	 */
-	@ResponseBody
+	@RequestMapping(value = "/channelList" , method = {RequestMethod.POST})
-	public ApiResponseMessage channelList(@RequestBody Map<String, Object> paramMap) throws Exception{
+	@ResponseBody
-		return attractService.channelList(paramMap);
+	public ApiResponseMessage channelList(@RequestBody Map<String, Object> paramMap) throws Exception{
-	}
+		return attractService.channelList(paramMap);
-
+	}
-	/**
+
-	 * date : 2022. 4. 26.
+	/**
-	 * auth : ckr
+	 * date : 2022. 4. 26.
-	 * desc : 유치채널 목록 엑셀 다운로드
+	 * auth : ckr
-	 * @param paramMap
+	 * desc : 유치채널 목록 엑셀 다운로드
-	 * @return
+	 * @param paramMap
-	 * @throws Exception
+	 * @return
-	 */
+	 * @throws Exception
-	@RequestMapping(value = "/channelListExcel" , method = {RequestMethod.POST})
+	 */
-	@ResponseBody
+	@RequestMapping(value = "/channelListExcel" , method = {RequestMethod.POST})
-	public ApiResponseMessage channelListExcel(@RequestBody Map<String, Object> paramMap) throws Exception{
+	@ResponseBody
-		return attractService.channelListExcel(paramMap);
+	public ApiResponseMessage channelListExcel(@RequestBody Map<String, Object> paramMap) throws Exception{
-	}
+		return attractService.channelListExcel(paramMap);
-
+	}
-	/**
+
-	 * date : 2022. 4. 26.
+	/**
-	 * auth : ckr
+	 * date : 2022. 4. 26.
-	 * desc : 유치 채널 상세 조회
+	 * auth : ckr
-	 * @param paramMap
+	 * desc : 유치 채널 상세 조회
-	 * @return
+	 * @param paramMap
-	 * @throws Exception
+	 * @return
-	 */
+	 * @throws Exception
-	@RequestMapping(value = "/channelDetail" , method = {RequestMethod.POST})
+	 */
-	@ResponseBody
+	@RequestMapping(value = "/channelDetail" , method = {RequestMethod.POST})
-	public ApiResponseMessage channelDetail(@RequestBody Map<String, Object> paramMap) throws Exception{
+	@ResponseBody
-		return attractService.channelDetail(paramMap);
+	public ApiResponseMessage channelDetail(@RequestBody Map<String, Object> paramMap) throws Exception{
-	}
+		return attractService.channelDetail(paramMap);
-
+	}
-	/**
+
-	 * date : 2022. 4. 26.
+	/**
-	 * auth : ckr
+	 * date : 2022. 4. 26.
-	 * desc : 발송건수 엑셀 다운로드
+	 * auth : ckr
-	 * @param paramMap
+	 * desc : 발송건수 엑셀 다운로드
-	 * @return
+	 * @param paramMap
-	 * @throws Exception
+	 * @return
-	 */
+	 * @throws Exception
-	@RequestMapping(value = "/sendNumberListExcel" , method = {RequestMethod.POST})
+	 */
-	@ResponseBody
+	@RequestMapping(value = "/sendNumberListExcel" , method = {RequestMethod.POST})
-	public ApiResponseMessage sendNumberListExcel(@RequestBody Map<String, Object> paramMap) throws Exception{
+	@ResponseBody
-		return attractService.sendNumberListExcel(paramMap);
+	public ApiResponseMessage sendNumberListExcel(@RequestBody Map<String, Object> paramMap) throws Exception{
-	}
+		return attractService.sendNumberListExcel(paramMap);
-}
+	}
+}

src/main/java/kr/co/uplus/ez/api/attractMgt/AttractMgtMapper.java

@@ -1,8 +1,8 @@
-package kr.co.uplus.ez.api.attractMgt;
+package kr.co.uplus.ez.api.attractMgt;
-
+
-import org.apache.ibatis.annotations.Mapper;
+import org.apache.ibatis.annotations.Mapper;
-
+
-@Mapper
+@Mapper
-public class AttractMgtMapper {
+public class AttractMgtMapper {
-
+
-}
+}

src/main/java/kr/co/uplus/ez/api/attractMgt/AttractMgtService.java

@@ -1,230 +1,230 @@
-package kr.co.uplus.ez.api.attractMgt;
+package kr.co.uplus.ez.api.attractMgt;
-
+
-import java.util.ArrayList;
+import java.util.ArrayList;
-import java.util.HashMap;
+import java.util.HashMap;
-import java.util.List;
+import java.util.List;
-import java.util.Map;
+import java.util.Map;
-
+
-import org.springframework.stereotype.Service;
+import org.springframework.stereotype.Service;
-
+
-import kr.co.uplus.ez.common.data.ApiResponseCode;
+import kr.co.uplus.ez.common.data.ApiResponseCode;
-import kr.co.uplus.ez.common.data.ApiResponseMessage;
+import kr.co.uplus.ez.common.data.ApiResponseMessage;
-
+
-@Service
+@Service
-public class AttractMgtService {
+public class AttractMgtService {
-
+
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 유치채널 목록조회
+	 * desc : 유치채널 목록조회
-	 * @param paramMap
+	 * @param paramMap
-	 * @return
+	 * @return  
-	 */
+	 */
-	public ApiResponseMessage channelList(Map<String, Object> paramMap) {
+	public ApiResponseMessage channelList(Map<String, Object> paramMap) {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
-		Map<String, Object> dataObj = new HashMap<>();
+		Map<String, Object> dataObj = new HashMap<>();
-		List<Map<String,Object>> dataList = new ArrayList<>();
+		List<Map<String,Object>> dataList = new ArrayList<>();
-		Map<String, Object> data = new HashMap<>();
+		Map<String, Object> data = new HashMap<>();
-
+		
-		data.put("totalCnt", "999");
+		data.put("totalCnt", "999");
-		data.put("currentPage", "1");
+		data.put("currentPage", "1");
-		dataObj.put("paging", data);
+		dataObj.put("paging", data);
-
+		
-		for(int i=1; i<10; i++) {
+		for(int i=1; i<10; i++) {
-			data = new HashMap<>();
+			data = new HashMap<>();
-			data.put("no", ""+i);
+			data.put("no", ""+i);
-			data.put("regDt", "2022-03-10");
+			data.put("regDt", "2022-03-10");
-			data.put("channelNm", "업체명");
+			data.put("channelNm", "업체명");
-			data.put("adminId", "uplus01");
+			data.put("adminId", "uplus01");
-			data.put("custNm", "유플러스");
+			data.put("custNm", "유플러스");
-			data.put("bRegNo", "221-81-39938");
+			data.put("bRegNo", "221-81-39938");
-			data.put("userNm", "유플러스스");
+			data.put("userNm", "유플러스스");
-			data.put("stat", "사용");
+			data.put("stat", "사용");
-			data.put("custType", "법인사용자");
+			data.put("custType", "법인사용자");
-			data.put("totalSendingCnt", "1440000");
+			data.put("totalSendingCnt", "1440000");
-			data.put("serviceId", "serviceId");
+			data.put("serviceId", "serviceId");
-			dataList.add(data);
+			dataList.add(data);
-		}
+		}
-		dataObj.put("list", dataList);
+		dataObj.put("list", dataList);
-		result.setData(dataObj);
+		result.setData(dataObj);
-		return result;
+		return result;
-	}
+	}
-
+
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 유치채널 목록 엑셀 다운로드
+	 * desc : 유치채널 목록 엑셀 다운로드
-	 * @param paramMap
+	 * @param paramMap
-	 * @return
+	 * @return  
-	 */
+	 */
-	public ApiResponseMessage channelListExcel(Map<String, Object> paramMap) {
+	public ApiResponseMessage channelListExcel(Map<String, Object> paramMap) {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
-		Map<String, Object> dataObj = new HashMap<>();
+		Map<String, Object> dataObj = new HashMap<>();
-		List<Map<String,Object>> dataList = new ArrayList<>();
+		List<Map<String,Object>> dataList = new ArrayList<>();
-		Map<String, Object> data = new HashMap<>();
+		Map<String, Object> data = new HashMap<>();
-
+		
-		data.put("totalCnt", "999");
+		data.put("totalCnt", "999");
-		data.put("currentPage", "1");
+		data.put("currentPage", "1");
-		dataObj.put("paging", data);
+		dataObj.put("paging", data);
-
+		
-		for(int i=1; i<50; i++) {
+		for(int i=1; i<50; i++) {
-			data = new HashMap<>();
+			data = new HashMap<>();
-			data.put("no", ""+i);
+			data.put("no", ""+i);
-			data.put("regDt", "2022-03-10");
+			data.put("regDt", "2022-03-10");
-			data.put("channelNm", "업체명");
+			data.put("channelNm", "업체명");
-			data.put("adminId", "uplus01");
+			data.put("adminId", "uplus01");
-			data.put("custNm", "유플러스");
+			data.put("custNm", "유플러스");
-			data.put("bRegNo", "221-81-39938");
+			data.put("bRegNo", "221-81-39938");
-			data.put("userNm", "유플러스스");
+			data.put("userNm", "유플러스스");
-			data.put("stat", "사용");
+			data.put("stat", "사용");
-			data.put("custType", "법인사용자");
+			data.put("custType", "법인사용자");
-			data.put("totalSendingCnt", "1440000");
+			data.put("totalSendingCnt", "1440000");
-			data.put("serviceId", "serviceId");
+			data.put("serviceId", "serviceId");
-			dataList.add(data);
+			dataList.add(data);
-		}
+		}
-		dataObj.put("list", dataList);
+		dataObj.put("list", dataList);
-		result.setData(dataObj);
+		result.setData(dataObj);
-		return result;
+		return result;
-	}
+	}
-
+
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 유치 채널 상세 조회
+	 * desc : 유치 채널 상세 조회
-	 * @param paramMap
+	 * @param paramMap
-	 * @return
+	 * @return  
-	 */
+	 */
-	public ApiResponseMessage channelDetail(Map<String, Object> paramMap) {
+	public ApiResponseMessage channelDetail(Map<String, Object> paramMap) {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
-		Map<String, Object> dataObj = new HashMap<>();
+		Map<String, Object> dataObj = new HashMap<>();
-		List<Map<String,Object>> dataList = new ArrayList<>();
+		List<Map<String,Object>> dataList = new ArrayList<>();
-		Map<String, Object> data = new HashMap<>();
+		Map<String, Object> data = new HashMap<>();
-
+		
-		dataObj.put("subsDt", "2022-03-10");
+		dataObj.put("subsDt", "2022-03-10");
-		dataObj.put("stat", "사용");
+		dataObj.put("stat", "사용");
-		dataObj.put("custNm", "홍길동");
+		dataObj.put("custNm", "홍길동");
-		dataObj.put("plan", "요금제1");
+		dataObj.put("plan", "요금제1");
-		dataObj.put("reprNm", "홍길동");
+		dataObj.put("reprNm", "홍길동");
-		dataObj.put("custType", "법인사업자");
+		dataObj.put("custType", "법인사업자");
-		dataObj.put("bRegNo", "1231212345");
+		dataObj.put("bRegNo", "1231212345");
-		dataObj.put("cprRegNo", "1234561234567");
+		dataObj.put("cprRegNo", "1234561234567");
-		dataObj.put("adr1", "12345");
+		dataObj.put("adr1", "12345");
-		dataObj.put("adr2", "서울 마포구 월드컵북로 416");
+		dataObj.put("adr2", "서울 마포구 월드컵북로 416");
-		dataObj.put("adr3", "유플러스 상암사옥");
+		dataObj.put("adr3", "유플러스 상암사옥");
-		dataObj.put("channelId", "Uplus01");
+		dataObj.put("channelId", "Uplus01");
-		dataObj.put("channelNm", "홍길동");
+		dataObj.put("channelNm", "홍길동");
-		dataObj.put("adminId", "uplus02");
+		dataObj.put("adminId", "uplus02");
-		dataObj.put("adminNm", "김철수");
+		dataObj.put("adminNm", "김철수");
-
+		
-		data.put("date", "합계");
+		data.put("date", "합계");
-		data.put("sms", "360000");
+		data.put("sms", "360000");
-		data.put("lms", "360000");
+		data.put("lms", "360000");
-		data.put("mms", "360000");
+		data.put("mms", "360000");
-		data.put("totiTalk", "360000");
+		data.put("totiTalk", "360000");
-		data.put("allSendingCnt", "1440000");
+		data.put("allSendingCnt", "1440000");
-		dataList.add(data);
+		dataList.add(data);
-
+		
-		data = new HashMap<>();
+		data = new HashMap<>();
-		data.put("date", "2022-03");
+		data.put("date", "2022-03");
-		data.put("sms", "10000");
+		data.put("sms", "10000");
-		data.put("lms", "10000");
+		data.put("lms", "10000");
-		data.put("mms", "10000");
+		data.put("mms", "10000");
-		data.put("totiTalk", "10000");
+		data.put("totiTalk", "10000");
-		data.put("allSendingCnt", "40000");
+		data.put("allSendingCnt", "40000");
-		dataList.add(data);
+		dataList.add(data);
-
+		
-		data = new HashMap<>();
+		data = new HashMap<>();
-		data.put("date", "2022-02");
+		data.put("date", "2022-02");
-		data.put("sms", "10000");
+		data.put("sms", "10000");
-		data.put("lms", "10000");
+		data.put("lms", "10000");
-		data.put("mms", "10000");
+		data.put("mms", "10000");
-		data.put("totiTalk", "10000");
+		data.put("totiTalk", "10000");
-		data.put("allSendingCnt", "40000");
+		data.put("allSendingCnt", "40000");
-		dataList.add(data);
+		dataList.add(data);
-
+		
-		data = new HashMap<>();
+		data = new HashMap<>();
-		data.put("date", "2022-01");
+		data.put("date", "2022-01");
-		data.put("sms", "10000");
+		data.put("sms", "10000");
-		data.put("lms", "10000");
+		data.put("lms", "10000");
-		data.put("mms", "10000");
+		data.put("mms", "10000");
-		data.put("totiTalk", "10000");
+		data.put("totiTalk", "10000");
-		data.put("allSendingCnt", "40000");
+		data.put("allSendingCnt", "40000");
-		dataList.add(data);
+		dataList.add(data);
-
+		
-		dataObj.put("list", dataList);
+		dataObj.put("list", dataList);
-		result.setData(dataObj);
+		result.setData(dataObj);
-
+		
-		return result;
+		return result;
-	}
+	}
-
+
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 발송건수 엑셀 다운로드
+	 * desc : 발송건수 엑셀 다운로드
-	 * @param paramMap
+	 * @param paramMap
-	 * @return
+	 * @return  
-	 */
+	 */
-	public ApiResponseMessage sendNumberListExcel(Map<String, Object> paramMap) {
+	public ApiResponseMessage sendNumberListExcel(Map<String, Object> paramMap) {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
-		Map<String, Object> dataObj = new HashMap<>();
+		Map<String, Object> dataObj = new HashMap<>();
-		List<Map<String,Object>> dataList = new ArrayList<>();
+		List<Map<String,Object>> dataList = new ArrayList<>();
-		Map<String, Object> data = new HashMap<>();
+		Map<String, Object> data = new HashMap<>();
-
+		
-		dataObj.put("subsDt", "2022-03-10");
+		dataObj.put("subsDt", "2022-03-10");
-		dataObj.put("stat", "사용");
+		dataObj.put("stat", "사용");
-		dataObj.put("custNm", "홍길동");
+		dataObj.put("custNm", "홍길동");
-		dataObj.put("plan", "요금제1");
+		dataObj.put("plan", "요금제1");
-		dataObj.put("reprNm", "홍길동");
+		dataObj.put("reprNm", "홍길동");
-		dataObj.put("custType", "법인사업자");
+		dataObj.put("custType", "법인사업자");
-		dataObj.put("bRegNo", "1231212345");
+		dataObj.put("bRegNo", "1231212345");
-		dataObj.put("cprRegNo", "1234561234567");
+		dataObj.put("cprRegNo", "1234561234567");
-		dataObj.put("adr1", "12345");
+		dataObj.put("adr1", "12345");
-		dataObj.put("adr2", "서울 마포구 월드컵북로 416");
+		dataObj.put("adr2", "서울 마포구 월드컵북로 416");
-		dataObj.put("adr3", "유플러스 상암사옥");
+		dataObj.put("adr3", "유플러스 상암사옥");
-		dataObj.put("channelId", "Uplus01");
+		dataObj.put("channelId", "Uplus01");
-		dataObj.put("channelNm", "홍길동");
+		dataObj.put("channelNm", "홍길동");
-		dataObj.put("adminId", "uplus02");
+		dataObj.put("adminId", "uplus02");
-		dataObj.put("adminNm", "김철수");
+		dataObj.put("adminNm", "김철수");
-
+		
-		data.put("date", "합계");
+		data.put("date", "합계");
-		data.put("sms", "360000");
+		data.put("sms", "360000");
-		data.put("lms", "360000");
+		data.put("lms", "360000");
-		data.put("mms", "360000");
+		data.put("mms", "360000");
-		data.put("totiTalk", "360000");
+		data.put("totiTalk", "360000");
-		data.put("allSendingCnt", "1440000");
+		data.put("allSendingCnt", "1440000");
-		dataList.add(data);
+		dataList.add(data);
-
+		
-		data = new HashMap<>();
+		data = new HashMap<>();
-		data.put("date", "2022-03");
+		data.put("date", "2022-03");
-		data.put("sms", "10000");
+		data.put("sms", "10000");
-		data.put("lms", "10000");
+		data.put("lms", "10000");
-		data.put("mms", "10000");
+		data.put("mms", "10000");
-		data.put("totiTalk", "10000");
+		data.put("totiTalk", "10000");
-		data.put("allSendingCnt", "40000");
+		data.put("allSendingCnt", "40000");
-		dataList.add(data);
+		dataList.add(data);
-
+		
-		data = new HashMap<>();
+		data = new HashMap<>();
-		data.put("date", "2022-02");
+		data.put("date", "2022-02");
-		data.put("sms", "10000");
+		data.put("sms", "10000");
-		data.put("lms", "10000");
+		data.put("lms", "10000");
-		data.put("mms", "10000");
+		data.put("mms", "10000");
-		data.put("totiTalk", "10000");
+		data.put("totiTalk", "10000");
-		data.put("allSendingCnt", "40000");
+		data.put("allSendingCnt", "40000");
-		dataList.add(data);
+		dataList.add(data);
-
+		
-		data = new HashMap<>();
+		data = new HashMap<>();
-		data.put("date", "2022-01");
+		data.put("date", "2022-01");
-		data.put("sms", "10000");
+		data.put("sms", "10000");
-		data.put("lms", "10000");
+		data.put("lms", "10000");
-		data.put("mms", "10000");
+		data.put("mms", "10000");
-		data.put("totiTalk", "10000");
+		data.put("totiTalk", "10000");
-		data.put("allSendingCnt", "40000");
+		data.put("allSendingCnt", "40000");
-		dataList.add(data);
+		dataList.add(data);
-
+		
-		dataObj.put("list", dataList);
+		dataObj.put("list", dataList);
-		result.setData(dataObj);
+		result.setData(dataObj);
-
+		
-		return result;
+		return result;
-	}
+	}
-
+
-}
+}

src/main/java/kr/co/uplus/ez/api/calculate/CalculateController.java

@@ -1,52 +1,52 @@
-/**
+/**
- * date : 2022. 4. 25.
+ * date : 2022. 4. 25.
- * auth : ckr
+ * auth : ckr
- * desc : 정산    
+ * desc : 정산    
- */
+ */
-package kr.co.uplus.ez.api.calculate;
+package kr.co.uplus.ez.api.calculate;
-
+
-import java.util.Map;
+import java.util.Map;
-
+
-import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestBody;
-import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RequestMethod;
+import org.springframework.web.bind.annotation.RequestMethod;
-import org.springframework.web.bind.annotation.ResponseBody;
+import org.springframework.web.bind.annotation.ResponseBody;
-import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.bind.annotation.RestController;
-
+
-import kr.co.uplus.ez.common.data.ApiResponseMessage;
+import kr.co.uplus.ez.common.data.ApiResponseMessage;
-
+
-@RestController
+@RestController
-@RequestMapping(value = "api/v1/bo/calculate")
+@RequestMapping(value = "api/v1/bo/calculate")
-public class CalculateController {
+public class CalculateController {
-	@Autowired
+	@Autowired
-	CalculateService calculateService;
+	CalculateService calculateService;
-	
+	
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 정산 이력 목록 조회
+	 * desc : 정산 이력 목록 조회
-	 * @param paramMap
+	 * @param paramMap
-	 * @return
+	 * @return
-	 * @throws Exception  
+	 * @throws Exception  
-	 */
+	 */
-	@RequestMapping(value = "/calcList" , method = {RequestMethod.POST})
+	@RequestMapping(value = "/calcList" , method = {RequestMethod.POST})
-	@ResponseBody
+	@ResponseBody
-	public ApiResponseMessage calcList(@RequestBody Map<String, Object> paramMap) throws Exception{
+	public ApiResponseMessage calcList(@RequestBody Map<String, Object> paramMap) throws Exception{
-		return calculateService.calcList(paramMap);
+		return calculateService.calcList(paramMap);
-	}
+	}
-	
+	
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 정산 이력 목록 엑셀 다운로드
+	 * desc : 정산 이력 목록 엑셀 다운로드
-	 * @param paramMap
+	 * @param paramMap
-	 * @return
+	 * @return
-	 * @throws Exception  
+	 * @throws Exception  
-	 */
+	 */
-	@RequestMapping(value = "/calcListExcel" , method = {RequestMethod.POST})
+	@RequestMapping(value = "/calcListExcel" , method = {RequestMethod.POST})
-	@ResponseBody
+	@ResponseBody
-	public ApiResponseMessage calcListExcel(@RequestBody Map<String, Object> paramMap) throws Exception{
+	public ApiResponseMessage calcListExcel(@RequestBody Map<String, Object> paramMap) throws Exception{
-		return calculateService.calcListExcel(paramMap);
+		return calculateService.calcListExcel(paramMap);
-	}
+	}
-}
+}

src/main/java/kr/co/uplus/ez/api/calculate/CalculateMapper.java

@@ -1,8 +1,8 @@
-package kr.co.uplus.ez.api.calculate;
+package kr.co.uplus.ez.api.calculate;
-
+
-import org.apache.ibatis.annotations.Mapper;
+import org.apache.ibatis.annotations.Mapper;
-
+
-@Mapper
+@Mapper
-public class CalculateMapper {
+public class CalculateMapper {
-
+
-}
+}

src/main/java/kr/co/uplus/ez/api/calculate/CalculateService.java

@@ -1,96 +1,96 @@
-package kr.co.uplus.ez.api.calculate;
+package kr.co.uplus.ez.api.calculate;
-
+
-import java.util.ArrayList;
+import java.util.ArrayList;
-import java.util.HashMap;
+import java.util.HashMap;
-import java.util.List;
+import java.util.List;
-import java.util.Map;
+import java.util.Map;
-
+
-import org.springframework.stereotype.Service;
+import org.springframework.stereotype.Service;
-
+
-import kr.co.uplus.ez.common.data.ApiResponseCode;
+import kr.co.uplus.ez.common.data.ApiResponseCode;
-import kr.co.uplus.ez.common.data.ApiResponseMessage;
+import kr.co.uplus.ez.common.data.ApiResponseMessage;
-
+
-@Service
+@Service
-public class CalculateService {
+public class CalculateService {
-
+
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 정산 이력 목록 조회
+	 * desc : 정산 이력 목록 조회
-	 * @param paramMap
+	 * @param paramMap
-	 * @return  
+	 * @return  
-	 */
+	 */
-	public ApiResponseMessage calcList(Map<String, Object> paramMap) {
+	public ApiResponseMessage calcList(Map<String, Object> paramMap) {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
-		Map<String, Object> dataObj = new HashMap<>();
+		Map<String, Object> dataObj = new HashMap<>();
-		List<Map<String,Object>> dataList = new ArrayList<>();
+		List<Map<String,Object>> dataList = new ArrayList<>();
-		Map<String, Object> data = new HashMap<>();
+		Map<String, Object> data = new HashMap<>();
-		data.put("totalCnt","999");
+		data.put("totalCnt","999");
-		data.put("currentPage","1");
+		data.put("currentPage","1");
-		dataObj.put("paging", data);
+		dataObj.put("paging", data);
-		
+		
-		for(int i=0; i<10; i++) {
+		for(int i=0; i<10; i++) {
-			data = new HashMap<>();			
+			data = new HashMap<>();			
-			data.put("date", "2022-02");
+			data.put("date", "2022-02");
-			data.put("custNm", "유플러스"+(i+1));
+			data.put("custNm", "유플러스"+(i+1));
-			data.put("bRegNo", "22-81-39937");
+			data.put("bRegNo", "22-81-39937");
-			data.put("plan", "요금제1(50000)");
+			data.put("plan", "요금제1(50000)");
-			data.put("startAmount", "50000");
+			data.put("startAmount", "50000");
-			data.put("useAmount", "100000");
+			data.put("useAmount", "100000");
-			data.put("carryOverAmount", "-");
+			data.put("carryOverAmount", "-");
-			data.put("unitAmount", "-");
+			data.put("unitAmount", "-");
-			data.put("extshAmount", "-");
+			data.put("extshAmount", "-");
-			data.put("requestAmount", "100000");
+			data.put("requestAmount", "100000");
-			data.put("allSendingCnt", "84000000");
+			data.put("allSendingCnt", "84000000");
-			data.put("sms", "21000000");
+			data.put("sms", "21000000");
-			data.put("lms", "21000000");
+			data.put("lms", "21000000");
-			data.put("mms", "21000000");
+			data.put("mms", "21000000");
-			data.put("notiTalk", "21000000");
+			data.put("notiTalk", "21000000");
-			dataList.add(data);			
+			dataList.add(data);			
-		}
+		}
-		dataObj.put("list", dataList);
+		dataObj.put("list", dataList);
-		result.setData(dataObj);
+		result.setData(dataObj);
-		return result;
+		return result;
-	}
+	}
-
+
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 정산 이력 목록 엑셀 다운로드
+	 * desc : 정산 이력 목록 엑셀 다운로드
-	 * @param paramMap
+	 * @param paramMap
-	 * @return  
+	 * @return  
-	 */
+	 */
-	public ApiResponseMessage calcListExcel(Map<String, Object> paramMap) {
+	public ApiResponseMessage calcListExcel(Map<String, Object> paramMap) {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
-		Map<String, Object> dataObj = new HashMap<>();
+		Map<String, Object> dataObj = new HashMap<>();
-		List<Map<String,Object>> dataList = new ArrayList<>();
+		List<Map<String,Object>> dataList = new ArrayList<>();
-		Map<String, Object> data = new HashMap<>();
+		Map<String, Object> data = new HashMap<>();
-		data.put("totalCnt","999");
+		data.put("totalCnt","999");
-		data.put("currentPage","1");
+		data.put("currentPage","1");
-		dataObj.put("paging", data);
+		dataObj.put("paging", data);
-		
+		
-		for(int i=0; i<10; i++) {
+		for(int i=0; i<10; i++) {
-			data = new HashMap<>();			
+			data = new HashMap<>();			
-			data.put("date", "2022-02");
+			data.put("date", "2022-02");
-			data.put("custNm", "유플러스"+(i+1));
+			data.put("custNm", "유플러스"+(i+1));
-			data.put("bRegNo", "22-81-39937");
+			data.put("bRegNo", "22-81-39937");
-			data.put("plan", "요금제1(50000)");
+			data.put("plan", "요금제1(50000)");
-			data.put("startAmount", "50000");
+			data.put("startAmount", "50000");
-			data.put("useAmount", "100000");
+			data.put("useAmount", "100000");
-			data.put("carryOverAmount", "-");
+			data.put("carryOverAmount", "-");
-			data.put("unitAmount", "-");
+			data.put("unitAmount", "-");
-			data.put("extshAmount", "-");
+			data.put("extshAmount", "-");
-			data.put("requestAmount", "100000");
+			data.put("requestAmount", "100000");
-			data.put("allSendingCnt", "84000000");
+			data.put("allSendingCnt", "84000000");
-			data.put("sms", "21000000");
+			data.put("sms", "21000000");
-			data.put("lms", "21000000");
+			data.put("lms", "21000000");
-			data.put("mms", "21000000");
+			data.put("mms", "21000000");
-			data.put("notiTalk", "21000000");
+			data.put("notiTalk", "21000000");
-			dataList.add(data);			
+			dataList.add(data);			
-		}
+		}
-		dataObj.put("list", dataList);
+		dataObj.put("list", dataList);
-		result.setData(dataObj);
+		result.setData(dataObj);
-		return result;
+		return result;
-	}
+	}
-
+
-}
+}

src/main/java/kr/co/uplus/ez/api/channelMgt/ChannelMgtController.java

@@ -1,38 +1,38 @@
-/**
+/**
- * date : 2022. 4. 25.
+ * date : 2022. 4. 25.
- * auth : ckr
+ * auth : ckr
- * desc : 채널관리 
+ * desc : 채널관리 
- */
+ */
-package kr.co.uplus.ez.api.channelMgt;
+package kr.co.uplus.ez.api.channelMgt;
-
+
-import java.util.Map;
+import java.util.Map;
-
+
-import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestBody;
-import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RequestMethod;
+import org.springframework.web.bind.annotation.RequestMethod;
-import org.springframework.web.bind.annotation.ResponseBody;
+import org.springframework.web.bind.annotation.ResponseBody;
-import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.bind.annotation.RestController;
-
+
-import kr.co.uplus.ez.common.data.ApiResponseMessage;
+import kr.co.uplus.ez.common.data.ApiResponseMessage;
-
+
-@RestController
+@RestController
-@RequestMapping(value = "api/v1/bo/channelMgt")
+@RequestMapping(value = "api/v1/bo/channelMgt")
-public class ChannelMgtController {
+public class ChannelMgtController {
-	@Autowired
+	@Autowired
-	ChannelMgtService channelService;
+	ChannelMgtService channelService;
-	
+	
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 알림톡 템플릿 목록 조회
+	 * desc : 알림톡 템플릿 목록 조회
-	 * @param paramMap
+	 * @param paramMap
-	 * @return
+	 * @return
-	 * @throws Exception  
+	 * @throws Exception  
-	 */
+	 */
-	@RequestMapping(value = "/tmpltList" , method = {RequestMethod.POST})
+	@RequestMapping(value = "/tmpltList" , method = {RequestMethod.POST})
-	@ResponseBody
+	@ResponseBody
-	public ApiResponseMessage tmpltList(@RequestBody Map<String, Object> paramMap) throws Exception{
+	public ApiResponseMessage tmpltList(@RequestBody Map<String, Object> paramMap) throws Exception{
-		return channelService.tmpltList(paramMap);
+		return channelService.tmpltList(paramMap);
-	}
+	}
-}
+}

src/main/java/kr/co/uplus/ez/api/channelMgt/ChannelMgtMapper.java

@@ -1,8 +1,8 @@
-package kr.co.uplus.ez.api.channelMgt;
+package kr.co.uplus.ez.api.channelMgt;
-
+
-import org.apache.ibatis.annotations.Mapper;
+import org.apache.ibatis.annotations.Mapper;
-
+
-@Mapper
+@Mapper
-public class ChannelMgtMapper {
+public class ChannelMgtMapper {
-
+
-}
+}

src/main/java/kr/co/uplus/ez/api/channelMgt/ChannelMgtService.java

@@ -1,51 +1,51 @@
-package kr.co.uplus.ez.api.channelMgt;
+package kr.co.uplus.ez.api.channelMgt;
-
+
-import java.util.ArrayList;
+import java.util.ArrayList;
-import java.util.HashMap;
+import java.util.HashMap;
-import java.util.List;
+import java.util.List;
-import java.util.Map;
+import java.util.Map;
-
+
-import org.springframework.stereotype.Service;
+import org.springframework.stereotype.Service;
-
+
-import kr.co.uplus.ez.common.data.ApiResponseCode;
+import kr.co.uplus.ez.common.data.ApiResponseCode;
-import kr.co.uplus.ez.common.data.ApiResponseMessage;
+import kr.co.uplus.ez.common.data.ApiResponseMessage;
-
+
-@Service
+@Service
-public class ChannelMgtService {
+public class ChannelMgtService {
-
+
-	/**
+	/**
-	 * date : 2022. 4. 25.
+	 * date : 2022. 4. 25.
-	 * auth : ckr
+	 * auth : ckr
-	 * desc : 알림톡 템플릿 목록 조회
+	 * desc : 알림톡 템플릿 목록 조회
-	 * @param paramMap
+	 * @param paramMap
-	 * @return  
+	 * @return  
-	 */
+	 */
-	public ApiResponseMessage tmpltList(Map<String, Object> paramMap) {
+	public ApiResponseMessage tmpltList(Map<String, Object> paramMap) {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
-		Map<String, Object> dataObj = new HashMap<>();
+		Map<String, Object> dataObj = new HashMap<>();
-		List<Map<String,Object>> dataList = new ArrayList<>();
+		List<Map<String,Object>> dataList = new ArrayList<>();
-		Map<String, Object> data = new HashMap<>();
+		Map<String, Object> data = new HashMap<>();
-		data.put("totalCnt","999");
+		data.put("totalCnt","999");
-		data.put("currentPage","1");
+		data.put("currentPage","1");
-		dataObj.put("paging", data);
+		dataObj.put("paging", data);
-		
+		
-		for(int i=0; i<10; i++) {
+		for(int i=0; i<10; i++) {
-			data = new HashMap<>();			
+			data = new HashMap<>();			
-			data.put("no", ""+(i+1));
+			data.put("no", ""+(i+1));
-			data.put("custNm", "유플러스");
+			data.put("custNm", "유플러스");
-			data.put("bRegNo", "229-81-39938");
+			data.put("bRegNo", "229-81-39938");
-			data.put("tmpltCd", "Abc");
+			data.put("tmpltCd", "Abc");
-			data.put("tmpltNm", "부가정보형");
+			data.put("tmpltNm", "부가정보형");
-			data.put("stat", "승인");
+			data.put("stat", "승인");
-			data.put("returnReason", "");
+			data.put("returnReason", "");
-			data.put("sendProfile", "@유플러스");
+			data.put("sendProfile", "@유플러스");
-			data.put("lastChgDt", "2022-03-10");
+			data.put("lastChgDt", "2022-03-10");
-			
+			
-			dataList.add(data);			
+			dataList.add(data);			
-		}
+		}
-		dataObj.put("list", dataList);
+		dataObj.put("list", dataList);
-		result.setData(dataObj);
+		result.setData(dataObj);
-		return result;
+		return result;
-	}
+	}
-
+
-}
+}

src/main/java/kr/co/uplus/ez/api/comm/CommController.java

@@ -1,78 +1,107 @@
-/**
+/**
- * date : 2022. 4. 26.
+ * date : 2022. 4. 26.
- * auth : ckr
+ * auth : ckr
- * desc : 공통   
+ * desc : 공통
- */
+ */
-package kr.co.uplus.ez.api.comm;
+package kr.co.uplus.ez.api.comm;
-
+
-import java.util.Map;
+import javax.servlet.http.HttpServletResponse;
-
+
-import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.beans.factory.annotation.Autowired;
-import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestBody;
-import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RequestMethod;
+import org.springframework.web.bind.annotation.RequestMethod;
-import org.springframework.web.bind.annotation.ResponseBody;
+import org.springframework.web.bind.annotation.ResponseBody;
-import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.bind.annotation.RestController;
-
+
-import kr.co.uplus.ez.common.data.ApiResponseMessage;
+import io.swagger.annotations.ApiOperation;
-
+import io.swagger.annotations.ApiResponse;
-@RestController
+import io.swagger.annotations.ApiResponses;
-@RequestMapping(value = "api/v1/bo/comm")
+import kr.co.uplus.ez.api.comm.dto.AuthResDto;
-public class CommController {
+import kr.co.uplus.ez.api.comm.dto.CodeReqDto;
-
+import kr.co.uplus.ez.api.comm.dto.CodeResDto;
-	@Autowired
+import kr.co.uplus.ez.api.comm.dto.MenuResDto;
-	CommService commService;
+import kr.co.uplus.ez.api.comm.dto.RefreshTokenReqDto;
-	
+import kr.co.uplus.ez.api.comm.dto.RefreshTokenResDto;
-	/**
+
-	 * date : 2022. 4. 26.
+/**
-	 * auth : ckr
+ * 공통관리 Controller.
-	 * desc : 메뉴 목록 조회
+ *
-	 * @param paramMap
+ * @author rejoice
-	 * @throws Exception  
+ *
-	 */
+ */
-	@RequestMapping(value = "/getMenu" , method = {RequestMethod.POST})
+@RestController
-	@ResponseBody
+@RequestMapping(value = "api/v1/bo/comm")
-	public ApiResponseMessage getMenu() throws Exception{
+public class CommController {
-		return commService.getMenu();
+
-	}
+	@Autowired
-	
+	CommService commService;
-	/**
+
-	 * date : 2022. 4. 26.
+	/**
-	 * auth : ckr
+	 * date : 2022. 4. 26.
-	 * desc : 공통 코드 조회
+	 * auth : ckr
-	 * @param paramMap
+	 * desc : 메뉴 목록 조회
-	 * @throws Exception  
+	 *
-	 */
+	 * @return MenuResDto
-	@RequestMapping(value = "/getCode" , method = {RequestMethod.POST})
+	 */
-	@ResponseBody
+	@ApiOperation(value = "getMenu", notes = "메뉴 목록 조회")
-	public ApiResponseMessage getCode(@RequestBody Map<String, Object> paramMap) throws Exception{
+	@ApiResponses({
-		return commService.getCode(paramMap);
+		@ApiResponse(code = HttpServletResponse.SC_OK, message = "SUCESS")
-	}
+	})
-	
+	@RequestMapping(value = "/getMenu" , method = {RequestMethod.POST})
-	/**
+	@ResponseBody
-	 * date : 2022. 4. 26.
+	public MenuResDto getMenu() {
-	 * auth : ckr
+		return commService.getMenu();
-	 * desc : 토큰요청
+	}
-	 * @param paramMap
+
-	 * @throws Exception  
+	/**
-	 */
+	 * date : 2022. 4. 26.
-	@RequestMapping(value = "/getToken" , method = {RequestMethod.POST})
+	 * auth : ckr
-	@ResponseBody
+	 * desc : 공통 코드 조회
-	public ApiResponseMessage getToken(@RequestBody Map<String, Object> paramMap) throws Exception{
+	 *
-		return commService.getToken(paramMap);
+	 * @param codeReqDto
-	}
+	 * @return CodeResDto
-	
+	 */
-	/**
+	@ApiOperation(value = "getCode", notes = "공통 코드 조회")
-	 * date : 2022. 4. 26.
+	@ApiResponses({
-	 * auth : ckr
+		@ApiResponse(code = HttpServletResponse.SC_OK, message = "SUCESS")
-	 * desc : 토큰연장
+	})
-	 * @param paramMap
+	@RequestMapping(value = "/getCode" , method = {RequestMethod.POST})
-	 * @throws Exception  
+	@ResponseBody
-	 */
+	public CodeResDto getCode(@RequestBody CodeReqDto codeReqDto) {
-	@RequestMapping(value = "/refreshToken" , method = {RequestMethod.POST})
+		return commService.getCode(codeReqDto);
-	@ResponseBody
+	}
-	public ApiResponseMessage refreshToken(@RequestBody Map<String, Object> paramMap) throws Exception{
+
-		return commService.refreshToken(paramMap);
+	/**
-	}	
+	 * date : 2022. 4. 26.
-	
+	 * auth : ckr
-}
+	 * desc : 토큰연장
+	 *
+	 * @param refreshTokenReqDto
+	 * @return RefreshTokenResDto
+	 */
+	@ApiOperation(value = "refreshToken", notes = "토큰연장")
+	@ApiResponses({
+		@ApiResponse(code = HttpServletResponse.SC_OK, message = "SUCESS")
+	})
+	@RequestMapping(value = "/refreshToken" , method = {RequestMethod.POST})
+	@ResponseBody
+	public RefreshTokenResDto refreshToken(@RequestBody RefreshTokenReqDto refreshTokenReqDto) {
+		return commService.refreshToken(refreshTokenReqDto);
+	}
+
+	/**
+	 * 권한 코드 조회.
+	 *
+	 * @return
+	 */
+	@ApiOperation(value = "getAuth", notes = "권한 코드 조회")
+	@ApiResponses({
+		@ApiResponse(code = HttpServletResponse.SC_OK, message = "SUCESS")
+	})
+	@RequestMapping(value = "/getAuth" , method = {RequestMethod.POST})
+	@ResponseBody
+	public AuthResDto getAuth() {
+		return commService.getAuth();
+	}
+}

src/main/java/kr/co/uplus/ez/api/comm/CommMapper.java

@@ -1,10 +1,19 @@
-package kr.co.uplus.ez.api.comm;
+package kr.co.uplus.ez.api.comm;
-
+
-import java.util.List;
+import java.util.List;
-
+
-import org.apache.ibatis.annotations.Mapper;
+import org.apache.ibatis.annotations.Mapper;
-
+
-@Mapper
+import kr.co.uplus.ez.api.comm.dto.Auth;
-public interface CommMapper {
+import kr.co.uplus.ez.api.comm.dto.Code;
-	public List<Menu> getMenuByRole(String role) throws Exception;
+import kr.co.uplus.ez.api.comm.dto.CodeReqDto;
-}
+import kr.co.uplus.ez.api.comm.dto.Menu;
+
+@Mapper
+public interface CommMapper {
+	public List<Menu> getMenuByRole(String role);
+
+	public List<Code> getCommCode(CodeReqDto codeReqDto);
+
+	public List<Auth> getAuthCode();
+}

src/main/java/kr/co/uplus/ez/api/comm/CommService.java

@@ -1,90 +1,143 @@
-package kr.co.uplus.ez.api.comm;
+package kr.co.uplus.ez.api.comm;
-
+
-import java.util.List;
+import java.util.List;
-import java.util.Map;
+import java.util.Map;
-import java.util.function.Function;
+import java.util.function.Function;
-import java.util.stream.Collectors;
+import java.util.stream.Collectors;
-
+
-import org.slf4j.Logger;
+import org.mybatis.spring.SqlSessionTemplate;
-import org.slf4j.LoggerFactory;
+import org.slf4j.Logger;
-import org.springframework.beans.factory.annotation.Autowired;
+import org.slf4j.LoggerFactory;
-import org.springframework.stereotype.Service;
+import org.springframework.beans.factory.annotation.Autowired;
-
+import org.springframework.beans.factory.annotation.Qualifier;
-import kr.co.uplus.ez.common.data.ApiResponseCode;
+import org.springframework.stereotype.Service;
-import kr.co.uplus.ez.common.data.ApiResponseMessage;
+
-import kr.co.uplus.ez.common.utils.SpringUtils;
+import kr.co.uplus.ez.api.comm.dto.Auth;
-
+import kr.co.uplus.ez.api.comm.dto.AuthRes;
-@Service
+import kr.co.uplus.ez.api.comm.dto.AuthResDto;
-public class CommService {
+import kr.co.uplus.ez.api.comm.dto.Code;
-	private final Logger log = LoggerFactory.getLogger(getClass());
+import kr.co.uplus.ez.api.comm.dto.CodeReqDto;
-	
+import kr.co.uplus.ez.api.comm.dto.CodeRes;
-	@Autowired
+import kr.co.uplus.ez.api.comm.dto.CodeResDto;
-	CommMapper commMapper;
+import kr.co.uplus.ez.api.comm.dto.Menu;
-	/**
+import kr.co.uplus.ez.api.comm.dto.MenuResDto;
-	 * date : 2022. 4. 26.
+import kr.co.uplus.ez.api.comm.dto.RefreshTokenReqDto;
-	 * auth : ckr
+import kr.co.uplus.ez.api.comm.dto.RefreshTokenResDto;
-	 * desc : 메뉴 목록 조회
+import kr.co.uplus.ez.common.data.ApiResponseCode;
-	 * @param paramMap
+import kr.co.uplus.ez.common.utils.SpringUtils;
-	 * @return  
+
-	 */
+@Service
-	public ApiResponseMessage getMenu() throws Exception{
+public class CommService {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+
-		String currUserRole = SpringUtils.getCurrentUserRole();
+	private final Logger log = LoggerFactory.getLogger(getClass());
-		log.debug("currUserRole : {}", currUserRole);
+
-		List<Menu> menuList = commMapper.getMenuByRole(currUserRole);
+	@Autowired
-		
+	@Qualifier("sqlSessionTemplateDb1")
-		Menu root = new Menu();
+	private SqlSessionTemplate sqlSessionMaster;
-		Map<Integer, Menu> map = menuList.stream().collect(
+
-				Collectors.toMap(Menu::getMenuNo, Function.identity()));
+	@Autowired
-		
+	@Qualifier("sqlSessionTemplateDb2")
-		for (Menu menu : menuList) {
+	private SqlSessionTemplate sqlSessionSlave;
-			Integer prntId = menu.getPrntsMenuNo();
+
-			if (prntId == null || prntId == 0) {
+	/**
-				root.addChild(menu);
+	 * date : 2022. 4. 26.
-			}
+	 * auth : ckr
-			else {
+	 * desc : 메뉴 목록 조회
-				map.get(prntId).addChild(menu);
+	 *
-			}
+	 * @return MenuResDto
-		}
+	 */
-		
+	public MenuResDto getMenu() {
-		result.setData(root);
+
-		return result;
+		CommMapper commMapper = sqlSessionSlave.getMapper(CommMapper.class);
-	}
+
-
+		String currUserRole = SpringUtils.getCurrentUserRole();
-	/**
+		log.debug("currUserRole : {}", currUserRole);
-	 * date : 2022. 4. 26.
+		List<Menu> menuList = commMapper.getMenuByRole(currUserRole);
-	 * auth : ckr
+
-	 * desc : 공통 코드 조회
+		Menu root = new Menu();
-	 * @param paramMap
+		Map<Integer, Menu> map = menuList.stream().collect(
-	 * @return  
+				Collectors.toMap(Menu::getMenuNo, Function.identity()));
-	 */
+
-	public ApiResponseMessage getCode(Map<String, Object> paramMap) {
+		for (Menu menu : menuList) {
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+			Integer prntId = menu.getPrntsMenuNo();
-		return result;
+			if (prntId == null || prntId == 0) {
-	}
+				root.addChild(menu);
-
+			}
-	/**
+			else {
-	 * date : 2022. 4. 26.
+				map.get(prntId).addChild(menu);
-	 * auth : ckr
+			}
-	 * desc : 토큰요청
+		}
-	 * @param paramMap
+		MenuResDto result = new MenuResDto(ApiResponseCode.SUCCESS, root);
-	 * @return  
+		return result;
-	 */
+	}
-	public ApiResponseMessage getToken(Map<String, Object> paramMap) {
+
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+	/**
-		return result;
+	 * date : 2022. 4. 26.
-	}
+	 * auth : ckr
-
+	 * desc : 공통 코드 조회
-	/**
+	 * @param codeReqDto
-	 * date : 2022. 4. 26.
+	 * @return CodeResDto
-	 * auth : ckr
+	 */
-	 * desc : 토큰연장
+	public CodeResDto getCode(CodeReqDto codeReqDto) {
-	 * @param paramMap
+		// 1.디비 메퍼 정하기
-	 * @return  
+		CommMapper commMapper = sqlSessionSlave.getMapper(CommMapper.class);
-	 */
+
-	public ApiResponseMessage refreshToken(Map<String, Object> paramMap) {
+		// 2. request 파라미터 벨리데이션 체크 필수값, 데이터 타입
-		ApiResponseMessage result = new ApiResponseMessage(ApiResponseCode.SUCCESS);
+
-		return result;
+		// 3. 쿼리 조회 메퍼를 통해서 메퍼.xml 데이터 들고오기
-	}
+		List<Code> codeList = commMapper.getCommCode(codeReqDto);
-
+
-}
+		// 응답 파라이터
+		CodeRes codRes = new CodeRes();
+		codRes.setList(codeList);
+
+		// 응답 메시지
+		CodeResDto result = new CodeResDto();
+		result.setData(codRes);
+
+		return result;
+	}
+
+	/**
+	 * date : 2022. 4. 26.
+	 * auth : ckr
+	 * desc : 토큰연장
+	 * @param refreshTokenReqDto
+	 * @return RefreshTokenResDto
+	 */
+	public RefreshTokenResDto refreshToken(RefreshTokenReqDto refreshTokenReqDto) {
+
+		// 1. 리프레시 토큰 조회.
+
+		// 2. AuthToken 생성.
+
+		// 3. 응답.
+
+
+
+		RefreshTokenResDto result = new RefreshTokenResDto(ApiResponseCode.SUCCESS);
+		return result;
+	}
+
+	/**
+	 * 권한 코드 조회.
+	 *
+	 * @return AuthResDto
+	 */
+	public AuthResDto getAuth(){
+		// 1.디비 메퍼 정하기
+		CommMapper commMapper = sqlSessionSlave.getMapper(CommMapper.class);
+
+		List<Auth> auths = commMapper.getAuthCode();
+
+		// 응답 파라이터
+		AuthRes authRes = new AuthRes();
+		authRes.setList(auths);
+
+		// 응답 메시지
+		AuthResDto result = new AuthResDto();
+		result.setData(authRes);
+
+		return result;
+	}
+}

src/main/java/kr/co/uplus/ez/api/comm/Menu.java

@@ -1,29 +1,29 @@
-package kr.co.uplus.ez.api.comm;
+package kr.co.uplus.ez.api.comm;
-
+
-import java.util.ArrayList;
+import java.util.ArrayList;
-import java.util.List;
+import java.util.List;
-
+
-import lombok.Data;
+import lombok.Data;
-
+
-@Data
+@Data
-public class Menu {
+public class Menu {
-	
+	
-	private Integer menuNo;			// 메뉴 번호
+	private Integer menuNo;			// 메뉴 번호
-	private Integer prntsMenuNo;    // 부모 메뉴 번호
+	private Integer prntsMenuNo;    // 부모 메뉴 번호
-	private String 	menuNm;         // 메뉴 명
+	private String 	menuNm;         // 메뉴 명
-	private Integer menuOdrg;       // 메뉴 순서
+	private Integer menuOdrg;       // 메뉴 순서
-	private String useYn;           // 사용 여부
+	private String useYn;           // 사용 여부
-	private Integer autchkGrpno;    // 권한체크 그룹번호
+	private Integer autchkGrpno;    // 권한체크 그룹번호
-	private Integer menuLvl;        // 메뉴 레벨
+	private Integer menuLvl;        // 메뉴 레벨
-	private String menuUrl;         // 메뉴 URL
+	private String menuUrl;         // 메뉴 URL
-	private String regId;           // 등록 ID
+	private String regId;           // 등록 ID
-	private String regDt;           // 등록 일시
+	private String regDt;           // 등록 일시
-	private String chgId;           // 변경 ID
+	private String chgId;           // 변경 ID
-	private String chgDt;           // 변경 일시
+	private String chgDt;           // 변경 일시
-	private List<Menu> children = new ArrayList<>();
+	private List<Menu> children = new ArrayList<>();
-	
+	
-	public void addChild(Menu menu) {
+	public void addChild(Menu menu) {
-		children.add(menu);
+		children.add(menu);
-	}
+	}
-	
+	
-}
+}