|
|
@@ -0,0 +1,367 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="ko" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorator="mob/common/layout/MypageLayoutMob">
|
|
|
+<!--
|
|
|
+ *******************************************************************************
|
|
|
+ * @source : MypageCreListFormMob.html
|
|
|
+ * @desc : 마이페이지 > 취소/반품/교환내역 Page
|
|
|
+ *============================================================================
|
|
|
+ * STYLE24
|
|
|
+ * Copyright(C) 2021 TSIT, All rights reserved.
|
|
|
+ *============================================================================
|
|
|
+ * VER DATE AUTHOR DESCRIPTION
|
|
|
+ * === =========== ========== =============================================
|
|
|
+ * 1.0 2021.04.26 jsh77b 최초 작성
|
|
|
+ *******************************************************************************
|
|
|
+ -->
|
|
|
+<body>
|
|
|
+<th:block layout:fragment="content">
|
|
|
+<main role="" id="" class="container my">
|
|
|
+ <section class="content my_return"> <!-- 210409_수정 : class my_return 변경 -->
|
|
|
+ <div class="inner">
|
|
|
+ <div class="order_sort">
|
|
|
+ <a href="javascript:void(0);" class="od_date_btn">최근 1개월</a>
|
|
|
+ <a href="javascript:void(0);" class="od_status_btn">전체</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- common 주문목록 -->
|
|
|
+ <div data-id="layer_infinite_item" >
|
|
|
+ <section id="infiniteContainer">
|
|
|
+ <div id="listBoxOuter">
|
|
|
+ <div class="area_list" id="listBox">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+ </div>
|
|
|
+ <!-- common 주문목록 -->
|
|
|
+
|
|
|
+ </section>
|
|
|
+</main>
|
|
|
+
|
|
|
+<script src="/ux/plugins/gaga/gaga.paging.js"></script>
|
|
|
+<script th:inline="javascript">
|
|
|
+ /*<![CDATA[*/
|
|
|
+ let totalCount = 0;
|
|
|
+ let pageSize = 0;
|
|
|
+
|
|
|
+ $(document).ready(function() {
|
|
|
+
|
|
|
+ // 마이페이지 location 설정
|
|
|
+ fnSetMypageLocation('취소/반품/교환내역');
|
|
|
+
|
|
|
+ // datepicker 설정
|
|
|
+ $('.period_datepicker').datepicker();
|
|
|
+
|
|
|
+ // 셀렉트박스 활성화
|
|
|
+ $('.select_custom.demand_status').each(function(index) {
|
|
|
+ new sCombo($(this));
|
|
|
+ });
|
|
|
+
|
|
|
+ // 주문 검색 기간 설정
|
|
|
+ $('#rdi-month2').click();
|
|
|
+
|
|
|
+ // Initialize a pagination
|
|
|
+ gagaPaging.init('searchForm', fnSearchCallback, 'paging', 5, 10);
|
|
|
+
|
|
|
+ // Load data
|
|
|
+ gagaPaging.load(1);
|
|
|
+ });
|
|
|
+
|
|
|
+ // 검색기간 버튼 클릭 이벤트 처리
|
|
|
+ var fnSetSearchPeriod = function(period) {
|
|
|
+ let date = new Date();
|
|
|
+ let edDate = date.getFullYear() + '-' + ('0' + (date.getMonth() + 1)).slice(-2) + '-' + ('0' + (date.getDate())).slice(-2);
|
|
|
+ date.setMonth(date.getMonth() - period);
|
|
|
+ let stDate = date.getFullYear() + '-' + ('0' + (date.getMonth() + 1)).slice(-2) + '-' + ('0' + (date.getDate())).slice(-2);
|
|
|
+
|
|
|
+ $('#edDate').val(edDate);
|
|
|
+ $('#searchForm input[name=edDate]').val(edDate);
|
|
|
+ $('#stDate').val(stDate);
|
|
|
+ $('#searchForm input[name=stDate]').val(stDate);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 주문 목록 조회
|
|
|
+ var fnSearchCreList = function() {
|
|
|
+ gagaPaging.load(1);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 주문 목록 조회 콜백
|
|
|
+ var fnSearchCallback = function(result) {
|
|
|
+ $('#creList').html(fnCreateCreList(result));
|
|
|
+
|
|
|
+ // Create pagination
|
|
|
+ gagaPaging.createPagination(result.creInfo.pageable);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 검색기간 설정 체크
|
|
|
+ var fnCheckPeriod = function(param) {
|
|
|
+ let stDate = $('#stDate').val();
|
|
|
+ let edDate = $('#edDate').val();
|
|
|
+
|
|
|
+ let sdt = new Date(stDate);
|
|
|
+ let edt = new Date(edDate);
|
|
|
+ let dateDiff = Math.ceil((edt.getTime() - sdt.getTime()) / (1000 * 3600 * 24));
|
|
|
+
|
|
|
+ if (dateDiff > 366) {
|
|
|
+ let id = $(param).attr('id');
|
|
|
+ mcxDialog.alert('조회기간은 최대 1년을 넘을 수 없습니다.');
|
|
|
+ if (id == 'stDate') {
|
|
|
+ sdt.setFullYear(sdt.getFullYear() + 1);
|
|
|
+ let chgEdDate = sdt.getFullYear() + '-' + ('0' + (sdt.getMonth() + 1)).slice(-2) + '-' + ('0' + (sdt.getDate())).slice(-2);
|
|
|
+
|
|
|
+ $('#edDate').val(chgEdDate);
|
|
|
+ $('#searchForm input[name=edDate]').val(chgEdDate);
|
|
|
+ } else {
|
|
|
+ edt.setFullYear(edt.getFullYear() - 1);
|
|
|
+ let chgStDate = edt.getFullYear() + '-' + ('0' + (edt.getMonth() + 1)).slice(-2) + '-' + ('0' + (edt.getDate())).slice(-2);
|
|
|
+
|
|
|
+ $('#stDate').val(chgStDate);
|
|
|
+ $('#searchForm input[name=stDate]').val(chgStDate);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 상태값 별 수량 업데이트 처리
|
|
|
+ var fnReloadStatusCount = function() {
|
|
|
+ let url = '/mypage/status/count';
|
|
|
+
|
|
|
+ let data = {};
|
|
|
+ data.custNo = customerInfo.custNo;
|
|
|
+
|
|
|
+ let jsonData = JSON.stringify(data);
|
|
|
+
|
|
|
+ gagajf.ajaxJsonSubmit(url, jsonData, function(result) {
|
|
|
+ $('#orderReceiptCount').text(result.orderCount.orderReceiptCount);
|
|
|
+ $('#paymentCompleteCount').text(result.orderCount.paymentCompleteCount);
|
|
|
+ $('#goodsPrepareCount').text(result.orderCount.goodsPrepareCount);
|
|
|
+ $('#shipPrepareCount').text(result.orderCount.shipPrepareCount);
|
|
|
+ $('#shippingCount').text(result.orderCount.shippingCount);
|
|
|
+ $('#shipCompleteCount').text(result.orderCount.shipCompleteCount);
|
|
|
+ $('#orderCreCount').text(result.orderCount.cancelCount + result.orderCount.returnCount + result.orderCount.exchangeCount);
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ // 주문상세상태코드 셀렉트박스 변경 이벤트
|
|
|
+ $('.select_custom.demand_status').find('li').on('click', function() {
|
|
|
+ $('#searchForm input[name=chgStat]').val($(this).attr('code'));
|
|
|
+ });
|
|
|
+
|
|
|
+ // 주문내역 리스트 처리
|
|
|
+ var fnCreateCreList = function(param) {
|
|
|
+ let tag = '';
|
|
|
+ let imageUrl = [[${@environment.getProperty('upload.goods.view')}]];
|
|
|
+
|
|
|
+ if (param.creList != null && param.creList.length > 0) {
|
|
|
+ $.each(param.creList, function (idx, creList) {
|
|
|
+ tag += ' <div class="part_goods">\n';
|
|
|
+ tag += ' <div class="goods_head">\n';
|
|
|
+ if (creList.giftPackYn == 'Y') {
|
|
|
+ tag += ' <p>선물일 <span>' + creList.ordDt + '</span></p>\n';
|
|
|
+ } else {
|
|
|
+ tag += ' <p>주문일 <span>' + creList.ordDt + '</span></p>\n';
|
|
|
+ }
|
|
|
+ tag += ' <a href="javascript:void(0)" ordChgSq="' + creList.ordChgSq + '" chgGb="' + creList.oneData.chgGb + '" ordNo ="' + creList.oneData.ordNo + '" onclick="fnGoToCreDetail(this)">상세보기</a>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <div class="goods_cont">\n';
|
|
|
+ $.each(creList.creList, function (index, cre) {
|
|
|
+ tag += ' <!-- 주문상품1 -->\n';
|
|
|
+ tag += ' <div class="goods_info">\n';
|
|
|
+ tag += ' <div class="order_desc">\n';
|
|
|
+ tag += ' <div class="goods_box">\n';
|
|
|
+ tag += ' <div class="gd_item">\n';
|
|
|
+ tag += ' <a href="javascript:void(0)" goodsCd="' + cre.goodsCd + '" onclick="fnGoToGoodsDetail(this)">\n';
|
|
|
+ tag += ' <span class="thumb">\n';
|
|
|
+ tag += ' <img src="' + imageUrl + '/' + cre.sysImgNm + '" width="100%" alt="">\n';
|
|
|
+ tag += ' </span>\n';
|
|
|
+ tag += ' <p>\n';
|
|
|
+ tag += ' <span class="brand">' + cre.brandNm + '</span>\n';
|
|
|
+ // 배송 아이콘 처리
|
|
|
+ if (cre.shotDelvYn == 'Y') {
|
|
|
+ tag += ' <span class="tag primary">총알배송</span>\n';
|
|
|
+ } else if (cre.selfGoodsYn == 'Y') {
|
|
|
+ tag += ' <span class="tag">STYLE24 일반배송</span>\n';
|
|
|
+ } else {
|
|
|
+ tag += ' <span class="tag">업체직배송</span>\n';
|
|
|
+ }
|
|
|
+ tag += ' </p>\n';
|
|
|
+ tag += ' <p>\n';
|
|
|
+ tag += ' <span class="name">' + cre.goodsNm + '</span>\n';
|
|
|
+ tag += ' </p>\n';
|
|
|
+ tag += ' </a>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <div class="gd_opt">\n';
|
|
|
+ tag += ' <div class="option_wrap">\n';
|
|
|
+ tag += ' <span class="title sr-only">주문 옵션</span>\n';
|
|
|
+ // 세트아이템 옵션 처리
|
|
|
+ if (cre.goodsType == 'G056_S') {
|
|
|
+ $.each(cre.colorNmArr, function (index2, option) {
|
|
|
+ tag += ' <span class="option">' + cre.itemNmArr[index2] + ' / ' + option + ' / ' + cre.optCd2Arr[index2] + '</span>\n';
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ tag += ' <span class="option">' + cre.colorNm + ' / ' + cre.optCd2 + '</span>\n';
|
|
|
+ }
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <div class="gd_calc">\n';
|
|
|
+ tag += ' <p>\n';
|
|
|
+ tag += ' <span class="count"><em>' + cre.chgQty + '</em>개</span>\n';
|
|
|
+ tag += ' </p>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <div class="gd_opt">\n';
|
|
|
+ tag += ' <div class="option_wrap">\n';
|
|
|
+ // 교환옵션
|
|
|
+ if (cre.chgGb == 'G680_40') {
|
|
|
+ $.each(creList.exchangeOptionList, function(index, exchange) {
|
|
|
+ if (cre.chgOrdDtlNo == exchange.ordDtlNo) {
|
|
|
+ if (cre.goodsType == 'G056_S') {
|
|
|
+ tag += ' <span class="title">교환 옵션</span>';
|
|
|
+ $.each(exchange.colorNmArr, function (index2, option) {
|
|
|
+ tag += ' <span class="option">' + exchange.itemNmArr[index2] + ' / ' + option + ' / ' + exchange.optCd2Arr[index2] + '</span>\n';
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ tag += ' <span class="option">' + exchange.colorNm + ' / ' + exchange.optCd2 + '</span>\n';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <div class="status_box">\n';
|
|
|
+ tag += ' <p>\n';
|
|
|
+ tag += ' ' + cre.chgStatNm + '\n';
|
|
|
+ tag += ' <span class="date">' + cre.chgDate + '</span>\n';
|
|
|
+ tag += ' <span class="time">' + cre.chgTime + '</span>\n';
|
|
|
+ tag += ' </p>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' <div class="button_box">\n';
|
|
|
+ if (cre.chgStat == 'G685_20' || cre.chgStat == 'G685_21' || cre.chgStat == 'G685_50' || cre.chgStat == 'G685_51') {
|
|
|
+ tag += ' <p><button type="button" class="btn btn_default btn_sm" ordNo="' + cre.ordNo + '" ordChgSq="' + cre.ordChgSq + '" cancelGb="' + cre.chgGb + '" onclick="fnCreCancel(this);"><span>신청취소</span></button></p>\n';
|
|
|
+ }
|
|
|
+ if (cre.chgStat == 'G685_21' || cre.chgStat == 'G685_51' || cre.chgStat == 'G685_32') {
|
|
|
+ tag += ' <p><button type="button" class="btn btn_default btn_sm" ordNo="' + cre.ordNo + '" ordChgSq="' + cre.ordChgSq + '" onclick="fnCrePayAddCost(this);"><span>결제하기</span></button></p>\n';
|
|
|
+ }
|
|
|
+ if (cre.chgStat == 'G685_40') {
|
|
|
+ tag += ' <p><button type="button" class="btn btn_default btn_sm" ordDtlNo="' + cre.ordDtlNo + '" onclick="fnGoToDeliveryTrack(this);"><span>배송조회</span></button></p>\n';
|
|
|
+ }
|
|
|
+ tag += ' <p><button type="button" class="btn btn_default btn_sm" onclick="cfnGoToPage(_PAGE_ONETOONE_QNA_REG);"><span>1:1 문의</span></button></p>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ //if (cre.chgStat == 'G685_10') {
|
|
|
+ // tag += ' <div class="order_text"><p>' + cre.addPayCost + '원 결제 후 취소 가능합니다.</p></div>\n';
|
|
|
+ //}
|
|
|
+ // cre.chgGb == 'G680_30' : 반품
|
|
|
+ // cre.chgGb == 'G680_40' : 교환
|
|
|
+ // 교환접수
|
|
|
+ if (cre.chgStat == 'G685_20') {
|
|
|
+ tag += ' <div class="order_text"><p>교환 신청이 접수 되었습니다. 신속하게 처리하여 드리겠습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 교환대기
|
|
|
+ if (cre.chgStat == 'G685_21') {
|
|
|
+ tag += ' <div class="order_text"><p>' + cre.addPayCost.addComma() + '원 결제 후 교환 가능합니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 회수요청
|
|
|
+ if (cre.chgStat == 'G685_30') {
|
|
|
+ tag += ' <div class="order_text"><p>고객님이 요청하신 회수지로 상품을 회수 중에 있습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 상품 검수중(교환)
|
|
|
+ if (cre.chgStat == 'G685_31' && cre.chgGb == 'G680_40') {
|
|
|
+ tag += ' <div class="order_text"><p>고객님이 교환하신 상품을 검수 중에 있습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 결제대기(교환)
|
|
|
+ if (cre.chgStat == 'G685_32' && cre.chgGb == 'G680_40') {
|
|
|
+ tag += ' <div class="order_text"><p>' + cre.addPayCost.addComma() + '원 결제 후 교환 가능합니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 교환완료
|
|
|
+ if (cre.chgStat == 'G685_40') {
|
|
|
+ $.each(creList.exchangeOptionList, function(index, exchange) {
|
|
|
+ if (cre.chgOrdDtlNo == exchange.ordDtlNo && (exchange.ordDtlStat == 'G013_60' || exchange.ordDtlStat == 'G013_70')) {
|
|
|
+ tag += ' <div class="order_text"><p>교환이 완료되었습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ // 교환철회
|
|
|
+ if (cre.chgStat == 'G685_49') {
|
|
|
+ tag += ' <div class="order_text"><p>요청하신 교환을 취소하였습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 반품접수
|
|
|
+ if (cre.chgStat == 'G685_50') {
|
|
|
+ tag += ' <div class="order_text"><p>반품 신청이 접수 되었습니다. 신속하게 처리하여 드리겠습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 반품대기
|
|
|
+ if (cre.chgStat == 'G685_51') {
|
|
|
+ tag += ' <div class="order_text"><p>' + cre.addPayCost.addComma() + '원 결제 후 반품 가능합니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 상품 검수중(반품)
|
|
|
+ if (cre.chgStat == 'G685_31' && cre.chgGb == 'G680_40') {
|
|
|
+ tag += ' <div class="order_text"><p>고객님이 반품하신 상품을 검수 중에 있습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 결제대기(반품)
|
|
|
+ if (cre.chgStat == 'G685_32' && cre.chgGb == 'G680_40') {
|
|
|
+ tag += ' <div class="order_text"><p>' + cre.addPayCost.addComma() + '원 결제 후 반품 가능합니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 환불진행중
|
|
|
+ if (cre.chgStat == 'G685_33') {
|
|
|
+ tag += ' <div class="order_text"><p>' + cre.refundAmt.addComma() + '원 환불을 진행하고 있습니다.(영업일 최대 3일 내 환불 예정)</p></div>\n';
|
|
|
+ }
|
|
|
+ // 반품완료
|
|
|
+ if (cre.chgStat == 'G685_60') {
|
|
|
+ tag += ' <div class="order_text"><p>반품이 완료되었습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ // 반품철회
|
|
|
+ if (cre.chgStat == 'G685_69') {
|
|
|
+ tag += ' <div class="order_text"><p>요청하신 반품을 취소하였습니다.</p></div>\n';
|
|
|
+ }
|
|
|
+ tag += ' </div>\n';
|
|
|
+ });
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += ' </div>\n';
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ // 데이터 없음 표시
|
|
|
+ tag += ' <div class="nodata">';
|
|
|
+ tag += ' <div class="txt_box">';
|
|
|
+ tag += ' <p>';
|
|
|
+ tag += ' 취소/반품/교환내역이 없습니다.<br>';
|
|
|
+ tag += ' </p>';
|
|
|
+ tag += ' </div>';
|
|
|
+ tag += ' </div>';
|
|
|
+ }
|
|
|
+
|
|
|
+ return tag;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 취반교 상세 페이지 이동
|
|
|
+ var fnGoToCreDetail = function(param) {
|
|
|
+ let ordChgSq = $(param).attr('ordChgSq');
|
|
|
+ let chgGb = $(param).attr('chgGb');
|
|
|
+ let ordNo = $(param).attr('ordNo');
|
|
|
+
|
|
|
+ if (chgGb == 'G680_20') {
|
|
|
+ $('#cancelForm input[name=ordChgSq]').val(ordChgSq);
|
|
|
+ $('#cancelForm input[name=ordNo]').val(ordNo);
|
|
|
+ document.cancelForm.submit();
|
|
|
+ } else if (chgGb == 'G680_30') {
|
|
|
+ $('#returnForm input[name=ordChgSq]').val(ordChgSq);
|
|
|
+ $('#returnForm input[name=ordNo]').val(ordNo);
|
|
|
+ document.returnForm.submit();
|
|
|
+ } else if (chgGb == 'G680_40') {
|
|
|
+ $('#exchangeForm input[name=ordChgSq]').val(ordChgSq);
|
|
|
+ $('#exchangeForm input[name=ordNo]').val(ordNo);
|
|
|
+ document.exchangeForm.submit();
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 취반교 배송조회 버튼 클릭 이벤트
|
|
|
+ var fnGoToDeliveryTrack = function(param) {
|
|
|
+ let ordDtlNo = $(param).attr('ordDtlNo');
|
|
|
+ // TODO
|
|
|
+ // 최반교 배송조회 페이지 이동 처리
|
|
|
+ }
|
|
|
+/*]]>*/
|
|
|
+</script>
|
|
|
+
|
|
|
+</th:block>
|
|
|
+
|
|
|
+</body>
|
|
|
+</html>
|