<div class="card-body">
{{ Form::open(['method' => 'GET', 'route' => 'order-of-report','id' => 'filter-form' ]) }}
    <div class="row justify-content-end align-items-end">
        <div class="form-group col-auto">
            {{ Form::label('from_date', __('message.from') . '<span class="text-danger">*</span>', ['class' => 'form-control-label'], false) }}
            <span class="text-danger" id="form_validation_from_date"></span>
            {{ Form::date('from_date', $params['from_date'] ?? request('from_date') , ['placeholder' => __('message.date'), 'class' => 'form-control datepicker select2Clear', 'id' => 'from_date_main']) }}
        </div>
        <div class="form-group col-auto">
            {{ Form::label('to_date', __('message.to') . ' <span class="text-danger">*</span>', ['class' => 'form-control-label'], false) }}
            <span class="text-danger" id="form_validation_to_date"></span>
            {{ Form::date('to_date', $params['to_date'] ?? request('to_date') , ['placeholder' => __('message.date'), 'class' => 'form-control datepicker select2Clear', 'id' => 'to_date_main']) }}
        </div>
        <div class="form-group col-sm-0">
            <button type="submit" class="btn btn-sm btn-primary text-white pt-2 pb-2 clearListPropertynumber">{{ __('message.apply_filter') }}</button>
        </div>
        <div class="form-group col-md-auto text-right">
            <a href="{{ route('order-of-report') }}" class="btn btn-light text-dark pt-2 pb-2">
                <i class="ri-repeat-line" style="font-size:12px"></i> {{ __('message.reset_filter') }}
            </a>
            <div class="dropdown d-inline">
                <button class="btn btn-success dropdown-toggle pt-2 pb-2" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    {{ __('message.export') }}
                </button>
                <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
                    <a class="dropdown-item" href="{{ route('report-of-orderexcel',request()->all()) }}">
                        <i class="fas fa-file-csv"></i> {{__('message.excel')}}
                    </a>
                    <a class="dropdown-item" href="{{ route('report-of-orderpdf',request()->all()) }}">
                        <i class="fas fa-file-pdf"></i> {{__('message.pdf')}}
                    </a>
                </div>
            </div>
        </div>
    </div>
{{ Form::close() }}
</div>

<script src="{{ asset('frontend-website/assets/js/jquery.min.js') }}"></script>
<script src="{{ asset('js/jquery.validate.min.js') }}"></script>
<script>
    $(document).ready(function () {
        $.validator.addMethod('greaterThanEqual', function (value, element, param) {
            var fromDateValue = $(param).val();
            if (!value || !fromDateValue) {
                return true;
            }
            return new Date(value) >= new Date(fromDateValue);
        });

        $('#filter-form').validate({
            rules: {
                from_date: {
                    required: true
                },
                to_date: {
                    greaterThanEqual: '#from_date_main'
                }
            },
            messages: {
                from_date: {
                    required: "{{ __('message.from_date_required') }}"
                },
                to_date: {
                    greaterThanEqual: "{{ __('message.to_date_must_be_greater_than_from_date') }}"
                }
            },
            errorPlacement: function (error, element) {
                error.addClass('text-danger');
                if (element.attr("name") == "from_date") {
                    $('#form_validation_from_date').prepend(error);
                } else if (element.attr("name") == "to_date") {
                    $('#form_validation_to_date').prepend(error);
                } else {
                    error.insertAfter(element);
                }
            },
            highlight: function (element) {
                $(element).addClass('is-invalid');
            },
            unhighlight: function (element) {
                $(element).removeClass('is-invalid');
            }
        });
    });
</script>