date.html
5.43 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
<!--日期20170629-->
<link rel="stylesheet" type="text/css" media="all" href="__PUBLIC__/static/date/daterangepicker-bs3.css" />
<link rel="stylesheet" type="text/css" media="all" href="__PUBLIC__/static/date/daterangepicker-1.3.7.css" />
<link href="__PUBLIC__/static/font/css/font-awesome.min.css" rel="stylesheet">
<script type="text/javascript" src="__PUBLIC__/static/date/bootstrap.min.js"></script>
<script type="text/javascript" src="__PUBLIC__/static/date/moment.js"></script>
<script type="text/javascript" src="__PUBLIC__/static/date/daterangepicker-1.3.7.js?v=2" id="datejs"></script>
<!--日期end-->
<style type="text/css">
.page-content{
vertical-align:middle;
display: inline-block;
*display: inline;
*zoom: 1;
}
#reportrange{
line-height: 30px;
height: 30px;
padding: 0;
position: relative;
}
#reportrange i {
margin-left: 10px;
}
.caret{
float: none;
position: absolute;
right: 5px;
top: 5px;
}
.fa-calendar::before{
content: "\f073";
}
.dateRange{
background-color: #fff;
}
.tabmenu .tab .active a, .tabmenu .tab .active a:hover{
padding: 7px 19px 26px;
}
.next i.fa{
margin-right: -20px;
}
.item-title .subject{
height: 47px;
}
.ncsc-default-table thead th{
height: auto;
}
.flexigrid .bDiv a.btn{
height: auto;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
//时间插件
// $('#reportrange span').text(1);
//$('#reportrange span').html(moment().subtract('hours', 24).format('YYYY-MM-DD HH:mm:ss') + ' - ' + moment().format('YYYY-MM-DD HH:mm:ss'));
// $("#add_time_begin").val(moment().subtract('hours', 24).format('YYYY-MM-DD HH:mm:ss'));
// $("#add_time_end").val(moment().format('YYYY-MM-DD HH:mm:ss'));
// var num=0;
// $(".dateRange").each(function(){
// num+=1;
// $(this).addClass("dateRange"+num);
// });
var getinputdate="";
if ($("#add_time_begin").val()!="" && $("#add_time_end").val()!="")
{
getinputdate = $("#add_time_begin").val() + " - " + $("#add_time_end").val();
}
$('#reportrange span').html(getinputdate);
$('#reportrange').daterangepicker({
// startDate: moment().startOf('day'),
//endDate: moment(),
//minDate: '01/01/2012', //最小时间
//maxDate: moment(), //最大时间
dateLimit: {
days: 7200
}, //起止时间的最大间隔
showDropdowns: true,
showWeekNumbers: true, //是否显示第几周
timePicker: true, //是否显示小时和分钟
timePickerIncrement: 60, //时间的增量，单位为分钟
timePicker12Hour: false, //是否使用12小时制来显示时间
ranges: {
//'最近1小时': [moment().subtract('hours',1), moment()],
'今日': [moment().startOf('day'), moment().format('YYYY-MM-DD 23:59:59')],
'昨日': [moment().subtract('days', 1).startOf('day'), moment().subtract('days', 1).endOf('day')],
'最近7日': [moment().subtract('days', 6), moment().format('YYYY-MM-DD 23:59:59')],
'最近30日': [moment().subtract('days', 29), moment().format('YYYY-MM-DD 23:59:59')]
},
beginTime:'#add_time_begin',//开始时间的元素id
endTime:'#add_time_end',//结束时间的元素id
showTime:'#reportrange span',//显示时间的元素id
timegap:'#timegap',//开始时间到结束时间的元素id
opens: 'right', //日期选择框的弹出位置
buttonClasses: ['btn btn-default'],
applyClass: 'btn-small btn-primary blue',
cancelClass: 'btn-small',
format: 'YYYY-MM-DD HH:mm:ss', //控件中from和to 显示的日期格式
separator: ' to ',
locale: {
applyLabel: '确定',
cancelLabel: '取消',
fromLabel: '起始时间',
toLabel: '结束时间',
customRangeLabel: '自定义',
daysOfWeek: ['日', '一', '二', '三', '四', '五', '六'],
monthNames: ['一月', '二月', '三月', '四月', '五月', '六月',
'七月', '八月', '九月', '十月', '十一月', '十二月'
],
firstDay: 1
}
}, function(start, end, label) { //格式化日期显示框
$("#add_time_begin").val(start.format('YYYY-MM-DD HH:mm:ss'));
$("#add_time_end").val(end.format('YYYY-MM-DD HH:mm:ss'));
$('#reportrange span').html(start.format('YYYY-MM-DD HH:mm:ss') + ' - ' + end.format('YYYY-MM-DD HH:mm:ss'));
});
//设置日期菜单被选项 --开始--
var dateOption;
if ("${riqi}" == 'day') {
dateOption = "今日";
} else if ("${riqi}" == 'yday') {
dateOption = "昨日";
} else if ("${riqi}" == 'week') {
dateOption = "最近7日";
} else if ("${riqi}" == 'month') {
dateOption = "最近30日";
} else if ("${riqi}" == 'year') {
dateOption = "最近一年";
} else {
dateOption = "自定义";
}
$(".daterangepicker").find("li").each(function() {
if ($(this).hasClass("active")) {
$(this).removeClass("active");
}
if (dateOption == $(this).html()) {
$(this).addClass("active");
}
});
//设置日期菜单被选项 --结束--
})
</script>
<div class="page-content">
<div class="container-fluid">
<div class="row-fluid" style="margin-top:5px">
<div class="span4">
<div class="control-group">
<div class="controls">
<div id="reportrange" class="pull-left dateRange" style="width:330px">
<i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
<span id="searchDateRange"></span>
<b class="caret"></b>
</div>
</div>
</div>
</div>
</div>
</div>
</div>