140 lines
5.2 KiB
Plaintext
140 lines
5.2 KiB
Plaintext
<!-- page content -->
|
|
<div class="right_col" role="main">
|
|
<div class="">
|
|
<div class="page-title">
|
|
<div class="title_left">
|
|
<h3>Plain Page</h3>
|
|
</div>
|
|
|
|
<div class="title_right">
|
|
<div class="col-md-5 col-sm-5 col-xs-12 form-group pull-right top_search">
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" placeholder="Search for...">
|
|
<span class="input-group-btn">
|
|
<button class="btn btn-default" type="button">Go!</button>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="clearfix"></div>
|
|
|
|
<div class="row">
|
|
|
|
<div class="col-md-12 col-sm-12 col-xs-12">
|
|
<div class="x_panel" style="height:600px;">
|
|
<div class="x_title">
|
|
<h2>Plain Page</h2>
|
|
<ul class="nav navbar-right panel_toolbox">
|
|
<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
|
|
</li>
|
|
<li class="dropdown">
|
|
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
|
|
<ul class="dropdown-menu" role="menu">
|
|
<li><a href="#">Settings 1</a>
|
|
</li>
|
|
<li><a href="#">Settings 2</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li><a class="close-link"><i class="fa fa-close"></i></a>
|
|
</li>
|
|
</ul>
|
|
<div class="clearfix"></div>
|
|
</div>
|
|
ttt
|
|
<div class="col-md-6">
|
|
<div id="reportrange" class="pull-right" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc">
|
|
<i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
|
|
<span>December 30, 2014 - January 28, 2015</span> <b class="caret"></b>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /page content -->
|
|
|
|
<!--Test Page specific JS -->
|
|
<script type="text/javascript">
|
|
|
|
//alert ('Test Page specific JS')
|
|
</script>
|
|
|
|
<!-- datepicker -->
|
|
<script type="text/javascript">
|
|
$(document).ready(function() {
|
|
|
|
var cb = function(start, end, label) {
|
|
console.log(start.toISOString(), end.toISOString(), label);
|
|
$('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
|
|
//alert("Callback has fired: [" + start.format('MMMM D, YYYY') + " to " + end.format('MMMM D, YYYY') + ", label = " + label + "]");
|
|
}
|
|
|
|
var optionSet1 = {
|
|
startDate: moment().subtract(29, 'days'),
|
|
endDate: moment(),
|
|
minDate: '01/01/2012',
|
|
maxDate: '12/31/2015',
|
|
dateLimit: {
|
|
days: 60
|
|
},
|
|
showDropdowns: true,
|
|
showWeekNumbers: true,
|
|
timePicker: false,
|
|
timePickerIncrement: 1,
|
|
timePicker12Hour: true,
|
|
ranges: {
|
|
'Today': [moment(), moment()],
|
|
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
|
|
'Last 7 Days': [moment().subtract(6, 'days'), moment()],
|
|
'Last 30 Days': [moment().subtract(29, 'days'), moment()],
|
|
'This Month': [moment().startOf('month'), moment().endOf('month')],
|
|
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')]
|
|
},
|
|
opens: 'left',
|
|
buttonClasses: ['btn btn-default'],
|
|
applyClass: 'btn-small btn-primary',
|
|
cancelClass: 'btn-small',
|
|
format: 'MM/DD/YYYY',
|
|
separator: ' to ',
|
|
locale: {
|
|
applyLabel: 'Submit',
|
|
cancelLabel: 'Clear',
|
|
fromLabel: 'From',
|
|
toLabel: 'To',
|
|
customRangeLabel: 'Custom',
|
|
daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
|
|
monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
|
|
firstDay: 1
|
|
}
|
|
};
|
|
$('#reportrange span').html(moment().subtract(29, 'days').format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));
|
|
$('#reportrange').daterangepicker(optionSet1, cb);
|
|
$('#reportrange').on('show.daterangepicker', function() {
|
|
console.log("show event fired");
|
|
});
|
|
$('#reportrange').on('hide.daterangepicker', function() {
|
|
console.log("hide event fired");
|
|
});
|
|
$('#reportrange').on('apply.daterangepicker', function(ev, picker) {
|
|
console.log("apply event fired, start/end dates are " + picker.startDate.format('MMMM D, YYYY') + " to " + picker.endDate.format('MMMM D, YYYY'));
|
|
});
|
|
$('#reportrange').on('cancel.daterangepicker', function(ev, picker) {
|
|
console.log("cancel event fired");
|
|
});
|
|
$('#options1').click(function() {
|
|
$('#reportrange').data('daterangepicker').setOptions(optionSet1, cb);
|
|
});
|
|
$('#options2').click(function() {
|
|
$('#reportrange').data('daterangepicker').setOptions(optionSet2, cb);
|
|
});
|
|
$('#destroy').click(function() {
|
|
$('#reportrange').data('daterangepicker').remove();
|
|
});
|
|
});
|
|
</script> |