@if ($start_date && $end_date)
   <script>
        $(document).ready(function() {
            var start_date = "{{ $start_date ?? '' }}";
            var end_date = "{{ $end_date ?? '' }}";
            $('#datepicker').daterangepicker({
                "showDropdowns": true,
                "showWeekNumbers": true,
                "showISOWeekNumbers": true,
                "timePicker": false,
                "timePicker24Hour": true,
                "timePickerSeconds": false,
                "autoApply": true,
                "minYear": '2023',
                // "maxSpan": {
                //     "days": 7
                // },
                locale: {
                    format: 'YYYY-MM-DD'
                },
                ranges: {
                    '{{ __('message.today') }}': [moment(), moment()],
                    '{{ __('message.yesterday') }}': [moment().subtract(1, 'days'), moment().subtract(1,
                        'days')],
                    '{{ __('message.this week') }}': [moment().subtract(6, 'days'), moment()],
                    '{{ __('message.this month') }}': [moment().startOf('month'), moment().endOf('month')],
                    '{{ __('message.last month') }}': [moment().subtract(1, 'month').startOf('month'),
                        moment().subtract(1, 'month').endOf('month')
                    ]
                },
                "alwaysShowCalendars": true,
                "startDate": start_date,
                "endDate": end_date,
                "applyButtonClasses": "btn-default shadow-0",
                "cancelClass": "btn-success shadow-0"
            }, function(start, end, label) {
                console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format(
                    'YYYY-MM-DD') + ' (predefined range: ' + label + ')');
            });
        });
    </script>
@else
    <script>
        $(document).ready(function() {
            var start_date = "{{ $start_date ?? '' }}";
            var end_date = "{{ $end_date ?? '' }}";
            $('#datepicker').daterangepicker({
                "showDropdowns": true,
                "showWeekNumbers": true,
                "showISOWeekNumbers": true,
                "timePicker": false,
                "timePicker24Hour": true,
                "timePickerSeconds": false,
                "autoApply": true,
                "minYear": '2023',

                "maxSpan": {
                    "days": 7
                },
                locale: {
                    format: 'YYYY-MM-DD'
                },
                ranges: {
                    '{{ __('message.today') }}': [moment(), moment()],
                    '{{ __('message.yesterday') }}': [moment().subtract(1, 'days'), moment().subtract(1,
                        'days')],
                    '{{ __('message.this week') }}': [moment().subtract(6, 'days'), moment()],
                    '{{ __('message.this month') }}': [moment().startOf('month'), moment().endOf('month')],
                    '{{ __('message.last month') }}': [moment().subtract(1, 'month').startOf('month'),
                        moment().subtract(1, 'month').endOf('month')
                    ]
                },
                "alwaysShowCalendars": true,
                "applyButtonClasses": "btn-default shadow-0",
                "cancelClass": "btn-success shadow-0"
            }, function(start, end, label) {
                console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format(
                    'YYYY-MM-DD') + ' (predefined range: ' + label + ')');
            });
            if ("{{ $start_date }}" == '' && "{{ $end_date }}" == '') {
                $('input[name="date"]').val('');
            }
        });
    </script>
@endif