@layout("/common/_container.html"){
|
<link rel="stylesheet" href="${ctxPath}/static/js/layui/css/layui.css" media="all">
|
<div class="row">
|
<div class="col-sm-12">
|
<div class="ibox float-e-margins">
|
<div class="ibox-title">
|
<h5>会员等级数据统计</h5>
|
</div>
|
<div class="ibox-content">
|
<div class="row row-lg">
|
<div class="col-sm-12">
|
<div class="row">
|
<div class="col-sm-3">
|
<div class="input-group">
|
<div class="input-group-btn">
|
<button data-toggle="dropdown" class="btn btn-white dropdown-toggle" type="button">
|
类型
|
</button>
|
</div>
|
<select class="form-control" id="dateType">
|
<option value="1">天</option>
|
<option value="2">月</option>
|
<option value="3">季度</option>
|
<option value="4">年</option>
|
</select>
|
</div>
|
</div>
|
<div class="col-sm-3">
|
<div class="day">
|
<div class="input-group">
|
<div class="input-group-btn">
|
<button data-toggle="dropdown" class="btn btn-white dropdown-toggle" type="button">
|
时间
|
</button>
|
</div>
|
<input type="text" class="form-control" id="dayTime">
|
</div>
|
</div>
|
<div class="month" style="display: none;">
|
<div class="input-group">
|
<div class="input-group-btn">
|
<button data-toggle="dropdown" class="btn btn-white dropdown-toggle" type="button">
|
时间
|
</button>
|
</div>
|
<input type="text" class="form-control" id="monthTime">
|
</div>
|
</div>
|
<div class="quarter" style="display: none;">
|
<div class="input-group">
|
<div class="input-group-btn">
|
<button data-toggle="dropdown" class="btn btn-white dropdown-toggle" type="button">
|
时间
|
</button>
|
</div>
|
<input type="text" class="form-control" id="quarterTime" style="width: 50%;">
|
<select id="quarter" class="form-control" style="width: 50%;">
|
<option value="1">一季度</option>
|
<option value="2">二季度</option>
|
<option value="3">三季度</option>
|
<option value="4">四季度</option>
|
</select>
|
</div>
|
</div>
|
<div class="year" style="display: none;">
|
<div class="input-group">
|
<div class="input-group-btn">
|
<button data-toggle="dropdown" class="btn btn-white dropdown-toggle" type="button">
|
时间
|
</button>
|
</div>
|
<input type="text" class="form-control" id="yearTime">
|
</div>
|
</div>
|
</div>
|
<div class="col-sm-3 pull-right">
|
<#button name="搜索" icon="fa-search" clickFun="Statistics.search()"/>
|
<#button name="重置" icon="fa-trash" clickFun="Statistics.resetSearch()" space="true"/>
|
</div>
|
</div>
|
<div class="hidden-xs" id="StatisticsTableToolbar" role="group">
|
</div>
|
<div style="width: 300px;height: 40px;margin-bottom: 20px;">
|
<div style="float: left;width: 100px;height: 40px;margin-right: 15px;text-align: center;line-height: 40px; background-color: #1ab394;color: #fff;" onclick="chooseType(this, 1)">当前等级人数</div>
|
<div style="float: left;width: 100px;height: 40px;margin-right: 15px;text-align: center;line-height: 40px;" onclick="chooseType(this, 2)">权益领取人数</div>
|
</div>
|
<div id="container" style="min-width: 400px; height: 400px"></div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<script src="${ctxPath}/static/modular/system/statistics/vipLevelNumberSummaryGraph.js"></script>
|
<script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
|
<script src="${ctxPath}/static/js/layui/layui.js" charset="utf-8"></script>
|
<script>
|
|
Date.prototype.format = function(fmt) {
|
var o = {
|
"M+" : this.getMonth()+1, //月份
|
"d+" : this.getDate(), //日
|
"h+" : this.getHours(), //小时
|
"m+" : this.getMinutes(), //分
|
"s+" : this.getSeconds(), //秒
|
"q+" : Math.floor((this.getMonth()+3)/3), //季度
|
"S" : this.getMilliseconds() //毫秒
|
};
|
if(/(y+)/.test(fmt)) {
|
fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
|
}
|
for(var k in o) {
|
if(new RegExp("("+ k +")").test(fmt)){
|
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
|
}
|
}
|
return fmt;
|
}
|
|
let end = new Date().format("yyyy-MM-dd");
|
let start = new Date(new Date().getTime() - (1000 * 60 * 60 * 24 * 30)).format("yyyy-MM-dd");
|
//年范围
|
layui.use('laydate', function() {
|
var laydate = layui.laydate;
|
laydate.render({
|
elem: '#dayTime'
|
,type: 'date'
|
,value: (start + ' - ' + end)
|
,range: true
|
});
|
laydate.render({
|
elem: '#monthTime'
|
,type: 'month'
|
,range: true
|
});
|
laydate.render({
|
elem: '#quarterTime'
|
,type: 'year'
|
});
|
laydate.render({
|
elem: '#yearTime'
|
,type: 'year'
|
,range: true
|
});
|
});
|
|
function chooseType(e, type) {
|
$(e).css({
|
'background-color': '#1ab394',
|
'color': '#fff'
|
})
|
$(e).siblings('div').css({
|
'background-color': '#fff',
|
'color': '#676a6c'
|
})
|
Statistics.type = type;
|
Statistics.search();
|
}
|
|
|
</script>
|
@}
|
