|
|
@@ -0,0 +1,246 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="ko"
|
|
|
+ xmlns:th="http://www.thymeleaf.org"
|
|
|
+ xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
|
|
|
+ layout:decorator="web/common/layout/CallcenterLayoutWeb">
|
|
|
+<!--
|
|
|
+ *******************************************************************************
|
|
|
+ * @source : OneToOneQnaFormWeb.html
|
|
|
+ * @desc : 1:1문의 Page
|
|
|
+ *============================================================================
|
|
|
+ * STYLE24
|
|
|
+ * Copyright(C) 2020 TSIT, All rights reserved.
|
|
|
+ *============================================================================
|
|
|
+ * VER DATE AUTHOR DESCRIPTION
|
|
|
+ * === =========== ========== =============================================
|
|
|
+ * 1.0 2021.02.19 gagamel 최초 작성
|
|
|
+ *******************************************************************************
|
|
|
+ -->
|
|
|
+<body>
|
|
|
+
|
|
|
+<th:block layout:fragment="content">
|
|
|
+ <main role="" id="" class="container cs">
|
|
|
+ <!-- 고객센터 Gnb -->
|
|
|
+ <nav class="pnb" id="callcenterGnb">
|
|
|
+ </nav>
|
|
|
+ <!-- //고객센터 Gnb -->
|
|
|
+
|
|
|
+ <!-- ★ 컨텐츠 시작 -->
|
|
|
+ <section class="content cs_contactUs_1">
|
|
|
+ <div class="inner sr-only"><h2 class="title">1:1문의</h2></div>
|
|
|
+ <div class="inner wide">
|
|
|
+ <!-- 게시판info -->
|
|
|
+ <ul class="inquiry_box">
|
|
|
+ <li>
|
|
|
+ <p th:text="${qnaCountInfo.totCnt}">999</p>
|
|
|
+ <p>총 문의</p>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <p th:text="${qnaCountInfo.ansCnt}">456</p>
|
|
|
+ <p>답변완료</p>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <p th:text="${qnaCountInfo.ingCnt}">690</p>
|
|
|
+ <p>처리 중</p>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <!-- //게시판info -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="inner wide">
|
|
|
+ <!-- 폴딩리스트2 -->
|
|
|
+ <div class="ui_row" id="divQna"> <!-- 데이터 없을시 클래스 nodata 추가 -->
|
|
|
+ <div class="foldGroup case2">
|
|
|
+ <!-- list2 -->
|
|
|
+ <ul id="ulQna">
|
|
|
+ </ul>
|
|
|
+ <!-- //list2 -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="ui_foot" id="nextPage">
|
|
|
+ <button class="btn btnM btnIcon_more" onclick="fnGetList();">더보기</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+ <!-- ★ 컨텐츠 종료 -->
|
|
|
+ </main>
|
|
|
+
|
|
|
+ <div class="cs_contactUs_my_footer">
|
|
|
+ <a href="#none" class="questionMy"><p>1:1문의</p></a>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 모달영역 -->
|
|
|
+ <div>
|
|
|
+ <div class="modal pop_full fade" id="thumb_pic" tabindex="-1" role="dialog" aria-labelledby="exampleFullLabel" aria-hidden="true" style="display: none;">
|
|
|
+ <div class="modal-dialog" role="document">
|
|
|
+ <div class="modal-content">
|
|
|
+ <div class="modal-header">
|
|
|
+ <h5 class="modal-title sr-only">문의이미지슬라이드</h5>
|
|
|
+ </div>
|
|
|
+ <div class="modal-body">
|
|
|
+ <div class="pop_cont">
|
|
|
+ <!-- Swiper -->
|
|
|
+ <div class="swiper-container cs_pop">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <div class="swiper-slide"><div class="pop_img" style="background-image: url(/images/mo/cs_pop_people.png);"></div></div>
|
|
|
+ <div class="swiper-slide"><div class="pop_img" style="background-image: url(/images/mo/cs_pop_people2.png);"></div></div>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- //모달끝 -->
|
|
|
+
|
|
|
+ <form id="qnaForm" name="qnaForm" action="#" th:action="@{'/callcenter/onetoone/qna/list'}">
|
|
|
+ <input type="hidden" name="pageNo" value ="1"/>
|
|
|
+ <input type="hidden" name="pageSize" value ="10"/>
|
|
|
+ </form>
|
|
|
+
|
|
|
+<script src="/ux/plugins/gaga/gaga.paging.js"></script>
|
|
|
+<script th:inline="javascript">
|
|
|
+/*<![CDATA[*/
|
|
|
+ // JQUERY를 이용한 버튼 모달 팝업
|
|
|
+ $(".thumb_pic").click(function() {
|
|
|
+ $("#thumb_pic").modal("show");
|
|
|
+ });
|
|
|
+
|
|
|
+ // 슬라이더_팝업에 문의이미지슬라이드
|
|
|
+ var swiper = new Swiper('#thumb_pic .swiper-container.cs_pop', {
|
|
|
+ observer: true,
|
|
|
+ observeParents: true,
|
|
|
+ pagination: {
|
|
|
+ el: '#thumb_pic .swiper-pagination',
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ $(document).ready(function() {
|
|
|
+ // 고객센터 GNB 설정
|
|
|
+ fnSetCallcenterGnb(2);
|
|
|
+
|
|
|
+ fnGetList(1);
|
|
|
+ });
|
|
|
+
|
|
|
+ let fnGetList = function(page) {
|
|
|
+ // Initialize a pagination
|
|
|
+ gagaPaging.init('qnaForm', fnGetListCallback, 'pageNav', 10);
|
|
|
+
|
|
|
+ // Load data
|
|
|
+ gagaPaging.load(page);
|
|
|
+ }
|
|
|
+
|
|
|
+ var fnGetListCallback = function(result) {
|
|
|
+ $('#ulQna').html('');
|
|
|
+
|
|
|
+ // 목록
|
|
|
+ if (result.dataList != null && result.dataList.length > 0) {
|
|
|
+ $.each(result.dataList, function(idx, item) {
|
|
|
+ let tag = '<li>\n';
|
|
|
+ tag += ' <div class="inner wide">\n';
|
|
|
+ tag += ' <div class="ui_row">\n'; //데이터 없을시 클래스 nodata 추가
|
|
|
+ tag += ' <div class="foldGroup case2">\n';
|
|
|
+ tag += ' <ul>\n';
|
|
|
+ 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 ' + (item.ansStat == "G060_10" ? "doing" : "done") + '">' + item.ansStatNm + '</span>\n'; //답변완료 : done / 처리중 : doing
|
|
|
+ tag += ' <span class="prod">' + item.counselClsfNm + '</span>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <div class="lap2"><span>' + item.questTitle + '</span></div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <span class="data">' + item.questDt + '</span>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </a>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <div class="fold_cont">\n';
|
|
|
+ tag += ' <div class="fold_detail">\n';
|
|
|
+ tag += ' <div>' + item.questContent + '</p>\n';
|
|
|
+
|
|
|
+ if (!gagajf.isNull(item.sysFileNm1) || !gagajf.isNull(item.sysFileNm2)) {
|
|
|
+ tag += ' <p class="img_group">\n';
|
|
|
+
|
|
|
+ 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 += ' </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 += ' </span>\n';
|
|
|
+ }
|
|
|
+
|
|
|
+ tag += ' </p>\n';
|
|
|
+ }
|
|
|
+
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+
|
|
|
+ if (item.ansStat == 'G060_20') { // 답변완료 상태일 때
|
|
|
+ tag += ' <div class="fold_answer">\n';
|
|
|
+ tag += ' <div>\n';
|
|
|
+ tag += ' <div class="answer_body">' + item.ansContent + '</div>\n';
|
|
|
+ tag += ' <div class="answer_foot">\n';
|
|
|
+ tag += ' <span class="data">' + item.ansDt + '</span>\n';
|
|
|
+
|
|
|
+ if (item.ansStat == 'G060_10') { // 처리중일때
|
|
|
+// tag += ' <button type="button" class="btn_delete" onclick="fnDeleteQna(' + item.counselSq + ');"><span>삭제</span></button>
|
|
|
+ }
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ }
|
|
|
+
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += '</li>\n';
|
|
|
+
|
|
|
+ $('#ulQna').append(tag);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ let tag = '<li>내역이 없습니다.</li>\n';
|
|
|
+ $('#ulQna').append(tag);
|
|
|
+ $('#divQna').addClass('nodata');
|
|
|
+ }
|
|
|
+
|
|
|
+ // 더보기 버튼 노출/미노출
|
|
|
+ if (result.paging.pageable.totalPage == result.paging.pageable.currPage) {
|
|
|
+ $('#nextPage').hide();
|
|
|
+ } else {
|
|
|
+ $('#nextPage').show();
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 삭제
|
|
|
+ let fnDeleteQna = function(counselSq) {
|
|
|
+ mcxDialog.confirm("등록된 내용을 삭제하시겠습니까?", {
|
|
|
+ cancelBtnText: "취소",
|
|
|
+ sureBtnText: "확인",
|
|
|
+ sureBtnClick: function() {
|
|
|
+ let params = new Object();
|
|
|
+ params.counselSq = counselSq;
|
|
|
+
|
|
|
+ var jsonData = JSON.stringify(params);
|
|
|
+ gagajf.ajaxJsonSubmit('/callcenter/onetoone/qna/delete'
|
|
|
+ , jsonData
|
|
|
+ , function() {
|
|
|
+ fnGetList();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+/*]]>*/
|
|
|
+</script>
|
|
|
+
|
|
|
+</th:block>
|
|
|
+
|
|
|
+</body>
|
|
|
+</html>
|
gagamel