|
|
@@ -13,7 +13,7 @@
|
|
|
*============================================================================
|
|
|
* VER DATE AUTHOR DESCRIPTION
|
|
|
* === =========== ========== =============================================
|
|
|
- * 1.0 2021.02.25 csh9191 최초 작성
|
|
|
+ * 1.0 2021.02.26 csh9191 최초 작성
|
|
|
*******************************************************************************
|
|
|
-->
|
|
|
<body>
|
|
|
@@ -37,9 +37,9 @@
|
|
|
</div>
|
|
|
<div class="my_tab coupon_tab">
|
|
|
<ul>
|
|
|
- <li><a href="javascript:void(0);" id="SearchFullHistory">전체내역</a></li>
|
|
|
- <li><a href="javascript:void(0);" id="SearchCollectHistory">적립내역</a></li>
|
|
|
- <li><a href="javascript:void(0);" id="SearchUsedHistory">사용내역</a></li>
|
|
|
+ <li><a href="javascript:void(0);" id="allPointList">전체내역</a></li>
|
|
|
+ <li><a href="javascript:void(0);" id="accumulatePointList">적립내역</a></li>
|
|
|
+ <li><a href="javascript:void(0);" id="usePointList">사용내역</a></li>
|
|
|
</ul>
|
|
|
<!-- <div class="form_field"> -->
|
|
|
<!-- <select id="searchDt" name="searchDt" onchange="fnSearchDate(this);"> -->
|
|
|
@@ -48,6 +48,7 @@
|
|
|
<div class="form_field">
|
|
|
<div class="select_custom type1">
|
|
|
<div class="combo">
|
|
|
+ <input type="hidden" name="pointDate" value="0"/>
|
|
|
<div class="select"></div> <!-- 셀렉박스 -->
|
|
|
<ul id="searchDt" class="list" style="width:200px; margin:0 auto">
|
|
|
</ul>
|
|
|
@@ -82,252 +83,135 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<script th:inline="javascript">
|
|
|
+ let accumulatePointList = [[${accumulatePointList}]];
|
|
|
+ let usePointList = [[${usePointList}]];
|
|
|
+ let allPointList = [[${allPointList}]];
|
|
|
|
|
|
- // select 날짜 생성
|
|
|
- var date = new Date();
|
|
|
- var year = date.getFullYear();
|
|
|
- var month = date.getMonth() +1;
|
|
|
-
|
|
|
- var oneYearAgo = year -1;
|
|
|
- var oneYearLater = year +1;
|
|
|
-
|
|
|
- if(10 > month){
|
|
|
- month = 0 + "" + (date.getMonth()+1);
|
|
|
+ // select 날짜 생성
|
|
|
+ var date = new Date();
|
|
|
+ var year = date.getFullYear();
|
|
|
+ var month = date.getMonth() +1;
|
|
|
+
|
|
|
+ // TODO - 퍼블확정시
|
|
|
+ var oneYearAgo = year -1;
|
|
|
+ var twoYearAgo = year -2;
|
|
|
+
|
|
|
+ // 이번년도
|
|
|
+ for(var i = 1;i <= 12; i++){
|
|
|
+ if(i < 10 && i != month){
|
|
|
+ $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + 0 + i +"'>"+ year + "년" + " " + i + "월" +"</li>");
|
|
|
}
|
|
|
- // Select this year month
|
|
|
- var checkYm = year + "" + month;
|
|
|
-
|
|
|
- // 작년
|
|
|
-// for(var i = 1;i <= 12; i++){
|
|
|
-// if(i < 10 && i != month){
|
|
|
-// $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ oneYearAgo + "" + 0 + i +"'>"+ oneYearAgo + "년" + " " + i + "월" +"</li>");
|
|
|
-// }
|
|
|
-// else if(i < 10 && i == month){
|
|
|
-// $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ oneYearAgo + "" + 0 + i +"'>" + oneYearAgo + "년" + " " + i + "월" +"</li>");
|
|
|
-// }
|
|
|
-// else if(i > 9 && i != month){
|
|
|
-// $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ oneYearAgo + "" + i +"'>"+ oneYearAgo + "년" + " " + i + "월" +"</li>");
|
|
|
-// }
|
|
|
-// else if(i > 9 && i == month){
|
|
|
-// $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ oneYearAgo + "" + i +"'>"+ oneYearAgo + "년" + " " + i + "월" +"</li>");
|
|
|
-// }
|
|
|
-// }
|
|
|
-
|
|
|
- // 이번년도
|
|
|
- for(var i = 1;i <= 12; i++){
|
|
|
- if(i < 10 && i != month){
|
|
|
- $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + 0 + i +"'>"+ year + "년" + " " + i + "월" +"</li>");
|
|
|
- }
|
|
|
- else if(i < 10 && i == month){
|
|
|
- $(".select").append("<li class='selected' value='"+ year + "" + 0 + i +"'>" + year + "년" + " " + i + "월" +"</li>");
|
|
|
- $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + 0 + i +"'>" + year + "년" + " " + i + "월" +"</li>");
|
|
|
- }
|
|
|
- else if(i > 9 && i != month){
|
|
|
- $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + i +"'>"+ year + "년" + " " + i + "월" +"</li>");
|
|
|
- }
|
|
|
- else if(i > 9 && i == month){
|
|
|
- $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + i +"'>"+ year + "년" + " " + i + "월" +"</li>");
|
|
|
- }
|
|
|
+ else if(i < 10 && i == month){
|
|
|
+ //셀렉트박스 이번 달 표시설정
|
|
|
+ $('.select').append("<li style='pointer-events: none' onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + 0 + i +"'>" + year + "년" + " " + i + "월" +"</li>");
|
|
|
+ $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + 0 + i +"'>" + year + "년" + " " + i + "월" +"</li>");
|
|
|
+ }
|
|
|
+ else if(i > 9 && i != month){
|
|
|
+ $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + i +"'>"+ year + "년" + " " + i + "월" +"</li>");
|
|
|
+ }
|
|
|
+ else if(i > 9 && i == month){
|
|
|
+ $('.select').append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + i +"'>" + year + "년" + " " + i + "월" +"</li>");
|
|
|
+ $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ year + "" + i +"'>"+ year + "년" + " " + i + "월" +"</li>");
|
|
|
}
|
|
|
-
|
|
|
- // 내년
|
|
|
-// for(var i = 1;i <= 12; i++){
|
|
|
-// if(i < 10 && i != month){
|
|
|
-// $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ oneYearLater + "" + 0 + i +"'>"+ oneYearLater + "년" + " " + i + "월" +"</li>");
|
|
|
-// }
|
|
|
-// else if(i < 10 && i == month){
|
|
|
-// $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ oneYearLater + "" + 0 + i +"'>" + oneYearLater + "년" + " " + i + "월" +"</li>");
|
|
|
-// }
|
|
|
-// else if(i > 9 && i != month){
|
|
|
-// $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ oneYearLater + "" + i +"'>"+ oneYearLater + "년" + " " + i + "월" +"</li>");
|
|
|
-// }
|
|
|
-// else if(i > 9 && i == month){
|
|
|
-// $("#searchDt").append("<li onclick='fnChangeDate(this);' class='selected' value='"+ oneYearLater + "" + i +"'>"+ oneYearLater + "년" + " " + i + "월" +"</li>");
|
|
|
-// }
|
|
|
-// }
|
|
|
-
|
|
|
- // 날짜변경 이벤트
|
|
|
- var fnChangeDate = function(parm) {
|
|
|
-
|
|
|
- let url = '/mypage/allpoint/list';
|
|
|
- let data = {};
|
|
|
-
|
|
|
- data.searchDt = $('#searchDt').find('.selected').val();
|
|
|
-
|
|
|
- var jsonData = JSON.stringify(data);
|
|
|
- gagajf.ajaxJsonSubmit(url, jsonData, function(result) {
|
|
|
-
|
|
|
- if($("#SearchFullHistory").hasClass("on")){
|
|
|
- $("#SearchFullHistory").click();
|
|
|
- }else if($("#SearchCollectHistory").hasClass("on")){
|
|
|
- $("#SearchCollectHistory").click();
|
|
|
- }else if($("#SearchUsedHistory").hasClass("on")){
|
|
|
- $("#SearchUsedHistory").click();
|
|
|
- }
|
|
|
- });
|
|
|
}
|
|
|
|
|
|
-
|
|
|
- // 전체내역 조회
|
|
|
- $("#SearchFullHistory").click(function(){
|
|
|
- // class제거 추가
|
|
|
- $("#SearchCollectHistory").removeClass("on");
|
|
|
- $("#SearchUsedHistory").removeClass("on");
|
|
|
- $("#SearchFullHistory").addClass("on");
|
|
|
- $("#plusMinus").text("증감/차감");
|
|
|
-
|
|
|
+ // 날짜변경 이벤트
|
|
|
+ var fnChangeDate = function(param) {
|
|
|
+ let url = '/mypage/allpoint/list';
|
|
|
+
|
|
|
+ $(param).parent().parent().find('input[name=pointDate]').val($(param).val());
|
|
|
+ var pointData = $(param).parent().parent().find('input[name=pointDate]').val();
|
|
|
+
|
|
|
+ if(10 > month){
|
|
|
+ month = "0" + month;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 포인트화면 로딩시 이번달 설정 리스트 표시하기 위함
|
|
|
+ if(pointData == null){
|
|
|
+ pointData = year + "" + month;
|
|
|
+ }
|
|
|
+
|
|
|
let data = {};
|
|
|
|
|
|
- // 처음 화면 로딩시 이번 달 선택
|
|
|
- if($('.select').find('.selected').val() == checkYm){
|
|
|
- data.searchDt = $('.select').find('.selected').val();
|
|
|
- }else{
|
|
|
- data.searchDt = $('#searchDt').find('.selected').val();
|
|
|
- }
|
|
|
-
|
|
|
- var jsonData = JSON.stringify(data);
|
|
|
+ data.searchDt = pointData;
|
|
|
|
|
|
- $.ajax(
|
|
|
- {
|
|
|
- type : "POST",
|
|
|
- data : jsonData,
|
|
|
- url : '/mypage/allpoint/list',
|
|
|
- contentType: 'application/json',
|
|
|
- dataType : 'json',
|
|
|
- success : function(result){
|
|
|
- PointAllListInfo(result);
|
|
|
- }
|
|
|
- }
|
|
|
- )
|
|
|
- });
|
|
|
-
|
|
|
- function PointAllListInfo(result) {
|
|
|
+ console.log(data);
|
|
|
|
|
|
- let allPointList = result.allPointList;
|
|
|
+ var jsonData = JSON.stringify(data);
|
|
|
|
|
|
- let tmtbHtml = "";
|
|
|
- for(let i=0; i<allPointList.length; i++){
|
|
|
- let point = allPointList[i];
|
|
|
- tmtbHtml +='<tr>';
|
|
|
- tmtbHtml +='<td>'+ point.occurGb + '</td>';
|
|
|
- tmtbHtml += '<td class="t_l pl40">'+ point.occurDtlDesc + '</td>';
|
|
|
- if(point.pntAmt > 0){
|
|
|
- tmtbHtml += '<td class="c_blue">'+ point.pntAmt + '</td>';
|
|
|
+ gagajf.ajaxJsonSubmit('/mypage/allpoint/list', jsonData, function(result){
|
|
|
+ accumulatePointList = result.accumulatePointList;
|
|
|
+ usePointList = result.usePointList;
|
|
|
+ allPointList = result.allPointList;
|
|
|
+
|
|
|
+ // 클릭상태 확인
|
|
|
+ if($("#accumulatePointList").hasClass("on")){
|
|
|
+ $("#accumulatePointList").click();
|
|
|
+ }else if($("#usePointList").hasClass("on")){
|
|
|
+ $("#usePointList").click();
|
|
|
+ }else if($("#allPointList").hasClass("on")) {
|
|
|
+ $("#allPointList").click();
|
|
|
+ }
|
|
|
+ // 첫화면 전체내역 조회
|
|
|
+ fnGetPointTableInfo();
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ // HTML 그리기
|
|
|
+ var fnGetPointTableInfo = function(param) {
|
|
|
+ let tag = "";
|
|
|
+ $.each(param, function(idx,item){
|
|
|
+ tag +='<tr>';
|
|
|
+ tag +='<td>'+ item.occurGb + '</td>';
|
|
|
+ tag += '<td class="t_l pl40">'+ item.occurDtlDesc + '</td>';
|
|
|
+ // 증감 : 파랑, 차감 : 빨강으로 표시
|
|
|
+ if(item.pntAmt > 0){
|
|
|
+ tag += '<td class="c_blue">'+ item.pntAmt + '</td>';
|
|
|
}else{
|
|
|
- tmtbHtml += '<td class="c_primary">'+ point.pntAmt + '</td>';
|
|
|
+ tag += '<td class="c_primary">'+ item.pntAmt + '</td>';
|
|
|
}
|
|
|
- tmtbHtml += '<td>'+ point.pntUploadDt + '</td>';
|
|
|
- tmtbHtml += '</tr>';
|
|
|
- }
|
|
|
- $("#pointAjaxList").html(tmtbHtml);
|
|
|
+ tag += '<td>'+ item.pntUploadDt + '</td>';
|
|
|
+ tag += '</tr>';
|
|
|
+ });
|
|
|
+ $("#pointAjaxList").html(tag);
|
|
|
}
|
|
|
+
|
|
|
+ // 전체내역 조회
|
|
|
+ $("#allPointList").click(function(){
|
|
|
|
|
|
+ $("#accumulatePointList").removeClass("on");
|
|
|
+ $("#usePointList").removeClass("on");
|
|
|
+
|
|
|
+ $("#allPointList").addClass("on");
|
|
|
+ $("#plusMinus").text("증감/차감");
|
|
|
+
|
|
|
+ fnGetPointTableInfo(allPointList);
|
|
|
+ });
|
|
|
|
|
|
// 적립내역 조회
|
|
|
- $("#SearchCollectHistory").click(function(){
|
|
|
- // Class제거 추가
|
|
|
- $("#SearchFullHistory").removeClass("on");
|
|
|
- $("#SearchUsedHistory").removeClass("on");
|
|
|
- $("#SearchCollectHistory").addClass("on");
|
|
|
-
|
|
|
- // 적립내역 포인트 블루
|
|
|
- $("#pntAmt").removeClass("c_primary");
|
|
|
- $("#pntAmt").addClass("c_blue");
|
|
|
- $("#plusMinus").text("증감");
|
|
|
-
|
|
|
- let data = {};
|
|
|
-
|
|
|
- if($('.select').find('.selected').val() == checkYm){
|
|
|
- data.searchDt = $('.select').find('.selected').val();
|
|
|
- }else{
|
|
|
- data.searchDt = $('#searchDt').find('.selected').val();
|
|
|
- }
|
|
|
-
|
|
|
- let jsonData = JSON.stringify(data);
|
|
|
+ $("#accumulatePointList").click(function(){
|
|
|
+
|
|
|
+ $("#allPointList").removeClass("on");
|
|
|
+ $("#usePointList").removeClass("on");
|
|
|
+
|
|
|
+ $("#accumulatePointList").addClass("on");
|
|
|
+ $("#plusMinus").text("증감");
|
|
|
|
|
|
- $.ajax(
|
|
|
- {
|
|
|
- type : "POST",
|
|
|
- data : jsonData,
|
|
|
- url : '/mypage/point/list',
|
|
|
- contentType: 'application/json',
|
|
|
- dataType : 'json',
|
|
|
- success : function(result){
|
|
|
- PointCollectListInfo(result);
|
|
|
- }
|
|
|
- }
|
|
|
- )
|
|
|
+ fnGetPointTableInfo(accumulatePointList);
|
|
|
});
|
|
|
|
|
|
- function PointCollectListInfo(result) {
|
|
|
-
|
|
|
- let pointList = result.accumulatePointList;
|
|
|
-
|
|
|
- let tmtbHtml = "";
|
|
|
- for(let i=0; i<pointList.length; i++){
|
|
|
- let point = pointList[i];
|
|
|
- tmtbHtml +='<tr>';
|
|
|
- tmtbHtml +='<td>'+ point.occurGb + '</td>';
|
|
|
- tmtbHtml += '<td class="t_l pl40">'+ point.occurDtlDesc + '</td>';
|
|
|
- tmtbHtml += '<td class="c_blue">'+ point.pntAmt + '</td>';
|
|
|
- tmtbHtml += '<td>'+ point.pntUploadDt + '</td>';
|
|
|
- tmtbHtml += '</tr>';
|
|
|
- }
|
|
|
- $("#pointAjaxList").html(tmtbHtml);
|
|
|
- }
|
|
|
-
|
|
|
// 사용내역 조회
|
|
|
- $("#SearchUsedHistory").click(function(){
|
|
|
- // Class제거 추가
|
|
|
- $("#SearchCollectHistory").removeClass("on");
|
|
|
- $("#SearchFullHistory").removeClass("on");
|
|
|
- $("#SearchUsedHistory").addClass("on");
|
|
|
-
|
|
|
- // 사용내역 포인트 블루
|
|
|
- $("#pntAmt").removeClass("c_blue");
|
|
|
- $("#pntAmt").addClass("c_primary");
|
|
|
- $("#plusMinus").text("차감");
|
|
|
-
|
|
|
- let data = {};
|
|
|
+ $("#usePointList").click(function(){
|
|
|
|
|
|
- if($('.select').find('.selected').val() == checkYm){
|
|
|
- data.searchDt = $('.select').find('.selected').val();
|
|
|
- }else{
|
|
|
- data.searchDt = $('#searchDt').find('.selected').val();
|
|
|
- }
|
|
|
+ $("#accumulatePointList").removeClass("on");
|
|
|
+ $("#allPointList").removeClass("on");
|
|
|
|
|
|
- let jsonData = JSON.stringify(data);
|
|
|
+ $("#usePointList").addClass("on");
|
|
|
+ $("#plusMinus").text("차감");
|
|
|
|
|
|
- $.ajax(
|
|
|
- {
|
|
|
- type : "POST",
|
|
|
- data : jsonData,
|
|
|
- url : '/mypage/usepoint/list',
|
|
|
- contentType: 'application/json',
|
|
|
- dataType : 'json',
|
|
|
- success : function(result){
|
|
|
- UsePointListInfo(result);
|
|
|
- }
|
|
|
- }
|
|
|
- )
|
|
|
+ fnGetPointTableInfo(usePointList);
|
|
|
});
|
|
|
|
|
|
- function UsePointListInfo(result) {
|
|
|
-
|
|
|
- let usePointList = result.usePointList;
|
|
|
- let tmtbHtml = "";
|
|
|
- for(let i=0; i<usePointList.length; i++){
|
|
|
- let usePoint = usePointList[i];
|
|
|
- tmtbHtml +='<tr>';
|
|
|
- tmtbHtml +='<td>'+ usePoint.occurGb + '</td>';
|
|
|
- tmtbHtml += '<td class="t_l pl40">'+ usePoint.occurDtlDesc + '</td>';
|
|
|
- tmtbHtml += '<td class="c_primary">'+ usePoint.pntAmt + '</td>';
|
|
|
- tmtbHtml += '<td>'+ usePoint.pntUploadDt + '</td>';
|
|
|
- tmtbHtml += '</tr>';
|
|
|
- }
|
|
|
- $("#pointAjaxList").html(tmtbHtml);
|
|
|
- }
|
|
|
-
|
|
|
$(document).ready(function() {
|
|
|
// 마이페이지 LNB 설정
|
|
|
fnSetMypageLnbList(5);
|
|
|
@@ -336,12 +220,16 @@
|
|
|
fnSetMypageLocation('STYLE24 포인트', '_PAGE_MYPAGE_POINT');
|
|
|
|
|
|
// 전체내역 표시
|
|
|
- $("#SearchFullHistory").trigger('click');
|
|
|
+ $("#allPointList").trigger('click');
|
|
|
|
|
|
// 셀렉트박스 활성화
|
|
|
$('.select_custom.type1').each(function(index) {
|
|
|
var selecter01 = new sCombo($(this));
|
|
|
});
|
|
|
+
|
|
|
+ // 셀렉트박스 데이터 설정
|
|
|
+ fnChangeDate();
|
|
|
+
|
|
|
});
|
|
|
|
|
|
</script>
|