<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<head>
<title>Store Homepage</title>
<spring:url value="/resources/core/css/selectivity-full.css" var="selectivityCss"></spring:url>
<spring:url value="/resources/core/js/selectivity-full.js" var="selectivityJs"></spring:url>
<spring:url value="/resources/core/js/echarts.min.js" var="echartsJs"></spring:url>
<spring:url value="/resources/core/images/important.png" var="important" />
<spring:url value="/resources/core/images/warn.png" var="warn" />
<spring:url value="/resources/core/images/greenWarn.png" var="greenWarn" />
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"/>
<link href="${selectivityCss}" rel="stylesheet"/>
<script src="${selectivityJs}"></script>
<script src="${echartsJs}"></script>
</head>
<body>
<!-- antiClickjack -->
<style id="antiClickjack">body {
display: none !important;
}</style>
<div id="fixed" style="position:fixed;z-index:500;bottom:0;right:0; "></div>
<div id="notice" >
</div>
<script>
$( function() {
$.post('${pageContext.request.contextPath}/settings/notice/getNoticeByStoreId',function(data){
if(data != "")
{
var op ="";
$.each(data,function(i,v){
op += "<div class='dialog' id='dialog" + i + "' title= '" + getNoticePriority(v.noticePriority) + " "+ v.theme+ "'>"
+ "<p>" + v.content + "</p>"
+ "</div>";
});
$("#notice").html(op);
$.each(data,function(i,v){
if(i == 0)
{
$( "#dialog0" ).dialog({
width:300,
height:150,
close: function(event,ui) {
onclose(event,ui, this);
},
position: {my: "right bottom" ,at: "right bottom",of: "#fixed",collisinon:"fit"},
});
var dia = $("#ui-id-" + (i+1));
var img = "<img width=26 height=26 src='" + getNoticePriority(v.noticePriority) + "' /> " + v.theme
$(dia).html(img);
}
else
{
$( "#dialog" + i ).dialog({
width:300,
height:150,
close: function(event,ui) {
onclose(event,ui, this);
},
position: {my: "center", at: "top top-114",of: "#dialog" + (i-1),collisinon:"fit"},
});
var dia = $("#ui-id-" + (i+1));
var img = "<img width=26 height=26 src='" + getNoticePriority(v.noticePriority)+ "' /> " + v.theme
$(dia).html(img);
}
});
}
setInterval("getNotice()",60000);
});
$(window).scroll(function(){
resetMsgQuene();
});
} );
function onclose(event,ui,aaa){
$("#" + aaa.id).remove();
resetMsgQuene();
//return false;
var dialog = $(".ui-dialog");
var notAllClose = 0;
for(var n = 0; n < dialog.length; n ++)
{
if($(dialog[n]).css("display") == "block")
{
++ notAllClose;
}
}
if(notAllClose == 0)
{
$.post('${pageContext.request.contextPath}/user/changeTimeCkeck',function(data){});
}
}
/**
重新排序消息队列
**/
function resetMsgQuene(){
var len = $(".dialog").length;
console.log(len);
for(var i = 0; i < len; i ++)
{
if(i == 0)
{
$($(".dialog")[0]).attr('id', 'dialog0');
$( "#dialog0" ).dialog(
"option","position",
{ my: "right bottom", at: "right bottom" ,of:"#fixed" }
);
}
else
{
$($(".dialog")[i]).attr('id', 'dialog' + i);
$( "#dialog" + i ).dialog(
"option","position",
{ my: "bottom bottom-98", at: "top right" ,of:"#dialog" + (i-1) }
);
}
}
}
function getNotice()
{
$.post('${pageContext.request.contextPath}/settings/notice/getNoticeEveyOneMinute',function(data){
var op ="";
var len = $(".dialog").length;
$.each(data,function(i,v){
op += "<div class='dialog' id='dialog" + (len+i) + "' title='" + getNoticePriority(v.noticePriority)+ " " + v.theme + "'>"
+ "<p>" + v.content + "</p>"
+ "</div>";
});
$("#notice").append(op);
$.each(data,function(i,v){
if((len+i) == 0)
{
$( "#dialog0" ).dialog({
width:300,
height:150,
close: function(event,ui) {
onclose(event,ui, this);
},
position: {my: "right bottom" ,at: "right bottom",of: "#fixed",collisinon:"fit"},
});
var diaId = $($($("#dialog" + (len+i)).parent()).find('span')[0]).attr('id');
var dia = $('#' + diaId);
var img = "<img width=26 height=26 src='" + getNoticePriority(v.noticePriority) + "' /> " + v.theme
$(dia).html(img);
}
else
{
$( "#dialog" + (len+i)).dialog({
width:300,
height:150,
close: function(event,ui) {
onclose(event,ui, this);
},
position: {my: "ceneter" ,at: "top top-114",of: "#dialog" + (len+i-1)},
});
var diaId = $($($("#dialog" + (len+i)).parent()).find('span')[0]).attr('id');
var dia = $('#' + diaId);
var img = "<img width=26 height=26 src='" + getNoticePriority(v.noticePriority)+ "' /> " + v.theme
$(dia).html(img);
}
});
});
}
function getNoticePriority(flag)
{
if(flag == 1)
return "${important}";
else if(flag == 2)
return "${warn}";
else if(flag == 3)
return "${greenWarn}";
}
</script>
<script type="text/javascript">
if (self === top) {
var antiClickjack = document.getElementById("antiClickjack");
antiClickjack.parentNode.removeChild(antiClickjack);
} else {
top.location = self.location;
}
function more(e){
if($(e).html() == "更多"){
$(e).html("收起");
$("#transferDetail").show();
}else if($(e).html() == "收起"){
$(e).html("更多");
$("#transferDetail").hide();
}
}
var thisYearReserve = [];
var thisYearExchange = [];
var lastYearReserve = [];
var lastYearExchange = [];
$(document).ready(function(){
//alert('${inventoryList}');
$.post('${pageContext.request.contextPath}/mainPage/getReserveAndExchange').done(function(data){
var thisYearReserve = new Array();
var thisYearExchange = new Array();
var lastYearReserve = new Array();
var lastYearExchange = new Array();
var days = new Array();
for(var i=0; i<data.thisYearReservelist.length; i++){
thisYearReserve.push({name:data.thisYearReservelist[i].label,value:data.thisYearReservelist[i].y});
}
for(var i=0; i<data.thisYearExchangeList.length; i++){
thisYearExchange.push({name:data.thisYearExchangeList[i].label,value:data.thisYearExchangeList[i].y});
}
for(var i=0; i<data.lastYearReservelist.length; i++){
lastYearReserve.push({name:data.lastYearReservelist[i].label,value:data.lastYearReservelist[i].y});
days.push("第" + (i + 1) + "天");
}
for(var i=0; i<data.lastYearExchangeList.length; i++){
lastYearExchange.push({name:data.lastYearExchangeList[i].label,value:data.lastYearExchangeList[i].y});
}
var myChart = echarts.init(document.getElementById('reserveExchangeChartContainer'));
var option = {
tooltip: {
trigger: 'item',
showDelay: 0,
show:true,
hideDelay: 50,
transitionDuration:0,
backgroundColor : 'black',
borderColor : '#f50',
borderRadius : 8,
borderWidth: 2,
padding: 10,
formatter: function (params, ticket, callback) {
return params.data.name + ' : ' + params.data.value;
},
},
toolbox: {
feature: {
dataView: {show: true, readOnly: false},
magicType: {show: true, type: ['line', 'bar']},
restore: {show: true},
saveAsImage: {show: true}
}
},
legend: {
data:['今年预约量','今年兑领量','去年预约量','去年兑领量']
},
xAxis: [
{
type: 'category',
boundaryGap: true,
data: days
}
],
yAxis: [
{
type: 'value',
},
{
type: 'value',
min: 0,
}
],
dataZoom: [
{
type: 'slider',
show: 'false',
filterMode: 'filter',
xAxisIndex: 0,
start: 0,
end: 100
},
{
type: 'inside',
show: 'false',
filterMode: 'filter',
xAxisIndex: 0,
start: 0,
end: 100
},
{
type: 'slider',
show: 'false',
filterMode: 'filter',
yAxisIndex: [0,1],
start: 0,
end: 100
},
{
type: 'inside',
show: 'false',
filterMode: 'filter',
yAxisIndex: [0,1],
start: 0,
end: 100
}
],
series: [
{
name:'今年预约量',
type:'line',
data:thisYearReserve
},
{
name:'今年兑领量',
type:'line',//区域
areaStyle: {normal: {}},
data:thisYearExchange
},
{
name:'去年预约量',
type:'line',
data:lastYearReserve
},
{
name:'去年兑领量',
type:'line',//区域
areaStyle: {normal: {}},
yAxisIndex: 1,
data:lastYearExchange
}
]
};
myChart.setOption(option);
});
});
function getSuggestedReserveCount(){
$.ajax({
type : "POST",
dataType:"json",
url : "${pageContext.request.contextPath}/mainPage/getSuggestedReserveCount",
success : function(data){
var info = "建议订货数量： ";
var holiday = "";
var secondNotAllowed = "";
var cityNotAllowed = "";
for(var key in data){
if(key == "Holiday"){
holiday = key;
}else if(key == "SecondNotAllowed"){
secondNotAllowed = key;
}else if(key == "cityNotAllowed"){
cityNotAllowed = key;
}else{
info += (key + ": " + data[key] + " ");
}
}
if(holiday == "Holiday"){
$("#suggestReserveCount").html("建议订货数量： " + data[holiday]);
}else if(secondNotAllowed == "SecondNotAllowed"){
$("#suggestReserveCount").html("建议订货数量： " + data[secondNotAllowed]);
}else if(cityNotAllowed == "cityNotAllowed"){
$("#suggestReserveCount").html("建议订货数量： " + data[cityNotAllowed]);
}else{
$("#suggestReserveCount").html(info);
}
},
error: function(data){
}
});
}
function fomatFloat(src, pos){
return Math.round(src*Math.pow(10,pos)) / Math.pow(10, pos);
}
$(document).ready(function(){
getSuggestedReserveCount();
setInterval("getSuggestedReserveCount()",3600 * 3 * 1000);
$.post('${pageContext.request.contextPath}/mainPage/getSalesData').done(function(data){
var xAxisData = new Array();
var salesVolume = new Array();
var salesTarget = new Array();
var salesRate = new Array();
for(var key in data){
xAxisData.push(key);
salesVolume.push(data[key][0]);
salesTarget.push(data[key][1]);
salesRate.push(fomatFloat(data[key][2] * 100,1));
}
var maxiumY = new Array();
var maxiumY2 = new Array();
var maxiumSalesVolume = new Array();
for(var key in data){
maxiumSalesVolume.push(data[key][0]);
maxiumY.push(data[key][1]);
maxiumY2.push(data[key][2]);
}
maxiumY.sort(function(a,b){
return b-a;
});
maxiumY2.sort(function(a,b){
return b-a;
});
maxiumSalesVolume.sort(function(a,b){
return b-a;
});
var myChart = echarts.init(document.getElementById('saleChartContainer'));
var option = {
tooltip: {
trigger: 'axis'
},
toolbox: {
feature: {
dataView: {show: true, readOnly: false},
magicType: {show: true, type: ['line', 'bar']},
restore: {show: true},
saveAsImage: {show: true}
}
},
legend: {
data:['销售量','销售目标','销售占目标百分比']
},
color: ['#C0504E','#4F81BC','#9BBB58'],
xAxis: [
{
type: 'category',
data: xAxisData
}
],
yAxis: [
{
type: 'value',
min: 0,
max: maxiumY[0] > maxiumSalesVolume[0] ? (maxiumY[0] + 20) : (maxiumSalesVolume[0] + 50),
interval: 50,
},
{
type: 'value',
min: 0,
max: fomatFloat(maxiumY2[0] * 100, 1) + 20,
interval: 40,
axisLabel: {
formatter: '{value} %'
}
}
],
dataZoom: [
{
type: 'slider',
show: 'false',
filterMode: 'filter',
xAxisIndex: 0,
start: 0,
end: 100
},
{
type: 'inside',
show: 'false',
filterMode: 'filter',
xAxisIndex: 0,
start: 0,
end: 100
},
{
type: 'slider',
show: 'false',
filterMode: 'filter',
yAxisIndex: [0,1],
start: 0,
end: 100
},
{
type: 'inside',
show: 'false',
filterMode: 'filter',
yAxisIndex: [0,1],
start: 0,
end: 100
}
],
series: [
{
name:'销售量',
type:'bar',
data:salesVolume
},
{
name:'销售目标',
type:'line',
data:salesTarget
},
{
name:'销售占目标百分比',
type:'line',
yAxisIndex: 1,
data:salesRate
}
]
};
myChart.setOption(option);
window.onresize = myChart.resize;
});
});
</script>
<div class="container">
<div class="row main-page-row">
<div class="col-sm-6 main-page-panel main-page-panel-top">
<div class="main-page-panel-head">提醒</div>
<div class="main-page-panel-container">
<ul>
<li style="color: #FF0000;">今日准备数量:
<c:choose>
<c:when test="${fn:length(todayResrv) == 0}">
无
</c:when>
<c:otherwise>
<c:forEach items="${todayResrv}" var="r">
${r.key}:${r.value}
</c:forEach>
</c:otherwise>
</c:choose>
</li>
<li>上一次盘点的时间: ${lastCheckTime}</li>
<li>
调拨:
<c:choose>
<c:when test="${fn:length(transferRecords) == 0}">
暂无调拨信息 <br/>
</c:when>
<c:otherwise>
<c:forEach items="${transferRecords}" var="record">
${record} <br/>
</c:forEach>
<c:if test="${fn:length(transferRecords2) > 0}">
<a href="javascript:void(0)" οnclick="more(this)" >更多</a> <br/>
<div id="transferDetail" style="display: none">
<c:forEach items="${transferRecords2}" var="record2">
${record2} <br/>
</c:forEach>
</div>
</c:if>
</c:otherwise>
</c:choose>
</li>
<li>订货提醒：
<c:choose>
<c:when test="${orderTime eq '0'}">
尚未订货安排
</c:when>
<c:otherwise>
${orderTime}
</c:otherwise>
</c:choose>
</li>
<li id="suggestReserveCount"></li>
</ul>
</div>
</div>
<div class="col-sm-4 main-page-panel main-page-panel-top">
<div class="main-page-panel-head">兑领概览</div>
<div class="main-page-panel-container">
<ul>
<li>正常兑领：${totalExMap["comCh"]}</li>
<li>强制兑领：${totalExMap["forceCh"]}</li>
<li>渠道兑领：${totalExMap["sstCh"]}</li>
<li>非渠道兑领：${totalExMap["notSstCh"]}</li>
<span style="color: red;">(建议撕毁相应数量礼券)</span>
</ul>
</div>
</div>
</div>
<div class="row main-page-row">
<div class="col-sm-6 main-page-panel">
<table class="table table-bordered table-responsive main-page-table">
<thead class="main-page-panel-head">
<tr>
<th style="width: 5%">礼盒</th>
<c:forEach var="sku" items="${inventoryList}">
<th style="width: 10%">${sku.skuName}</th>
</c:forEach>
</tr>
</thead>
<tbody class="main-page-panel-container">
<tr>
<td style="width: 5%">实际库存</td>
<c:forEach var="sku" items="${inventoryList}">
<c:choose>
<c:when test="${sku.specialActualCount != null && sku.commonActualCount != null}">
<td style="width: 10%">${sku.commonActualCount+stu.specialActualCount}</td>
</c:when>
<c:otherwise>
<td>-</td>
</c:otherwise>
</c:choose>
</c:forEach>
</tr>
<tr>
<td style="width: 7.5%">可用库存</td>
<c:forEach var="sku" items="${inventoryList}">
<c:choose>
<c:when test="${sku.commonAvailableCount != null}">
<td style="width: 10%">${sku.commonAvailableCount}</td>
</c:when>
<c:otherwise>
<td>-</td>
</c:otherwise>
</c:choose>
</c:forEach>
</tr>
<tr>
<td style="width: 5%">自备库存</td>
<c:forEach var="sku" items="${inventoryList}">
<c:choose>
<c:when test="${sku.specialActualCount != null}">
<td style="width: 10%">${sku.specialActualCount}</td>
</c:when>
<c:otherwise>
<td>-</td>
</c:otherwise>
</c:choose>
</c:forEach>
</tr>
</tbody>
</table>
</div>
<div class="col-sm-4 main-page-panel">
<table style="text-align : center" class="table table-bordered table-responsive">
<thead class="main-page-panel-head">
<tr>
<th style="width: 10%">礼券</th>
<c:forEach var="sku" items="${couponInventoryList}">
<th style="width: 15%">${sku.createUser}</th>
</c:forEach>
</tr>
</thead>
<tbody class="main-page-panel-container">
<tr>
<td style="width: 10%">实际库存</td>
<c:forEach var="sku" items="${couponInventoryList}">
<c:choose>
<c:when test="${sku.masterCount != null}">
<td style="width: 10%">${sku.masterCount + sku.bufferMasterCount}</td>
</c:when>
<c:otherwise>
<td>-</td>
</c:otherwise>
</c:choose>
</c:forEach>
</tr>
<tr>
<td style="width: 5%">调入</td>
<c:forEach var="sku" items="${couponInventoryList}">
<c:choose>
<c:when test="${masterTransferInMap[sku.createUser] != null}">
<td>${masterTransferInMap[sku.createUser]}</td>
</c:when>
<c:otherwise>
<td>0</td>
</c:otherwise>
</c:choose>
</c:forEach>
</tr>
<tr>
<td style="width: 10%">调出</td>
<c:forEach var="sku" items="${couponInventoryList}">
<c:choose>
<c:when test="${masterTransferOutMap[sku.createUser] != null}">
<td>${masterTransferOutMap[sku.createUser]}</td>
</c:when>
<c:otherwise>
<td>0</td>
</c:otherwise>
</c:choose>
</c:forEach>
</tr>
<tr>
<td style="width: 10%">buffer</td>
<c:forEach var="sku" items="${couponInventoryList}">
<c:choose>
<c:when test="${sku.bufferMasterCount != null}">
<td style="width: 10%">${sku.bufferMasterCount}</td>
</c:when>
<c:otherwise>
<td>-</td>
</c:otherwise>
</c:choose>
</c:forEach>
</tr>
</tbody>
</table>
</div>
</div>
<div class="row main-page-row">
<div class="col-sm-10 main-page-panel">
<div class="main-page-panel-head">销售占比图表</div>
<div class="main-page-panel-container">
<div id="saleChartContainer" style="height: 400px; width: 100%;"></div>
</div>
</div>
</div>
<div class="row main-page-row" id="reserve">
<div class="col-sm-10 main-page-panel">
<div class="main-page-panel-head">预约兑领图表</div>
<div class="main-page-panel-container">
<div id="reserveExchangeChartContainer" style="height: 65%; width: 100%;"></div>
</div>
</div>
</div>
</div>
</body>
</html>
测试
最新推荐文章于 2023-06-02 21:06:00 发布
9万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
