공통 팝업호출 명칭 변경 uiPopupClose -> uifnPopupClose

style24.admin/src/main/webapp/WEB-INF/views/common/ExcelUploadPopupForm.html

@@ -19,7 +19,7 @@
 			<!-- TITLE -->
 			<div class="panelTitle">
 				<strong>엑셀업로드</strong>
-				<button type="button" class="close" onclick="uiPopupClose('popupExcelUpload')"><i class="fa fa-times"></i></button>
+				<button type="button" class="close" onclick="uifnPopupClose('popupExcelUpload')"><i class="fa fa-times"></i></button>
 			</div>
 			<!-- //TITLE -->
 			<!-- CONTENT -->
@@ -103,7 +103,7 @@
 					else eval( callback(jsonData) );
 				}
 			}
-			uiPopupClose('popupExcelUpload');
+			uifnPopupClose('popupExcelUpload');
 		}
 	});	
 	

style24.admin/src/main/webapp/WEB-INF/views/envset/EnvsetHistoryForm.html

@@ -19,7 +19,7 @@
 		<!-- TITLE -->
 		<div class="panelTitle">
 			<strong th:text="${envsetTypeNm + ' 이력'}">쇼핑몰Meat정보 이력</strong>
-			<button type="button" class="close" onclick="uiPopupClose('popupEnvset');"><i class="fa fa-times" aria-hidden="true"></i></button>
+			<button type="button" class="close" onclick="uifnPopupClose('popupEnvset');"><i class="fa fa-times" aria-hidden="true"></i></button>
 		</div>
 		<!-- //TITLE -->
 		

style24.admin/src/main/webapp/WEB-INF/views/system/UserDetailForm.html

@@ -19,7 +19,7 @@
 		<!-- TITLE -->
 		<div class="panelTitle">
 			<strong th:text="${'사용자 ' + (mode == 'N' ? '등록' : '상세')}">사용자 상세</strong>
-			<button type="button" class="close" onclick="uiPopupClose('popupUser');"><em class="fa fa-times"></em></button>
+			<button type="button" class="close" onclick="uifnPopupClose('popupUser');"><em class="fa fa-times"></em></button>
 		</div>
 		<!-- //TITLE -->
 		
@@ -422,7 +422,7 @@
 				}
 				
 				gagajf.ajaxFormSubmit($(formId).prop('action'), formId, function() {
-					uifnPopClose('popupUser');
+					uifnPopupClose('popupUser');
 					$('#btnSearch').trigger('click');
 				});
 			}

style24.admin/src/main/webapp/ux/css/admin.ui.css

@@ -22,9 +22,9 @@ button, select {text-transform:none;}
 button,[type=button],[type=reset],[type=submit] {margin:0; -webkit-appearance:button; border-radius:0; cursor:pointer; background-color:transparent; border-color:transparent;}
 button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner {padding:0; border-style:none;}
 textarea {overflow:auto; resize:vertical; width:100%; margin:4px 0; vertical-align:middle; line-height:22px; height:32px;}
-.textareaR2 {height:60px; line-height:26px;}
-.textareaR3 {height:96px; line-height:26px;}
-.textareaR4 {height:134px; line-height:26px;}
+.textareaR2 {min-height:60px; line-height:26px;}
+.textareaR3 {min-height:96px; line-height:26px;}
+.textareaR4 {min-height:134px; line-height:26px;}
 .byteChk {line-height:20px; padding-left:20px; display:inline-block; vertical-align:middle;}
 select {margin:0 3px 1px 0; padding:3px 10px 3px 3px; color:inherit; border-radius:1px; vertical-align:middle;}
 select, input[type=text], input[type=file], input[type=date], input[type=password], textarea {border:1px solid #dbdbdb;}
@@ -112,6 +112,8 @@ header a, header button {color:#fff;}
 #lnb .dep2.on {display:block; background:url('../../image/icon_dep2On.png') 10px 50% no-repeat, url('../../image/icon_depArr2On.png') 222px 50% no-repeat; background-color:#233646;}
 #lnb .dep3 {padding:5px 0 10px 10px; border-left:4px solid #8597eb; cursor:pointer;}
 #lnb .dep3 a {padding:10px; cursor:pointer;}
+#lnb .dep4 {padding:5px 0 10px 20px; cursor:pointer;}
+#lnb .dep4 a {padding:10px; cursor:pointer;}
 
 /* main--------------- */
 #main-wrapper {position:relative; left:0; top:0; margin-left:0; min-height:100%; padding-bottom:60px; vertical-align:top; color:#222; transition:margin-left .3s; -webkit-transition:margin-left .3s;}
@@ -150,14 +152,13 @@ header a, header button {color:#fff;}
 .panelStyle .division li {display:table-cell; padding-right:40px;}
 .panelStyle .division li:last-child {padding-right:0;}
 /* table, grid, button 상하 여백 */
-.frmStyle, .ag-theme-balham{margin-bottom:15px !important;}
+.ag-theme-balham{margin-bottom:15px !important;}
 .frmStyle + .panelBar {padding-bottom:15px;}
 .ag-theme-balham {margin:10px 0 15px;}
 .ag-theme-balham + .panelBar{padding-bottom:15px;}
 .panelBar + .ag-theme-balham {margin:0 0 15px;}
 .panelBar + .frmStyle {margin-top:0;}
 
-
 /* TABS 영역 --------------- */
 .tabs {position:relative; margin-bottom:30px; margin-left:20px; margin-right:20px;}
 .tabs h2 {position:absolute; top:0; z-index:2; margin-left:10px; font-size:14px; line-height:34px;}
@@ -233,20 +234,13 @@ a, button, .ui-state-active, .ui-state-focus, .ui-state-hover {outline:0 !import
 .xScroll {overflow-x:auto;}
 .yScroll {overflow-y:auto;}
 
-/* 좌우배치 스타일--------------- */
-.lrStyle {display:table; width:100%; padding-bottom:10px;}
-.lrStyle li {display:table-cell; vertical-align:middle; line-height:26px;}
-.lrStyle em {color:red;}
-
 /* 폼테이블 스타일 --------------- */
-.frmStyle {width:100%;}
+.frmStyle {width:100%; margin-bottom:15px;}
 .frmStyle th {border-top:1px solid #dae0fd;}
 .frmStyle tr:last-child th {border-bottom:1px solid #dae0fd;}
 .frmStyle tr:last-child td {border-bottom:1px solid #eee;}
 .frmStyle th {padding:0 15px; height:36px; line-height:24px; white-space:nowrap; text-align:center; background:#e9ecfb;}
 .frmStyle td {padding:0 10px 0 10px; line-height:36px; position:relative; border-top:1px solid #eee; border-right:1px solid #eee;}
-.frmBtnT {padding-bottom:10px; overflow:auto;}
-.frmBtnB {padding-top:10px; overflow:auto;}
 
 /* 체크박스&라디오박스 공통--------------- */
 input[type=checkbox],
@@ -266,14 +260,14 @@ input[type=radio]:checked::after {position:absolute; top:5px; left:5px; content:
 input[type=radio].formControl::before {background:#eee;}
 
 /* 테이블 스타일--------------- */
-.tableStyle {width:100%; max-width:100%;}
+.tableStyle {width:100%; max-width:100%; margin-bottom:15px;}
 .tableStyle th {position:relative; padding:7px 0; color:#333; border-top:1px solid #dae0fd; border-bottom:1px solid #dae0fd; border-right:1px solid #dae0fd; background-color:#e9ecfb; text-align:center;}
 .tableStyle th:last-child {border-right:none;}
 .tableStyle td {position:relative; padding:7px 0; border-right:1px solid #ebebeb; border-bottom:1px solid #ebebeb; text-align:center;}
 .tableStyle td:last-child {border-right:none;}
 .tableStyle tbody tr:nth-of-type(2n) {background-color:rgba(0, 0, 0, 0.02);}
 .tableStyle tbody tr:hover {background-color:rgba(224,243,255,0.6);}
-
+.tableStyle + .panelBar {padding-bottom:15px;}
 /* 스캔 */
 .scanTbl th {font-size:25px; line-height:80px;}
 .scanTbl td {line-height:80px;}
@@ -343,8 +337,8 @@ td[rowspan] {border-bottom:1px solid #eee;}
 .btn.icn i {padding-top:6px; width:12px; vertical-align:top; font-size:14px; text-align:center;}
 
 /* 페이징 --------------- */
-.tablePaging {	position:relative; 	display:inline-block;}
-.tablePaging a {display:inline-block; float:left; margin:0 5px; width:28px; height:28px; line-height:28px; text-align:center; border:1px solid #ccc; border-radius:50px;}
+.tablePaging {position:relative; 	display:inline-block; vertical-align: middle;}
+.tablePaging a {display:inline-block; float:left; margin:0 5px; width:28px; height:28px; line-height:28px; text-align:center; border:1px solid #ccc; border-radius:50px; cursor:pointer;}
 .tablePaging a.arrow {background-color:rgba(0, 0, 0, 0.03); 	border-color:#ebebeb;}
 .tablePaging .num.on {background:#8597eb; color:#fff; border-color:#8597eb;}
 
@@ -466,16 +460,16 @@ p.dot em {color:red;}
 /*Color :Gray ---*/
 .color-mGray header,span.color-mGray {background:linear-gradient(to right,#6c757d 0%,#555 100%) !important;}
 .color-gray header,span.color-gray {background:#666 !important;}
-.color-mGray .frmStyle th,.color-mGray .tableStyle th,.color-gray .frmStyle th,.color-gray .tableStyle th {	background:#eee !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
-.color-mGray .tablePaging .num.on,.color-gray .tablePaging .num.on {	background:#888 !important; 	border-color:#888 !important;}
+.color-mGray .frmStyle th,.color-mGray .tableStyle th,.color-gray .frmStyle th,.color-gray .tableStyle th {background:#eee !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
+.color-mGray .tablePaging .num.on,.color-gray .tablePaging .num.on {background:#888 !important; 	border-color:#888 !important;}
 .color-mGray #lnb .dep3,.color-gray #lnb .dep3 {border-color:#777 !important;}
 .color-mGray .tabsJrNav li.on a,.color-gray .tabsJrNav li.on a {color:#333;}
 
 /*Color :Blue ---*/
 .color-mBlue header,span.color-mBlue {background:linear-gradient(to right,#4481eb 0%,#04befe 100%) !important;}
 .color-blue header,span.color-blue {background:#0042a5 !important;}
-.color-mBlue .frmStyle th,.color-mBlue .tableStyle th,.color-blue .frmStyle th,.color-blue .tableStyle th {	background:#d8eafc !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
-.color-mBlue .tablePaging .num.on,.color-blue .tablePaging .num.on {	background:#3e91de !important; 	border-color:#3e91de !important;}
+.color-mBlue .frmStyle th,.color-mBlue .tableStyle th,.color-blue .frmStyle th,.color-blue .tableStyle th {background:#d8eafc !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
+.color-mBlue .tablePaging .num.on,.color-blue .tablePaging .num.on {background:#3e91de !important; 	border-color:#3e91de !important;}
 .color-mBlue #lnb .dep3,.color-blue #lnb .dep3 {border-color:#3e91de !important;}
 .color-mBlue .tabsJrNav li.on a,.color-blue .tabsJrNav li.on a {background:#d8eafc;}
 .color-mBlue .tabJr.on,.color-blue .tabJr.on {border-top:4px solid #d8eafc;}
@@ -484,8 +478,8 @@ p.dot em {color:red;}
 /*Color :Green ---*/
 .color-mGreen header,span.color-mGreen {background:linear-gradient(135deg,#00b09b 0,#96c93d 100%) !important;}
 .color-green header,span.color-green {background:#00b09b !important;}
-.color-mGreen .frmStyle th,.color-mGreen .tableStyle th,.color-green .frmStyle th,.color-green .tableStyle th {	background:#e5f7f5 !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
-.color-mGreen .tablePaging .num.on,.color-green .tablePaging .num.on {	background:rgba(0,176,155,0.8); 	border-color:rgba(0,176,155,0.8) !important;}
+.color-mGreen .frmStyle th,.color-mGreen .tableStyle th,.color-green .frmStyle th,.color-green .tableStyle th {background:#e5f7f5 !important; 	border-top:1px solid #ddd; 	border-bottom:1px solid #ddd;}
+.color-mGreen .tablePaging .num.on,.color-green .tablePaging .num.on {background:rgba(0,176,155,0.8); 	border-color:rgba(0,176,155,0.8) !important;}
 .color-mGreen #lnb .dep3,.color-green #lnb .dep3 {border-color:#00b09b !important;}
 .color-mGreen .tabsJrNav li.on a,.color-green .tabsJrNav li.on a {background:#e5f7f5;}
 .color-mGreen .tabJr.on,.color-green .tabJr.on {border-top:4px solid #e5f7f5;}
@@ -513,7 +507,7 @@ p.dot em {color:red;}
 .color-wivis #lnb .dep3{background:#fdfdfd !important;  }
 .color-wivis #lnb .dep3 a{color:#111111 !important;}
 .color-wivis #lnb a{color:#fff !important;}
-.color-wivis .frmStyle th, .color-wivis .tableStyle th, .color-wivis .frmStyle th, .color-wivis .tableStyle th{	background:#eee !important; 	border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
+.color-wivis .frmStyle th, .color-wivis .tableStyle th, .color-wivis .frmStyle th, .color-wivis .tableStyle th{background:#eee !important; 	border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
 .color-wivis .tablePaging .num.on, .color-wivis .tablePaging .num.on{background:#888 !important; 	border-color:#888 !important;}
 .color-wivis .tabsJrNav li.on a, .color-wivis .tabsJrNav li.on a{color:#333; background:#eee !important}
 .color-wivis .tabJr.on, .color-wivis .tabJr.on { border-top: 4px solid #eee;}
@@ -661,19 +655,19 @@ table.mtz-monthpicker {border:1px solid #ddd; border-top:none;}
 .multiCheckBox label {display:flex;}
 
 /* checkBox More */
-.checkBoxMore {overflow:hidden; padding-right:36px; height:36px;}
-.checkBoxMore.on {overflow:visible; height:auto;}
-.checkBoxMore .more {position:absolute; top:-1px; right:0; width:36px; height:38px; border:1px solid #eee; background:#f7f7f7;}
-.checkBoxMore ul {display:flex; flex-wrap:wrap;}
-.checkBoxMore li {justify-content:flex-start; line-height:36px;}
-.checkBoxMore[data-unit='1'] li {flex-basis:100%;}
-.checkBoxMore[data-unit='2'] li {flex-basis:50%;}
-.checkBoxMore[data-unit='3'] li {flex-basis:33%;}
-.checkBoxMore[data-unit='4'] li {flex-basis:25%;}
-.checkBoxMore[data-unit='5'] li {flex-basis:20%;}
-.checkBoxMore[data-unit='6'] li {flex-basis:16.6%;}
-.checkBoxMore[data-unit='7'] li {flex-basis:14.2%;}
-.checkBoxMore[data-unit='8'] li {flex-basis:12.5%;}
+.checkBoxList {overflow:hidden; padding-right:36px; height:36px;}
+.checkBoxList.on {overflow:visible; height:auto;}
+.checkBoxList .more {position:absolute; top:-1px; right:0; width:36px; height:38px; border:1px solid #eee; background:#f7f7f7;}
+.checkBoxList ul {display:flex; flex-wrap:wrap;}
+.checkBoxList li {justify-content:flex-start; line-height:36px;}
+.checkBoxList[data-unit='1'] li {flex-basis:100%;}
+.checkBoxList[data-unit='2'] li {flex-basis:50%;}
+.checkBoxList[data-unit='3'] li {flex-basis:33%;}
+.checkBoxList[data-unit='4'] li {flex-basis:25%;}
+.checkBoxList[data-unit='5'] li {flex-basis:20%;}
+.checkBoxList[data-unit='6'] li {flex-basis:16.6%;}
+.checkBoxList[data-unit='7'] li {flex-basis:14.2%;}
+.checkBoxList[data-unit='8'] li {flex-basis:12.5%;}
 
 /* 아이콘 툴팁 버튼 */
 .iconTooltip {display:inline-block; position:relative; margin-right:10px;}

style24.admin/src/main/webapp/ux/js/admin.popup.js

@@ -42,7 +42,7 @@ var cfnOpenModalPopup = function(actionUrl, oTarget) {
 	}
 
 	$("#" + oTarget).load(actionUrl, function() {
-		uiPopupOpen(oTarget);
+		uifnPopupOpen(oTarget);
 		
 		$('.schDate').datepicker({
 			changeMonth: true,
@@ -91,7 +91,7 @@ var cfnOpenGoodsDetailPopup = function(mode, goodsCd) {
 	if (typeof(goodsCd) != "undefined") {
 		actionUrl += "&goodsCd=" + goodsCd;
 	}
-	uiPopupClose('popupGoodsDetail');
+	uifnPopupClose('popupGoodsDetail');
 	cfnOpenModalPopup(actionUrl, 'popupGoodsDetail');
 }
 

style24.admin/src/main/webapp/ux/js/admin.ui.js

@@ -18,8 +18,9 @@ function chartResize(){
 };
 
 //체크박스 전체선택
-function uifnAllCheck(id) {
-	var $thisId = $("#"+id);
+function uifnAllCheck(id, el) {
+	let $thisId = $("#"+id); //전체선택 및 전체해제
+	//전체선택 및 전체해제
 	if ( $thisId.hasClass("checked") ) {
 		$thisId.removeClass("checked");
 		$("input[name="+id+"]").parent("label").removeClass("checked");
@@ -29,11 +30,16 @@ function uifnAllCheck(id) {
 		$("input[name="+id+"]").parent("label").addClass("checked");
 		$("input[name="+id+"]").prop("checked", true);
 	};
-	return false;
+	//checkBoxList : 체크된 갯수 출력
+	if ( (el != undefined) && ( $(el).parents().find(".checkBoxList").length > 0) ){
+		let cntId = $(el).parent().parent().parent().attr("data-count-id");
+		let cntLen =  $(document).find("input[name="+id+"]:checkbox:checked").length;
+		$("#"+cntId).text(cntLen);
+	};
 };
 
 //MODAL & MODELESS POPUP 열기
-function uiPopupOpen(id){
+function uifnPopupOpen(id){
 	var $thisId = $(document).find("#"+id);
 	var popW = parseInt( $thisId.children().attr("data-width"));
 	var popH = parseInt( $thisId.children().attr("data-height"));
@@ -103,7 +109,7 @@ function uiPopupOpen(id){
 };
 
 //MODAL POPUP CLOSE
-function uiPopupClose(id) {
+function uifnPopupClose(id) {
 	var $thisId = $("#"+id);
 	$thisId.children().css({display:"none"});
 	$thisId.children().remove();
@@ -178,10 +184,36 @@ $(document).ready(function(){
 		return false;
 	});
 
-	// 체크박스
-	$(document).on("click", "input[type=checkbox]", function(){
-		var thisId = $(this).attr("name");
-		$("#"+thisId).removeClass("checked").prop("checked", false);
+	//CheckBox List : 개별 선택 및 해제
+	$(document).on("click", ".checkBoxList .chkBox", function(){
+		let id = $(this).find("input").attr("name");
+		let cntId = $(this).parent().parent().attr("data-count-id");
+		let cntLen =  $(document).find("input[name="+id+"]:checked").length;
+		$("#"+cntId).text(cntLen);
+	});
+	/* CheckBox List : More(+) 버튼 */
+	$(document).on("click", ".checkBoxList .more", function(){
+		var thisI = $(this).find("i");
+		if( $(thisI).hasClass("fa-plus") ){
+			$(this).parent().addClass("on");
+			$(thisI).removeClass("fa-plus").addClass("fa-minus");
+		} else {
+			$(this).parent().removeClass("on");
+			$(thisI).removeClass("fa-minus").addClass("fa-plus");
+		}
+	});
+
+	/* Multi CheckBox - 다중선택 체크박스 */
+	$(document).on("click", ".multiCheckBox .sltBtn", function(){
+		if($(this).hasClass("on")){
+			$(this).removeClass("on");
+			$(this).parent().find("ul").css({display:"none"});
+		}else{
+			$(".multiCheckBox .sltBtn").removeClass("on");
+			$(".multiCheckBox ul").css({display:"none"});
+			$(this).addClass("on");
+			$(this).parent().find("ul").css({display:"block"});
+		}
 	});
 
 	//햄버거버튼 : LNB 숨김(전체화면 보기)
@@ -664,31 +696,46 @@ $(document).ready(function(){
 	//Date Picker End-----------------------------------------------------------
 
 
-	/* checkbox More */
-	$(document).on("click", ".checkBoxMore .more", function(){
-		var thisI = $(this).find("i");
-		if( $(thisI).hasClass("fa-plus") ){
-			$(this).parent().addClass("on");
-			$(thisI).removeClass("fa-plus").addClass("fa-minus");
-		} else {
-			$(this).parent().removeClass("on");
-			$(thisI).removeClass("fa-minus").addClass("fa-plus");
-		}
-	});
+	//SUMMERNOTE
+	if ( $(document).find("#summernote").length > 0 ) {
+		document.emojiSource = 'ux/summernote/pngs/'; //이모티콘 경로
+		$(document).find("#summernote").summernote({
+			disableDragAndDrop:true, //drag&drop 사용안함
+			placeholder: '내용을 입력하세요',
+			height: 300, //에디터 기본 높이
+			lang : 'ko-KR', //기본 언어 인코딩
+			fontNames: ['Malgun Gothic', 'HY견고딕', 'Helvetica', 'Verdana', 'Arial', 'Arial Black'], //폰트 스타일
+			fontNamesIgnoreCheck: ['Malgun Gothic'], //기본폰트 스타일
+			focus: true, //로드시 에디터창에 포커싱
+			fontSizes: ['8','9','10','11','12','13','14','15','16','17','18','19','20','24','30','36'],
+			toolbar: [
+				['style', ['style']],
+				['Font Style', ['fontname']],
+				['fontsize', ['fontsize']],
+				['height', ['height']],
+				['style', ['bold', 'italic', 'underline','clear']],
+				['font', ['strikethrough', 'superscript', 'subscript']],
+				['color', ['color']],
+				['para', ['ul', 'ol', 'paragraph']],
+				['Insert', ['table']],
+				['Insert', ['link', 'picture', 'video']],
+				['misc', ['emoji', 'print']],
+				['code', ['fullscreen', 'codeview', 'help']]
+			],
+			callbacks: {
+				onImageUpload: function(files, editor, welEditable) { //이미지 업로드
+					for (var i = files.length - 1; i >= 0; i--) {
+						sendFile(files[i], this);
+					}
+				}
+			}
+		});
+	};
+
+
+
 
 
-	/* Multi CheckBox */
-	$(document).on("click", ".multiCheckBox .sltBtn", function(){
-		if($(this).hasClass("on")){
-			$(this).removeClass("on");
-			$(this).parent().find("ul").css({display:"none"});
-		}else{
-			$(".multiCheckBox .sltBtn").removeClass("on");
-			$(".multiCheckBox ul").css({display:"none"});
-			$(this).addClass("on");
-			$(this).parent().find("ul").css({display:"block"});
-		}
-	});
 
 
 });

style24.admin/src/main/webapp/ux/plugins/mcxdialog/mcxdialog_ui.css

@@ -69,12 +69,18 @@
 	border:1px solid #999;
 	min-width:100px;
 }
-.dialog-mobile .dialog-sure-button {
+.dialog-mobile .dialog-sure-button{
 	color: #fff;
 	background:#000;
 	border:1px solid #000;
 	min-width:100px;
 }
+.dialog-mobile button[i='1']{
+	color: #000 !important;
+	background:#fff !important;
+	border:1px solid #777;
+	min-width:100px;
+}
 
 /* 닫기 아이콘 */
 .dialog-close-btn {
@@ -85,7 +91,7 @@
 	width: 17px;
 	height: 17px;
 	cursor:pointer;
-	background:url('/image/btn_top_close.png') no-repeat 50% 50%;
+	background:url('../../image/btn_top_close.png') no-repeat 50% 50%;
 }
 
 /*bottom dialog*/