mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-06-30 18:15:11 +00:00
[ACS-6107] Replaced SearchDateRange component with SearchDateRangeAdvanced Component (#9023)
* [ACS-6107] Removed date range component from ADF content-services * [ACS-6107] Removed references of date range component in code * [ACS-6107] Updated documentation to replace occurrences of date range component with date-range-advanced-tabbed component * [ACS-6107] Renamed DateRangeAdvanced to DateRange. Renamed DateRangeAdvancedTabbed to DateRangeTabbed * [ACS-6107] Fixed missing export of SearchDateRangeTabbedComponent * [ACS-6107] Replaced occurrences of date-range-advanced with date-range in HTML and Unit Tests automation ids * [ACS-6107] Documentation corrections * [ACS-6107] Reverted unneeded documentation formatting * [ACS-6107] Reverted unneeded documentation formatting * [ACS-6107] Reverted unneeded documentation formatting * [ACS-6107] Migrated unneeded E2E test case to unit test * [ACS-6107] Removed search-date-range E2E * [ACS-6107] Resolved PR comments. Removed date-range-filter.page.ts. Removed unused translation keys. Updated documentation to refer proper comment name * [ACS-6107] Updated documentation for SearchDateRange component to mention the change from original configuration to the newer configuration * [ACS-6107] Corrected wrong version in documentation * [ci:force] * [ACS-6107] Removed unneeded file * [ACS-6107] Updated unit tests and mock data after rebase * [ci:force] * [ACS-6107] Revert unneeded change. Remove unneeded file * [ci:force] * [ACS-6107] Updated E2E search config * [ci:force] * [ACS-6107] Updated E2E expects after component changes * [ci:force]
This commit is contained in:
swapnil-verma-gl
GitHub
parent
88ab336d05
commit
f47fb2a7e9
@ -310,25 +310,12 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
|
||||||
"id": "createdDateRange",
|
|
||||||
"name": "Created Date (range)",
|
|
||||||
"enabled": true,
|
|
||||||
"component": {
|
|
||||||
"selector": "date-range",
|
|
||||||
"settings": {
|
|
||||||
"field": "cm:created",
|
|
||||||
"dateFormat": "DD-MMM-YY",
|
|
||||||
"maxDate": "today"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
"id": "createdModifiedDateRange",
|
"id": "createdModifiedDateRange",
|
||||||
"name": "Date",
|
"name": "Date",
|
||||||
"enabled": true,
|
"enabled": true,
|
||||||
"component": {
|
"component": {
|
||||||
"selector": "date-range-advanced",
|
"selector": "date-range",
|
||||||
"settings": {
|
"settings": {
|
||||||
"dateFormat": "dd-MMM-yy",
|
"dateFormat": "dd-MMM-yy",
|
||||||
"maxDate": "today",
|
"maxDate": "today",
|
||||||
@ -746,15 +733,17 @@
|
|||||||
{
|
{
|
||||||
"id": "createdDateRange",
|
"id": "createdDateRange",
|
||||||
"name": "SEARCH.SEARCH_HEADER.FILTERS.DATE.TITLE",
|
"name": "SEARCH.SEARCH_HEADER.FILTERS.DATE.TITLE",
|
||||||
"columnKey": "createdAt",
|
|
||||||
"enabled": true,
|
"enabled": true,
|
||||||
"component": {
|
"component": {
|
||||||
"selector": "date-range",
|
"selector": "date-range",
|
||||||
"settings": {
|
"settings": {
|
||||||
"allowUpdateOnChange": false,
|
"allowUpdateOnChange": false,
|
||||||
|
"dateFormat": "dd-MMM-yy",
|
||||||
|
"maxDate": "today",
|
||||||
"field": "cm:created",
|
"field": "cm:created",
|
||||||
"dateFormat": "DD-MMM-YY",
|
"displayedLabelsByField": {
|
||||||
"maxDate": "today"
|
"cm:created": "Created Date"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -290,10 +290,9 @@ for more information about installing and using the source code.
|
|||||||
| [Search Chip Input Component](content-services/components/search-chip-input.component.md) | Displays input for providing phrases display as "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-input/search-chip-input.component.ts) |
|
| [Search Chip Input Component](content-services/components/search-chip-input.component.md) | Displays input for providing phrases display as "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-input/search-chip-input.component.ts) |
|
||||||
| [Search Chip Autocomplete Input component](content-services/components/search-chip-autocomplete-input.component.md) | Displays an input with autocomplete options. | [Source](../lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts) |
|
| [Search Chip Autocomplete Input component](content-services/components/search-chip-autocomplete-input.component.md) | Displays an input with autocomplete options. | [Source](../lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts) |
|
||||||
| [Search Chip List Component](content-services/components/search-chip-list.component.md) | Displays search criteria as a set of "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.ts) |
|
| [Search Chip List Component](content-services/components/search-chip-list.component.md) | Displays search criteria as a set of "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.ts) |
|
||||||
| [Search Date Range Advanced Component](content-services/components/search-date-range-advanced.component.md) | Displays a UI to configure different kinds of search criteria around date. Options are 'Anyytime', 'In the last' and 'Between' | [Source](../lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.ts) |
|
|
||||||
| [Search control component](content-services/components/search-control.component.md) | Displays a input text that shows find-as-you-type suggestions. | [Source](../lib/content-services/src/lib/search/components/search-control.component.ts) |
|
| [Search control component](content-services/components/search-control.component.md) | Displays a input text that shows find-as-you-type suggestions. | [Source](../lib/content-services/src/lib/search/components/search-control.component.ts) |
|
||||||
| [Search date range component](content-services/components/search-date-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.ts) |
|
| [Search Date Range Component](content-services/components/search-date-range.component.md) | Displays a UI to configure different kinds of search criteria around date. Options are 'Anytime', 'In the last' and 'Between' | [Source](../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts) |
|
||||||
| [Search date range advanced tabbed component](content-services/components/search-date-range-advanced-tabbed.component.md) | Implements a tabbed advanced search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.ts) |
|
| [Search Date Range Tabbed component](content-services/components/search-date-range-tabbed.component.md) | Implements a tabbed advanced search widget for the Search Date Range component. | [Source](../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts) |
|
||||||
| [Search datetime range component](content-services/components/search-datetime-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts) |
|
| [Search datetime range component](content-services/components/search-datetime-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts) |
|
||||||
| [Search Filter Autocomplete Chips component](content-services/components/search-filter-autocomplete-chips.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts) |
|
| [Search Filter Autocomplete Chips component](content-services/components/search-filter-autocomplete-chips.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts) |
|
||||||
| [Search Filter Chips component](content-services/components/search-filter-chips.component.md) | Represents a chip based container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.ts) |
|
| [Search Filter Chips component](content-services/components/search-filter-chips.component.md) | Represents a chip based container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.ts) |
|
||||||
|
|||||||
@ -76,7 +76,7 @@ items in the list.
|
|||||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
||||||
- [Search filter chips component](search-filter-chips.component.md)
|
- [Search filter chips component](search-filter-chips.component.md)
|
||||||
- [Search filter component](search-filter.component.md)
|
- [Search filter component](search-filter.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -50,7 +50,7 @@ Represents an input with autocomplete options.
|
|||||||
- [Search Filter Autocomplete Chips component](search-filter-autocomplete-chips.component.md)
|
- [Search Filter Autocomplete Chips component](search-filter-autocomplete-chips.component.md)
|
||||||
- [Search Logical Filter component](search-logical-filter.component.md)
|
- [Search Logical Filter component](search-logical-filter.component.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -1,47 +0,0 @@
|
|||||||
---
|
|
||||||
Title: Search date range advanced component
|
|
||||||
Added: v6.2.0
|
|
||||||
Status: Active
|
|
||||||
Last reviewed: 2023-07-10
|
|
||||||
---
|
|
||||||
|
|
||||||
# [Search date range advanced component](../../../lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component.ts "Defined in search-date-range-advanced.component.ts")
|
|
||||||
|
|
||||||
Represents an advanced date range component for
|
|
||||||
the [SearchAdvancedDateRangeTabbedComponent](search-date-range-advanced-tabbed.component.md).
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Basic usage
|
|
||||||
|
|
||||||
```html
|
|
||||||
|
|
||||||
<adf-search-date-range-advanced></adf-search-date-range-advanced>
|
|
||||||
```
|
|
||||||
|
|
||||||
## Class Members
|
|
||||||
|
|
||||||
### Properties
|
|
||||||
|
|
||||||
| Name | Type | Description |
|
|
||||||
|--------------|-------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
|
|
||||||
| field | string | Field to apply the query to. Required value |
|
|
||||||
| maxDate | string | A fixed date (default format: dd-MMM-yy) or the string `"today"` that will set the maximum searchable date. Default is today. |
|
|
||||||
| dateFormat | string | Date format. Dates used by the datepicker are Javascript Date objects, using [date-fns](https://date-fns.org/v2.30.0/docs/format) for formatting, so you can use any date format supported by the library. Default is 'dd-MMM-yy (sample date - 07-Jun-23) |
|
|
||||||
| initialValue | SearchDateRangeAdvanced | Initial value for the component |
|
|
||||||
|
|
||||||
### Events
|
|
||||||
|
|
||||||
| Name | Type | Description |
|
|
||||||
|---------------------|------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------|
|
|
||||||
| changed | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<Partial<SearchDateRangeAdvanced>>` | Emitted whenever a change is made in the component values. Emits the changes being made in the component. |
|
|
||||||
| valid | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted whenever a change is made in the component values. Emits a flag indicating whether the current state of the component is valid or not. |
|
|
||||||
|
|
||||||
## Details
|
|
||||||
|
|
||||||
This component lets the user choose a variety of options to perform date related operations.
|
|
||||||
|
|
||||||
- Anytime - No date related data will be returned. This option is selected by default
|
|
||||||
- In the last - Allows user to perform date related operations over a period of time. The user can select the length of the period from current time,
|
|
||||||
as well as its unit. Currently, 3 units are supported - Days, Weeks, and Months.
|
|
||||||
- Between - Allows the user to select a range of dates to perform operations on.
|
|
||||||
@ -1,16 +1,15 @@
|
|||||||
---
|
---
|
||||||
Title: Search date range advanced tabbed component
|
Title: Search date range tabbed component
|
||||||
Added: v6.2.0
|
Added: v6.2.0
|
||||||
Status: Active
|
Status: Active
|
||||||
Last reviewed: 2023-07-10
|
Last reviewed: 2023-07-10
|
||||||
---
|
---
|
||||||
|
|
||||||
# [Search date range advanced tabbed component](../../../lib/content-services/src/lib/search/components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component.ts "Defined in search-date-range-advanced-tabbed.component.ts")
|
# [Search date range tabbed component](../../../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range-tabbed.component.ts "Defined in search-date-range-tabbed.component.ts")
|
||||||
|
|
||||||
Represents a tabbed advanced date range [search widget](../../../lib/content-services/src/lib/search/models/search-widget.interface.ts) for
|
Represents a tabbed date range [search widget](../../../lib/content-services/src/lib/search/models/search-widget.interface.ts) for the [Search Filter component](search-filter.component.md).
|
||||||
the [Search Filter component](search-filter.component.md).
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Basic usage
|
## Basic usage
|
||||||
|
|
||||||
@ -23,7 +22,7 @@ the [Search Filter component](search-filter.component.md).
|
|||||||
"name": "Date",
|
"name": "Date",
|
||||||
"enabled": true,
|
"enabled": true,
|
||||||
"component": {
|
"component": {
|
||||||
"selector": "date-range-advanced",
|
"selector": "date-range",
|
||||||
"settings": {
|
"settings": {
|
||||||
"dateFormat": "dd-MMM-yy",
|
"dateFormat": "dd-MMM-yy",
|
||||||
"maxDate": "today",
|
"maxDate": "today",
|
||||||
@ -51,7 +50,7 @@ the [Search Filter component](search-filter.component.md).
|
|||||||
|
|
||||||
## Details
|
## Details
|
||||||
|
|
||||||
This component creates a tabbed layout where each tab consists of the [SearchDateRangeAdvanced](./search-date-range-advanced-tabbed.component.md) component, which allows user to create a query containing multiple date related queries in one go.
|
This component creates a tabbed layout where each tab consists of the [SearchDateRange](./search-date-range.component.md) component, which allows user to create a query containing multiple date related queries in one go.
|
||||||
|
|
||||||
See the [Search filter component](search-filter.component.md) for full details of how to use widgets in a search query.
|
See the [Search filter component](search-filter.component.md) for full details of how to use widgets in a search query.
|
||||||
|
|
||||||
@ -70,7 +69,7 @@ in the `dateFormat` and in the `maxDate` setting:
|
|||||||
"name": "Date",
|
"name": "Date",
|
||||||
"enabled": true,
|
"enabled": true,
|
||||||
"component": {
|
"component": {
|
||||||
"selector": "date-range-advanced",
|
"selector": "date-range",
|
||||||
"settings": {
|
"settings": {
|
||||||
"dateFormat": "dd-MMM-yy",
|
"dateFormat": "dd-MMM-yy",
|
||||||
"maxDate": "02-May-23",
|
"maxDate": "02-May-23",
|
||||||
@ -87,7 +86,7 @@ in the `dateFormat` and in the `maxDate` setting:
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
The [SearchDateRangeAdvanced](./search-date-range-advanced-tabbed.component.md) component allows 3 different kinds of date related operations to be performed.
|
The [SearchDateRange](./search-date-range.component.md) component allows 3 different kinds of date related operations to be performed.
|
||||||
Based on what information is provided to that component, this component will create different kinds of queries -
|
Based on what information is provided to that component, this component will create different kinds of queries -
|
||||||
|
|
||||||
- Anytime - No date filters are applied on the `field`. This option is selected by default
|
- Anytime - No date filters are applied on the `field`. This option is selected by default
|
||||||
@ -105,7 +104,6 @@ The queries generated by this filter when using the 'In the last' or 'Between' o
|
|||||||
- [Search Query Builder service](../services/search-query-builder.service.md)
|
- [Search Query Builder service](../services/search-query-builder.service.md)
|
||||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
@ -1,88 +1,49 @@
|
|||||||
---
|
---
|
||||||
Title: Search date range component
|
Title: Search date range component
|
||||||
Added: v2.4.0
|
Added: v6.2.0
|
||||||
Status: Active
|
Status: Active
|
||||||
Last reviewed: 2018-06-11
|
Last reviewed: 2023-07-10
|
||||||
---
|
---
|
||||||
|
|
||||||
# [Search date range component](../../../lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.ts "Defined in search-date-range.component.ts")
|
# [Search date range component](../../../lib/content-services/src/lib/search/components/search-date-range-tabbed/search-date-range/search-date-range.component.ts "Defined in search-date-range.component.ts")
|
||||||
|
|
||||||
Implements a [search widget](../../../lib/content-services/src/lib/search/search-widget.interface.ts) for the [Search Filter component](search-filter.component.md).
|
Represents a date range component for the [SearchDateRangeTabbedComponent](search-date-range-tabbed.component.md).
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
NOTE: As of v6.5.0, the settings configuration for the original SearchDateRangeComponent have changed. If you have been using this component since
|
||||||
|
before that release, please ensure that your component configuration is updated according to the new settings listed below.
|
||||||
|
|
||||||
## Basic usage
|
## Basic usage
|
||||||
|
|
||||||
```json
|
```html
|
||||||
{
|
|
||||||
"search": {
|
<adf-search-date-range></adf-search-date-range>
|
||||||
"categories": [
|
|
||||||
{
|
|
||||||
"id": "createdDateRange",
|
|
||||||
"name": "Created Date (range)",
|
|
||||||
"enabled": true,
|
|
||||||
"component": {
|
|
||||||
"selector": "date-range",
|
|
||||||
"settings": {
|
|
||||||
"field": "cm:created"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
```
|
||||||
|
|
||||||
### Settings
|
## Class Members
|
||||||
|
|
||||||
| Name | Type | Description |
|
### Properties
|
||||||
| ---- | ---- | ----------- |
|
|
||||||
| field | string | Field to apply the query to. Required value |
|
| Name | Type | Description |
|
||||||
| dateFormat | string | Date format. Dates used by the datepicker are [Moment.js](https://momentjs.com/docs/#/parsing/string-format/) instances, so you can use any date format supported by Moment. Default is 'DD/MM/YYYY'. |
|
|--------------|-----------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
|
||||||
| maxDate | string | A fixed date or the string `"today"` that will set the maximum searchable date. Default is no maximum. |
|
| field | string | Field to apply the query to. Required value |
|
||||||
| hideDefaultAction | boolean | Show/hide the [widget](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) actions. By default is false. |
|
| maxDate | string | A fixed date (default format: dd-MMM-yy) or the string `"today"` that will set the maximum searchable date. Default is today. |
|
||||||
|
| dateFormat | string | Date format. Dates used by the datepicker are Javascript Date objects, using [date-fns](https://date-fns.org/v2.30.0/docs/format) for formatting, so you can use any date format supported by the library. Default is 'dd-MMM-yy (sample date - 07-Jun-23) |
|
||||||
|
| initialValue | SearchDateRange | Initial value for the component |
|
||||||
|
|
||||||
|
### Events
|
||||||
|
|
||||||
|
| Name | Type | Description |
|
||||||
|
|---------------------|----------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------|
|
||||||
|
| changed | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<Partial<SearchDateRange>>` | Emitted whenever a change is made in the component values. Emits the changes being made in the component. |
|
||||||
|
| valid | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted whenever a change is made in the component values. Emits a flag indicating whether the current state of the component is valid or not. |
|
||||||
|
|
||||||
## Details
|
## Details
|
||||||
|
|
||||||
This component lets the user select a range between two dates based on the particular `field`.
|
This component lets the user choose a variety of options to perform date related operations.
|
||||||
See the [Search filter component](search-filter.component.md) for full details of how to use widgets
|
|
||||||
in a search query.
|
|
||||||
|
|
||||||
### Custom date format
|
- Anytime - No date related data will be returned. This option is selected by default
|
||||||
|
- In the last - Allows user to perform date related operations over a period of time. The user can select the length of the period from current time,
|
||||||
You can set the date range picker to work with any date format your app requires. You can use
|
as well as its unit. Currently, 3 units are supported - Days, Weeks, and Months.
|
||||||
any date format supported by [Moment.js](https://momentjs.com/docs/#/parsing/string-format/)
|
- Between - Allows the user to select a range of dates to perform operations on.
|
||||||
in the `dateFormat` and in the `maxDate` setting:
|
|
||||||
|
|
||||||
```json
|
|
||||||
{
|
|
||||||
"search": {
|
|
||||||
"categories": [
|
|
||||||
{
|
|
||||||
"id": "createdDateRange",
|
|
||||||
"name": "Created Date (range)",
|
|
||||||
"enabled": true,
|
|
||||||
"component": {
|
|
||||||
"selector": "date-range",
|
|
||||||
"settings": {
|
|
||||||
"field": "cm:created",
|
|
||||||
"dateFormat": "DD-MMM-YY",
|
|
||||||
"maxDate": "02-Mar-20"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
## See also
|
|
||||||
|
|
||||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
|
||||||
- [Search filter chips component](search-filter-chips.component.md)
|
|
||||||
- [Search filter component](search-filter.component.md)
|
|
||||||
- [Search check list component](search-check-list.component.md)
|
|
||||||
- [Search number range component](search-number-range.component.md)
|
|
||||||
- [Search radio component](search-radio.component.md)
|
|
||||||
- [Search slider component](search-slider.component.md)
|
|
||||||
- [Search text component](search-text.component.md)
|
|
||||||
|
|||||||
@ -59,7 +59,7 @@ See the [Search Chip Autocomplete Input component](search-chip-autocomplete-inpu
|
|||||||
- [Search Chip Autocomplete Input component](search-chip-autocomplete-input.component.md)
|
- [Search Chip Autocomplete Input component](search-chip-autocomplete-input.component.md)
|
||||||
- [Search Chip Input component](search-chip-input.component.md)
|
- [Search Chip Input component](search-chip-input.component.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -70,7 +70,7 @@ here is the [example configuration](https://github.com/Alfresco/alfresco-ng2-com
|
|||||||
- [Search Query Builder service](../services/search-query-builder.service.md)
|
- [Search Query Builder service](../services/search-query-builder.service.md)
|
||||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -34,7 +34,7 @@ with the name input property being assigned the value of whatever name should be
|
|||||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range component](search-date-range.component.md)
|
||||||
- [Search date range advanced component](search-date-range-advanced.component.md)
|
- [Search date range component](search-date-range.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -36,8 +36,8 @@ to build and execute the query.
|
|||||||
- [Search Sorting Picker Component](search-sorting-picker.component.md)
|
- [Search Sorting Picker Component](search-sorting-picker.component.md)
|
||||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range component](search-date-range.component.md)
|
||||||
- [Search date range advanced component](search-date-range-advanced.component.md)
|
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -52,7 +52,7 @@ This component lets the user provide logical conditions to apply to each `field`
|
|||||||
- [Search Query Builder service](../services/search-query-builder.service.md)
|
- [Search Query Builder service](../services/search-query-builder.service.md)
|
||||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -75,7 +75,7 @@ cm:content.size:[0 TO 100]
|
|||||||
- [Search filter chips component](search-filter-chips.component.md)
|
- [Search filter chips component](search-filter-chips.component.md)
|
||||||
- [Search filter component](search-filter.component.md)
|
- [Search filter component](search-filter.component.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -54,7 +54,7 @@ Allows to search by file size and type.
|
|||||||
- [Search Query Builder service](../services/search-query-builder.service.md)
|
- [Search Query Builder service](../services/search-query-builder.service.md)
|
||||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -66,7 +66,7 @@ buttons as appropriate.
|
|||||||
- [Search filter chips component](search-filter-chips.component.md)
|
- [Search filter chips component](search-filter-chips.component.md)
|
||||||
- [Search filter component](search-filter.component.md)
|
- [Search filter component](search-filter.component.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
- [Search text component](search-text.component.md)
|
- [Search text component](search-text.component.md)
|
||||||
|
|||||||
@ -73,7 +73,7 @@ or zero and the corresponsing query fragment is removed from the query.
|
|||||||
- [Search filter chips component](search-filter-chips.component.md)
|
- [Search filter chips component](search-filter-chips.component.md)
|
||||||
- [Search filter component](search-filter.component.md)
|
- [Search filter component](search-filter.component.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search text component](search-text.component.md)
|
- [Search text component](search-text.component.md)
|
||||||
|
|||||||
@ -63,7 +63,7 @@ details of how to use widgets in a search query.
|
|||||||
- [Search filter chips component](search-filter-chips.component.md)
|
- [Search filter chips component](search-filter-chips.component.md)
|
||||||
- [Search filter component](search-filter.component.md)
|
- [Search filter component](search-filter.component.md)
|
||||||
- [Search check list component](search-check-list.component.md)
|
- [Search check list component](search-check-list.component.md)
|
||||||
- [Search date range component](search-date-range.component.md)
|
- [Search date range tabbed component](search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](search-number-range.component.md)
|
- [Search number range component](search-number-range.component.md)
|
||||||
- [Search radio component](search-radio.component.md)
|
- [Search radio component](search-radio.component.md)
|
||||||
- [Search slider component](search-slider.component.md)
|
- [Search slider component](search-slider.component.md)
|
||||||
|
|||||||
@ -186,7 +186,7 @@ and pass custom attributes, if your component supports them:
|
|||||||
|
|
||||||
- [Search filter component](../components/search-filter.component.md)
|
- [Search filter component](../components/search-filter.component.md)
|
||||||
- [Search check list component](../components/search-check-list.component.md)
|
- [Search check list component](../components/search-check-list.component.md)
|
||||||
- [Search date range component](../components/search-date-range.component.md)
|
- [Search date range tabbed component](../components/search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](../components/search-number-range.component.md)
|
- [Search number range component](../components/search-number-range.component.md)
|
||||||
- [Search radio component](../components/search-radio.component.md)
|
- [Search radio component](../components/search-radio.component.md)
|
||||||
- [Search slider component](../components/search-slider.component.md)
|
- [Search slider component](../components/search-slider.component.md)
|
||||||
|
|||||||
@ -139,7 +139,7 @@ constructor(queryBuilder: SearchQueryBuilderService) {
|
|||||||
- [Search Form Component](../components/search-form.component.md)
|
- [Search Form Component](../components/search-form.component.md)
|
||||||
- [Search Widget interface](../interfaces/search-widget.interface.md)
|
- [Search Widget interface](../interfaces/search-widget.interface.md)
|
||||||
- [Search check list component](../components/search-check-list.component.md)
|
- [Search check list component](../components/search-check-list.component.md)
|
||||||
- [Search date range component](../components/search-date-range.component.md)
|
- [Search date range tabbed component](../components/search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](../components/search-number-range.component.md)
|
- [Search number range component](../components/search-number-range.component.md)
|
||||||
- [Search radio component](../components/search-radio.component.md)
|
- [Search radio component](../components/search-radio.component.md)
|
||||||
- [Search slider component](../components/search-slider.component.md)
|
- [Search slider component](../components/search-slider.component.md)
|
||||||
|
|||||||
Binary file not shown.
|
Before Width: | Height: | Size: 8.0 KiB |
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 8.0 KiB |
@ -294,10 +294,10 @@ The Search Filter supports a number of widgets out of the box, each implemented
|
|||||||
by an ADF component. The `selector` property specifies which [widget](../../lib/content-services/src/lib/search/models/search-widget.interface.ts) is used for
|
by an ADF component. The `selector` property specifies which [widget](../../lib/content-services/src/lib/search/models/search-widget.interface.ts) is used for
|
||||||
a category:
|
a category:
|
||||||
|
|
||||||
| [`Widget`](../../lib/content-services/src/lib/search/models/search-widget.interface.ts) name | Selector | Description |
|
| [`Widget`](../../lib/content-services/src/lib/search/models/search-widget.interface.ts) name | Selector | Description |
|
||||||
| ------------------------------------------------------------------------------- | -------- | ----------- |
|
|----------------------------------------------------------------------------------------------| -------- |------------------------------------------------------------------------------|
|
||||||
| [Check List](../content-services/components/search-check-list.component.md) | `check-list` | Toggles individual query fragments for the search |
|
| [Check List](../content-services/components/search-check-list.component.md) | `check-list` | Toggles individual query fragments for the search |
|
||||||
| [Date Range](../content-services/components/search-date-range.component.md) | `date-range` | Specifies a range f dates that a field may contain |
|
| [Date Range](../content-services/components/search-date-range.component.md) | `date-range` | Specifies a varities of options for selecting dates that a field may contain |
|
||||||
| [Number Range](../content-services/components/search-number-range.component.md) | `number-range` | Specifies a range of numeric values that a field may contain |
|
| [Number Range](../content-services/components/search-number-range.component.md) | `number-range` | Specifies a range of numeric values that a field may contain |
|
||||||
| [Radio List](../content-services/components/search-radio.component.md) | `radio` | Selects one query fragment from a list of options |
|
| [Radio List](../content-services/components/search-radio.component.md) | `radio` | Selects one query fragment from a list of options |
|
||||||
| [Slider](../content-services/components/search-slider.component.md) | `slider` | Selects a single numeric value in a given range that a field may contain |
|
| [Slider](../content-services/components/search-slider.component.md) | `slider` | Selects a single numeric value in a given range that a field may contain |
|
||||||
@ -589,7 +589,7 @@ then be added in each node entry response. An example partial response is shown
|
|||||||
- [Search Form Component](../content-services/components/search-form.component.md)
|
- [Search Form Component](../content-services/components/search-form.component.md)
|
||||||
- [Search Widget interface](../interfaces/search-widget.interface.md)
|
- [Search Widget interface](../interfaces/search-widget.interface.md)
|
||||||
- [Search check list component](../content-services/components/search-check-list.component.md)
|
- [Search check list component](../content-services/components/search-check-list.component.md)
|
||||||
- [Search date range component](../content-services/components/search-date-range.component.md)
|
- [Search date range tabbed component](../content-services/components/search-date-range-tabbed.component.md)
|
||||||
- [Search number range component](../content-services/components/search-number-range.component.md)
|
- [Search number range component](../content-services/components/search-number-range.component.md)
|
||||||
- [Search radio component](../content-services/components/search-radio.component.md)
|
- [Search radio component](../content-services/components/search-radio.component.md)
|
||||||
- [Search slider component](../content-services/components/search-slider.component.md)
|
- [Search slider component](../content-services/components/search-slider.component.md)
|
||||||
|
|||||||
@ -57,8 +57,8 @@ backend services have been tested with each released version of ADF.
|
|||||||
<!--v620 start-->
|
<!--v620 start-->
|
||||||
|
|
||||||
- [Search Properties component](content-services/components/search-properties.component.md)
|
- [Search Properties component](content-services/components/search-properties.component.md)
|
||||||
- [Search Date Range Advanced Component](content-services/components/search-date-range-advanced.component.md)
|
- [Search Date Range Component](content-services/components/search-date-range.component.md)
|
||||||
- [Search Date Range Advanced Tabbed Component](content-services/components/search-date-range-advanced-tabbed.component.md)
|
- [Search Date Range Tabbed Component](content-services/components/search-date-range-tabbed.component.md)
|
||||||
- [Search Filter Tabbed Component](content-services/components/search-filter-tabbed.component.md)
|
- [Search Filter Tabbed Component](content-services/components/search-filter-tabbed.component.md)
|
||||||
- [Search Facet Chip Tabbed Component](content-services/components/search-facet-chip-tabbed.md)
|
- [Search Facet Chip Tabbed Component](content-services/components/search-facet-chip-tabbed.md)
|
||||||
- [Date Time Pipe](core/pipes/date-time.pipe.md)
|
- [Date Time Pipe](core/pipes/date-time.pipe.md)
|
||||||
|
|||||||
@ -1,107 +0,0 @@
|
|||||||
/*!
|
|
||||||
* @license
|
|
||||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
|
||||||
*
|
|
||||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
||||||
* you may not use this file except in compliance with the License.
|
|
||||||
* You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing, software
|
|
||||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
* See the License for the specific language governing permissions and
|
|
||||||
* limitations under the License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { BrowserActions, DataTableComponentPage, LoginPage } from '@alfresco/adf-testing';
|
|
||||||
import { browser, ElementFinder } from 'protractor';
|
|
||||||
import { SearchBarPage } from '../pages/search-bar.page';
|
|
||||||
import { SearchFiltersPage } from '../pages/search-filters.page';
|
|
||||||
import { SearchResultsPage } from '../pages/search-results.page';
|
|
||||||
import { format, parse, addDays } from 'date-fns';
|
|
||||||
|
|
||||||
describe('Search Date Range Filter', () => {
|
|
||||||
const loginPage = new LoginPage();
|
|
||||||
const searchBarPage = new SearchBarPage();
|
|
||||||
const searchFilters = new SearchFiltersPage();
|
|
||||||
const dateRangeFilter = searchFilters.createdDateRangeFilterPage();
|
|
||||||
const searchResults = new SearchResultsPage();
|
|
||||||
const dataTable = new DataTableComponentPage();
|
|
||||||
|
|
||||||
beforeAll(async () => {
|
|
||||||
await loginPage.loginWithProfile('admin');
|
|
||||||
|
|
||||||
await searchBarPage.checkSearchIconIsVisible();
|
|
||||||
await searchBarPage.clickOnSearchIcon();
|
|
||||||
await searchBarPage.enterTextAndPressEnter('*');
|
|
||||||
await searchResults.dataTable.waitTillContentLoaded();
|
|
||||||
});
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await searchFilters.checkCreatedRangeFilterIsDisplayed();
|
|
||||||
await searchFilters.clickCreatedRangeFilterHeader();
|
|
||||||
await searchFilters.checkCreatedRangeFilterIsExpanded();
|
|
||||||
});
|
|
||||||
|
|
||||||
afterEach(async () => {
|
|
||||||
await browser.refresh();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('[C277119] FROM and TO dates should depend on each other', async () => {
|
|
||||||
await dateRangeFilter.checkFromDateToggleIsDisplayed();
|
|
||||||
const fromDatePicker = await dateRangeFilter.openFromDatePicker();
|
|
||||||
await fromDatePicker.checkDatesAfterDateAreDisabled(new Date());
|
|
||||||
await fromDatePicker.closeDatePicker();
|
|
||||||
|
|
||||||
await dateRangeFilter.checkToDateToggleIsDisplayed();
|
|
||||||
let datePickerTo = await dateRangeFilter.openToDatePicker();
|
|
||||||
|
|
||||||
await datePickerTo.checkDatesAfterDateAreDisabled(new Date());
|
|
||||||
await datePickerTo.closeDatePicker();
|
|
||||||
|
|
||||||
await dateRangeFilter.checkFromDateToggleIsDisplayed();
|
|
||||||
const datePickerFrom = await dateRangeFilter.openFromDatePicker();
|
|
||||||
await datePickerFrom.selectTodayDate();
|
|
||||||
await datePickerFrom.checkDatePickerIsNotDisplayed();
|
|
||||||
|
|
||||||
await dateRangeFilter.checkToDateToggleIsDisplayed();
|
|
||||||
datePickerTo = await dateRangeFilter.openToDatePicker();
|
|
||||||
await datePickerTo.checkDatesBeforeDateAreDisabled(new Date());
|
|
||||||
await datePickerTo.checkDatesAfterDateAreDisabled(new Date());
|
|
||||||
});
|
|
||||||
|
|
||||||
it('[C277107] Should be able to apply a date range', async () => {
|
|
||||||
await dateRangeFilter.checkFromDateToggleIsDisplayed();
|
|
||||||
const datePickerToday = await dateRangeFilter.openFromDatePicker();
|
|
||||||
await datePickerToday.selectTodayDate();
|
|
||||||
await datePickerToday.checkDatePickerIsNotDisplayed();
|
|
||||||
let fromDate = await dateRangeFilter.getFromDate();
|
|
||||||
fromDate = format(parse(fromDate, 'd-MMM-yy', new Date()), 'dd-MM-yy');
|
|
||||||
|
|
||||||
await dateRangeFilter.checkApplyButtonIsDisabled();
|
|
||||||
|
|
||||||
await dateRangeFilter.checkToDateToggleIsDisplayed();
|
|
||||||
const toDatePicker = await dateRangeFilter.openToDatePicker();
|
|
||||||
|
|
||||||
await toDatePicker.selectTodayDate();
|
|
||||||
await toDatePicker.checkDatePickerIsNotDisplayed();
|
|
||||||
let toDate = await dateRangeFilter.getToDate();
|
|
||||||
toDate = format(addDays(parse(toDate, 'dd-MMM-yy', new Date()), 1), 'dd-MM-yy');
|
|
||||||
|
|
||||||
await dateRangeFilter.checkApplyButtonIsEnabled();
|
|
||||||
await dateRangeFilter.clickApplyButton();
|
|
||||||
|
|
||||||
await searchResults.sortByCreated('ASC');
|
|
||||||
|
|
||||||
const results = (await dataTable.geCellElementDetail('Created')) as ElementFinder[];
|
|
||||||
for (const currentResult of results) {
|
|
||||||
const currentDate = await BrowserActions.getAttribute(currentResult, 'title');
|
|
||||||
const currentDateFormatted = parse(currentDate, 'MMM dd, yyyy, h:mm:ss a', new Date());
|
|
||||||
|
|
||||||
await expect(currentDateFormatted <= parse(toDate, 'dd-MM-yy', new Date())).toBe(true);
|
|
||||||
await expect(currentDateFormatted >= parse(fromDate, 'dd-MM-yy', new Date())).toBe(true);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -155,7 +155,7 @@ describe('Search Radio Component', () => {
|
|||||||
|
|
||||||
await searchFiltersPage.clickTypeFilterHeader();
|
await searchFiltersPage.clickTypeFilterHeader();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(13);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(16);
|
||||||
|
|
||||||
await navigationBarPage.navigateToContentServices();
|
await navigationBarPage.navigateToContentServices();
|
||||||
|
|
||||||
@ -170,7 +170,7 @@ describe('Search Radio Component', () => {
|
|||||||
|
|
||||||
await searchFiltersPage.clickTypeFilterHeader();
|
await searchFiltersPage.clickTypeFilterHeader();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(13);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(16);
|
||||||
|
|
||||||
await navigationBarPage.navigateToContentServices();
|
await navigationBarPage.navigateToContentServices();
|
||||||
jsonFile.categories[5].component.settings.pageSize = 9;
|
jsonFile.categories[5].component.settings.pageSize = 9;
|
||||||
@ -184,7 +184,7 @@ describe('Search Radio Component', () => {
|
|||||||
|
|
||||||
await searchFiltersPage.clickTypeFilterHeader();
|
await searchFiltersPage.clickTypeFilterHeader();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(12);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(15);
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
||||||
@ -213,21 +213,21 @@ describe('Search Radio Component', () => {
|
|||||||
|
|
||||||
await searchFiltersPage.clickTypeFilterHeader();
|
await searchFiltersPage.clickTypeFilterHeader();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(8);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(11);
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().clickShowMoreButton();
|
await searchFiltersPage.typeFiltersPage().clickShowMoreButton();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(13);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(16);
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsNotDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsNotDisplayed();
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsDisplayed();
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().clickShowLessButton();
|
await searchFiltersPage.typeFiltersPage().clickShowLessButton();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(8);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(11);
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
||||||
@ -244,21 +244,21 @@ describe('Search Radio Component', () => {
|
|||||||
|
|
||||||
await searchFiltersPage.clickTypeFilterHeader();
|
await searchFiltersPage.clickTypeFilterHeader();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(8);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(11);
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().clickShowMoreButton();
|
await searchFiltersPage.typeFiltersPage().clickShowMoreButton();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(13);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(16);
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsNotDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsNotDisplayed();
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsDisplayed();
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().clickShowLessButton();
|
await searchFiltersPage.typeFiltersPage().clickShowLessButton();
|
||||||
|
|
||||||
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(8);
|
await expect(await searchFiltersPage.typeFiltersPage().getRadioButtonsNumberOnPage()).toBe(11);
|
||||||
|
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowMoreButtonIsDisplayed();
|
||||||
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
await searchFiltersPage.typeFiltersPage().checkShowLessButtonIsNotDisplayed();
|
||||||
|
|||||||
@ -17,7 +17,6 @@
|
|||||||
|
|
||||||
import {
|
import {
|
||||||
BrowserVisibility,
|
BrowserVisibility,
|
||||||
DateRangeFilterPage,
|
|
||||||
NumberRangeFilterPage,
|
NumberRangeFilterPage,
|
||||||
SearchCategoriesPage,
|
SearchCategoriesPage,
|
||||||
SearchCheckListPage,
|
SearchCheckListPage,
|
||||||
@ -36,7 +35,6 @@ export class SearchFiltersPage {
|
|||||||
fileSizeFilter = $('[data-automation-id="expansion-panel-SEARCH.FACET_FIELDS.SIZE"]');
|
fileSizeFilter = $('[data-automation-id="expansion-panel-SEARCH.FACET_FIELDS.SIZE"]');
|
||||||
nameFilter = $('[data-automation-id="expansion-panel-Name"]');
|
nameFilter = $('[data-automation-id="expansion-panel-Name"]');
|
||||||
checkListFilter = $('[data-automation-id="expansion-panel-Check List"]');
|
checkListFilter = $('[data-automation-id="expansion-panel-Check List"]');
|
||||||
createdDateRangeFilter = $('[data-automation-id="expansion-panel-Created Date (range)"]');
|
|
||||||
typeFilter = $('[data-automation-id="expansion-panel-Type"]');
|
typeFilter = $('[data-automation-id="expansion-panel-Type"]');
|
||||||
sizeRangeFilter = $('[data-automation-id="expansion-panel-Content Size (range)"]');
|
sizeRangeFilter = $('[data-automation-id="expansion-panel-Content Size (range)"]');
|
||||||
sizeSliderFilter = $('[data-automation-id="expansion-panel-Content Size"]');
|
sizeSliderFilter = $('[data-automation-id="expansion-panel-Content Size"]');
|
||||||
@ -56,10 +54,6 @@ export class SearchFiltersPage {
|
|||||||
return SearchCategoriesPage.numberRangeFilter(this.sizeRangeFilter);
|
return SearchCategoriesPage.numberRangeFilter(this.sizeRangeFilter);
|
||||||
}
|
}
|
||||||
|
|
||||||
createdDateRangeFilterPage(): DateRangeFilterPage {
|
|
||||||
return SearchCategoriesPage.dateRangeFilter(this.createdDateRangeFilter);
|
|
||||||
}
|
|
||||||
|
|
||||||
textFiltersPage(): SearchTextPage {
|
textFiltersPage(): SearchTextPage {
|
||||||
return SearchCategoriesPage.textFiltersPage(this.nameFilter);
|
return SearchCategoriesPage.textFiltersPage(this.nameFilter);
|
||||||
}
|
}
|
||||||
@ -156,18 +150,6 @@ export class SearchFiltersPage {
|
|||||||
await this.searchCategoriesPage.checkFilterIsExpanded(this.checkListFilter);
|
await this.searchCategoriesPage.checkFilterIsExpanded(this.checkListFilter);
|
||||||
}
|
}
|
||||||
|
|
||||||
async checkCreatedRangeFilterIsDisplayed(): Promise<void> {
|
|
||||||
await this.searchCategoriesPage.checkFilterIsDisplayed(this.createdDateRangeFilter);
|
|
||||||
}
|
|
||||||
|
|
||||||
async clickCreatedRangeFilterHeader(): Promise<void> {
|
|
||||||
await this.searchCategoriesPage.clickFilterHeader(this.createdDateRangeFilter);
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkCreatedRangeFilterIsExpanded(): Promise<void> {
|
|
||||||
await this.searchCategoriesPage.checkFilterIsExpanded(this.createdDateRangeFilter);
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkTypeFilterIsDisplayed(): Promise<void> {
|
async checkTypeFilterIsDisplayed(): Promise<void> {
|
||||||
await this.searchCategoriesPage.checkFilterIsDisplayed(this.typeFilter);
|
await this.searchCategoriesPage.checkFilterIsDisplayed(this.typeFilter);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -155,7 +155,10 @@ export class SearchConfiguration {
|
|||||||
selector: 'date-range',
|
selector: 'date-range',
|
||||||
settings: {
|
settings: {
|
||||||
field: 'cm:created',
|
field: 'cm:created',
|
||||||
dateFormat: 'DD-MMM-YY'
|
dateFormat: 'DD-MMM-YY',
|
||||||
|
displayedLabelsByField: {
|
||||||
|
'cm:created': 'Created Date'
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -182,7 +185,7 @@ export class SearchConfiguration {
|
|||||||
name: 'Date',
|
name: 'Date',
|
||||||
enabled: true,
|
enabled: true,
|
||||||
component: {
|
component: {
|
||||||
selector: 'date-range-advanced',
|
selector: 'date-range',
|
||||||
settings: {
|
settings: {
|
||||||
dateFormat: 'dd-MMM-yy',
|
dateFormat: 'dd-MMM-yy',
|
||||||
maxDate: 'today',
|
maxDate: 'today',
|
||||||
|
|||||||
@ -319,9 +319,7 @@
|
|||||||
"FROM": "From",
|
"FROM": "From",
|
||||||
"TO": "To",
|
"TO": "To",
|
||||||
"FROM-DATE": "From",
|
"FROM-DATE": "From",
|
||||||
"TO-DATE": "To",
|
"TO-DATE": "To"
|
||||||
"SELECT-FROM-DATE": "Select From Date",
|
|
||||||
"SELECT-TO-DATE": "Select To Date"
|
|
||||||
},
|
},
|
||||||
"VALIDATION": {
|
"VALIDATION": {
|
||||||
"REQUIRED-VALUE": "Required value",
|
"REQUIRED-VALUE": "Required value",
|
||||||
@ -378,14 +376,14 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"UNKNOWN_CONFIGURATION": "Unknown Configuration",
|
"UNKNOWN_CONFIGURATION": "Unknown Configuration",
|
||||||
"SEARCH_HEADER" : {
|
"SEARCH_HEADER": {
|
||||||
"TITLE":"Filter",
|
"TITLE": "Filter",
|
||||||
"TYPE": "Type",
|
"TYPE": "Type",
|
||||||
"FILTER_BY": "Filter by {{ category }}",
|
"FILTER_BY": "Filter by {{ category }}",
|
||||||
"CLEAR": "Clear",
|
"CLEAR": "Clear",
|
||||||
"APPLY": "Apply",
|
"APPLY": "Apply",
|
||||||
"FILTERS" : {
|
"FILTERS": {
|
||||||
"NAME" : {
|
"NAME": {
|
||||||
"TITLE": "Name",
|
"TITLE": "Name",
|
||||||
"PLACEHOLDER": "Enter the name"
|
"PLACEHOLDER": "Enter the name"
|
||||||
},
|
},
|
||||||
@ -395,14 +393,14 @@
|
|||||||
"DOCUMENT": "Document"
|
"DOCUMENT": "Document"
|
||||||
},
|
},
|
||||||
"SIZE": {
|
"SIZE": {
|
||||||
"TITLE" : "Content Size (range)",
|
"TITLE": "Content Size (range)",
|
||||||
"SMALL": "Small",
|
"SMALL": "Small",
|
||||||
"MEDIUM": "Medium",
|
"MEDIUM": "Medium",
|
||||||
"LARGE": "Large",
|
"LARGE": "Large",
|
||||||
"HUGE": "Huge"
|
"HUGE": "Huge"
|
||||||
},
|
},
|
||||||
"DATE" :{
|
"DATE": {
|
||||||
"TITLE" : "Created Date (range)"
|
"TITLE": "Created Date (range)"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -493,15 +491,15 @@
|
|||||||
"ADD_TAG_TOOLTIP": "Add tag"
|
"ADD_TAG_TOOLTIP": "Add tag"
|
||||||
},
|
},
|
||||||
"CONTENT_TYPE": {
|
"CONTENT_TYPE": {
|
||||||
"DIALOG" :{
|
"DIALOG": {
|
||||||
"TITLE" : "Change content type",
|
"TITLE": "Change content type",
|
||||||
"DESCRIPTION": "Making this change to the content type will permanently add some properties and stored metadata to the document.",
|
"DESCRIPTION": "Making this change to the content type will permanently add some properties and stored metadata to the document.",
|
||||||
"CONFIRM": "Are you sure you want to change the content type?",
|
"CONFIRM": "Are you sure you want to change the content type?",
|
||||||
"CANCEL": "CANCEL",
|
"CANCEL": "CANCEL",
|
||||||
"APPLY": "SAVE CHANGES",
|
"APPLY": "SAVE CHANGES",
|
||||||
"VIEW_DETAILS": "View details",
|
"VIEW_DETAILS": "View details",
|
||||||
"PROPERTY" :{
|
"PROPERTY": {
|
||||||
"NAME" : "Name",
|
"NAME": "Name",
|
||||||
"DESCRIPTION": "Description",
|
"DESCRIPTION": "Description",
|
||||||
"DATA_TYPE": "Data type"
|
"DATA_TYPE": "Data type"
|
||||||
}
|
}
|
||||||
@ -524,7 +522,7 @@
|
|||||||
"LINK-WITH-EXPIRY-SETTINGS": "New link has been generated with expiry settings",
|
"LINK-WITH-EXPIRY-SETTINGS": "New link has been generated with expiry settings",
|
||||||
"EXPIRES": "Expires on",
|
"EXPIRES": "Expires on",
|
||||||
"LINK-EXPIRY-DATE": "Link Expiry Date",
|
"LINK-EXPIRY-DATE": "Link Expiry Date",
|
||||||
"EXPIRATION-LABEL" : "Expiration Date",
|
"EXPIRATION-LABEL": "Expiration Date",
|
||||||
"EXPIRATION-PLACEHOLDER": "MM/DD/YYYY",
|
"EXPIRATION-PLACEHOLDER": "MM/DD/YYYY",
|
||||||
"CLIPBOARD-MESSAGE": "Link copied to the clipboard",
|
"CLIPBOARD-MESSAGE": "Link copied to the clipboard",
|
||||||
"CLOSE": "Close",
|
"CLOSE": "Close",
|
||||||
@ -666,19 +664,19 @@
|
|||||||
"ARIA_LABEL": "Open {{ name }}"
|
"ARIA_LABEL": "Open {{ name }}"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"ADF-ASPECT-LIST" : {
|
"ADF-ASPECT-LIST": {
|
||||||
"PROPERTY_NAME": "Property Name",
|
"PROPERTY_NAME": "Property Name",
|
||||||
"DESCRIPTION": "Description",
|
"DESCRIPTION": "Description",
|
||||||
"DATA_TYPE": "Data Type",
|
"DATA_TYPE": "Data Type",
|
||||||
"DIALOG" : {
|
"DIALOG": {
|
||||||
"TITLE" : "Customize Properties",
|
"TITLE": "Customize Properties",
|
||||||
"DESCRIPTION": "Manage the properties associated with selected file(s). Choose from property aspects listed below, to expose and apply additional metadata and functionality",
|
"DESCRIPTION": "Manage the properties associated with selected file(s). Choose from property aspects listed below, to expose and apply additional metadata and functionality",
|
||||||
"RESET": "Reset",
|
"RESET": "Reset",
|
||||||
"CLEAR": "Clear",
|
"CLEAR": "Clear",
|
||||||
"CANCEL": "Cancel",
|
"CANCEL": "Cancel",
|
||||||
"APPLY": "Apply",
|
"APPLY": "Apply",
|
||||||
"OVER-TABLE-MESSAGE" : "Select property aspects",
|
"OVER-TABLE-MESSAGE": "Select property aspects",
|
||||||
"SELECTED": "Selected"
|
"SELECTED": "Selected"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"NODE_COUNTER": {
|
"NODE_COUNTER": {
|
||||||
|
|||||||
@ -375,7 +375,10 @@ export const searchFilter = {
|
|||||||
selector: 'date-range',
|
selector: 'date-range',
|
||||||
settings: {
|
settings: {
|
||||||
field: 'cm:created',
|
field: 'cm:created',
|
||||||
dateFormat: 'DD-MMM-YY'
|
dateFormat: 'DD-MMM-YY',
|
||||||
|
displayedLabelsByField: {
|
||||||
|
'cm:created': 'Created Date (range)'
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
<adf-search-filter-tabbed>
|
<adf-search-filter-tabbed>
|
||||||
<ng-container *ngFor="let field of fields">
|
<ng-container *ngFor="let field of fields">
|
||||||
<adf-search-date-range-advanced
|
<adf-search-date-range
|
||||||
*adf-search-filter-tab="settings.displayedLabelsByField[field]"
|
*adf-search-filter-tab="settings.displayedLabelsByField[field]"
|
||||||
[dateFormat]="settings.dateFormat"
|
[dateFormat]="settings.dateFormat"
|
||||||
[maxDate]="settings.maxDate"
|
[maxDate]="settings.maxDate"
|
||||||
@ -8,6 +8,6 @@
|
|||||||
[initialValue]="startValue"
|
[initialValue]="startValue"
|
||||||
(changed)="onDateRangedValueChanged($event, field)"
|
(changed)="onDateRangedValueChanged($event, field)"
|
||||||
(valid)="tabsValidity[field]=$event">
|
(valid)="tabsValidity[field]=$event">
|
||||||
</adf-search-date-range-advanced>
|
</adf-search-date-range>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</adf-search-filter-tabbed>
|
</adf-search-filter-tabbed>
|
||||||
@ -19,12 +19,12 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|||||||
import { TranslateModule } from '@ngx-translate/core';
|
import { TranslateModule } from '@ngx-translate/core';
|
||||||
import { ContentTestingModule } from '../../../testing/content.testing.module';
|
import { ContentTestingModule } from '../../../testing/content.testing.module';
|
||||||
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
||||||
import { SearchDateRangeAdvanced } from './search-date-range-advanced/search-date-range-advanced';
|
import { SearchDateRange } from './search-date-range/search-date-range';
|
||||||
import { SearchFilterTabbedComponent } from '../search-filter-tabbed/search-filter-tabbed.component';
|
import { SearchFilterTabbedComponent } from '../search-filter-tabbed/search-filter-tabbed.component';
|
||||||
import { SearchDateRangeAdvancedComponent } from './search-date-range-advanced/search-date-range-advanced.component';
|
import { SearchDateRangeComponent } from './search-date-range/search-date-range.component';
|
||||||
import { SearchDateRangeAdvancedTabbedComponent } from './search-date-range-advanced-tabbed.component';
|
import { SearchDateRangeTabbedComponent } from './search-date-range-tabbed.component';
|
||||||
import { DateRangeType } from './search-date-range-advanced/date-range-type';
|
import { DateRangeType } from './search-date-range/date-range-type';
|
||||||
import { InLastDateType } from './search-date-range-advanced/in-last-date-type';
|
import { InLastDateType } from './search-date-range/in-last-date-type';
|
||||||
import {
|
import {
|
||||||
endOfDay,
|
endOfDay,
|
||||||
endOfToday,
|
endOfToday,
|
||||||
@ -44,10 +44,10 @@ import {
|
|||||||
export class MockSearchFilterTabbedComponent {}
|
export class MockSearchFilterTabbedComponent {}
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'adf-search-date-range-advanced',
|
selector: 'adf-search-date-range',
|
||||||
template: ``
|
template: ``
|
||||||
})
|
})
|
||||||
export class MockSearchDateRangeAdvancedComponent {
|
export class MockSearchDateRangeComponent {
|
||||||
@Input()
|
@Input()
|
||||||
dateFormat: string;
|
dateFormat: string;
|
||||||
@Input()
|
@Input()
|
||||||
@ -55,39 +55,39 @@ export class MockSearchDateRangeAdvancedComponent {
|
|||||||
@Input()
|
@Input()
|
||||||
field: string;
|
field: string;
|
||||||
@Input()
|
@Input()
|
||||||
initialValue: SearchDateRangeAdvanced;
|
initialValue: SearchDateRange;
|
||||||
|
|
||||||
@Output()
|
@Output()
|
||||||
changed = new EventEmitter<Partial<SearchDateRangeAdvanced>>();
|
changed = new EventEmitter<Partial<SearchDateRange>>();
|
||||||
@Output()
|
@Output()
|
||||||
valid = new EventEmitter<boolean>();
|
valid = new EventEmitter<boolean>();
|
||||||
}
|
}
|
||||||
describe('SearchDateRangeAdvancedTabbedComponent', () => {
|
describe('SearchDateRangeTabbedComponent', () => {
|
||||||
let component: SearchDateRangeAdvancedTabbedComponent;
|
let component: SearchDateRangeTabbedComponent;
|
||||||
let fixture: ComponentFixture<SearchDateRangeAdvancedTabbedComponent>;
|
let fixture: ComponentFixture<SearchDateRangeTabbedComponent>;
|
||||||
let betweenMockData: SearchDateRangeAdvanced;
|
let betweenMockData: SearchDateRange;
|
||||||
let inLastMockData: SearchDateRangeAdvanced;
|
let inLastMockData: SearchDateRange;
|
||||||
let anyMockDate: SearchDateRangeAdvanced;
|
let anyMockDate: SearchDateRange;
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
TestBed.configureTestingModule({
|
TestBed.configureTestingModule({
|
||||||
declarations: [SearchDateRangeAdvancedTabbedComponent, SearchFilterTabbedComponent, SearchDateRangeAdvancedComponent],
|
declarations: [SearchDateRangeTabbedComponent, SearchFilterTabbedComponent, SearchDateRangeComponent],
|
||||||
imports: [
|
imports: [
|
||||||
TranslateModule.forRoot(),
|
TranslateModule.forRoot(),
|
||||||
ContentTestingModule
|
ContentTestingModule
|
||||||
],
|
],
|
||||||
providers: [
|
providers: [
|
||||||
{ provide: SearchFilterTabbedComponent, useClass: MockSearchFilterTabbedComponent },
|
{ provide: SearchFilterTabbedComponent, useClass: MockSearchFilterTabbedComponent },
|
||||||
{ provide: SearchDateRangeAdvancedComponent, useClass: MockSearchDateRangeAdvancedComponent }
|
{ provide: SearchDateRangeComponent, useClass: MockSearchDateRangeComponent }
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
fixture = TestBed.createComponent(SearchDateRangeAdvancedTabbedComponent);
|
fixture = TestBed.createComponent(SearchDateRangeTabbedComponent);
|
||||||
|
|
||||||
component = fixture.componentInstance;
|
component = fixture.componentInstance;
|
||||||
component.id = 'dateRangeAdvanced';
|
component.id = 'dateRange';
|
||||||
component.context = {
|
component.context = {
|
||||||
queryFragments: {
|
queryFragments: {
|
||||||
dateRangeAdvanced: ''
|
dateRange: ''
|
||||||
},
|
},
|
||||||
update: jasmine.createSpy('update')
|
update: jasmine.createSpy('update')
|
||||||
} as any;
|
} as any;
|
||||||
@ -219,7 +219,7 @@ describe('SearchDateRangeAdvancedTabbedComponent', () => {
|
|||||||
const inLastStartDate = startOfWeek(subWeeks(new Date(), 5));
|
const inLastStartDate = startOfWeek(subWeeks(new Date(), 5));
|
||||||
const query = `createdDate:['${formatISO(startOfDay(betweenMockData.betweenStartDate))}' TO '${formatISO(endOfDay(betweenMockData.betweenEndDate))}']` +
|
const query = `createdDate:['${formatISO(startOfDay(betweenMockData.betweenStartDate))}' TO '${formatISO(endOfDay(betweenMockData.betweenEndDate))}']` +
|
||||||
` AND modifiedDate:['${formatISO(startOfDay(inLastStartDate))}' TO '${formatISO(endOfToday())}']`;
|
` AND modifiedDate:['${formatISO(startOfDay(inLastStartDate))}' TO '${formatISO(endOfToday())}']`;
|
||||||
expect(component.context.queryFragments['dateRangeAdvanced']).toEqual(query);
|
expect(component.context.queryFragments['dateRange']).toEqual(query);
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
expect(component.context.update).toHaveBeenCalled();
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -230,7 +230,7 @@ describe('SearchDateRangeAdvancedTabbedComponent', () => {
|
|||||||
expect(component.combinedQuery).toBe('');
|
expect(component.combinedQuery).toBe('');
|
||||||
expect(component.combinedDisplayValue).toBe('');
|
expect(component.combinedDisplayValue).toBe('');
|
||||||
expect(component.displayValue$.next).toHaveBeenCalledWith('');
|
expect(component.displayValue$.next).toHaveBeenCalledWith('');
|
||||||
expect(component.context.queryFragments['dateRangeAdvanced']).toEqual('');
|
expect(component.context.queryFragments['dateRange']).toEqual('');
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
expect(component.context.update).toHaveBeenCalled();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@ -17,12 +17,12 @@
|
|||||||
|
|
||||||
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
|
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
|
||||||
import { Subject } from 'rxjs';
|
import { Subject } from 'rxjs';
|
||||||
import { SearchDateRangeAdvanced } from './search-date-range-advanced/search-date-range-advanced';
|
import { DateRangeType } from './search-date-range/date-range-type';
|
||||||
import { DateRangeType } from './search-date-range-advanced/date-range-type';
|
import { SearchDateRange } from './search-date-range/search-date-range';
|
||||||
import { SearchWidget } from '../../models/search-widget.interface';
|
import { SearchWidget } from '../../models/search-widget.interface';
|
||||||
import { SearchWidgetSettings } from '../../models/search-widget-settings.interface';
|
import { SearchWidgetSettings } from '../../models/search-widget-settings.interface';
|
||||||
import { SearchQueryBuilderService } from '../../services/search-query-builder.service';
|
import { SearchQueryBuilderService } from '../../services/search-query-builder.service';
|
||||||
import { InLastDateType } from './search-date-range-advanced/in-last-date-type';
|
import { InLastDateType } from './search-date-range/in-last-date-type';
|
||||||
import { TranslationService } from '@alfresco/adf-core';
|
import { TranslationService } from '@alfresco/adf-core';
|
||||||
import {
|
import {
|
||||||
endOfDay,
|
endOfDay,
|
||||||
@ -38,14 +38,14 @@ import {
|
|||||||
} from 'date-fns';
|
} from 'date-fns';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'adf-search-date-range-advanced-tabbed',
|
selector: 'adf-search-date-range-tabbed',
|
||||||
templateUrl: './search-date-range-advanced-tabbed.component.html',
|
templateUrl: './search-date-range-tabbed.component.html',
|
||||||
encapsulation: ViewEncapsulation.None
|
encapsulation: ViewEncapsulation.None
|
||||||
})
|
})
|
||||||
export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnInit {
|
export class SearchDateRangeTabbedComponent implements SearchWidget, OnInit {
|
||||||
displayValue$ = new Subject<string>();
|
displayValue$ = new Subject<string>();
|
||||||
id: string;
|
id: string;
|
||||||
startValue: SearchDateRangeAdvanced = {
|
startValue: SearchDateRange = {
|
||||||
dateRangeType: DateRangeType.ANY,
|
dateRangeType: DateRangeType.ANY,
|
||||||
inLastValueType: InLastDateType.DAYS,
|
inLastValueType: InLastDateType.DAYS,
|
||||||
inLastValue: undefined,
|
inLastValue: undefined,
|
||||||
@ -59,7 +59,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI
|
|||||||
combinedQuery: string;
|
combinedQuery: string;
|
||||||
combinedDisplayValue: string;
|
combinedDisplayValue: string;
|
||||||
|
|
||||||
private value: { [key: string]: Partial<SearchDateRangeAdvanced> } = {};
|
private value: { [key: string]: Partial<SearchDateRange> } = {};
|
||||||
private queryMapByField: Map<string, string> = new Map<string, string>();
|
private queryMapByField: Map<string, string> = new Map<string, string>();
|
||||||
private displayValueMapByField: Map<string, string> = new Map<string, string>();
|
private displayValueMapByField: Map<string, string> = new Map<string, string>();
|
||||||
|
|
||||||
@ -69,7 +69,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI
|
|||||||
this.fields = this.settings?.field.split(',').map(field => field.trim());
|
this.fields = this.settings?.field.split(',').map(field => field.trim());
|
||||||
}
|
}
|
||||||
|
|
||||||
getCurrentValue(): { [key: string]: Partial<SearchDateRangeAdvanced> } {
|
getCurrentValue(): { [key: string]: Partial<SearchDateRange> } {
|
||||||
return this.value;
|
return this.value;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -86,7 +86,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI
|
|||||||
this.submitValues();
|
this.submitValues();
|
||||||
}
|
}
|
||||||
|
|
||||||
setValue(value: { [key: string]: SearchDateRangeAdvanced }) {
|
setValue(value: { [key: string]: SearchDateRange }) {
|
||||||
this.value = value;
|
this.value = value;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -97,13 +97,13 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI
|
|||||||
this.context.update();
|
this.context.update();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onDateRangedValueChanged(value: Partial<SearchDateRangeAdvanced>, field: string) {
|
onDateRangedValueChanged(value: Partial<SearchDateRange>, field: string) {
|
||||||
this.value[field] = value;
|
this.value[field] = value;
|
||||||
this.updateQuery(value, field);
|
this.updateQuery(value, field);
|
||||||
this.updateDisplayValue(value, field);
|
this.updateDisplayValue(value, field);
|
||||||
}
|
}
|
||||||
|
|
||||||
private generateQuery(value: Partial<SearchDateRangeAdvanced>, field: string): string {
|
private generateQuery(value: Partial<SearchDateRange>, field: string): string {
|
||||||
let query = '';
|
let query = '';
|
||||||
let startDate: Date;
|
let startDate: Date;
|
||||||
let endDate: Date;
|
let endDate: Date;
|
||||||
@ -136,7 +136,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI
|
|||||||
return query;
|
return query;
|
||||||
}
|
}
|
||||||
|
|
||||||
private generateDisplayValue(value: Partial<SearchDateRangeAdvanced>): string {
|
private generateDisplayValue(value: Partial<SearchDateRange>): string {
|
||||||
let displayValue = '';
|
let displayValue = '';
|
||||||
if (value.dateRangeType === DateRangeType.IN_LAST && value.inLastValue) {
|
if (value.dateRangeType === DateRangeType.IN_LAST && value.inLastValue) {
|
||||||
displayValue = this.translateService.instant(`SEARCH.DATE_RANGE_ADVANCED.IN_LAST_DISPLAY_LABELS.${value.inLastValueType}`, {
|
displayValue = this.translateService.instant(`SEARCH.DATE_RANGE_ADVANCED.IN_LAST_DISPLAY_LABELS.${value.inLastValueType}`, {
|
||||||
@ -148,7 +148,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI
|
|||||||
return displayValue;
|
return displayValue;
|
||||||
}
|
}
|
||||||
|
|
||||||
private updateQuery(value: Partial<SearchDateRangeAdvanced>, field: string) {
|
private updateQuery(value: Partial<SearchDateRange>, field: string) {
|
||||||
this.combinedQuery = '';
|
this.combinedQuery = '';
|
||||||
this.queryMapByField.set(field, this.generateQuery(value, field));
|
this.queryMapByField.set(field, this.generateQuery(value, field));
|
||||||
this.queryMapByField.forEach((query: string) => {
|
this.queryMapByField.forEach((query: string) => {
|
||||||
@ -158,7 +158,7 @@ export class SearchDateRangeAdvancedTabbedComponent implements SearchWidget, OnI
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
private updateDisplayValue(value: Partial<SearchDateRangeAdvanced>, field: string) {
|
private updateDisplayValue(value: Partial<SearchDateRange>, field: string) {
|
||||||
this.combinedDisplayValue = '';
|
this.combinedDisplayValue = '';
|
||||||
this.displayValueMapByField.set(field, this.generateDisplayValue(value));
|
this.displayValueMapByField.set(field, this.generateDisplayValue(value));
|
||||||
this.displayValueMapByField.forEach((displayValue: string, fieldForDisplayLabel: string) => {
|
this.displayValueMapByField.forEach((displayValue: string, fieldForDisplayLabel: string) => {
|
||||||
@ -1,41 +1,41 @@
|
|||||||
<div class="adf-search-date-range-container" [formGroup]="form">
|
<div class="adf-search-date-range-container" [formGroup]="form">
|
||||||
<mat-radio-group formControlName="dateRangeType">
|
<mat-radio-group formControlName="dateRangeType">
|
||||||
<span class="adf-search-date-range-container-row">
|
<span class="adf-search-date-range-container-row">
|
||||||
<mat-radio-button [value]="DateRangeType.ANY" data-automation-id="date-range-advanced-anytime">
|
<mat-radio-button [value]="DateRangeType.ANY" data-automation-id="date-range-anytime">
|
||||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.ANYTIME' | translate }}
|
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.ANYTIME' | translate }}
|
||||||
</mat-radio-button>
|
</mat-radio-button>
|
||||||
</span>
|
</span>
|
||||||
<span class="adf-search-date-range-container-row">
|
<span class="adf-search-date-range-container-row">
|
||||||
<mat-radio-button [value]="DateRangeType.IN_LAST" data-automation-id="date-range-advanced-in-last">
|
<mat-radio-button [value]="DateRangeType.IN_LAST" data-automation-id="date-range-in-last">
|
||||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.IN_LAST' | translate }}
|
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.IN_LAST' | translate }}
|
||||||
</mat-radio-button>
|
</mat-radio-button>
|
||||||
<mat-form-field class="adf-search-date-range-form-field adf-search-date-range-input-field">
|
<mat-form-field class="adf-search-date-range-form-field adf-search-date-range-input-field">
|
||||||
<input matInput [attr.aria-label]="'SEARCH.DATE_RANGE_ADVANCED.ARIA_LABEL.NUMBER_INPUT' | translate"
|
<input matInput [attr.aria-label]="'SEARCH.DATE_RANGE_ADVANCED.ARIA_LABEL.NUMBER_INPUT' | translate"
|
||||||
type="number" min="1" formControlName="inLastValue"
|
type="number" min="1" formControlName="inLastValue"
|
||||||
data-automation-id="date-range-advanced-in-last-input" (input)="narrowDownAllowedCharacters($event)"
|
data-automation-id="date-range-in-last-input" (input)="narrowDownAllowedCharacters($event)"
|
||||||
(keydown)="preventIncorrectNumberCharacters($event)">
|
(keydown)="preventIncorrectNumberCharacters($event)">
|
||||||
<mat-error *ngIf="form.controls.inLastValue.errors?.required">{{ 'SEARCH.DATE_RANGE_ADVANCED.ERROR.IN_LAST' | translate }}</mat-error>
|
<mat-error *ngIf="form.controls.inLastValue.errors?.required">{{ 'SEARCH.DATE_RANGE_ADVANCED.ERROR.IN_LAST' | translate }}</mat-error>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
<mat-form-field class="adf-search-date-range-form-field">
|
<mat-form-field class="adf-search-date-range-form-field">
|
||||||
<mat-select formControlName="inLastValueType" data-automation-id="date-range-advanced-in-last-dropdown">
|
<mat-select formControlName="inLastValueType" data-automation-id="date-range-in-last-dropdown">
|
||||||
<mat-option data-automation-id="date-range-advanced-in-last-option-days" [value]="InLastDateType.DAYS">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.DAYS' | translate }}</mat-option>
|
<mat-option data-automation-id="date-range-in-last-option-days" [value]="InLastDateType.DAYS">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.DAYS' | translate }}</mat-option>
|
||||||
<mat-option data-automation-id="date-range-advanced-in-last-option-weeks" [value]="InLastDateType.WEEKS">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.WEEKS' | translate }}</mat-option>
|
<mat-option data-automation-id="date-range-in-last-option-weeks" [value]="InLastDateType.WEEKS">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.WEEKS' | translate }}</mat-option>
|
||||||
<mat-option data-automation-id="date-range-advanced-in-last-option-months" [value]="InLastDateType.MONTHS">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.MONTHS' | translate }}</mat-option>
|
<mat-option data-automation-id="date-range-in-last-option-months" [value]="InLastDateType.MONTHS">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.MONTHS' | translate }}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
</span>
|
</span>
|
||||||
<span class="adf-search-date-range-container-row">
|
<span class="adf-search-date-range-container-row">
|
||||||
<mat-radio-button [value]="DateRangeType.BETWEEN" data-automation-id="date-range-advanced-between">
|
<mat-radio-button [value]="DateRangeType.BETWEEN" data-automation-id="date-range-between">
|
||||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.BETWEEN' | translate }}
|
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.BETWEEN' | translate }}
|
||||||
</mat-radio-button>
|
</mat-radio-button>
|
||||||
<mat-form-field class="adf-search-date-range-form-field">
|
<mat-form-field class="adf-search-date-range-form-field">
|
||||||
<mat-date-range-input [rangePicker]="$any(picker)" [max]="convertedMaxDate">
|
<mat-date-range-input [rangePicker]="$any(picker)" [max]="convertedMaxDate">
|
||||||
<input matStartDate placeholder="{{ 'SEARCH.DATE_RANGE_ADVANCED.BETWEEN_PLACEHOLDERS.START_DATE' | translate }}"
|
<input matStartDate placeholder="{{ 'SEARCH.DATE_RANGE_ADVANCED.BETWEEN_PLACEHOLDERS.START_DATE' | translate }}"
|
||||||
data-automation-id="date-range-advanced-between-start-input" [formControl]="betweenStartDateFormControl" (change)="dateChanged($event, betweenStartDateFormControl)">
|
data-automation-id="date-range-between-start-input" [formControl]="betweenStartDateFormControl" (change)="dateChanged($event, betweenStartDateFormControl)">
|
||||||
<input matEndDate placeholder="{{ 'SEARCH.DATE_RANGE_ADVANCED.BETWEEN_PLACEHOLDERS.END_DATE' | translate }}"
|
<input matEndDate placeholder="{{ 'SEARCH.DATE_RANGE_ADVANCED.BETWEEN_PLACEHOLDERS.END_DATE' | translate }}"
|
||||||
data-automation-id="date-range-advanced-between-end-input" [formControl]="betweenEndDateFormControl" (change)="dateChanged($event, betweenEndDateFormControl)">
|
data-automation-id="date-range-between-end-input" [formControl]="betweenEndDateFormControl" (change)="dateChanged($event, betweenEndDateFormControl)">
|
||||||
</mat-date-range-input>
|
</mat-date-range-input>
|
||||||
<mat-datepicker-toggle matSuffix [for]="picker" data-automation-id="date-range-advanced-between-datepicker-toggle"></mat-datepicker-toggle>
|
<mat-datepicker-toggle matSuffix [for]="picker" data-automation-id="date-range-between-datepicker-toggle"></mat-datepicker-toggle>
|
||||||
<mat-date-range-picker #picker></mat-date-range-picker>
|
<mat-date-range-picker #picker></mat-date-range-picker>
|
||||||
|
|
||||||
<mat-error *ngIf="betweenStartDateFormControl.errors?.invalidDate">{{ 'SEARCH.DATE_RANGE_ADVANCED.ERROR.START_DATE.INVALID_FORMAT' | translate }}</mat-error>
|
<mat-error *ngIf="betweenStartDateFormControl.errors?.invalidDate">{{ 'SEARCH.DATE_RANGE_ADVANCED.ERROR.START_DATE.INVALID_FORMAT' | translate }}</mat-error>
|
||||||
@ -1,4 +1,4 @@
|
|||||||
adf-search-date-range-advanced {
|
adf-search-date-range {
|
||||||
.adf-search-date-range-container {
|
.adf-search-date-range-container {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
@ -19,29 +19,29 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|||||||
import { By } from '@angular/platform-browser';
|
import { By } from '@angular/platform-browser';
|
||||||
import { TranslateModule } from '@ngx-translate/core';
|
import { TranslateModule } from '@ngx-translate/core';
|
||||||
import { ContentTestingModule } from '../../../../testing/content.testing.module';
|
import { ContentTestingModule } from '../../../../testing/content.testing.module';
|
||||||
import { SearchDateRangeAdvancedComponent } from './search-date-range-advanced.component';
|
import { SearchDateRangeComponent } from './search-date-range.component';
|
||||||
import { addDays, endOfToday, format, parse, startOfYesterday, subDays } from 'date-fns';
|
import { addDays, endOfToday, format, parse, startOfYesterday, subDays } from 'date-fns';
|
||||||
import { Validators } from '@angular/forms';
|
import { Validators } from '@angular/forms';
|
||||||
|
|
||||||
describe('SearchDateRangeAdvancedComponent', () => {
|
describe('SearchDateRangeComponent', () => {
|
||||||
let component: SearchDateRangeAdvancedComponent;
|
let component: SearchDateRangeComponent;
|
||||||
let fixture: ComponentFixture<SearchDateRangeAdvancedComponent>;
|
let fixture: ComponentFixture<SearchDateRangeComponent>;
|
||||||
|
|
||||||
const startDateSampleValue = parse('05-Jun-23', 'dd-MMM-yy', new Date());
|
const startDateSampleValue = parse('05-Jun-23', 'dd-MMM-yy', new Date());
|
||||||
const endDateSampleValue = parse('07-Jun-23', 'dd-MMM-yy', new Date());
|
const endDateSampleValue = parse('07-Jun-23', 'dd-MMM-yy', new Date());
|
||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
TestBed.configureTestingModule({
|
TestBed.configureTestingModule({
|
||||||
declarations: [SearchDateRangeAdvancedComponent],
|
declarations: [SearchDateRangeComponent],
|
||||||
imports: [
|
imports: [
|
||||||
TranslateModule.forRoot(),
|
TranslateModule.forRoot(),
|
||||||
ContentTestingModule
|
ContentTestingModule
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
|
||||||
fixture = TestBed.createComponent(SearchDateRangeAdvancedComponent);
|
fixture = TestBed.createComponent(SearchDateRangeComponent);
|
||||||
component = fixture.componentInstance;
|
component = fixture.componentInstance;
|
||||||
component.field = 'test-field';
|
component.field = 'test-field';
|
||||||
component.dateFormat = 'dd-MMM-yy';
|
component.dateFormat = 'dd-MMM-yy';
|
||||||
component.maxDate = 'today';
|
component.maxDate = 'today';
|
||||||
component.form.setValue({
|
component.form.setValue({
|
||||||
@ -64,7 +64,7 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const selectDropdownOption = (itemId: string) => {
|
const selectDropdownOption = (itemId: string) => {
|
||||||
const matSelect = fixture.debugElement.query(By.css('[data-automation-id="date-range-advanced-in-last-dropdown"]')).nativeElement;
|
const matSelect = fixture.debugElement.query(By.css('[data-automation-id="date-range-in-last-dropdown"]')).nativeElement;
|
||||||
matSelect.click();
|
matSelect.click();
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
const matOption = fixture.debugElement.query(By.css(`[data-automation-id="${itemId}"]`)).nativeElement;
|
const matOption = fixture.debugElement.query(By.css(`[data-automation-id="${itemId}"]`)).nativeElement;
|
||||||
@ -131,20 +131,20 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
it('should not be able to set zero or negative values in In the last input field', () => {
|
it('should not be able to set zero or negative values in In the last input field', () => {
|
||||||
component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST);
|
component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST);
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '-5');
|
enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '-5');
|
||||||
let inLastInputFieldValue = getElementBySelector('[data-automation-id="date-range-advanced-in-last-input"]').value;
|
let inLastInputFieldValue = getElementBySelector('[data-automation-id="date-range-in-last-input"]').value;
|
||||||
expect(inLastInputFieldValue).toBe('5');
|
expect(inLastInputFieldValue).toBe('5');
|
||||||
|
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '0');
|
enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '0');
|
||||||
inLastInputFieldValue = getElementBySelector('[data-automation-id="date-range-advanced-in-last-input"]').value;
|
inLastInputFieldValue = getElementBySelector('[data-automation-id="date-range-in-last-input"]').value;
|
||||||
expect(inLastInputFieldValue).toBe('');
|
expect(inLastInputFieldValue).toBe('');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should give an invalid date error when manually setting a start date and an end date that are not in the correct format', () => {
|
it('should give an invalid date error when manually setting a start date and an end date that are not in the correct format', () => {
|
||||||
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-start-input', 'invalid-date-input', 'change');
|
enterValueInInputFieldAndTriggerEvent('date-range-between-start-input', 'invalid-date-input', 'change');
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-end-input', 'invalid-date-input', 'change');
|
enterValueInInputFieldAndTriggerEvent('date-range-between-end-input', 'invalid-date-input', 'change');
|
||||||
expect(component.form.controls.betweenStartDate.errors.invalidDate).toBeTrue();
|
expect(component.form.controls.betweenStartDate.errors.invalidDate).toBeTrue();
|
||||||
expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue();
|
expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue();
|
||||||
});
|
});
|
||||||
@ -154,7 +154,7 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
component.form.controls.betweenEndDate.setValue(new Date());
|
component.form.controls.betweenEndDate.setValue(new Date());
|
||||||
const startDate = format(addDays(component.form.controls.betweenEndDate.value, 3), component.dateFormat);
|
const startDate = format(addDays(component.form.controls.betweenEndDate.value, 3), component.dateFormat);
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-start-input', startDate, 'change');
|
enterValueInInputFieldAndTriggerEvent('date-range-between-start-input', startDate, 'change');
|
||||||
expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue();
|
expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue();
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -163,7 +163,7 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
component.form.controls.betweenStartDate.setValue(new Date());
|
component.form.controls.betweenStartDate.setValue(new Date());
|
||||||
const endDate = format(subDays(component.form.controls.betweenStartDate.value, 3), component.dateFormat);
|
const endDate = format(subDays(component.form.controls.betweenStartDate.value, 3), component.dateFormat);
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-end-input', endDate, 'change');
|
enterValueInInputFieldAndTriggerEvent('date-range-between-end-input', endDate, 'change');
|
||||||
expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue();
|
expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue();
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -171,16 +171,28 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
const endDate = format(addDays(component.convertedMaxDate, 3), component.dateFormat);
|
const endDate = format(addDays(component.convertedMaxDate, 3), component.dateFormat);
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-between-end-input', endDate, 'change');
|
enterValueInInputFieldAndTriggerEvent('date-range-between-end-input', endDate, 'change');
|
||||||
expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue();
|
expect(component.form.controls.betweenEndDate.errors.invalidDate).toBeTrue();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should not be able to select a date after the max date when selecting the BETWEEN option', async () => {
|
||||||
|
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
||||||
|
component.maxDate = 'today';
|
||||||
|
fixture.detectChanges();
|
||||||
|
getElementBySelector('[data-automation-id="date-range-between-datepicker-toggle"]').click();
|
||||||
|
fixture.detectChanges();
|
||||||
|
|
||||||
|
const afterDate = format(addDays(new Date(), 1), 'MMM d, yyyy');
|
||||||
|
const afterDateItem = document.querySelector(`.mat-calendar-body-cell[aria-label="${afterDate}"]`);
|
||||||
|
expect(afterDateItem.getAttribute('aria-disabled')).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
it('should emit valid as false when form is invalid', () => {
|
it('should emit valid as false when form is invalid', () => {
|
||||||
spyOn(component.valid, 'emit');
|
spyOn(component.valid, 'emit');
|
||||||
component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST);
|
component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST);
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '');
|
enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '');
|
||||||
selectDropdownOption('date-range-advanced-in-last-option-weeks');
|
selectDropdownOption('date-range-in-last-option-weeks');
|
||||||
expect(component.valid.emit).toHaveBeenCalledWith(false);
|
expect(component.valid.emit).toHaveBeenCalledWith(false);
|
||||||
|
|
||||||
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
||||||
@ -192,8 +204,8 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
spyOn(component.valid, 'emit');
|
spyOn(component.valid, 'emit');
|
||||||
component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST);
|
component.form.controls.dateRangeType.setValue(component.DateRangeType.IN_LAST);
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '5');
|
enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '5');
|
||||||
selectDropdownOption('date-range-advanced-in-last-option-weeks');
|
selectDropdownOption('date-range-in-last-option-weeks');
|
||||||
expect(component.valid.emit).toHaveBeenCalledWith(true);
|
expect(component.valid.emit).toHaveBeenCalledWith(true);
|
||||||
|
|
||||||
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
component.form.controls.dateRangeType.setValue(component.DateRangeType.BETWEEN);
|
||||||
@ -213,10 +225,10 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
betweenStartDate: undefined,
|
betweenStartDate: undefined,
|
||||||
betweenEndDate: undefined
|
betweenEndDate: undefined
|
||||||
};
|
};
|
||||||
let dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-advanced-in-last"] .mat-radio-input');
|
let dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-in-last"] .mat-radio-input');
|
||||||
dateRangeTypeRadioButton.click();
|
dateRangeTypeRadioButton.click();
|
||||||
selectDropdownOption('date-range-advanced-in-last-option-weeks');
|
selectDropdownOption('date-range-in-last-option-weeks');
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '');
|
enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '');
|
||||||
expect(component.changed.emit).not.toHaveBeenCalledWith(value);
|
expect(component.changed.emit).not.toHaveBeenCalledWith(value);
|
||||||
|
|
||||||
component.form.patchValue({
|
component.form.patchValue({
|
||||||
@ -234,7 +246,7 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
betweenStartDate: '',
|
betweenStartDate: '',
|
||||||
betweenEndDate: ''
|
betweenEndDate: ''
|
||||||
};
|
};
|
||||||
dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-advanced-between"] .mat-radio-input');
|
dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-between"] .mat-radio-input');
|
||||||
dateRangeTypeRadioButton.click();
|
dateRangeTypeRadioButton.click();
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
expect(component.changed.emit).not.toHaveBeenCalledWith(value);
|
expect(component.changed.emit).not.toHaveBeenCalledWith(value);
|
||||||
@ -249,10 +261,10 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
betweenStartDate: null,
|
betweenStartDate: null,
|
||||||
betweenEndDate: null
|
betweenEndDate: null
|
||||||
};
|
};
|
||||||
let dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-advanced-in-last"] .mat-radio-input');
|
let dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-in-last"] .mat-radio-input');
|
||||||
dateRangeTypeRadioButton.click();
|
dateRangeTypeRadioButton.click();
|
||||||
selectDropdownOption('date-range-advanced-in-last-option-weeks');
|
selectDropdownOption('date-range-in-last-option-weeks');
|
||||||
enterValueInInputFieldAndTriggerEvent('date-range-advanced-in-last-input', '5');
|
enterValueInInputFieldAndTriggerEvent('date-range-in-last-input', '5');
|
||||||
fixture.detectChanges();
|
fixture.detectChanges();
|
||||||
expect(component.changed.emit).toHaveBeenCalledWith(value);
|
expect(component.changed.emit).toHaveBeenCalledWith(value);
|
||||||
|
|
||||||
@ -271,7 +283,7 @@ describe('SearchDateRangeAdvancedComponent', () => {
|
|||||||
betweenStartDate: startDateSampleValue,
|
betweenStartDate: startDateSampleValue,
|
||||||
betweenEndDate: endDateSampleValue
|
betweenEndDate: endDateSampleValue
|
||||||
};
|
};
|
||||||
dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-advanced-between"] .mat-radio-input');
|
dateRangeTypeRadioButton = getElementBySelector('[data-automation-id="date-range-between"] .mat-radio-input');
|
||||||
dateRangeTypeRadioButton.click();
|
dateRangeTypeRadioButton.click();
|
||||||
component.betweenStartDateFormControl.setValue(startDateSampleValue);
|
component.betweenStartDateFormControl.setValue(startDateSampleValue);
|
||||||
component.betweenEndDateFormControl.setValue(endDateSampleValue);
|
component.betweenEndDateFormControl.setValue(endDateSampleValue);
|
||||||
@ -22,7 +22,7 @@ import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE, MatDateFormats } from '
|
|||||||
import { DateFnsAdapter, MAT_DATE_FNS_FORMATS } from '@angular/material-date-fns-adapter';
|
import { DateFnsAdapter, MAT_DATE_FNS_FORMATS } from '@angular/material-date-fns-adapter';
|
||||||
import { InLastDateType } from './in-last-date-type';
|
import { InLastDateType } from './in-last-date-type';
|
||||||
import { DateRangeType } from './date-range-type';
|
import { DateRangeType } from './date-range-type';
|
||||||
import { SearchDateRangeAdvanced } from './search-date-range-advanced';
|
import { SearchDateRange } from './search-date-range';
|
||||||
import { FormBuilder, UntypedFormControl, Validators } from '@angular/forms';
|
import { FormBuilder, UntypedFormControl, Validators } from '@angular/forms';
|
||||||
import { takeUntil } from 'rxjs/operators';
|
import { takeUntil } from 'rxjs/operators';
|
||||||
import { UserPreferencesService, UserPreferenceValues, DateFnsUtils } from '@alfresco/adf-core';
|
import { UserPreferencesService, UserPreferenceValues, DateFnsUtils } from '@alfresco/adf-core';
|
||||||
@ -30,17 +30,17 @@ import { UserPreferencesService, UserPreferenceValues, DateFnsUtils } from '@alf
|
|||||||
const DEFAULT_DATE_DISPLAY_FORMAT = 'dd-MMM-yy';
|
const DEFAULT_DATE_DISPLAY_FORMAT = 'dd-MMM-yy';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'adf-search-date-range-advanced',
|
selector: 'adf-search-date-range',
|
||||||
templateUrl: './search-date-range-advanced.component.html',
|
templateUrl: './search-date-range.component.html',
|
||||||
styleUrls: ['./search-date-range-advanced.component.scss'],
|
styleUrls: ['./search-date-range.component.scss'],
|
||||||
providers: [
|
providers: [
|
||||||
{ provide: DateAdapter, useClass: DateFnsAdapter, deps: [ MAT_DATE_LOCALE ] },
|
{ provide: DateAdapter, useClass: DateFnsAdapter, deps: [ MAT_DATE_LOCALE ] },
|
||||||
{ provide: MAT_DATE_FORMATS, useValue: MAT_DATE_FNS_FORMATS }
|
{ provide: MAT_DATE_FORMATS, useValue: MAT_DATE_FNS_FORMATS }
|
||||||
],
|
],
|
||||||
encapsulation: ViewEncapsulation.None,
|
encapsulation: ViewEncapsulation.None,
|
||||||
host: {class: 'adf-search-date-range-advanced'}
|
host: {class: 'adf-search-date-range'}
|
||||||
})
|
})
|
||||||
export class SearchDateRangeAdvancedComponent implements OnInit, OnDestroy {
|
export class SearchDateRangeComponent implements OnInit, OnDestroy {
|
||||||
@Input()
|
@Input()
|
||||||
dateFormat = DEFAULT_DATE_DISPLAY_FORMAT;
|
dateFormat = DEFAULT_DATE_DISPLAY_FORMAT;
|
||||||
@Input()
|
@Input()
|
||||||
@ -48,18 +48,18 @@ export class SearchDateRangeAdvancedComponent implements OnInit, OnDestroy {
|
|||||||
@Input()
|
@Input()
|
||||||
field: string;
|
field: string;
|
||||||
@Input()
|
@Input()
|
||||||
set initialValue(value: SearchDateRangeAdvanced) {
|
set initialValue(value: SearchDateRange) {
|
||||||
if (value) {
|
if (value) {
|
||||||
this.form.patchValue(value);
|
this.form.patchValue(value);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@Output()
|
@Output()
|
||||||
changed = new EventEmitter<Partial<SearchDateRangeAdvanced>>();
|
changed = new EventEmitter<Partial<SearchDateRange>>();
|
||||||
@Output()
|
@Output()
|
||||||
valid = new EventEmitter<boolean>();
|
valid = new EventEmitter<boolean>();
|
||||||
|
|
||||||
form = this.formBuilder.group<SearchDateRangeAdvanced>({
|
form = this.formBuilder.group<SearchDateRange>({
|
||||||
dateRangeType: DateRangeType.ANY,
|
dateRangeType: DateRangeType.ANY,
|
||||||
inLastValueType: InLastDateType.DAYS,
|
inLastValueType: InLastDateType.DAYS,
|
||||||
inLastValue: undefined,
|
inLastValue: undefined,
|
||||||
@ -18,7 +18,7 @@
|
|||||||
import { DateRangeType } from './date-range-type';
|
import { DateRangeType } from './date-range-type';
|
||||||
import { InLastDateType } from './in-last-date-type';
|
import { InLastDateType } from './in-last-date-type';
|
||||||
|
|
||||||
export interface SearchDateRangeAdvanced {
|
export interface SearchDateRange {
|
||||||
dateRangeType: DateRangeType;
|
dateRangeType: DateRangeType;
|
||||||
inLastValueType?: InLastDateType;
|
inLastValueType?: InLastDateType;
|
||||||
inLastValue?: string;
|
inLastValue?: string;
|
||||||
@ -1,49 +0,0 @@
|
|||||||
<form [formGroup]="form" novalidate (ngSubmit)="apply(form.value, form.valid)">
|
|
||||||
<mat-form-field>
|
|
||||||
<mat-label>{{ 'SEARCH.FILTER.RANGE.SELECT-FROM-DATE' | translate }}</mat-label>
|
|
||||||
<input matInput
|
|
||||||
(input)="forcePlaceholder($event)"
|
|
||||||
[formControl]="from"
|
|
||||||
[errorStateMatcher]="matcher"
|
|
||||||
placeholder="{{ 'SEARCH.FILTER.RANGE.FROM-DATE' | translate }}"
|
|
||||||
[attr.aria-label]="'SEARCH.FILTER.RANGE.FROM-DATE' | translate"
|
|
||||||
[matDatepicker]="fromDatepicker"
|
|
||||||
[max]="fromMaxDate"
|
|
||||||
(dateChange)="onChangedHandler($event, from)"
|
|
||||||
data-automation-id="date-range-from-input">
|
|
||||||
<mat-datepicker-toggle matSuffix [for]="fromDatepicker" data-automation-id="date-range-from-date-toggle"></mat-datepicker-toggle>
|
|
||||||
<mat-datepicker #fromDatepicker color="accent"></mat-datepicker>
|
|
||||||
<mat-error *ngIf="from.invalid" data-automation-id="date-range-from-error">
|
|
||||||
{{ getFromValidationMessage() | translate: { requiredFormat: datePickerFormat } }}
|
|
||||||
</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<mat-form-field>
|
|
||||||
<mat-label>{{ 'SEARCH.FILTER.RANGE.SELECT-TO-DATE' | translate }}</mat-label>
|
|
||||||
<input matInput
|
|
||||||
(input)="forcePlaceholder($event)"
|
|
||||||
[formControl]="to"
|
|
||||||
[errorStateMatcher]="matcher"
|
|
||||||
placeholder="{{ 'SEARCH.FILTER.RANGE.TO-DATE' | translate }}"
|
|
||||||
[attr.aria-label]="'SEARCH.FILTER.RANGE.TO-DATE' | translate"
|
|
||||||
[matDatepicker]="toDatepicker"
|
|
||||||
[min]="from.value"
|
|
||||||
[max]="maxDate"
|
|
||||||
(dateChange)="onChangedHandler($event, to)"
|
|
||||||
data-automation-id="date-range-to-input">
|
|
||||||
<mat-datepicker-toggle matSuffix [for]="toDatepicker" data-automation-id="date-range-to-date-toggle"></mat-datepicker-toggle>
|
|
||||||
<mat-datepicker #toDatepicker color="accent"></mat-datepicker>
|
|
||||||
<mat-error *ngIf="to.invalid" data-automation-id="date-range-to-error">
|
|
||||||
{{ getToValidationMessage() | translate: { requiredFormat: datePickerFormat } }}
|
|
||||||
</mat-error>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<div class="adf-facet-buttons adf-facet-buttons--topSpace" *ngIf="!settings?.hideDefaultAction">
|
|
||||||
<button mat-button color="primary" type="button" (click)="clear()" data-automation-id="date-range-clear-btn">
|
|
||||||
{{ 'SEARCH.FILTER.ACTIONS.CLEAR' | translate }}
|
|
||||||
</button>
|
|
||||||
<button mat-button color="primary" type="submit" [disabled]="!form.valid" data-automation-id="date-range-apply-btn">
|
|
||||||
{{ 'SEARCH.FILTER.ACTIONS.APPLY' | translate }}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
@ -1,5 +0,0 @@
|
|||||||
.adf-search-date-range > form {
|
|
||||||
display: inline-flex;
|
|
||||||
flex-direction: column;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
@ -1,267 +0,0 @@
|
|||||||
/*!
|
|
||||||
* @license
|
|
||||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
|
||||||
*
|
|
||||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
||||||
* you may not use this file except in compliance with the License.
|
|
||||||
* You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing, software
|
|
||||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
* See the License for the specific language governing permissions and
|
|
||||||
* limitations under the License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { SearchDateRangeComponent } from './search-date-range.component';
|
|
||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { ContentTestingModule } from '../../../testing/content.testing.module';
|
|
||||||
import { TranslateModule } from '@ngx-translate/core';
|
|
||||||
import { MatDatepickerInputEvent } from '@angular/material/datepicker';
|
|
||||||
import { startOfDay, endOfDay, isValid, addDays, format } from 'date-fns';
|
|
||||||
|
|
||||||
describe('SearchDateRangeComponent', () => {
|
|
||||||
let fixture: ComponentFixture<SearchDateRangeComponent>;
|
|
||||||
let component: SearchDateRangeComponent;
|
|
||||||
|
|
||||||
const dateFormatFixture = 'dd-MMM-yy';
|
|
||||||
const fromDate = new Date('2016-10-16');
|
|
||||||
const toDate = new Date('2017-10-16');
|
|
||||||
|
|
||||||
beforeEach(() => {
|
|
||||||
TestBed.configureTestingModule({
|
|
||||||
imports: [TranslateModule.forRoot(), ContentTestingModule]
|
|
||||||
});
|
|
||||||
fixture = TestBed.createComponent(SearchDateRangeComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
});
|
|
||||||
|
|
||||||
afterEach(() => fixture.destroy());
|
|
||||||
|
|
||||||
const getFromInput = () => fixture.debugElement.nativeElement.querySelector('[data-automation-id="date-range-from-input"]');
|
|
||||||
const getToInput = () => fixture.debugElement.nativeElement.querySelector('[data-automation-id="date-range-to-input"]');
|
|
||||||
|
|
||||||
it('should setup form elements on init', () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
expect(component.from).toBeDefined();
|
|
||||||
expect(component.to).toBeDefined();
|
|
||||||
expect(component.form).toBeDefined();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should setup form control with formatted valid date on change', () => {
|
|
||||||
component.settings = { field: 'cm:created', dateFormat: dateFormatFixture };
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const date = new Date('20-feb-18');
|
|
||||||
expect(isValid(date)).toBeTrue();
|
|
||||||
|
|
||||||
component.onChangedHandler({ value: date } as MatDatepickerInputEvent<Date>, component.from);
|
|
||||||
expect(component.from.value.toString()).toEqual(date.toString());
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should NOT setup form control with invalid date on change', () => {
|
|
||||||
component.settings = { field: 'cm:created', dateFormat: dateFormatFixture };
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const date = new Date('20.f.18');
|
|
||||||
expect(isValid(date)).toBeFalse();
|
|
||||||
|
|
||||||
component.onChangedHandler({ value: date } as MatDatepickerInputEvent<Date>, component.from);
|
|
||||||
expect(component.from.value).not.toEqual(date);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should reset form', () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
component.form.setValue({ from: fromDate, to: toDate });
|
|
||||||
|
|
||||||
expect(component.from.value).toEqual(fromDate);
|
|
||||||
expect(component.to.value).toEqual(toDate);
|
|
||||||
|
|
||||||
component.reset();
|
|
||||||
|
|
||||||
expect(component.from.value).toBeNull();
|
|
||||||
expect(component.to.value).toBeNull();
|
|
||||||
expect(component.form.value).toEqual({ from: null, to: null });
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should reset fromMaxDate on reset', () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
component.fromMaxDate = fromDate;
|
|
||||||
component.reset();
|
|
||||||
|
|
||||||
expect(component.fromMaxDate).toEqual(undefined);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should update query builder on reset', () => {
|
|
||||||
const context: any = {
|
|
||||||
queryFragments: {
|
|
||||||
createdDateRange: 'query'
|
|
||||||
},
|
|
||||||
update: () => {}
|
|
||||||
};
|
|
||||||
|
|
||||||
component.id = 'createdDateRange';
|
|
||||||
component.context = context;
|
|
||||||
|
|
||||||
spyOn(context, 'update').and.stub();
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
component.reset();
|
|
||||||
|
|
||||||
expect(context.queryFragments.createdDateRange).toEqual('');
|
|
||||||
expect(context.update).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should update query builder on value changes', () => {
|
|
||||||
const context: any = {
|
|
||||||
queryFragments: {},
|
|
||||||
update: () => {}
|
|
||||||
};
|
|
||||||
|
|
||||||
component.id = 'createdDateRange';
|
|
||||||
component.context = context;
|
|
||||||
component.settings = { field: 'cm:created' };
|
|
||||||
|
|
||||||
spyOn(context, 'update').and.stub();
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
component.apply(
|
|
||||||
{
|
|
||||||
from: fromDate,
|
|
||||||
to: toDate
|
|
||||||
},
|
|
||||||
true
|
|
||||||
);
|
|
||||||
|
|
||||||
const startDate = startOfDay(fromDate).toISOString();
|
|
||||||
const endDate = endOfDay(toDate).toISOString();
|
|
||||||
|
|
||||||
const expectedQuery = `cm:created:['${startDate}' TO '${endDate}']`;
|
|
||||||
|
|
||||||
expect(context.queryFragments[component.id]).toEqual(expectedQuery);
|
|
||||||
expect(context.update).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should show date-format error when Invalid found', async () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const input = getFromInput();
|
|
||||||
input.value = '10-f-18';
|
|
||||||
input.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
|
|
||||||
expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.INVALID-DATE');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should hide date-format error when correcting input', async () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const input = getFromInput();
|
|
||||||
input.value = '10-f-18';
|
|
||||||
input.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
|
|
||||||
expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.INVALID-DATE');
|
|
||||||
|
|
||||||
input.value = '10-10-2018';
|
|
||||||
input.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
|
|
||||||
expect(component.getFromValidationMessage()).toEqual('');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should show error for max date constraint', async () => {
|
|
||||||
component.settings = { field: 'cm:created', maxDate: 'today' };
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const input = getFromInput();
|
|
||||||
input.value = format(addDays(new Date(), 1), 'dd-MM-yyyy');
|
|
||||||
input.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
|
|
||||||
expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should show error for required constraint', async () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const fromInput = getFromInput();
|
|
||||||
fromInput.value = '';
|
|
||||||
fromInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
const toInput = getToInput();
|
|
||||||
toInput.value = '';
|
|
||||||
toInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
|
|
||||||
expect(component.getFromValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.REQUIRED-VALUE');
|
|
||||||
expect(component.getToValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.REQUIRED-VALUE');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should show error for incorrect date range', async () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const fromInput = getFromInput();
|
|
||||||
fromInput.value = '11-10-2018';
|
|
||||||
fromInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
const toInput = getToInput();
|
|
||||||
toInput.value = '10-10-2018';
|
|
||||||
toInput.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
|
|
||||||
expect(component.getFromValidationMessage()).toEqual('');
|
|
||||||
expect(component.getToValidationMessage()).toEqual('SEARCH.FILTER.VALIDATION.NO-DAYS');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should not show date-format error when valid found', async () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const input = getFromInput();
|
|
||||||
input.value = '10-10-2018';
|
|
||||||
input.dispatchEvent(new Event('input'));
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
|
|
||||||
expect(component.getFromValidationMessage()).toEqual('');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should have no maximum date by default', async () => {
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
|
|
||||||
expect(component.maxDate).toBeUndefined();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should be able to set a fixed maximum date', async () => {
|
|
||||||
component.settings = { field: 'cm:created', dateFormat: dateFormatFixture, maxDate: '10-Mar-20' };
|
|
||||||
fixture.detectChanges();
|
|
||||||
|
|
||||||
const expected = endOfDay(new Date(2020, 2, 10));
|
|
||||||
expect(component.maxDate).toEqual(expected);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should be able to set the maximum date to today', async () => {
|
|
||||||
component.settings = { field: 'cm:created', dateFormat: dateFormatFixture, maxDate: 'today' };
|
|
||||||
fixture.detectChanges();
|
|
||||||
const today = endOfDay(new Date());
|
|
||||||
|
|
||||||
expect(component.maxDate).toEqual(today);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,240 +0,0 @@
|
|||||||
/*!
|
|
||||||
* @license
|
|
||||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
|
||||||
*
|
|
||||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
||||||
* you may not use this file except in compliance with the License.
|
|
||||||
* You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing, software
|
|
||||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
* See the License for the specific language governing permissions and
|
|
||||||
* limitations under the License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
|
|
||||||
import { FormControl, FormGroup, Validators } from '@angular/forms';
|
|
||||||
import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
|
|
||||||
import { ADF_DATE_FORMATS, AdfDateFnsAdapter } from '@alfresco/adf-core';
|
|
||||||
import { SearchWidget } from '../../models/search-widget.interface';
|
|
||||||
import { SearchWidgetSettings } from '../../models/search-widget-settings.interface';
|
|
||||||
import { SearchQueryBuilderService } from '../../services/search-query-builder.service';
|
|
||||||
import { LiveErrorStateMatcher } from '../../forms/live-error-state-matcher';
|
|
||||||
import { Subject } from 'rxjs';
|
|
||||||
import { MatDatepickerInputEvent } from '@angular/material/datepicker';
|
|
||||||
import { startOfDay, endOfDay, isBefore, isValid as isValidDate } from 'date-fns';
|
|
||||||
|
|
||||||
export interface DateRangeValue {
|
|
||||||
from: string;
|
|
||||||
to: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
const DEFAULT_FORMAT_DATE: string = 'DD/MM/YYYY';
|
|
||||||
|
|
||||||
interface DateRangeForm {
|
|
||||||
from: FormControl<Date>;
|
|
||||||
to: FormControl<Date>;
|
|
||||||
}
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'adf-search-date-range',
|
|
||||||
templateUrl: './search-date-range.component.html',
|
|
||||||
styleUrls: ['./search-date-range.component.scss'],
|
|
||||||
providers: [
|
|
||||||
{ provide: MAT_DATE_FORMATS, useValue: ADF_DATE_FORMATS },
|
|
||||||
{ provide: DateAdapter, useClass: AdfDateFnsAdapter }
|
|
||||||
],
|
|
||||||
encapsulation: ViewEncapsulation.None,
|
|
||||||
host: { class: 'adf-search-date-range' }
|
|
||||||
})
|
|
||||||
export class SearchDateRangeComponent implements SearchWidget, OnInit {
|
|
||||||
from: FormControl<Date>;
|
|
||||||
to: FormControl<Date>;
|
|
||||||
|
|
||||||
form: FormGroup<DateRangeForm>;
|
|
||||||
matcher = new LiveErrorStateMatcher();
|
|
||||||
|
|
||||||
id: string;
|
|
||||||
settings?: SearchWidgetSettings;
|
|
||||||
context?: SearchQueryBuilderService;
|
|
||||||
datePickerFormat: string;
|
|
||||||
maxDate: Date;
|
|
||||||
fromMaxDate: Date;
|
|
||||||
isActive = false;
|
|
||||||
startValue: any;
|
|
||||||
enableChangeUpdate: boolean;
|
|
||||||
displayValue$ = new Subject<string>();
|
|
||||||
|
|
||||||
constructor(private dateAdapter: DateAdapter<Date>) {}
|
|
||||||
|
|
||||||
getFromValidationMessage(): string {
|
|
||||||
return this.from.hasError('invalidOnChange') || this.hasParseError(this.from)
|
|
||||||
? 'SEARCH.FILTER.VALIDATION.INVALID-DATE'
|
|
||||||
: this.from.hasError('matDatepickerMax')
|
|
||||||
? 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE'
|
|
||||||
: this.from.hasError('required')
|
|
||||||
? 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE'
|
|
||||||
: '';
|
|
||||||
}
|
|
||||||
|
|
||||||
getToValidationMessage(): string {
|
|
||||||
return this.to.hasError('invalidOnChange') || this.hasParseError(this.to)
|
|
||||||
? 'SEARCH.FILTER.VALIDATION.INVALID-DATE'
|
|
||||||
: this.to.hasError('matDatepickerMin')
|
|
||||||
? 'SEARCH.FILTER.VALIDATION.NO-DAYS'
|
|
||||||
: this.to.hasError('matDatepickerMax')
|
|
||||||
? 'SEARCH.FILTER.VALIDATION.BEYOND-MAX-DATE'
|
|
||||||
: this.to.hasError('required')
|
|
||||||
? 'SEARCH.FILTER.VALIDATION.REQUIRED-VALUE'
|
|
||||||
: '';
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.datePickerFormat = this.settings?.dateFormat ? this.settings.dateFormat : DEFAULT_FORMAT_DATE;
|
|
||||||
|
|
||||||
const customDateAdapter = this.dateAdapter as AdfDateFnsAdapter;
|
|
||||||
customDateAdapter.displayFormat = this.datePickerFormat;
|
|
||||||
|
|
||||||
const validators = Validators.compose([Validators.required]);
|
|
||||||
|
|
||||||
if (this.settings?.maxDate) {
|
|
||||||
if (this.settings.maxDate === 'today') {
|
|
||||||
this.maxDate = endOfDay(this.dateAdapter.today());
|
|
||||||
} else {
|
|
||||||
this.maxDate = endOfDay(this.dateAdapter.parse(this.settings.maxDate, this.datePickerFormat));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (this.startValue) {
|
|
||||||
const splitValue = this.startValue.split('||');
|
|
||||||
const fromValue = this.dateAdapter.parse(splitValue[0], this.datePickerFormat);
|
|
||||||
const toValue = this.dateAdapter.parse(splitValue[1], this.datePickerFormat);
|
|
||||||
this.from = new FormControl(fromValue, validators);
|
|
||||||
this.to = new FormControl(toValue, validators);
|
|
||||||
} else {
|
|
||||||
this.from = new FormControl(null, validators);
|
|
||||||
this.to = new FormControl(null, validators);
|
|
||||||
}
|
|
||||||
|
|
||||||
this.form = new FormGroup({
|
|
||||||
from: this.from,
|
|
||||||
to: this.to
|
|
||||||
});
|
|
||||||
|
|
||||||
this.setFromMaxDate();
|
|
||||||
this.enableChangeUpdate = this.settings?.allowUpdateOnChange ?? true;
|
|
||||||
}
|
|
||||||
|
|
||||||
apply(model: Partial<{ from: Date; to: Date }>, isValid: boolean) {
|
|
||||||
if (isValid && this.id && this.context && this.settings && this.settings.field) {
|
|
||||||
this.isActive = true;
|
|
||||||
|
|
||||||
const start = startOfDay(model.from).toISOString();
|
|
||||||
const end = endOfDay(model.to).toISOString();
|
|
||||||
|
|
||||||
this.context.queryFragments[this.id] = `${this.settings.field}:['${start}' TO '${end}']`;
|
|
||||||
|
|
||||||
this.updateDisplayValue();
|
|
||||||
this.context.update();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
submitValues() {
|
|
||||||
this.apply(this.form.value, this.form.valid);
|
|
||||||
}
|
|
||||||
|
|
||||||
hasValidValue(): boolean {
|
|
||||||
return this.form.valid;
|
|
||||||
}
|
|
||||||
|
|
||||||
getCurrentValue(): DateRangeValue {
|
|
||||||
return {
|
|
||||||
from: this.dateAdapter.format(this.form.value.from, this.datePickerFormat),
|
|
||||||
to: this.dateAdapter.format(this.form.value.from, this.datePickerFormat)
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
updateDisplayValue(): void {
|
|
||||||
if (this.form.invalid || this.form.pristine) {
|
|
||||||
this.displayValue$.next('');
|
|
||||||
} else {
|
|
||||||
this.displayValue$.next(
|
|
||||||
`${this.dateAdapter.format(this.form.value.from, this.datePickerFormat)} - ${this.dateAdapter.format(
|
|
||||||
this.form.value.to,
|
|
||||||
this.datePickerFormat
|
|
||||||
)}`
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setValue(parsedDate: string) {
|
|
||||||
const splitValue = parsedDate.split('||');
|
|
||||||
const fromValue = this.dateAdapter.parse(splitValue[0], this.datePickerFormat);
|
|
||||||
const toValue = this.dateAdapter.parse(splitValue[1], this.datePickerFormat);
|
|
||||||
this.from.setValue(fromValue);
|
|
||||||
this.from.markAsDirty();
|
|
||||||
this.from.markAsTouched();
|
|
||||||
this.to.setValue(toValue);
|
|
||||||
this.to.markAsDirty();
|
|
||||||
this.to.markAsTouched();
|
|
||||||
this.submitValues();
|
|
||||||
}
|
|
||||||
|
|
||||||
clear() {
|
|
||||||
this.isActive = false;
|
|
||||||
this.form.reset({
|
|
||||||
from: null,
|
|
||||||
to: null
|
|
||||||
});
|
|
||||||
|
|
||||||
if (this.id && this.context) {
|
|
||||||
this.context.queryFragments[this.id] = '';
|
|
||||||
if (this.enableChangeUpdate) {
|
|
||||||
this.updateQuery();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
this.setFromMaxDate();
|
|
||||||
}
|
|
||||||
|
|
||||||
reset() {
|
|
||||||
this.clear();
|
|
||||||
this.updateQuery();
|
|
||||||
}
|
|
||||||
|
|
||||||
private updateQuery() {
|
|
||||||
if (this.id && this.context) {
|
|
||||||
this.updateDisplayValue();
|
|
||||||
this.context.update();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onChangedHandler(event: MatDatepickerInputEvent<Date>, formControl: FormControl) {
|
|
||||||
const inputValue = event.value;
|
|
||||||
|
|
||||||
if (isValidDate(inputValue)) {
|
|
||||||
formControl.setValue(inputValue);
|
|
||||||
} else if (inputValue) {
|
|
||||||
formControl.setErrors({
|
|
||||||
invalidOnChange: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
this.setFromMaxDate();
|
|
||||||
}
|
|
||||||
|
|
||||||
hasParseError(formControl: FormControl): boolean {
|
|
||||||
return formControl.hasError('matDatepickerParse') && formControl.getError('matDatepickerParse').text;
|
|
||||||
}
|
|
||||||
|
|
||||||
forcePlaceholder(event: any) {
|
|
||||||
event.srcElement.click();
|
|
||||||
}
|
|
||||||
|
|
||||||
setFromMaxDate() {
|
|
||||||
this.fromMaxDate = !this.to.value || (this.maxDate && isBefore(this.maxDate, this.to.value)) ? this.maxDate : this.to.value;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -47,7 +47,6 @@ export * from './components/search.component';
|
|||||||
export * from './components/search-panel/search-panel.component';
|
export * from './components/search-panel/search-panel.component';
|
||||||
export * from './components/search-check-list/search-check-list.component';
|
export * from './components/search-check-list/search-check-list.component';
|
||||||
export * from './components/search-chip-list/search-chip-list.component';
|
export * from './components/search-chip-list/search-chip-list.component';
|
||||||
export * from './components/search-date-range/search-date-range.component';
|
|
||||||
export * from './components/search-filter/search-filter.component';
|
export * from './components/search-filter/search-filter.component';
|
||||||
export * from './components/search-filter-container/search-filter-container.component';
|
export * from './components/search-filter-container/search-filter-container.component';
|
||||||
export * from './components/search-number-range/search-number-range.component';
|
export * from './components/search-number-range/search-number-range.component';
|
||||||
@ -63,7 +62,8 @@ export * from './components/search-filter-chips/search-filter-chips.component';
|
|||||||
export * from './components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component';
|
export * from './components/search-filter-chips/search-filter-menu-card/search-filter-menu-card.component';
|
||||||
export * from './components/search-facet-field/search-facet-field.component';
|
export * from './components/search-facet-field/search-facet-field.component';
|
||||||
export * from './components/search-logical-filter/search-logical-filter.component';
|
export * from './components/search-logical-filter/search-logical-filter.component';
|
||||||
export * from './components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component';
|
export * from './components/search-date-range-tabbed/search-date-range/search-date-range.component';
|
||||||
|
export * from './components/search-date-range-tabbed/search-date-range-tabbed.component';
|
||||||
export * from './components/search-filter-tabbed/search-filter-tabbed.component';
|
export * from './components/search-filter-tabbed/search-filter-tabbed.component';
|
||||||
export * from './components/reset-search.directive';
|
export * from './components/reset-search.directive';
|
||||||
export * from './components/search-chip-autocomplete-input/search-chip-autocomplete-input.component';
|
export * from './components/search-chip-autocomplete-input/search-chip-autocomplete-input.component';
|
||||||
|
|||||||
@ -37,7 +37,6 @@ import { SearchSliderComponent } from './components/search-slider/search-slider.
|
|||||||
import { SearchNumberRangeComponent } from './components/search-number-range/search-number-range.component';
|
import { SearchNumberRangeComponent } from './components/search-number-range/search-number-range.component';
|
||||||
import { SearchPanelComponent } from './components/search-panel/search-panel.component';
|
import { SearchPanelComponent } from './components/search-panel/search-panel.component';
|
||||||
import { SearchCheckListComponent } from './components/search-check-list/search-check-list.component';
|
import { SearchCheckListComponent } from './components/search-check-list/search-check-list.component';
|
||||||
import { SearchDateRangeComponent } from './components/search-date-range/search-date-range.component';
|
|
||||||
import { SearchSortingPickerComponent } from './components/search-sorting-picker/search-sorting-picker.component';
|
import { SearchSortingPickerComponent } from './components/search-sorting-picker/search-sorting-picker.component';
|
||||||
import { SEARCH_QUERY_SERVICE_TOKEN } from './search-query-service.token';
|
import { SEARCH_QUERY_SERVICE_TOKEN } from './search-query-service.token';
|
||||||
import { SearchQueryBuilderService } from './services/search-query-builder.service';
|
import { SearchQueryBuilderService } from './services/search-query-builder.service';
|
||||||
@ -53,8 +52,8 @@ import { SearchLogicalFilterComponent } from './components/search-logical-filter
|
|||||||
import { ResetSearchDirective } from './components/reset-search.directive';
|
import { ResetSearchDirective } from './components/reset-search.directive';
|
||||||
import { SearchPropertiesComponent } from './components/search-properties/search-properties.component';
|
import { SearchPropertiesComponent } from './components/search-properties/search-properties.component';
|
||||||
import { SearchFilterTabbedComponent } from './components/search-filter-tabbed/search-filter-tabbed.component';
|
import { SearchFilterTabbedComponent } from './components/search-filter-tabbed/search-filter-tabbed.component';
|
||||||
import { SearchDateRangeAdvancedComponent } from './components/search-date-range-advanced-tabbed/search-date-range-advanced/search-date-range-advanced.component';
|
import { SearchDateRangeComponent } from './components/search-date-range-tabbed/search-date-range/search-date-range.component';
|
||||||
import { SearchDateRangeAdvancedTabbedComponent } from './components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component';
|
import { SearchDateRangeTabbedComponent } from './components/search-date-range-tabbed/search-date-range-tabbed.component';
|
||||||
import { SearchFilterTabDirective } from './components/search-filter-tabbed/search-filter-tab.directive';
|
import { SearchFilterTabDirective } from './components/search-filter-tabbed/search-filter-tab.directive';
|
||||||
import { SearchFacetChipTabbedComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component';
|
import { SearchFacetChipTabbedComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-chip-tabbed.component';
|
||||||
import { SearchFacetTabbedContentComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-tabbed-content.component';
|
import { SearchFacetTabbedContentComponent } from './components/search-filter-chips/search-facet-chip-tabbed/search-facet-tabbed-content.component';
|
||||||
@ -84,7 +83,6 @@ import { SearchFacetTabbedContentComponent } from './components/search-filter-ch
|
|||||||
SearchNumberRangeComponent,
|
SearchNumberRangeComponent,
|
||||||
SearchPanelComponent,
|
SearchPanelComponent,
|
||||||
SearchCheckListComponent,
|
SearchCheckListComponent,
|
||||||
SearchDateRangeComponent,
|
|
||||||
SearchDatetimeRangeComponent,
|
SearchDatetimeRangeComponent,
|
||||||
SearchSortingPickerComponent,
|
SearchSortingPickerComponent,
|
||||||
SearchFilterContainerComponent,
|
SearchFilterContainerComponent,
|
||||||
@ -98,8 +96,8 @@ import { SearchFacetTabbedContentComponent } from './components/search-filter-ch
|
|||||||
ResetSearchDirective,
|
ResetSearchDirective,
|
||||||
SearchPropertiesComponent,
|
SearchPropertiesComponent,
|
||||||
SearchFilterTabbedComponent,
|
SearchFilterTabbedComponent,
|
||||||
SearchDateRangeAdvancedComponent,
|
SearchDateRangeComponent,
|
||||||
SearchDateRangeAdvancedTabbedComponent,
|
SearchDateRangeTabbedComponent,
|
||||||
SearchFilterTabDirective,
|
SearchFilterTabDirective,
|
||||||
SearchFacetChipTabbedComponent,
|
SearchFacetChipTabbedComponent,
|
||||||
SearchFacetTabbedContentComponent
|
SearchFacetTabbedContentComponent
|
||||||
@ -119,7 +117,6 @@ import { SearchFacetTabbedContentComponent } from './components/search-filter-ch
|
|||||||
SearchNumberRangeComponent,
|
SearchNumberRangeComponent,
|
||||||
SearchPanelComponent,
|
SearchPanelComponent,
|
||||||
SearchCheckListComponent,
|
SearchCheckListComponent,
|
||||||
SearchDateRangeComponent,
|
|
||||||
SearchDatetimeRangeComponent,
|
SearchDatetimeRangeComponent,
|
||||||
SearchSortingPickerComponent,
|
SearchSortingPickerComponent,
|
||||||
SearchFilterContainerComponent,
|
SearchFilterContainerComponent,
|
||||||
@ -129,7 +126,8 @@ import { SearchFacetTabbedContentComponent } from './components/search-filter-ch
|
|||||||
SearchFacetFieldComponent,
|
SearchFacetFieldComponent,
|
||||||
SearchLogicalFilterComponent,
|
SearchLogicalFilterComponent,
|
||||||
SearchFilterTabbedComponent,
|
SearchFilterTabbedComponent,
|
||||||
SearchDateRangeAdvancedComponent,
|
SearchDateRangeComponent,
|
||||||
|
SearchDateRangeTabbedComponent,
|
||||||
ResetSearchDirective,
|
ResetSearchDirective,
|
||||||
SearchFacetChipTabbedComponent,
|
SearchFacetChipTabbedComponent,
|
||||||
SearchFacetTabbedContentComponent
|
SearchFacetTabbedContentComponent
|
||||||
|
|||||||
@ -21,14 +21,11 @@ import { SearchRadioComponent } from '../components/search-radio/search-radio.co
|
|||||||
import { SearchSliderComponent } from '../components/search-slider/search-slider.component';
|
import { SearchSliderComponent } from '../components/search-slider/search-slider.component';
|
||||||
import { SearchNumberRangeComponent } from '../components/search-number-range/search-number-range.component';
|
import { SearchNumberRangeComponent } from '../components/search-number-range/search-number-range.component';
|
||||||
import { SearchCheckListComponent } from '../components/search-check-list/search-check-list.component';
|
import { SearchCheckListComponent } from '../components/search-check-list/search-check-list.component';
|
||||||
import { SearchDateRangeComponent } from '../components/search-date-range/search-date-range.component';
|
|
||||||
import { SearchDatetimeRangeComponent } from '../components/search-datetime-range/search-datetime-range.component';
|
import { SearchDatetimeRangeComponent } from '../components/search-datetime-range/search-datetime-range.component';
|
||||||
import { SearchLogicalFilterComponent } from '../components/search-logical-filter/search-logical-filter.component';
|
import { SearchLogicalFilterComponent } from '../components/search-logical-filter/search-logical-filter.component';
|
||||||
import { SearchFilterAutocompleteChipsComponent } from '../components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component';
|
import { SearchFilterAutocompleteChipsComponent } from '../components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component';
|
||||||
import { SearchPropertiesComponent } from '../components/search-properties/search-properties.component';
|
import { SearchPropertiesComponent } from '../components/search-properties/search-properties.component';
|
||||||
import {
|
import { SearchDateRangeTabbedComponent } from '../components/search-date-range-tabbed/search-date-range-tabbed.component';
|
||||||
SearchDateRangeAdvancedTabbedComponent
|
|
||||||
} from '../components/search-date-range-advanced-tabbed/search-date-range-advanced-tabbed.component';
|
|
||||||
|
|
||||||
@Injectable({
|
@Injectable({
|
||||||
providedIn: 'root'
|
providedIn: 'root'
|
||||||
@ -45,11 +42,10 @@ export class SearchFilterService {
|
|||||||
properties: SearchPropertiesComponent,
|
properties: SearchPropertiesComponent,
|
||||||
'number-range': SearchNumberRangeComponent,
|
'number-range': SearchNumberRangeComponent,
|
||||||
'check-list': SearchCheckListComponent,
|
'check-list': SearchCheckListComponent,
|
||||||
'date-range': SearchDateRangeComponent,
|
|
||||||
'datetime-range': SearchDatetimeRangeComponent,
|
'datetime-range': SearchDatetimeRangeComponent,
|
||||||
'logical-filter': SearchLogicalFilterComponent,
|
'logical-filter': SearchLogicalFilterComponent,
|
||||||
'autocomplete-chips': SearchFilterAutocompleteChipsComponent,
|
'autocomplete-chips': SearchFilterAutocompleteChipsComponent,
|
||||||
'date-range-advanced': SearchDateRangeAdvancedTabbedComponent
|
'date-range': SearchDateRangeTabbedComponent
|
||||||
};
|
};
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,141 +0,0 @@
|
|||||||
/*!
|
|
||||||
* @license
|
|
||||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
|
||||||
*
|
|
||||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
||||||
* you may not use this file except in compliance with the License.
|
|
||||||
* You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing, software
|
|
||||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
||||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
||||||
* See the License for the specific language governing permissions and
|
|
||||||
* limitations under the License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
import { protractor, ElementFinder, $ } from 'protractor';
|
|
||||||
import { DatePickerCalendarPage } from '../../../core/pages/material/date-picker-calendar.page';
|
|
||||||
import { BrowserVisibility } from '../../../core/utils/browser-visibility';
|
|
||||||
import { BrowserActions } from '../../../core/utils/browser-actions';
|
|
||||||
|
|
||||||
export class DateRangeFilterPage {
|
|
||||||
fromField = '[data-automation-id="date-range-from-input"]';
|
|
||||||
fromDateToggle = '[data-automation-id="date-range-from-date-toggle"]';
|
|
||||||
toField = '[data-automation-id="date-range-to-input"]';
|
|
||||||
toDateToggle = '[data-automation-id="date-range-to-date-toggle"]';
|
|
||||||
applyButton = '[data-automation-id="date-range-apply-btn"]';
|
|
||||||
clearButton = '[data-automation-id="date-range-clear-btn"]';
|
|
||||||
fromErrorMessage = '[data-automation-id="date-range-from-error"]';
|
|
||||||
toErrorMessage = '[data-automation-id="date-range-to-error"]';
|
|
||||||
filter: ElementFinder;
|
|
||||||
|
|
||||||
constructor(filter: ElementFinder) {
|
|
||||||
this.filter = filter;
|
|
||||||
}
|
|
||||||
|
|
||||||
async getFromDate(): Promise<string> {
|
|
||||||
return BrowserActions.getInputValue(this.filter.$(this.fromField));
|
|
||||||
}
|
|
||||||
|
|
||||||
async putFromDate(date): Promise<void> {
|
|
||||||
await this.checkFromFieldIsDisplayed();
|
|
||||||
await BrowserActions.clearSendKeys(this.filter.$(this.fromField), date);
|
|
||||||
await this.filter.$(this.fromField).sendKeys(protractor.Key.ENTER);
|
|
||||||
}
|
|
||||||
|
|
||||||
async getFromCalendarSelectedDate(): Promise<string> {
|
|
||||||
const datePicker = await this.openFromDatePicker();
|
|
||||||
const selectedDate = await datePicker.getSelectedDate();
|
|
||||||
await datePicker.closeDatePicker();
|
|
||||||
return selectedDate;
|
|
||||||
}
|
|
||||||
|
|
||||||
async openFromDatePicker(): Promise<DatePickerCalendarPage> {
|
|
||||||
await BrowserActions.click(this.filter.$(this.fromDateToggle));
|
|
||||||
|
|
||||||
const datePicker = new DatePickerCalendarPage();
|
|
||||||
await datePicker.checkDatePickerIsDisplayed();
|
|
||||||
return datePicker;
|
|
||||||
}
|
|
||||||
|
|
||||||
async openToDatePicker(): Promise<DatePickerCalendarPage> {
|
|
||||||
await BrowserActions.click(this.filter.$(this.toDateToggle));
|
|
||||||
const datePicker = new DatePickerCalendarPage();
|
|
||||||
await datePicker.checkDatePickerIsDisplayed();
|
|
||||||
return datePicker;
|
|
||||||
}
|
|
||||||
|
|
||||||
async clickFromField(): Promise<void> {
|
|
||||||
await BrowserActions.click(this.filter.$(this.fromField));
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkFromErrorMessageIsDisplayed(msg: string): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.fromErrorMessage));
|
|
||||||
const text = await BrowserActions.getText(this.filter.$(this.fromErrorMessage));
|
|
||||||
await expect(text).toEqual(msg);
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkFromErrorMessageIsNotDisplayed(): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsNotVisible(this.filter.$(this.fromErrorMessage));
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkFromFieldIsDisplayed(): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.fromField));
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkFromDateToggleIsDisplayed(): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.fromDateToggle));
|
|
||||||
}
|
|
||||||
|
|
||||||
async getToDate(): Promise<string> {
|
|
||||||
return BrowserActions.getInputValue(this.filter.$(this.toField));
|
|
||||||
}
|
|
||||||
|
|
||||||
async putToDate(date): Promise<void> {
|
|
||||||
await this.checkToFieldIsDisplayed();
|
|
||||||
await BrowserActions.clearSendKeys($(this.toField), date);
|
|
||||||
await this.filter.$(this.toField).sendKeys(protractor.Key.ENTER);
|
|
||||||
}
|
|
||||||
|
|
||||||
async clickToField(): Promise<void> {
|
|
||||||
await BrowserActions.click(this.filter.$(this.toField));
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkToErrorMessageIsDisplayed(msg): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.toErrorMessage));
|
|
||||||
const text = await BrowserActions.getText(this.filter.$(this.toErrorMessage));
|
|
||||||
await expect(text).toEqual(msg);
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkToFieldIsDisplayed(): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.toField));
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkToDateToggleIsDisplayed(): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.toDateToggle));
|
|
||||||
}
|
|
||||||
|
|
||||||
async clickApplyButton(): Promise<void> {
|
|
||||||
await BrowserActions.click(this.filter.$(this.applyButton));
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkApplyButtonIsDisplayed(): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.applyButton));
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkApplyButtonIsEnabled(): Promise<void> {
|
|
||||||
const isEnabled = await this.filter.$(this.applyButton).isEnabled();
|
|
||||||
await expect(isEnabled).toBe(true);
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkApplyButtonIsDisabled(): Promise<void> {
|
|
||||||
const isEnabled = await this.filter.$(this.applyButton).isEnabled();
|
|
||||||
await expect(isEnabled).toBe(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
async checkClearButtonIsDisplayed(): Promise<void> {
|
|
||||||
await BrowserVisibility.waitUntilElementIsVisible(this.filter.$(this.clearButton));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -16,7 +16,6 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
export * from './search-categories.page';
|
export * from './search-categories.page';
|
||||||
export * from './date-range-filter.page';
|
|
||||||
export * from './number-range-filter.page';
|
export * from './number-range-filter.page';
|
||||||
export * from './search-check-list.page';
|
export * from './search-check-list.page';
|
||||||
export * from './search-radio.page';
|
export * from './search-radio.page';
|
||||||
|
|||||||
@ -19,7 +19,6 @@ import { ElementFinder } from 'protractor';
|
|||||||
import { SearchTextPage } from './search-text.page';
|
import { SearchTextPage } from './search-text.page';
|
||||||
import { SearchCheckListPage } from './search-check-list.page';
|
import { SearchCheckListPage } from './search-check-list.page';
|
||||||
import { SearchRadioPage } from './search-radio.page';
|
import { SearchRadioPage } from './search-radio.page';
|
||||||
import { DateRangeFilterPage } from './date-range-filter.page';
|
|
||||||
import { NumberRangeFilterPage } from './number-range-filter.page';
|
import { NumberRangeFilterPage } from './number-range-filter.page';
|
||||||
import { SearchSliderPage } from './search-slider.page';
|
import { SearchSliderPage } from './search-slider.page';
|
||||||
import { BrowserActions } from '../../../core/utils/browser-actions';
|
import { BrowserActions } from '../../../core/utils/browser-actions';
|
||||||
@ -39,10 +38,6 @@ export class SearchCategoriesPage {
|
|||||||
return new SearchRadioPage(filter);
|
return new SearchRadioPage(filter);
|
||||||
}
|
}
|
||||||
|
|
||||||
static dateRangeFilter(filter: ElementFinder): DateRangeFilterPage {
|
|
||||||
return new DateRangeFilterPage(filter);
|
|
||||||
}
|
|
||||||
|
|
||||||
static numberRangeFilter(filter: ElementFinder): NumberRangeFilterPage {
|
static numberRangeFilter(filter: ElementFinder): NumberRangeFilterPage {
|
||||||
return new NumberRangeFilterPage(filter);
|
return new NumberRangeFilterPage(filter);
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user