mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-12 17:04:57 +00:00

[AAE-3967] Add datetime-range search filter component (#6297 )

* [AAE-3967] Add datetime-range search filter component

* Fix bug from max date is not resetting when clicking the clear button

* Fix formatting identation on date-range component

* Add unit tests

* Add documentation

* Fix comments

2020-11-04 11:22:18 +00:00

2.9 KiB

Raw Blame History

Title, Added, Status, Last reviewed

Title	Added	Status	Last reviewed
Search datetime range component	v4.2.0	Active	2020-11-02

Search datetime range component

Implements a search widget for the Search Filter component.

Basic usage

{
    "search": {
        "categories": [
            {
                "id": "createdDatetimeRange",
                "name": "Created Datetime (range)",
                "enabled": true,
                "component": {
                    "selector": "datetime-range",
                    "settings": {
                        "field": "cm:created"
                    }
                }
            }
        ]
    }
}

Settings

Name	Type	Description
field	string	Field to apply the query to. Required value
datetimeFormat	string	Datetime format. Datetime formats used by the datetime picker are Moment.js instances, so you can use any datetime format supported by Moment. Default is 'DD/MM/YYYY HH:mm'.
maxDatetime	string	A fixed datetime that will set the maximum searchable datetime. Default is no maximum.

Details

This component lets the user select a range between two dates and times based on the particular field. See the Search filter component for full details of how to use widgets in a search query.

Custom datetime format

You can set the datetime range picker to work with any datetime format your app requires. You can use any datetime format supported by Moment.js in the datetimeFormat and in the maxDatetime setting:

{
    "search": {
        "categories": [
            {
                "id": "createdDateTimeRange",
                "name": "Created Datetime (range)",
                "enabled": true,
                "component": {
                    "selector": "datetime-range",
                    "settings": {
                        "field": "cm:created",
                        "datetimeFormat": "DD-MMM-YY HH:mm:ss",
                        "maxDatetime": "10-Mar-20 20:00"
                    }
                }
            }
        ]
    }
}

2.9 KiB Raw Blame History