333 lines
14 KiB
Plaintext
333 lines
14 KiB
Plaintext
<%@ page contentType="text/html;charset=UTF-8" %>
|
||
<%@ include file="/webpage/include/taglib.jsp"%>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<script src="${ctxStatic }/echarts-2.2.7/build/dist/echarts-all.js"></script>
|
||
<title>首页</title>
|
||
<!-- <script type="text/javascript">
|
||
window.location.href="/hw/a/echarts/bar";
|
||
</script> -->
|
||
<!-- <style type="text/css"> -->
|
||
<!-- #calendar{ margin:40px auto 10px auto;width:100%;height:50%;} -->
|
||
<!-- .fancy{width:450px; height:200px} -->
|
||
<!-- .fancy h3{height:30px; line-height:30px; border-bottom:1px solid #d3d3d3; font-size:14px} -->
|
||
<!-- .fancy form{padding:10px} -->
|
||
<!-- .fancy p{height:28px; line-height:28px; padding:4px; color:#999} -->
|
||
<!-- .input{height:20px; line-height:20px; padding:2px; border:1px solid #d3d3d3; width:100px} -->
|
||
<!-- .btn{-webkit-border-radius: 3px;-moz-border-radius:3px;padding:5px 12px; cursor:pointer} -->
|
||
<!-- .btn_ok{background: #360;border: 1px solid #390;color:#fff} -->
|
||
<!-- .btn_cancel{background:#f0f0f0;border: 1px solid #d3d3d3; color:#666 } -->
|
||
<!-- .btn_del{background:#f90;border: 1px solid #f80; color:#fff } -->
|
||
<!-- .sub_btn{height:32px; line-height:32px; padding-top:6px; border-top:1px solid #f0f0f0; text-align:right; position:relative} -->
|
||
<!-- .sub_btn .del{position:absolute; left:2px} -->
|
||
<!-- </style> -->
|
||
<style>
|
||
.hand{cursor:pointer}
|
||
</style>
|
||
<script src='${ctxStatic}/fullcalendar/js/jquery-1.9.1.js'></script>
|
||
<script src='${ctxStatic}/fullcalendar/js/jquery-ui.js'></script>
|
||
<link rel="stylesheet" type="text/css" href="${ctxStatic}/fullcalendar/css/main.css">
|
||
<link rel="stylesheet" type="text/css" href="${ctxStatic}/fullcalendar/css/fancybox.css">
|
||
<script src='${ctxStatic}/fullcalendar/js/jquery.fancybox-1.3.1.pack.js'></script>
|
||
<link href="${ctxStatic}/fullcalendar/css/fullcalendar2.css" rel="stylesheet">
|
||
<link href="${ctxStatic}/fullcalendar/fullcalendar.print.css" rel="stylesheet">
|
||
<script src="${ctxStatic}/fullcalendar/js/fullcalendar.js"></script>
|
||
<meta name="decorator" content="default"/>
|
||
<%--<script type="text/javascript">
|
||
$(function() {
|
||
//页面加载完初始化日历
|
||
$('#calendar').fullCalendar({
|
||
//设置日历头部信息
|
||
header: {
|
||
left: 'prev',
|
||
center: 'title',
|
||
right: 'next'
|
||
},
|
||
titleFormat :{
|
||
month: 'yyyy年MMMM月 我的日程',
|
||
week: "yyyy年MMMM月d{'—'d日}",
|
||
day: 'yyyy年MMMM月d日 dddd'
|
||
},
|
||
firstDay:7,//每行第一天为周一
|
||
editable: true,//启用拖动
|
||
events: '${ctx}/iim/myCalendar/findList',
|
||
//点击某一天时促发
|
||
dayClick: function(date, allDay, jsEvent, view) {
|
||
var selDate =$.fullCalendar.formatDate(date,'yyyy-MM-dd');
|
||
$.fancybox({
|
||
'type':'ajax',
|
||
'href':'${ctx}/iim/myCalendar/addform?date='+selDate
|
||
});
|
||
},
|
||
//单击事件项时触发
|
||
eventClick: function(calEvent, jsEvent, view) {
|
||
$.fancybox({
|
||
'type':'ajax',
|
||
'href':'${ctx}/iim/myCalendar/editform?id='+calEvent.id
|
||
});
|
||
},
|
||
|
||
//拖动事件
|
||
eventDrop: function(event,dayDelta,minuteDelta,allDay,revertFunc) {
|
||
$.post("${ctx}/iim/myCalendar/drag",{id:event.id,daydiff:dayDelta, minudiff:minuteDelta,allday:allDay},function(msg){
|
||
if(msg!=1){
|
||
alert(msg);
|
||
revertFunc(); //恢复原状
|
||
}
|
||
});
|
||
},
|
||
|
||
//日程事件的缩放
|
||
eventResize: function(event,dayDelta,minuteDelta,revertFunc) {
|
||
$.post("${ctx}/iim/myCalendar/resize",{id:event.id,daydiff:dayDelta,minudiff:minuteDelta},function(msg){
|
||
if(msg!=1){
|
||
alert(msg);
|
||
revertFunc();
|
||
}
|
||
});
|
||
},
|
||
|
||
selectable: true, //允许用户拖动
|
||
select: function( startDate, endDate, allDay, jsEvent, view ){
|
||
var start =$.fullCalendar.formatDate(startDate,'yyyy-MM-dd');
|
||
var end =$.fullCalendar.formatDate(endDate,'yyyy-MM-dd');
|
||
$.fancybox({
|
||
'type':'ajax',
|
||
'href':'${ctx}/iim/myCalendar/addform?date='+start+'&end='+end
|
||
});
|
||
}
|
||
});
|
||
/* $(".fc-sat").css('backgroundColor','#c4e1ff');//这个是周六的TD
|
||
$(".fc-sun").css('backgroundColor','#c4e1ff');//这个是周日的TD */
|
||
});
|
||
</script>
|
||
--%>
|
||
</head>
|
||
<body class="gray-bg">
|
||
<div class="wrapper wrapper-content">
|
||
<div class="row animated fadeInDown">
|
||
|
||
<div class="col-sm-9">
|
||
<div class="ibox float-e-margins">
|
||
<!-- <div class="ibox-title">
|
||
<h5>我的日程 </h5>
|
||
</div> -->
|
||
<div class="ibox-content" style="padding:10px 15px 10px 8px;">
|
||
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
|
||
<div id="main" style="height:100%;min-height:450px;width:813px;margin: 5px;">图标初始化失败</div>
|
||
</div>
|
||
<%-- <c:forEach items="orderList" var="list">
|
||
${list.name}
|
||
|
||
</c:forEach>--%>
|
||
<script type="text/javascript">
|
||
</script>
|
||
<script type="text/javascript">
|
||
// 基于准备好的dom，初始化echarts实例
|
||
var myChart = echarts.init(document.getElementById('main'));
|
||
var option = "";
|
||
|
||
option = ${str}
|
||
/* {
|
||
color: ['#3398DB'],
|
||
title: {
|
||
text: ''
|
||
},
|
||
tooltip: {},
|
||
legend: {
|
||
data:['金额']
|
||
},
|
||
xAxis: {
|
||
data : ['商品名', '商品名', '商品名', '商品名', '商品名'],
|
||
},
|
||
yAxis: {},
|
||
series: [{
|
||
name: '金额',
|
||
type: 'bar',
|
||
data:[0, 0, 123, 33, 52]
|
||
},{
|
||
name: '总销量',
|
||
type: 'bar',
|
||
data:[22, 0, 123, 33, 52]
|
||
}
|
||
]
|
||
};*/
|
||
// option = {
|
||
// color: ['#A398DB'],
|
||
// tooltip : {
|
||
// trigger: 'axis',
|
||
// axisPointer : { // 坐标轴指示器，坐标轴触发有效
|
||
// type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
||
// }
|
||
// },
|
||
// grid: {
|
||
// left: '3%',
|
||
// right: '4%',
|
||
// bottom: '3%',
|
||
// containLabel: true
|
||
// },
|
||
// xAxis : [
|
||
// {
|
||
// type : 'category',
|
||
// data : ['总金额', '历史提现金额', '可提现金额', '本次提现金额', '未提现金额'],
|
||
// axisTick: {
|
||
// alignWithLabel: true
|
||
// }
|
||
// }
|
||
// ],
|
||
// yAxis : [
|
||
// {
|
||
// type : 'value'
|
||
// }
|
||
// ],
|
||
// series : [
|
||
// {
|
||
// name:'金额',
|
||
// type:'bar',
|
||
// barWidth: '60%',
|
||
// data:[10.5, 52, 200, 334, 390, 330, 220]
|
||
// data:[${list.sum}, ${list.history}, ${list.cantake}, ${list.thisNum}, ${list.notNum}]
|
||
// }
|
||
// ]
|
||
// };
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
function newline(option, number, axis){
|
||
option[axis]['axisLabel']={
|
||
interval: 0,
|
||
formatter: function(params){
|
||
var newParamsName = "";
|
||
var paramsNameNumber = params.length;
|
||
var provideNumber = number;
|
||
var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
|
||
if (paramsNameNumber > provideNumber) {
|
||
for (var p = 0; p < rowNumber; p++) {
|
||
var tempStr = "";
|
||
var start = p * provideNumber;
|
||
var end = start + provideNumber;
|
||
if (p == rowNumber - 1) {
|
||
tempStr = params.substring(start, paramsNameNumber);
|
||
} else {
|
||
tempStr = params.substring(start, end) + "\n";
|
||
}
|
||
newParamsName += tempStr;
|
||
}
|
||
} else {
|
||
newParamsName = params;
|
||
}
|
||
return newParamsName
|
||
}
|
||
}
|
||
return option;
|
||
}
|
||
|
||
//console.log(option);
|
||
/* var width = 813;
|
||
var xWidth = 95;
|
||
var yWidth = 95;
|
||
var fontSize = 12;
|
||
var xAxisWidth = parseInt(width) - (parseInt(xWidth) + parseInt(x2Width));//柱状图x轴宽度=统计页面宽度-柱状图x轴的空白间隙(x + x2)
|
||
var barCount = 3; //x轴单元格的个数（即为获取x轴的数据的条数）
|
||
var preBarWidth = Math.floor(xAxisWidth / barCount); //统计x轴每个单元格的间隔
|
||
var preBarFontCount = Math.floor(preBarWidth / fontSize) ; //柱状图每个柱所在x轴间隔能容纳的字数 = 每个柱子 x 轴间隔宽度 / 每个字的宽度（12px）
|
||
*/
|
||
|
||
//console.log(preBarFontCount);
|
||
//option = newline(option, 8, 'xAxis')
|
||
myChart.setOption(option);
|
||
myChart.on('click', function (params) {
|
||
//window.open('https://www.baidu.com/s?wd=' + encodeURIComponent(params.name));
|
||
//alert(params);
|
||
//console.log(params)
|
||
var map = {${map}};//利用map获取id
|
||
//console.log(map)
|
||
|
||
openDialogView('查看商品', '${ctx}/goods/goodss/form?id='+map[params.name],'800px', '500px');
|
||
//window.open('${ctx}/goods/goodss/form?id='+ map[params.name]);
|
||
// encodeURIComponent(map[params.name]));
|
||
});
|
||
</script>
|
||
</div>
|
||
</div>
|
||
<div class="col-sm-3" style="margin: 0px; padding: 0px 10px 0px 0px;">
|
||
<div class="ibox float-e-margins">
|
||
<div class="ibox-title">
|
||
<h5><i class="fa fa-bell panel-danger"></i> 最新订单</h5>
|
||
<c:if test="${not empty orderList}">
|
||
<span class="label label-danger pull-right hand" style="float: right" onclick="window.location.href='${ctx}/order/order'">查看更多</span>
|
||
</c:if>
|
||
</div>
|
||
<div class="ibox-content">
|
||
<div class="feed-activity-list">
|
||
<c:forEach items="${orderList}" var="order" end="8">
|
||
<div class="feed-element">
|
||
<div class="media-body ">
|
||
<small class="pull-right">${fns:pastTimeLong(order.enterTime)}前</small>
|
||
<small class="pull-right">金额:${order.amount}<c:if test="${empty order.amount}">0</c:if>元,</small>
|
||
<!-- <strong>谨斯里</strong> 上传了一个文件 -->
|
||
<a href="###" onclick="openDialogView('查看订单', '${ctx}/order/order/form?id=${order.id}','780px', '500px')">
|
||
${fns:abbr(order.name,50)}
|
||
</a>
|
||
<br>
|
||
<!-- <small class="text-muted"><fmt:formatDate value="${oaNotify.updateDate}" pattern="yyyy-MM-dd HH:mm:ss"/></small> -->
|
||
|
||
</div>
|
||
</div>
|
||
</c:forEach>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<%--
|
||
<div class="ibox float-e-margins">
|
||
<div class="ibox-title">
|
||
<h5><i class="fa fa-bell panel-warning"></i> 最新会议通知 </h5>
|
||
<span class="label label-warning pull-right" style="float: right">${meetCount}</span>
|
||
</div>
|
||
<div class="ibox-content">
|
||
<div class="feed-activity-list">
|
||
<c:forEach items="${meetNL}" var="oaNotify">
|
||
<div class="feed-element">
|
||
<div class="media-body ">
|
||
<small class="pull-right">${fns:pastTimeLong(oaNotify.updateDate)}</small>
|
||
<!-- <strong>谨斯里</strong> 上传了一个文件 -->
|
||
<a href="###" onclick="openDialogView('查看通知', '${ctx}/oa/oaNotify/view?id=${oaNotify.id}','800px', '700px')">
|
||
${fns:abbr(oaNotify.title,50)}
|
||
</a>
|
||
<br>
|
||
<small class="text-muted"><fmt:formatDate value="${oaNotify.updateDate}" pattern="yyyy-MM-dd HH:mm:ss"/></small>
|
||
|
||
</div>
|
||
</div>
|
||
</c:forEach>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
--%> <%--div class="ibox float-e-margins">
|
||
<div class="ibox-title">
|
||
<h5><i class="fa fa-bell panel-info"></i> 最新放假通知</h5>
|
||
<span class="label label-info pull-right" style="float: right">${holidayCount}</span>
|
||
</div>
|
||
<div class="ibox-content">
|
||
<div class="feed-activity-list">
|
||
<c:forEach items="${holidayNL}" var="oaNotify">
|
||
<div class="feed-element">
|
||
<div class="media-body ">
|
||
<small class="pull-right">${fns:pastTimeLong(oaNotify.updateDate)}</small>
|
||
<!-- <strong>谨斯里</strong> 上传了一个文件 -->
|
||
<a href="###" onclick="openDialogView('查看通知', '${ctx}/oa/oaNotify/view?id=${oaNotify.id}','800px', '700px')">
|
||
${fns:abbr(oaNotify.title,50)}
|
||
</a>
|
||
<br>
|
||
<small class="text-muted"><fmt:formatDate value="${oaNotify.updateDate}" pattern="yyyy-MM-dd HH:mm:ss"/></small>
|
||
|
||
</div>
|
||
</div>
|
||
</c:forEach>
|
||
</div>
|
||
</div>
|
||
</div--%>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</body> |