고객센터 관련 수정

src/main/java/com/style24/front/biz/service/TsfCounselService.java

@@ -91,9 +91,11 @@ public class TsfCounselService {
 	 */
 	public Collection<Counsel> getOneToOneQnaList(Counsel counsel) {
 		Collection<Counsel> counselList = counselDao.getOneToOneQnaList(counsel);
-		for (Counsel item : counselList) {
-			item.setQuestContent(GagaStringUtil.replace(item.getQuestContent(), "\r\n", "<br/>"));
-			item.setAnsContent(GagaStringUtil.replace(item.getAnsContent(), "\r\n", "<br/>"));
+		if (counselList != null && !counselList.isEmpty()) {
+			for (Counsel item : counselList) {
+				item.setQuestContent(GagaStringUtil.replace(item.getQuestContent(), "\r\n", "<br/>"));
+				item.setAnsContent(GagaStringUtil.replace(item.getAnsContent(), "\r\n", "<br/>"));
+			}
 		}
 
 		return counselList;

src/main/webapp/WEB-INF/views/mob/callcenter/FaqFormMob.html

@@ -41,7 +41,7 @@
 					</form>
 				</div>
 				<div class="fold_nav">
-					<ul>
+					<ul id="ulFaqType">
 						<li><a href="#none;" onclick="fnGetList(this);" class="on">전체</a></li>
 						<li th:if="${faqTypeList != null and !faqTypeList.empty}" th:each="oneData, status : ${faqTypeList}">
 							<a href="javascript:void(0);" th:onclick='fnGetList(this, [[${oneData.cd}]]);' th:text="${oneData.cdNm}">상품문의</a>
@@ -103,13 +103,15 @@
 			$('#faqForm input[name=faqType]').val('');
 		}
 		
+		$('#faqForm input[name=pageNo]').val(1);
+		
+		$('#ulFaq').html('');
+		
 		$('#btnFaqMore').trigger('click');
 	}
 	
 	// FAQ 목록 콜백함수
 	var fnGetListCallback = function(result) {
-		$('#ulFaq').html('');
-
 		if (result.dataList != null && result.dataList.length > 0) {
 			$.each(result.dataList, function(idx, item) {
 				let tag = '<li>\n';
@@ -158,7 +160,9 @@
 		}
 		
 		$('#faqForm input[name=faqType]').val('');
-		$('#btnFaqMore').trigger('click');
+		
+// 		$('#btnFaqMore').trigger('click');
+		fnGetList($('#ulFaqType>li').eq(0).find('a'));
 	}
 /*]]>*/
 </script>

src/main/webapp/WEB-INF/views/mob/callcenter/GoodsQnaFormMob.html

@@ -32,15 +32,15 @@
 				<!-- 게시판info -->
 				<ul class="inquiry_box">
 					<li>
-						<p th:text="${qnaCountInfo.totCnt}">999</p>
+						<p th:text="${qnaCountInfo.totCnt}" id="qnaTotCnt">999</p>
 						<p>총 문의</p>
 					</li>
 					<li>
-						<p th:text="${qnaCountInfo.ansCnt}">456</p>
+						<p th:text="${qnaCountInfo.ansCnt}" id="qnaAnsCnt">456</p>
 						<p>답변완료</p>
 					</li>
 					<li>
-						<p th:text="${qnaCountInfo.ingCnt}">690</p>
+						<p th:text="${qnaCountInfo.ingCnt}" id="qnaIngCnt">690</p>
 						<p>처리 중</p>
 					</li>
 				</ul>
@@ -89,8 +89,6 @@
 	
 	// QNA 콜백함수
 	var fnGetListCallback = function(result) {
-		$('#ulQna').html('');
-
 		// 목록
 		if (result.dataList != null && result.dataList.length > 0) {
 			$.each(result.dataList, function(idx, item) {
@@ -135,8 +133,8 @@
 				$('#divQna').removeClass('nodata');
 			});
 		} else {
-			let tag = '<li>내역이 없습니다.</li>\n';
-			$('#ulQna').append(tag);
+// 			let tag = '<li>내역이 없습니다.</li>\n';
+// 			$('#ulQna').append(tag);
 			$('#divQna').addClass('nodata');
 		}
 		
@@ -161,7 +159,17 @@
 				gagajf.ajaxJsonSubmit('/callcenter/goods/qna/delete'
 						, jsonData
 						, function() {
-							fnGetList();
+							$('#qnaForm input[name=pageNo]').val(1);
+							$('#ulQna').html('');
+							$('#btnQnaMore').trigger('click');
+							
+							$.get('/callcenter/goods/qna/count/info'
+									, function(result) {
+										$('#qnaTotCnt').html(result.totCnt);
+										$('#qnaAnsCnt').html(result.ansCnt);
+										$('#qnaIngCnt').html(result.ingCnt);
+									}
+								);
 						});
 			}
 		});

src/main/webapp/WEB-INF/views/mob/callcenter/NoticeFormMob.html

@@ -71,38 +71,7 @@
 	
 	// 목록 콜백함수
 	var fnGetListCallback = function(result) {
-		$('#ulNotice').html('');
-
 		// 중요 공지 목록
-		if (result.urgentList != null && result.urgentList.length > 0) {
-			$.each(result.urgentList, function(idx, item) {
-				let tag = '<li>\n';
-				tag += '	<div class="fold_head">\n';
-				tag += '		<a href="javascript:void(0)">\n';
-				tag += '			<div>\n';
-				tag += '				<div class="fold_tit">\n';
-				tag += '					<div class="lap1">\n';
-				tag += '						<span class="fold_state done">중요</span>\n';
-				tag += '						<span class="prod">공지</span>\n';
-				tag += '					</div>\n';
-				tag += '					<div class="lap2"><span>' + item.noticeTitle + '</span></div>\n';
-				tag += '				</div>\n';
-				tag += '				<span class="data">' + item.regDt.toDate("YYYYMMDD").format("YYYY.MM.DD") + '</span>\n';
-				tag += '			</div>\n';
-				tag += '		</a>\n';
-				tag += '	</div>\n';
-				tag += '	<div class="fold_cont">\n';
-				tag += '		<div class="fold_answer">\n';
-				tag += '			<div class="answer_body">' + item.noticeContent + '</div>\n';
-				tag += '		</div>\n';
-				tag += '	</div>\n';
-				tag += '</li>\n';
-
-				$('#ulNotice').append(tag);
-			});
-		}
-		
-		// 일반 공지 목록
 		if (result.dataList != null && result.dataList.length > 0) {
 			$.each(result.dataList, function(idx, item) {
 				let tag = '<li>\n';
@@ -111,7 +80,12 @@
 				tag += '			<div>\n';
 				tag += '				<div class="fold_tit">\n';
 				tag += '					<div class="lap1">\n';
-				tag += '						<span class="prod">공지</span>\n';
+				
+				if (item.urgentYn == 'Y') {
+					tag += '						<span class="fold_state done">중요</span>\n';
+				}
+				
+// 				tag += '						<span class="prod">공지</span>\n';
 				tag += '					</div>\n';
 				tag += '					<div class="lap2"><span>' + item.noticeTitle + '</span></div>\n';
 				tag += '				</div>\n';
@@ -125,16 +99,10 @@
 				tag += '		</div>\n';
 				tag += '	</div>\n';
 				tag += '</li>\n';
-				
+
 				$('#ulNotice').append(tag);
 			});
-		}
-		
-		if (result.urgentList == null && result.dataList == null) {
-			let tag = '<li>내역이 없습니다.</li>\n';
-			$('#ulNotice').append(tag);
-			$('#divNotice').addClass('nodata');
-		} else {
+			
 			$('#divNotice').removeClass('nodata');
 			
 			if (result.paging.pageable.totalPage > result.paging.pageable.pageNo) {
@@ -143,7 +111,54 @@
 			} else {
 				$('#btnNoticeMore').parent().hide();
 			}
+		} else {
+// 			let tag = '<li>내역이 없습니다.</li>\n';
+// 			$('#ulNotice').append(tag);
+			$('#divNotice').addClass('nodata');
 		}
+		
+// 		// 일반 공지 목록
+// 		if (result.dataList != null && result.dataList.length > 0) {
+// 			$.each(result.dataList, function(idx, item) {
+// 				let tag = '<li>\n';
+// 				tag += '	<div class="fold_head">\n';
+// 				tag += '		<a href="javascript:void(0)">\n';
+// 				tag += '			<div>\n';
+// 				tag += '				<div class="fold_tit">\n';
+// 				tag += '					<div class="lap1">\n';
+// 				tag += '						<span class="prod">공지</span>\n';
+// 				tag += '					</div>\n';
+// 				tag += '					<div class="lap2"><span>' + item.noticeTitle + '</span></div>\n';
+// 				tag += '				</div>\n';
+// 				tag += '				<span class="data">' + item.regDt.toDate("YYYYMMDD").format("YYYY.MM.DD") + '</span>\n';
+// 				tag += '			</div>\n';
+// 				tag += '		</a>\n';
+// 				tag += '	</div>\n';
+// 				tag += '	<div class="fold_cont">\n';
+// 				tag += '		<div class="fold_answer">\n';
+// 				tag += '			<div class="answer_body">' + item.noticeContent + '</div>\n';
+// 				tag += '		</div>\n';
+// 				tag += '	</div>\n';
+// 				tag += '</li>\n';
+				
+// 				$('#ulNotice').append(tag);
+// 			});
+// 		}
+		
+// 		if (result.urgentList == null && result.dataList == null) {
+// 			let tag = '<li>내역이 없습니다.</li>\n';
+// 			$('#ulNotice').append(tag);
+// 			$('#divNotice').addClass('nodata');
+// 		} else {
+// 			$('#divNotice').removeClass('nodata');
+			
+// 			if (result.paging.pageable.totalPage > result.paging.pageable.pageNo) {
+// 				$('#btnNoticeMore').parent().show();
+// 				$('#noticeForm input[name=pageNo]').val(result.paging.pageable.pageNo + 1);
+// 			} else {
+// 				$('#btnNoticeMore').parent().hide();
+// 			}
+// 		}
 	}
 /*]]>*/
 </script>

src/main/webapp/WEB-INF/views/mob/callcenter/OneToOneQnaFormMob.html

@@ -32,15 +32,15 @@
 				<!-- 게시판info -->
 				<ul class="inquiry_box">
 					<li>
-						<p th:text="${qnaCountInfo.totCnt}">999</p>
+						<p th:text="${qnaCountInfo.totCnt}" id="qnaTotCnt">999</p>
 						<p>총 문의</p>
 					</li>
 					<li>
-						<p th:text="${qnaCountInfo.ansCnt}">456</p>
+						<p th:text="${qnaCountInfo.ansCnt}" id="qnaAnsCnt">456</p>
 						<p>답변완료</p>
 					</li>
 					<li>
-						<p th:text="${qnaCountInfo.ingCnt}">690</p>
+						<p th:text="${qnaCountInfo.ingCnt}" id="qnaIngCnt">690</p>
 						<p>처리 중</p>
 					</li>
 				</ul>
@@ -111,13 +111,13 @@
 										<div class="ui_col_12 form_full">
 											<div class="input_wrap">
 												<div class="select">
-													<select class="select_hidden" name="counselClsf">
-														<option value="">(필수) 문의 유형을 선택해 주세요</option>
+													<select class="select_hidden" name="counselClsf" required="required" data-valid-name="문의유형">
+														<option value="">문의 유형을 선택해 주세요 (필수)</option>
 														<option th:if="${counselClsfList}" th:each="oneData, status : ${counselClsfList}" th:value="${oneData.cd}" th:text="${oneData.cdNm}"></option>
 													</select>
-													<!-- <div class="select_dress">(필수) 문의 유형을 선택해 주세요<span></span></div> -->
+													<!-- <div class="select_dress">문의 유형을 선택해 주세요 (필수)<span></span></div> -->
 													<ul class="select_options">
-														<li rel="">(필수) 유형을 선택해 주세요</li>
+														<li rel="">문의 유형을 선택해 주세요 (필수)</li>
 														<li th:if="${counselClsfList}" th:each="oneData, status : ${counselClsfList}" th:rel="${oneData.cd}" th:text="${oneData.cdNm}"></li>
 													</ul>
 												</div>
@@ -128,7 +128,7 @@
 										<div class="ui_col_12 form_full">
 											<div class="input_wrap test">
 												<span class="input_group_addon"><span class="ico"></span></span>
-												<input type="text" class="form_control" placeholder="(필수) 문의 제목을 입력해 주세요" maxlength="30" name="questTitle" required="required" data-valid-name="제목"/>
+												<input type="text" class="form_control" placeholder="제목을 입력해 주세요 (필수)" maxlength="30" name="questTitle" required="required" data-valid-name="제목"/>
 											</div>
 											<!-- 숫자, 특수문자, 불완성형 한글 제외하여 입력 -->
 										</div>
@@ -136,7 +136,7 @@
 									<div class="form_field">
 										<div class="ui_col_12 form_full">
 											<div class="input_wrap">
-												<textarea class="doc_contactus" name="questContent" cols="30" rows="10" style="resize: none;" placeholder="내용을 입력해 주세요. (500자 이내)" required="required" data-valid-name="내용"></textarea>
+												<textarea class="doc_contactus" name="questContent" cols="30" rows="10" style="resize: none;" placeholder="내용을 입력해 주세요. (필수)" required="required" data-valid-name="내용"></textarea>
 												<p class="txt_cnt">
 													<span id="contactus_cnt" class="contactus_cnt"><em class="c_primary">0</em>/500</span>
 												</p>
@@ -144,20 +144,21 @@
 											<!-- 특수문자 : \ / : < >  사용 불가 > 입력 시, “특수문자 \ / : < > 는 사용할 수 없습니다.” 얼럿 호출 스크립트 입력 불가능 -->
 										</div>
 									</div>
+									
 									<div class="form_field">
 										<div class="ui_col_12 form_full">
 											<div class="input_wrap">
 												<!-- 이미지첨부 -->
 												<div class="form_field">
 													<div class="imgUpload">
-														<label for="fileAdd" class="fileAdd">첫번째업로드</label>
-														<input type="file" id="fileAdd" name="file1"/>
+														<label for="fileAdd" class="fileAdd">업로드</label>
+														<input type="file" id="fileAdd" name="file1">
 														<input type="hidden" name="file1OrgFileNm"/>
 														<input type="hidden" name="file1SysFileNm"/>
 													</div>
 													<div class="imgUpload">
-														<label for="fileAdds" class="fileAdd">두번째업로드</label>
-														<input type="file" id="fileAdds" name="file2"/>
+														<label for="fileAdds" class="fileAdd">업로드</label>
+														<input type="file" id="fileAdds" name="file2">
 														<input type="hidden" name="file2OrgFileNm"/>
 														<input type="hidden" name="file2SysFileNm"/>
 													</div>
@@ -234,6 +235,56 @@
 	});
 	
 	$(document).ready(function() {
+		$('select').each(function() {
+			var $this = $(this), numberOfOptions = $(this).children('option').length;
+			
+			$this.addClass('select_hidden');
+			$this.wrap('<div class="select"></div>');
+			$this.after('<div class="select_dress"></div>');
+			
+			var $dressSelect = $this.next('div.select_dress');
+			$dressSelect.text($this.children('option').eq(0).text());
+			
+			var $selList = $('<ul />', {
+				'class': 'select_options'
+			}).insertAfter($dressSelect);
+			
+			for (var i = 0; i < numberOfOptions; i++) {
+				$('<li />', {
+					text: $this.children('option').eq(i).text(),
+					rel: $this.children('option').eq(i).val(),
+					class: $this.children('option').eq(i).attr('disabled')
+				}).appendTo($selList);
+			}
+			
+			var $selListItems = $selList.children('li');
+			
+			$dressSelect.click(function(e) {
+				e.stopPropagation();
+				$('div.select_dress.active').not(this).each(function(){
+					$(this).removeClass('active').next('ul.select_options').hide();
+				});
+				$(this).toggleClass('active').next('ul.select_options').toggle();
+			});
+			
+			$selListItems.click(function(e) {
+				e.stopPropagation();
+				
+				if($(this).hasClass('disabled')){
+					$this.val($(this).attr('rel',false));
+				} else {
+					$dressSelect.text($(this).text()).removeClass('active');
+					$this.val($(this).attr('rel'));
+					$selList.hide();
+				}
+			});
+			
+			$(document).click(function() {
+				$dressSelect.removeClass('active');
+				$selList.hide();
+			});
+		});
+		
 		// 타이틀명
 		$('#htopTitle').text('고객센터');
 		
@@ -250,8 +301,6 @@
 	
 	// QNA 콜백함수
 	var fnGetListCallback = function(result) {
-		$('#ulQna').html('');
-
 		// 목록
 		if (result.dataList != null && result.dataList.length > 0) {
 			$.each(result.dataList, function(idx, item) {
@@ -279,13 +328,15 @@
 					
 					if (!gagajf.isNull(item.sysFileNm1)) {
 						tag += '		<span class="thumb_pic">\n';
-						tag += '			<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm1 + '" alt="" onerror="this.src=\'/image/bg_profile.png\'">\n';
+// 						tag += '			<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm1 + '" alt="" onerror="this.src=\'/image/bg_profile.png\'">\n';
+						tag += '			<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm1 + '" alt="">\n';
 						tag += '		</span>\n';
 					}
 					
 					if (!gagajf.isNull(item.sysFileNm2)) {
 						tag += '		<span class="thumb_pic">\n';
-						tag += '			<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm2 + '" alt="" onerror="this.src=\'/image/bg_profile.png\'">\n';
+// 						tag += '			<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm2 + '" alt="" onerror="this.src=\'/image/bg_profile.png\'">\n';
+						tag += '			<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm2 + '" alt="">\n';
 						tag += '		</span>\n';
 					}
 					
@@ -317,8 +368,8 @@
 			});
 			$('#divQna').removeClass('nodata');
 		} else {
-			let tag = '<li>내역이 없습니다.</li>\n';
-			$('#ulQna').append(tag);
+// 			let tag = '<li>내역이 없습니다.</li>\n';
+// 			$('#ulQna').append(tag);
 			$('#divQna').addClass('nodata');
 		}
 
@@ -343,7 +394,17 @@
 				gagajf.ajaxJsonSubmit('/callcenter/onetoone/qna/delete'
 						, jsonData
 						, function() {
+							$('#qnaForm input[name=pageNo]').val(1);
+							$('#ulQna').html('');
 							$('#btnQnaMore').trigger('click');
+							
+							$.get('/callcenter/onetoone/qna/count/info'
+									, function(result) {
+										$('#qnaTotCnt').html(result.totCnt);
+										$('#qnaAnsCnt').html(result.ansCnt);
+										$('#qnaIngCnt').html(result.ingCnt);
+									}
+								);
 						});
 			}
 		});

src/main/webapp/WEB-INF/views/web/callcenter/NoticeFormWeb.html

@@ -127,9 +127,11 @@
 
 				$('#ulNotice').append(tag);
 			});
+			
+			$('#divNotice').removeClass('nodata');
 		} else {
-			let tag = '<li>내역이 없습니다.</li>\n';
-			$('#ulNotice').html(tag);
+// 			let tag = '<li>등록된 공지사항이 없습니다.</li>\n';
+// 			$('#ulNotice').html(tag);
 			$('#divNotice').addClass('nodata');
 		}
 

src/main/webapp/WEB-INF/views/web/callcenter/OneToOneQnaFormWeb.html

@@ -199,13 +199,13 @@
 					
 					if (!gagajf.isNull(item.sysFileNm1)) {
 						tag += '					<span class="thumb_pic">\n';
-						tag += '						<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm1 + '" alt="" onerror="this.src=\'/image/bg_profile.png\'">\n';
+						tag += '						<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm1 + '" alt="" onerror="this.src=\'/images/pc/thumb/bg_item_none.png\'">\n';
 						tag += '					</span>\n';
 					}
 					
 					if (!gagajf.isNull(item.sysFileNm2)) {
 						tag += '					<span class="thumb_pic">\n';
-						tag += '						<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm2 + '" alt="" onerror="this.src=\'/image/bg_profile.png\'">\n';
+						tag += '						<img src="' + _uploadImageUrl + '/counsel/' + item.sysFileNm2 + '" alt="" onerror="this.src=\'/images/pc/thumb/bg_item_none.png\'">\n';
 						tag += '					</span>\n';
 					}
 					

src/main/webapp/ux/mo/css/layout_m.css

@@ -130,7 +130,7 @@
 .cs_contactUs_my textarea { width: 100%; height: 15rem; box-sizing: border-box; padding: 1.5rem; font-size: 1.4rem;}
 .cs_contactUs_my .form_field { margin: 0 0 1.2rem; }
 .cs_contactUs_my .info_addfile ul li {font-size: 1.2rem; color: #c6c6c6;}
-.cs_contactUs_my_footer { width: 100%; height: 5.7rem; background: #222; color: #fff; text-align: center;  font-size: 1.6rem; line-height: 5.7rem; bottom: 0; position: fixed; z-index: 1000;}
+.cs_contactUs_my_footer { width: 100%; height: 5.7rem; background: #222; color: #fff; text-align: center;  font-size: 1.6rem; line-height: 5.7rem; bottom: 0; position: fixed; z-index: 100;}
 .cs_contactUs_my .select_dress { height: 4.5rem; padding: 0 1.5rem; line-height: 4.5rem;}
 .cs_contactUs_my .blt_dot {position:relative; padding-left:1rem}
 .cs_contactUs_my .blt_dot::before {content:''; position:absolute; left:0; top:50%; margin-top:-0.2rem; width:0.3rem; height:0.3rem; background:#888;}
@@ -379,7 +379,7 @@
 /* .item_prod .itemLike.active::before {opacity: 1;} */
 .itemLike.likeit::before {opacity: 1;}
 .item_prod .itemLink {position: relative;text-decoration: none;color: rgb(102, 102, 102);cursor: pointer;display: block;}
-.item_prod .itemPic {position: relative;width: 100%;margin-bottom: 1.5rem;padding-top: 150%;font-size: 0px;overflow: hidden;}
+.item_prod .itemPic {position: relative;width: 100%;margin-bottom: 1.5rem;padding-top: 150%;font-size: 0px;overflow: hidden; background-color: #fff;}
 /*.item_prod .itemPic::after {content: "";display: block;position: absolute;top: 0px;left: 0px;width: 100%;height: 100%;opacity: 0.03;background-color: rgb(0, 0, 0);}*/
 .item_prod .itemPic .pd_img {position: absolute;width: 100%;height: auto;top: 50%;left: 0px;transform: translateY(-50%);}
 .item_prod .itemBrand {display: inline-block; margin: 0px 0.5rem 0.3rem; font-size: 1rem;font-weight: 300;color: rgb(137, 137, 137); text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;width:10rem;overflow:hidden;}