add daterangepicker

We are now adding the daterangepicker without Angular. This is a little
bit dirty, because we have to load jquery, moment and daterangepicker
manually via script tags, but it works without major hassle.
This commit is contained in:
2019-10-11 17:47:17 +02:00
parent e61f415880
commit 708a85c28c
6 changed files with 6616 additions and 1 deletions

View File

@@ -6,8 +6,44 @@
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<script type="text/javascript" src="/assets/js/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="/assets/js/moment-2.24.0.min.js"></script>
<script type="text/javascript" src="/assets/js/daterangepicker-3.0.5.js"></script>
<link rel="stylesheet" type="text/css" href="/assets/css/daterangepicker-3.0.5.css" />
</head>
<body>
<app-root></app-root>
<script>
$( document ).ready(function() {
$('input[name="dates"]').daterangepicker({
timePicker: true,
minDate: "2017-01-01",
maxDate: "2029-12-31",
maxYear: parseInt(moment().format('YYYY'),10),
timePicker24Hour: true,
timePickerSeconds: true,
showDropdowns: true, // drop downs for selecting year and month
locale: {
format: 'YYYY-MM-DD HH:mm:ss',
"firstDay": 1 // monday is the first day of the week
},
ranges: {
'Today': [moment().startOf('day'), moment().endOf('day')],
'Yesterday': [moment().subtract(1, 'days').startOf('day'), moment().subtract(1, 'days').endOf('day')],
'Last 7 Days': [moment().subtract(6, 'days').startOf('day'), moment().endOf('day')],
'This Week': [moment().startOf('week'), moment().endOf('day')],
'Last Week': [moment().subtract(7, 'days').startOf('week'), moment().subtract(7, 'days').endOf('week')],
'Last 30 Days': [moment().subtract(29, 'days').startOf('day'), moment().endOf('day')],
'This Month': [moment().startOf('month'), moment().endOf('month').endOf('day')],
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')],
'Last 3 Months': [moment().subtract(3, 'month').startOf('month'),moment().endOf('month').endOf('day')],
'This Year': [moment().startOf('year'),moment().endOf('month').endOf('day')],
'Last Year': [moment().subtract(1, 'year').startOf('year'),moment().subtract(1, 'year').endOf('year')],
},
});
});
</script>
</body>
</html>