초기소스
This commit is contained in:
@@ -0,0 +1,312 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
||||
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
|
||||
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
|
||||
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
|
||||
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
|
||||
<head>
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Include.jsp" %>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
|
||||
fn_set_dateRange_function('#dataRangeBtn', 'srchStrtSndngDt','srchEndSndngDt', 'srchEndSndngDt');
|
||||
fn_set_date('srchStrtSndngDt', 'srchEndSndngDt','srchEndSndngDt', '7D');
|
||||
fn_set_dateRange_function('#dataRange2Btn', 'srchStrtSndngDt2','srchEndSndngDt2', 'srchEndSndngDt2');
|
||||
fn_set_date('srchStrtSndngDt2', 'srchEndSndngDt2','srchEndSndngDt2', '7D');
|
||||
|
||||
// 표 조회
|
||||
fn_select_table_data(null, null);
|
||||
|
||||
// 날짜 검색
|
||||
$("#srchBtn").on("click", function(){
|
||||
fn_select_table_data(null, null);
|
||||
});
|
||||
|
||||
|
||||
// 표
|
||||
// $("#").on("click", function() {
|
||||
// fn_select_table_data(null, '', 'coupNm', 'ASC');
|
||||
// });
|
||||
|
||||
// 페이징 제자리 새로고침(Submit) 방지
|
||||
$('body').on('click', 'button.pagination__item.active', function(event) {
|
||||
event.preventDefault();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 테이블 데이터 조회
|
||||
* pageIndex
|
||||
* unitFlag
|
||||
* - 없음 : ''
|
||||
*
|
||||
* ordrStand
|
||||
* - fn_select_ordrStandMapping() 참조
|
||||
*
|
||||
* ordrType
|
||||
* - 오름차순 : 'ASC'
|
||||
* - 내림차순 : 'DESC'
|
||||
*/
|
||||
let PordrStand;
|
||||
let TordrType;
|
||||
const fn_select_table_data = function(pageIndex, unitFlag, ordrStand, ordrType) {
|
||||
// console.log("fn_select_table_data()pageIndex, unitFlag : ", pageIndex, unitFlag);
|
||||
|
||||
const srchStrtSndngDt = $("#srchStrtSndngDt").val();
|
||||
const srchEndSndngDt = $("#srchEndSndngDt").val();
|
||||
const srchStrtSndngDt2 = $("#srchStrtSndngDt2").val();
|
||||
const srchEndSndngDt2 = $("#srchEndSndngDt2").val();
|
||||
const srchOrdrEnvrnCds = $('input[name="srchOrdrEnvrnCds"]:checked').map(function() { return $(this).val(); }).get();
|
||||
const pageUnit = $("#pageUnit").val();
|
||||
const recordCountPerPage = '50';
|
||||
|
||||
if(!pageIndex) {
|
||||
$('#pageIndex').val(1);
|
||||
} else {
|
||||
$('#pageIndex').val(pageIndex);
|
||||
}
|
||||
const pageIndexValue = $("#pageIndex").val();
|
||||
|
||||
if(!unitFlag) {
|
||||
// if ($('#').hasClass('selected')) {
|
||||
unitFlag = '';
|
||||
// }
|
||||
}
|
||||
|
||||
if(!pageIndex){
|
||||
if (!ordrType && PordrStand == ordrStand) {
|
||||
//정렬 방식 변경 (정렬 기준 파라미터가 이전과 동일)
|
||||
TordrType = (TordrType == 'ASC') ? 'DESC' : 'ASC';
|
||||
}else if(!ordrType){
|
||||
//정렬 방식 기본값으로 지정 (정렬 기준 변경)
|
||||
TordrType = 'ASC';
|
||||
}else{
|
||||
//정렬 방식 초기화 (표 조회)
|
||||
TordrType = ordrType;
|
||||
}
|
||||
|
||||
if(!ordrStand){
|
||||
//정렬 기준 기본값으로 지정
|
||||
PordrStand = 'gubun';
|
||||
}else{
|
||||
//정렬 기준 변경
|
||||
PordrStand = ordrStand;
|
||||
}
|
||||
}
|
||||
|
||||
const data = {
|
||||
srchStrtSndngDt : srchStrtSndngDt,
|
||||
srchEndSndngDt : srchEndSndngDt,
|
||||
srchStrtSndngDt2 : srchStrtSndngDt2,
|
||||
srchEndSndngDt2 : srchEndSndngDt2,
|
||||
srchOrdrEnvrnCds : srchOrdrEnvrnCds,
|
||||
unitFlag : unitFlag,
|
||||
pageUnit : pageUnit,
|
||||
ordrStand : PordrStand,
|
||||
ordrType : TordrType,
|
||||
pageIndex : pageIndexValue,
|
||||
recordCountPerPage : recordCountPerPage
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url : "/mngr/stats/marktAnals/selectMngrCouponStatsTableInqire",
|
||||
data : data,
|
||||
success:function(resultHtml) {
|
||||
// console.log('success');
|
||||
$('#pageDiv').empty();
|
||||
$('#pageDiv').html(resultHtml);
|
||||
|
||||
$('.reorder_' + PordrStand).text(fn_select_ordrStandMapping()[PordrStand] + (TordrType === 'ASC' ? ' ▲' : ' ▼'));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 테이블 정렬 조건(행)
|
||||
*/
|
||||
const fn_select_ordrStandMapping = function() {
|
||||
let ordrStandMapping;
|
||||
|
||||
ordrStandMapping = {
|
||||
'coupNm': '쿠폰명',
|
||||
'gubun': '쿠폰구분',
|
||||
'discountAmt': '쿠폰할인금액',
|
||||
'couponDwldCnt': '발급건수',
|
||||
'couponUseDcnt': '사용건수'
|
||||
};
|
||||
|
||||
return ordrStandMapping;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 엑셀 다운로드
|
||||
*/
|
||||
const fn_download_excel = function() {
|
||||
|
||||
let unitFlag = "";
|
||||
// if ($('#').hasClass('selected')) {
|
||||
// unitFlag = '';
|
||||
// }
|
||||
|
||||
$('#unitFlag').val(unitFlag);
|
||||
|
||||
var tempForm = $('#listForm').clone();
|
||||
tempForm.append('<input type="hidden" name="ordrStand" value="' + PordrStand + '">');
|
||||
tempForm.append('<input type="hidden" name="ordrType" value="' + TordrType + '">');
|
||||
tempForm.attr('action', '<c:url value="/mngr/stats/marktAnals/selectMngrCouponStatsExcelFileDownload"/>');
|
||||
tempForm.attr('method', 'POST');
|
||||
|
||||
$('body').append(tempForm);
|
||||
tempForm.submit();
|
||||
tempForm.remove();
|
||||
};
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Header.jsp" %>
|
||||
<main class="main">
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Left.jsp" %>
|
||||
<div class="content">
|
||||
<div class="content__inner">
|
||||
|
||||
<input type="hidden" id="pageIndex" value="${ resultMap.pageIndex }"/>
|
||||
<input type="hidden" id="pageUnit" value="${ resultMap.pageUnit }"/>
|
||||
|
||||
<div class="page-title">
|
||||
<div class="dashboardTitle__left">
|
||||
<h2 class="page-title__title">전자상거래 요약</h2>
|
||||
<p class="dashboardTitle__subTitle">전자상거래 분석에 꼭 필요한 정보만을 요약하여 볼 수 있습니다.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form id="listForm">
|
||||
<section class="content-section">
|
||||
<div class="table-wrapper">
|
||||
<table class="table dashboardSearch">
|
||||
<caption>해당 테이블에 대한 설명</caption>
|
||||
<colgroup>
|
||||
<col>
|
||||
|
||||
<col>
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>결제기간</th>
|
||||
<td>
|
||||
<div class="td-inner">
|
||||
<div class="input-container">
|
||||
<input type="text" class="datepicker"
|
||||
id="srchStrtSndngDt" name="srchStrtSndngDt" title="시작 날짜 선택"
|
||||
autocomplete="off">
|
||||
<span class="tilde">~</span>
|
||||
<input type="text" class="datepicker"
|
||||
id="srchEndSndngDt" name="srchEndSndngDt" title="종료 날짜 선택"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<div class="dateRange-btnContainer" id="dataRangeBtn">
|
||||
<button type="button" class="dateRange-btn" id="yesterday">어제</button>
|
||||
<button type="button" class="dateRange-btn" id="today" >오늘</button>
|
||||
<button type="button" class="dateRange-btn" id="threeDays">3일간</button>
|
||||
<button type="button" class="dateRange-btn selected" id="sevenDays">일주일</button>
|
||||
<button type="button" class="dateRange-btn" id="oneMonth">1개월</button>
|
||||
<button type="button" class="dateRange-btn" id="threeMonth">3개월</button>
|
||||
<button type="button" class="dateRange-btn" id="sixMonth">6개월</button>
|
||||
<button type="button" class="dateRange-btn" id="year">1년</button>
|
||||
</div>
|
||||
<button class="btn sm primary ml-5" type="button" id="srchBtn">검색</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>발급기간</th>
|
||||
<td>
|
||||
<div class="td-inner">
|
||||
<div class="input-container">
|
||||
<input type="text" class="datepicker"
|
||||
id="srchStrtSndngDt2" name="srchStrtSndngDt2" title="시작 날짜 선택"
|
||||
autocomplete="off">
|
||||
<span class="tilde">~</span>
|
||||
<input type="text" class="datepicker"
|
||||
id="srchEndSndngDt2" name="srchEndSndngDt2" title="종료 날짜 선택"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<div class="dateRange-btnContainer" id="dataRange2Btn">
|
||||
<button type="button" class="dateRange-btn">어제</button>
|
||||
<button type="button" class="dateRange-btn">오늘</button>
|
||||
<button type="button" class="dateRange-btn">3일간</button>
|
||||
<button type="button" class="dateRange-btn selected">일주일</button>
|
||||
<button type="button" class="dateRange-btn">1개월</button>
|
||||
<button type="button" class="dateRange-btn">3개월</button>
|
||||
<button type="button" class="dateRange-btn">6개월</button>
|
||||
<button type="button" class="dateRange-btn">1년</button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>주문환경</th>
|
||||
<td>
|
||||
<div class="td-inner">
|
||||
<div class="b-checkbox-container">
|
||||
<c:forEach items="${cond.ordrEnvrnDvCdList}" var="ordrEnvrnDvCd" varStatus="status">
|
||||
<c:if test="${!(ordrEnvrnDvCd.cd == 'S1' || ordrEnvrnDvCd.cd == 'S2' || ordrEnvrnDvCd.cd == 'S3')}">
|
||||
<label class="b-checkbox checkbox">
|
||||
<input type="checkbox" name="srchOrdrEnvrnCds" value="${ordrEnvrnDvCd.cd}">
|
||||
<span class="check"></span>
|
||||
<span class="control-label">${ordrEnvrnDvCd.cdNm}</span>
|
||||
</label>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="table-wrapper">
|
||||
<div class="dashboardContentTitle" style="margin-bottom: 20px;">
|
||||
<div class="dashboardContentTitle__left">
|
||||
<div class="dateRange-btnContainer">
|
||||
<input type="hidden" name="unitFlag" id="unitFlag" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dashboardContentTitle__right">
|
||||
<button class="btn outline sm" onclick="fn_download_excel(); return false;">
|
||||
<i class="icon icon_excel"></i>
|
||||
다운로드
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="pageDiv">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
</div>
|
||||
<button class="scroll-to-top"><span class="visually-hidden">위로가기</span></button>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,65 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
||||
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
|
||||
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
|
||||
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
|
||||
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('th[class^="reorder_"]').click(function() {
|
||||
var className = $(this).attr('class');
|
||||
var ordrStand = className.replace('reorder_', '');
|
||||
fn_select_table_data(null, null, ordrStand);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
th[class^="reorder_"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
<section class="content-section">
|
||||
<table class="table vertical">
|
||||
<caption>해당 테이블에 대한 설명</caption>
|
||||
<colgroup>
|
||||
<col style="width: auto;">
|
||||
</colgroup>
|
||||
<thead id="tableHeader">
|
||||
<tr>
|
||||
<th class="reorder_coupNm">쿠폰명</th>
|
||||
<th class="reorder_gubun">쿠폰구분</th>
|
||||
<th class="reorder_discountAmt">쿠폰할인금액</th>
|
||||
<th class="reorder_couponDwldCnt">발급건수</th>
|
||||
<th class="reorder_couponUseDcnt">사용건수</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tableBody">
|
||||
<c:choose>
|
||||
<c:when test="${ empty resultMap.resultList }">
|
||||
<tr>
|
||||
<td class="row-no-data" colspan="20">조회된 데이터가 없습니다.</td>
|
||||
</tr>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
|
||||
<c:forEach items="${ resultMap.resultList }" var="list" varStatus="status">
|
||||
<tr>
|
||||
<td>${ list.coupNm }</td>
|
||||
<td>${ list.gubun }</td>
|
||||
<td><fmt:formatNumber value="${ list.discountAmt }" pattern="#,###"/></td>
|
||||
<td>${ list.couponDwldCnt }</td>
|
||||
<td>${ list.couponUseDcnt }</td>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
|
||||
<div class="pagination__container">
|
||||
<ui:pagination paginationInfo="${ resultMap.paginationInfo }" type="image" jsFunction="fn_select_table_data" />
|
||||
</div>
|
||||
@@ -0,0 +1,494 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
||||
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
|
||||
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
|
||||
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
|
||||
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
|
||||
<head>
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Include.jsp" %>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
|
||||
fn_set_dateRange_function('#dataRangeBtn', 'srchStrtSndngDt','srchEndSndngDt', 'srchEndSndngDt');
|
||||
fn_set_date('srchStrtSndngDt', 'srchEndSndngDt','srchEndSndngDt', '7D');
|
||||
|
||||
// 차트1 조회
|
||||
fn_select_chart1_data('month');
|
||||
// 차트2 조회
|
||||
fn_select_chart2_data();
|
||||
|
||||
// 표 조회
|
||||
fn_select_table_data(null, 'tableSimple');
|
||||
|
||||
// 날짜 검색
|
||||
$("#srchBtn").on("click", function(){
|
||||
$("#chart1Month").click();
|
||||
fn_select_chart2_data();
|
||||
$('#tableSimple').click();
|
||||
});
|
||||
|
||||
// 차트1
|
||||
$("#chart1Month").on("click", function() {
|
||||
fn_select_chart1_data('month');
|
||||
});
|
||||
$("#chart1Day").on("click", function() {
|
||||
fn_select_chart1_data('day');
|
||||
});
|
||||
$("#chart1Hour").on("click", function() {
|
||||
fn_select_chart1_data('hour');
|
||||
});
|
||||
|
||||
|
||||
// 표
|
||||
$("#tableSimple").on("click", function() {
|
||||
fn_select_table_data(null, 'tableSimple', 'dt', 'ASC');
|
||||
});
|
||||
$("#tableDetail").on("click", function() {
|
||||
fn_select_table_data(null, 'tableDetail', 'dt', 'ASC');
|
||||
});
|
||||
|
||||
// 페이징 제자리 새로고침(Submit) 방지
|
||||
$('body').on('click', 'button.pagination__item.active', function(event) {
|
||||
event.preventDefault();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* 차트1 데이터 조회
|
||||
* unitFlag : 시간, 일, 월 구분 값
|
||||
*/
|
||||
const fn_select_chart1_data = function(unitFlag) {
|
||||
const srchStrtSndngDt = $("#srchStrtSndngDt").val();
|
||||
const srchEndSndngDt = $("#srchEndSndngDt").val();
|
||||
const srchOrdrEnvrnCds = $('input[name="srchOrdrEnvrnCds"]:checked').map(function() { return $(this).val(); }).get();
|
||||
|
||||
const data = {
|
||||
srchStrtSndngDt : srchStrtSndngDt,
|
||||
srchEndSndngDt : srchEndSndngDt,
|
||||
srchOrdrEnvrnCds : srchOrdrEnvrnCds,
|
||||
unitFlag : unitFlag
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url : "/mngr/stats/marktAnals/selectMngrInflowStatsChart1Inqire",
|
||||
data : data,
|
||||
success:function(resultHtml) {
|
||||
// console.log('success');
|
||||
let result = JSON.parse(resultHtml.resBody.result);
|
||||
// console.log("result : ", result);
|
||||
loadChart1(result);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 차트 1
|
||||
*/
|
||||
var chart1;
|
||||
function loadChart1(data) {
|
||||
var divHolder1 = document.getElementById('ChartDiv1');
|
||||
|
||||
// 데이터가 없는 경우
|
||||
if(data == '') {
|
||||
chart1 = null;
|
||||
divHolder1.innerHTML = '';
|
||||
return;
|
||||
}
|
||||
// 차트가 이미 존재하는 경우 기존 차트를 제거
|
||||
if (chart1) {
|
||||
chart1 = null;
|
||||
divHolder1.innerHTML = '';
|
||||
}
|
||||
|
||||
// 차트 생성
|
||||
chart1 = new cfx.Chart();
|
||||
chart1.setGallery(cfx.Gallery.Bar);
|
||||
// 데이터 설정
|
||||
chart1.setDataSource(data);
|
||||
// y축 단위 설정
|
||||
// chart1.getAxisY().setStep(10000000);
|
||||
|
||||
chart1.getSeries().getItem(0).setText("유입수");
|
||||
chart1.getSeries().getItem(1).setText("결제수");
|
||||
|
||||
// 데이터 라벨 값 노출
|
||||
chart1.getAllSeries().getPointLabels().setVisible(true);
|
||||
// 툴 팁 표시 속도 조절
|
||||
chart1.getToolTips().setInitialDelay(0);
|
||||
chart1.getToolTips().setHideDelay(0);
|
||||
|
||||
// Y축 라벨 포맷을 Number로 지정하기(천단위 콤마 표시)
|
||||
chart1.getAxisY().getLabelsFormat().setFormat(cfx.AxisFormat.Number);
|
||||
|
||||
chart1.create(divHolder1);
|
||||
}
|
||||
|
||||
/**
|
||||
* 차트2 데이터 조회
|
||||
* unitFlag : 일, 주, 월 구분 값
|
||||
*/
|
||||
const fn_select_chart2_data = function() {
|
||||
const srchStrtSndngDt = $("#srchStrtSndngDt").val();
|
||||
const srchEndSndngDt = $("#srchEndSndngDt").val();
|
||||
const srchOrdrEnvrnCds = $('input[name="srchOrdrEnvrnCds"]:checked').map(function() { return $(this).val(); }).get();
|
||||
|
||||
const data = {
|
||||
srchStrtSndngDt : srchStrtSndngDt,
|
||||
srchEndSndngDt : srchEndSndngDt,
|
||||
srchOrdrEnvrnCds : srchOrdrEnvrnCds
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url : "/mngr/stats/marktAnals/selectMngrInflowStatsChart2Inqire",
|
||||
data : data,
|
||||
success:function(resultHtml) {
|
||||
// console.log('success');
|
||||
let result = JSON.parse(resultHtml.resBody.result);
|
||||
// console.log('result ', result);
|
||||
loadChart2(result);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 차트 2
|
||||
*/
|
||||
var chart2;
|
||||
function loadChart2(data) {
|
||||
var divHolder2 = document.getElementById('ChartDiv2');
|
||||
|
||||
// 데이터가 없는 경우
|
||||
if(data == '') {
|
||||
chart2 = null;
|
||||
divHolder2.innerHTML = '';
|
||||
return;
|
||||
}
|
||||
// 차트가 이미 존재하는 경우 기존 차트를 제거
|
||||
if (chart2) {
|
||||
chart2 = null;
|
||||
divHolder2.innerHTML = '';
|
||||
}
|
||||
|
||||
// 차트 생성
|
||||
chart2 = new cfx.Chart();
|
||||
chart2.setGallery(cfx.Gallery.Bar);
|
||||
// 데이터 설정
|
||||
chart2.setDataSource(data);
|
||||
// y축 단위 설정
|
||||
// chart2.getAxisY().setStep(10000000);
|
||||
|
||||
chart2.getSeries().getItem(0).setText("결제금액");
|
||||
|
||||
// 데이터 라벨 값 노출
|
||||
chart2.getAllSeries().getPointLabels().setVisible(true);
|
||||
// 툴 팁 표시 속도 조절
|
||||
chart2.getToolTips().setInitialDelay(0);
|
||||
chart2.getToolTips().setHideDelay(0);
|
||||
|
||||
// Y축 라벨 포맷을 Number로 지정하기(천단위 콤마 표시)
|
||||
chart2.getAxisY().getLabelsFormat().setFormat(cfx.AxisFormat.Number);
|
||||
|
||||
chart2.create(divHolder2);
|
||||
}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 테이블 데이터 조회
|
||||
* pageIndex
|
||||
* unitFlag
|
||||
* - 간단 : 'tableSimple'
|
||||
* - 상세 : 'tableDetail'
|
||||
*
|
||||
* ordrStand
|
||||
* - fn_select_ordrStandMapping() 참조
|
||||
*
|
||||
* ordrType
|
||||
* - 오름차순 : 'ASC'
|
||||
* - 내림차순 : 'DESC'
|
||||
*/
|
||||
let PordrStand;
|
||||
let TordrType;
|
||||
const fn_select_table_data = function(pageIndex, unitFlag, ordrStand, ordrType) {
|
||||
// console.log("fn_select_table_data()pageIndex, unitFlag : ", pageIndex, unitFlag);
|
||||
|
||||
const srchStrtSndngDt = $("#srchStrtSndngDt").val();
|
||||
const srchEndSndngDt = $("#srchEndSndngDt").val();
|
||||
const srchOrdrEnvrnCds = $('input[name="srchOrdrEnvrnCds"]:checked').map(function() { return $(this).val(); }).get();
|
||||
const pageUnit = $("#pageUnit").val();
|
||||
const recordCountPerPage = '50';
|
||||
|
||||
if(!pageIndex) {
|
||||
$('#pageIndex').val(1);
|
||||
} else {
|
||||
$('#pageIndex').val(pageIndex);
|
||||
}
|
||||
const pageIndexValue = $("#pageIndex").val();
|
||||
|
||||
if(!unitFlag) {
|
||||
if ($('#tableSimple').hasClass('selected')) {
|
||||
unitFlag = 'tableSimple';
|
||||
}else if ($('#tableDetail').hasClass('selected')) {
|
||||
unitFlag = 'tableDetail';
|
||||
}
|
||||
}
|
||||
|
||||
if(!pageIndex){
|
||||
if (!ordrType && PordrStand == ordrStand) {
|
||||
//정렬 방식 변경 (정렬 기준 파라미터가 이전과 동일)
|
||||
TordrType = (TordrType == 'ASC') ? 'DESC' : 'ASC';
|
||||
}else if(!ordrType){
|
||||
//정렬 방식 기본값으로 지정 (정렬 기준 변경)
|
||||
TordrType = 'ASC';
|
||||
}else{
|
||||
//정렬 방식 초기화 (표 조회)
|
||||
TordrType = ordrType;
|
||||
}
|
||||
|
||||
if(!ordrStand){
|
||||
//정렬 기준 기본값으로 지정
|
||||
PordrStand = 'dt';
|
||||
}else{
|
||||
//정렬 기준 변경
|
||||
PordrStand = ordrStand;
|
||||
}
|
||||
}
|
||||
|
||||
const data = {
|
||||
srchStrtSndngDt : srchStrtSndngDt,
|
||||
srchEndSndngDt : srchEndSndngDt,
|
||||
srchOrdrEnvrnCds : srchOrdrEnvrnCds,
|
||||
unitFlag : unitFlag,
|
||||
pageUnit : pageUnit,
|
||||
ordrStand : PordrStand,
|
||||
ordrType : TordrType,
|
||||
pageIndex : pageIndexValue,
|
||||
recordCountPerPage : recordCountPerPage
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url : "/mngr/stats/marktAnals/selectMngrInflowStatsTableInqire",
|
||||
data : data,
|
||||
success:function(resultHtml) {
|
||||
// console.log('success');
|
||||
$('#pageDiv').empty();
|
||||
$('#pageDiv').html(resultHtml);
|
||||
|
||||
$('.reorder_' + PordrStand).text(fn_select_ordrStandMapping()[PordrStand] + (TordrType === 'ASC' ? ' ▲' : ' ▼'));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 테이블 정렬 조건(행)
|
||||
*/
|
||||
const fn_select_ordrStandMapping = function() {
|
||||
let ordrStandMapping;
|
||||
|
||||
if ($('#tableSimple').hasClass('selected')) {
|
||||
ordrStandMapping = {
|
||||
'dt': '일자',
|
||||
'accessUserCnt': '유입수',
|
||||
'ordrCnt': '결제건수',
|
||||
'rlSetleAmt': '결제금액',
|
||||
'rlSetleAmtRt': '유입당결제율'
|
||||
};
|
||||
}else if ($('#tableDetail').hasClass('selected')) {
|
||||
ordrStandMapping = {
|
||||
'dt': '일자',
|
||||
'hr': '시간대',
|
||||
'accessUserCnt': '유입수',
|
||||
'ordrCnt': '결제건수',
|
||||
'rlSetleAmt': '결제금액',
|
||||
'rlSetleAmtRt': '유입당결제율'
|
||||
};
|
||||
}
|
||||
|
||||
return ordrStandMapping;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 엑셀 다운로드
|
||||
*/
|
||||
const fn_download_excel = function() {
|
||||
|
||||
let unitFlag = "";
|
||||
if ($('#tableSimple').hasClass('selected')) {
|
||||
unitFlag = 'tableSimple';
|
||||
}else if ($('#tableDetail').hasClass('selected')) {
|
||||
unitFlag = 'tableDetail';
|
||||
}
|
||||
|
||||
$('#unitFlag').val(unitFlag);
|
||||
|
||||
var tempForm = $('#listForm').clone();
|
||||
tempForm.append('<input type="hidden" name="ordrStand" value="' + PordrStand + '">');
|
||||
tempForm.append('<input type="hidden" name="ordrType" value="' + TordrType + '">');
|
||||
tempForm.attr('action', '<c:url value="/mngr/stats/marktAnals/selectMngrInflowStatsExcelFileDownload"/>');
|
||||
tempForm.attr('method', 'POST');
|
||||
|
||||
$('body').append(tempForm);
|
||||
tempForm.submit();
|
||||
tempForm.remove();
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<body>
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Header.jsp" %>
|
||||
<main class="main">
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Left.jsp" %>
|
||||
<div class="content">
|
||||
<div class="content__inner">
|
||||
|
||||
<input type="hidden" id="pageIndex" value="${ resultMap.pageIndex }"/>
|
||||
<input type="hidden" id="pageUnit" value="${ resultMap.pageUnit }"/>
|
||||
|
||||
<div class="page-title">
|
||||
<div class="dashboardTitle__left">
|
||||
<h2 class="page-title__title">전자상거래 요약</h2>
|
||||
<p class="dashboardTitle__subTitle">전자상거래 분석에 꼭 필요한 정보만을 요약하여 볼 수 있습니다.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form id="listForm">
|
||||
<section class="content-section">
|
||||
<div class="table-wrapper">
|
||||
<table class="table dashboardSearch">
|
||||
<caption>해당 테이블에 대한 설명</caption>
|
||||
<colgroup>
|
||||
<col>
|
||||
|
||||
<col>
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>결제기간</th>
|
||||
<td>
|
||||
<div class="td-inner">
|
||||
<div class="input-container">
|
||||
<input type="text" class="datepicker"
|
||||
id="srchStrtSndngDt" name="srchStrtSndngDt" title="시작 날짜 선택"
|
||||
autocomplete="off">
|
||||
<span class="tilde">~</span>
|
||||
<input type="text" class="datepicker"
|
||||
id="srchEndSndngDt" name="srchEndSndngDt" title="종료 날짜 선택"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<div class="dateRange-btnContainer" id="dataRangeBtn">
|
||||
<button type="button" class="dateRange-btn" id="yesterday">어제</button>
|
||||
<button></button>
|
||||
<button type="button" class="dateRange-btn" id="threeDays">3일간</button>
|
||||
<button type="button" class="dateRange-btn selected" id="sevenDays">일주일</button>
|
||||
<button type="button" class="dateRange-btn" id="oneMonth">1개월</button>
|
||||
<button type="button" class="dateRange-btn" id="threeMonth">3개월</button>
|
||||
<button type="button" class="dateRange-btn" id="sixMonth">6개월</button>
|
||||
<button type="button" class="dateRange-btn" id="year">1년</button>
|
||||
</div>
|
||||
<button class="btn sm primary ml-5" type="button" id="srchBtn">검색</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>주문환경</th>
|
||||
<td>
|
||||
<div class="td-inner">
|
||||
<div class="b-checkbox-container">
|
||||
<c:forEach items="${cond.ordrEnvrnDvCdList}" var="ordrEnvrnDvCd" varStatus="status">
|
||||
<c:if test="${!(ordrEnvrnDvCd.cd == 'S1' || ordrEnvrnDvCd.cd == 'S2' || ordrEnvrnDvCd.cd == 'S3')}">
|
||||
<label class="b-checkbox checkbox">
|
||||
<input type="checkbox" name="srchOrdrEnvrnCds" value="${ordrEnvrnDvCd.cd}">
|
||||
<span class="check"></span>
|
||||
<span class="control-label">${ordrEnvrnDvCd.cdNm}</span>
|
||||
</label>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="dashboardContent__wrapper">
|
||||
<div class="dashboardContentTitle">
|
||||
<div class="dashboardContentTitle__left">
|
||||
<h3 class="content-section__title">
|
||||
유입수
|
||||
</h3>
|
||||
</div>
|
||||
<div class="dashboardContentTitle__right">
|
||||
<div class="dateRange-btnContainer">
|
||||
<button class="dateRange-btn selected" id="chart1Month">월</button>
|
||||
<button class="dateRange-btn" id="chart1Day">일</button>
|
||||
<button class="dateRange-btn" id="chart1Hour">시간대</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="ChartDiv1" style="height:400px;"></div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="dashboardContent__wrapper">
|
||||
<div class="dashboardContentTitle">
|
||||
<div class="dashboardContentTitle__left">
|
||||
<h3 class="content-section__title">
|
||||
시간대별 결제금액(기여도추정)
|
||||
<p class="dashboardTitle__subTitle">시간대/요일 별로 고객들의 마케팅채널 이용 행태와 이용된 마케팅 채널이 결제금액에 얼마나 기여하고 있는지를 알 수 있습니다.</p>
|
||||
</h3>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="ChartDiv2" style="height:400px;"></div>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
<div class="table-wrapper">
|
||||
<div class="dashboardContentTitle" style="margin-bottom: 20px;">
|
||||
<div class="dashboardContentTitle__left">
|
||||
<div class="dateRange-btnContainer">
|
||||
<button class="dateRange-btn selected" id="tableSimple">간단</button>
|
||||
<button class="dateRange-btn" id="tableDetail">상세</button>
|
||||
|
||||
<input type="hidden" name="unitFlag" id="unitFlag" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dashboardContentTitle__right">
|
||||
<button class="btn outline sm" onclick="fn_download_excel(); return false;">
|
||||
<i class="icon icon_excel"></i>
|
||||
다운로드
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="pageDiv">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
</div>
|
||||
<button class="scroll-to-top"><span class="visually-hidden">위로가기</span></button>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,90 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
||||
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
|
||||
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
|
||||
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
|
||||
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('th[class^="reorder_"]').click(function() {
|
||||
var className = $(this).attr('class');
|
||||
var ordrStand = className.replace('reorder_', '');
|
||||
fn_select_table_data(null, null, ordrStand);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
th[class^="reorder_"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
<section class="content-section">
|
||||
<table class="table vertical">
|
||||
<caption>해당 테이블에 대한 설명</caption>
|
||||
<colgroup>
|
||||
<col style="width: auto;">
|
||||
</colgroup>
|
||||
<thead id="tableHeader">
|
||||
<tr>
|
||||
<c:if test="${ resultMap.unitFlag eq 'tableSimple' }">
|
||||
<th class="reorder_dt">일자</th>
|
||||
<th class="reorder_accessUserCnt">유입수</th>
|
||||
<th class="reorder_ordrCnt">결제건수</th>
|
||||
<th class="reorder_rlSetleAmt">결제금액</th>
|
||||
<th class="reorder_rlSetleAmtRt">유입당결제율</th>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${ resultMap.unitFlag eq 'tableDetail' }">
|
||||
<th class="reorder_dt">일자</th>
|
||||
<th class="reorder_hr">시간대</th>
|
||||
<th class="reorder_accessUserCnt">유입수</th>
|
||||
<th class="reorder_ordrCnt">결제건수</th>
|
||||
<th class="reorder_rlSetleAmt">결제금액</th>
|
||||
<th class="reorder_rlSetleAmtRt">유입당결제율</th>
|
||||
</c:if>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tableBody">
|
||||
<c:choose>
|
||||
<c:when test="${ empty resultMap.resultList }">
|
||||
<tr>
|
||||
<td class="row-no-data" colspan="20">조회된 데이터가 없습니다.</td>
|
||||
</tr>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
|
||||
<c:forEach items="${ resultMap.resultList }" var="list" varStatus="status">
|
||||
<c:if test="${ resultMap.unitFlag eq 'tableSimple' }">
|
||||
<tr>
|
||||
<td>${ list.dt }</td>
|
||||
<td><fmt:formatNumber value="${ list.accessUserCnt }" pattern="#,###"/></td>
|
||||
<td><fmt:formatNumber value="${ list.ordrCnt }" pattern="#,###"/></td>
|
||||
<td><fmt:formatNumber value="${ list.rlSetleAmt }" pattern="#,###"/></td>
|
||||
<td>${ list.rlSetleAmtRt }%</td>
|
||||
</tr>
|
||||
</c:if>
|
||||
|
||||
<c:if test="${ resultMap.unitFlag eq 'tableDetail' }">
|
||||
<tr>
|
||||
<td>${ list.dt }</td>
|
||||
<td>${ list.hr }</td>
|
||||
<td><fmt:formatNumber value="${ list.accessUserCnt }" pattern="#,###"/></td>
|
||||
<td><fmt:formatNumber value="${ list.ordrCnt }" pattern="#,###"/></td>
|
||||
<td><fmt:formatNumber value="${ list.rlSetleAmt }" pattern="#,###"/></td>
|
||||
<td>${ list.rlSetleAmtRt }%</td>
|
||||
</tr>
|
||||
</c:if>
|
||||
|
||||
</c:forEach>
|
||||
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
|
||||
<div class="pagination__container">
|
||||
<ui:pagination paginationInfo="${ resultMap.paginationInfo }" type="image" jsFunction="fn_select_table_data" />
|
||||
</div>
|
||||
@@ -0,0 +1,278 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
||||
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
|
||||
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
|
||||
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
|
||||
<%@ taglib prefix="f" uri="/WEB-INF/tlds/f.tld" %>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
|
||||
<head>
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Include.jsp" %>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
|
||||
fn_set_dateRange_function('#dataRangeBtn', 'srchStrtSndngDt','srchEndSndngDt', 'srchEndSndngDt');
|
||||
fn_set_date('srchStrtSndngDt', 'srchEndSndngDt','srchEndSndngDt', '7D');
|
||||
|
||||
// 표 조회
|
||||
// fn_select_table_data(null, null);
|
||||
|
||||
// 날짜 검색
|
||||
$("#srchBtn").on("click", function(){
|
||||
fn_select_table_data(null, null);
|
||||
});
|
||||
|
||||
|
||||
// 표
|
||||
// $("#").on("click", function() {
|
||||
// fn_select_table_data(null, '', 'coupNm', 'ASC');
|
||||
// });
|
||||
|
||||
// 페이징 제자리 새로고침(Submit) 방지
|
||||
$('body').on('click', 'button.pagination__item.active', function(event) {
|
||||
event.preventDefault();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* 테이블 데이터 조회
|
||||
* pageIndex
|
||||
* unitFlag
|
||||
* - 간단 : 'tableSimple'
|
||||
* - 상세 : 'tableDetail'
|
||||
*
|
||||
* ordrStand
|
||||
* - fn_select_ordrStandMapping() 참조
|
||||
*
|
||||
* ordrType
|
||||
* - 오름차순 : 'ASC'
|
||||
* - 내림차순 : 'DESC'
|
||||
*/
|
||||
let PordrStand;
|
||||
let TordrType;
|
||||
const fn_select_table_data = function(pageIndex, unitFlag, ordrStand, ordrType) {
|
||||
// console.log("fn_select_table_data()pageIndex, unitFlag : ", pageIndex, unitFlag);
|
||||
|
||||
const srchStrtSndngDt = $("#srchStrtSndngDt").val();
|
||||
const srchEndSndngDt = $("#srchEndSndngDt").val();
|
||||
const srchOrdrEnvrnCds = $('input[name="srchOrdrEnvrnCds"]:checked').map(function() { return $(this).val(); }).get();
|
||||
const pageUnit = $("#pageUnit").val();
|
||||
const recordCountPerPage = '50';
|
||||
|
||||
if(!pageIndex) {
|
||||
$('#pageIndex').val(1);
|
||||
} else {
|
||||
$('#pageIndex').val(pageIndex);
|
||||
}
|
||||
const pageIndexValue = $("#pageIndex").val();
|
||||
|
||||
if(!unitFlag) {
|
||||
// if ($('#').hasClass('selected')) {
|
||||
unitFlag = '';
|
||||
// }
|
||||
}
|
||||
|
||||
if(!pageIndex){
|
||||
if (!ordrType && PordrStand == ordrStand) {
|
||||
//정렬 방식 변경 (정렬 기준 파라미터가 이전과 동일)
|
||||
TordrType = (TordrType == 'ASC') ? 'DESC' : 'ASC';
|
||||
}else if(!ordrType){
|
||||
//정렬 방식 기본값으로 지정 (정렬 기준 변경)
|
||||
TordrType = 'ASC';
|
||||
}else{
|
||||
//정렬 방식 초기화 (표 조회)
|
||||
TordrType = ordrType;
|
||||
}
|
||||
|
||||
if(!ordrStand){
|
||||
//정렬 기준 기본값으로 지정
|
||||
PordrStand = 'couponNm';
|
||||
}else{
|
||||
//정렬 기준 변경
|
||||
PordrStand = ordrStand;
|
||||
}
|
||||
}
|
||||
|
||||
const data = {
|
||||
srchStrtSndngDt : srchStrtSndngDt,
|
||||
srchEndSndngDt : srchEndSndngDt,
|
||||
srchOrdrEnvrnCds : srchOrdrEnvrnCds,
|
||||
unitFlag : unitFlag,
|
||||
pageUnit : pageUnit,
|
||||
ordrStand : PordrStand,
|
||||
ordrType : TordrType,
|
||||
pageIndex : pageIndexValue,
|
||||
recordCountPerPage : recordCountPerPage
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url : "/mngr/stats/marktAnals/selectMngrCouponStatsTableInqire",
|
||||
data : data,
|
||||
success:function(resultHtml) {
|
||||
// console.log('success');
|
||||
$('#pageDiv').empty();
|
||||
$('#pageDiv').html(resultHtml);
|
||||
|
||||
$('.reorder_' + PordrStand).text(fn_select_ordrStandMapping()[PordrStand] + (TordrType === 'ASC' ? ' ▲' : ' ▼'));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 테이블 정렬 조건(행)
|
||||
*/
|
||||
const fn_select_ordrStandMapping = function() {
|
||||
let ordrStandMapping;
|
||||
|
||||
ordrStandMapping = {
|
||||
't1': '',
|
||||
't2': ''
|
||||
};
|
||||
|
||||
return ordrStandMapping;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 엑셀 다운로드
|
||||
*/
|
||||
const fn_download_excel = function() {
|
||||
|
||||
let unitFlag = "";
|
||||
// if ($('#').hasClass('selected')) {
|
||||
// unitFlag = '';
|
||||
// }
|
||||
|
||||
$('#unitFlag').val(unitFlag);
|
||||
|
||||
var tempForm = $('#listForm').clone();
|
||||
tempForm.append('<input type="hidden" name="ordrStand" value="' + PordrStand + '">');
|
||||
tempForm.append('<input type="hidden" name="ordrType" value="' + TordrType + '">');
|
||||
tempForm.attr('action', '<c:url value="/mngr/stats/marktAnals/selectMngrCouponStatsExcelFileDownload"/>');
|
||||
tempForm.attr('method', 'POST');
|
||||
|
||||
$('body').append(tempForm);
|
||||
tempForm.submit();
|
||||
tempForm.remove();
|
||||
};
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Header.jsp" %>
|
||||
<main class="main">
|
||||
<%@include file ="/WEB-INF/views/comm/mngr/Left.jsp" %>
|
||||
<div class="content">
|
||||
<div class="content__inner">
|
||||
|
||||
<input type="hidden" id="pageIndex" value="${ resultMap.pageIndex }"/>
|
||||
<input type="hidden" id="pageUnit" value="${ resultMap.pageUnit }"/>
|
||||
|
||||
<div class="page-title">
|
||||
<div class="dashboardTitle__left">
|
||||
<h2 class="page-title__title">전자상거래 요약</h2>
|
||||
<p class="dashboardTitle__subTitle">전자상거래 분석에 꼭 필요한 정보만을 요약하여 볼 수 있습니다.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form id="listForm">
|
||||
<section class="content-section">
|
||||
<div class="table-wrapper">
|
||||
<table class="table dashboardSearch">
|
||||
<caption>해당 테이블에 대한 설명</caption>
|
||||
<colgroup>
|
||||
<col>
|
||||
|
||||
<col>
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>결제기간</th>
|
||||
<td>
|
||||
<div class="td-inner">
|
||||
<div class="input-container">
|
||||
<input type="text" class="datepicker"
|
||||
id="srchStrtSndngDt" name="srchStrtSndngDt" title="시작 날짜 선택"
|
||||
autocomplete="off">
|
||||
<span class="tilde">~</span>
|
||||
<input type="text" class="datepicker"
|
||||
id="srchEndSndngDt" name="srchEndSndngDt" title="종료 날짜 선택"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<div class="dateRange-btnContainer" id="dataRangeBtn">
|
||||
<button type="button" class="dateRange-btn" id="yesterday">어제</button>
|
||||
<button type="button" class="dateRange-btn" id="today" >오늘</button>
|
||||
<button type="button" class="dateRange-btn" id="threeDays">3일간</button>
|
||||
<button type="button" class="dateRange-btn selected" id="sevenDays">일주일</button>
|
||||
<button type="button" class="dateRange-btn" id="oneMonth">1개월</button>
|
||||
<button type="button" class="dateRange-btn" id="threeMonth">3개월</button>
|
||||
<button type="button" class="dateRange-btn" id="sixMonth">6개월</button>
|
||||
<button type="button" class="dateRange-btn" id="year">1년</button>
|
||||
</div>
|
||||
<button class="btn sm primary ml-5" type="button" id="srchBtn">검색</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>주문환경</th>
|
||||
<td>
|
||||
<div class="td-inner">
|
||||
<div class="b-checkbox-container">
|
||||
<c:forEach items="${cond.ordrEnvrnDvCdList}" var="ordrEnvrnDvCd" varStatus="status">
|
||||
<c:if test="${!(ordrEnvrnDvCd.cd == 'S1' || ordrEnvrnDvCd.cd == 'S2' || ordrEnvrnDvCd.cd == 'S3')}">
|
||||
<label class="b-checkbox checkbox">
|
||||
<input type="checkbox" name="srchOrdrEnvrnCds" value="${ordrEnvrnDvCd.cd}">
|
||||
<span class="check"></span>
|
||||
<span class="control-label">${ordrEnvrnDvCd.cdNm}</span>
|
||||
</label>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="table-wrapper">
|
||||
<div class="dashboardContentTitle" style="margin-bottom: 20px;">
|
||||
<div class="dashboardContentTitle__left">
|
||||
<div class="dateRange-btnContainer">
|
||||
<input type="hidden" name="unitFlag" id="unitFlag" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dashboardContentTitle__right">
|
||||
<button class="btn outline sm" onclick="fn_download_excel(); return false;">
|
||||
<i class="icon icon_excel"></i>
|
||||
다운로드
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="pageDiv">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
</div>
|
||||
<button class="scroll-to-top"><span class="visually-hidden">위로가기</span></button>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,64 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
||||
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
|
||||
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
|
||||
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
|
||||
|
||||
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('th[class^="reorder_"]').click(function() {
|
||||
var className = $(this).attr('class');
|
||||
var ordrStand = className.replace('reorder_', '');
|
||||
fn_select_table_data(null, null, ordrStand);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
th[class^="reorder_"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
<section class="content-section">
|
||||
<table class="table vertical">
|
||||
<caption>해당 테이블에 대한 설명</caption>
|
||||
<colgroup>
|
||||
<col style="width: auto;">
|
||||
</colgroup>
|
||||
<thead id="tableHeader">
|
||||
<tr>
|
||||
<th class="reorder_t1"></th>
|
||||
<th class="reorder_t2"></th>
|
||||
<th class="reorder_t3"></th>
|
||||
<th class="reorder_t4"></th>
|
||||
<th class="reorder_t5"></th>
|
||||
<th class="reorder_t6"></th>
|
||||
<th class="reorder_t7"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tableBody">
|
||||
<c:choose>
|
||||
<c:when test="${ empty resultMap.resultList }">
|
||||
<tr>
|
||||
<td class="row-no-data" colspan="8">조회된 데이터가 없습니다.</td>
|
||||
</tr>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
|
||||
<c:forEach items="${ resultMap.resultList }" var="list" varStatus="status">
|
||||
<tr>
|
||||
<td>${ list.couponNm }</td>
|
||||
<td><fmt:formatNumber value="${ list.discountAmt }" pattern="#,###"/></td>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
|
||||
<div class="pagination__container">
|
||||
<ui:pagination paginationInfo="${ resultMap.paginationInfo }" type="image" jsFunction="fn_select_table_data" />
|
||||
</div>
|
||||
Reference in New Issue
Block a user