mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
[ACA-4486] docs update (#7146)
* [ACA-4486] docs update * * [ci:force] rename see also section * [ci:force] settings and migrate step added * settings and migrate step added * [ci:force] minor corrections
This commit is contained in:
Dharan
GitHub
parent
d93980d1a3
commit
bbc2701df2
@ -601,7 +601,26 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
"categories": [],
|
||||
"categories": [
|
||||
{
|
||||
"id": "contentSize",
|
||||
"name": "Content Size",
|
||||
"enabled": true,
|
||||
"component": {
|
||||
"selector": "slider",
|
||||
"settings": {
|
||||
"allowUpdateOnChange": false,
|
||||
"hideDefaultAction": true,
|
||||
"unit": "Byte",
|
||||
"field": "cm:content.size",
|
||||
"min": 0,
|
||||
"max": 18,
|
||||
"step": 1,
|
||||
"thumbLabel": true
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
"highlight": {
|
||||
"prefix": " ",
|
||||
"postfix": " ",
|
||||
|
||||
@ -73,6 +73,8 @@ items in the list.
|
||||
|
||||
## 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 date range component](search-date-range.component.md)
|
||||
- [Search number range component](search-number-range.component.md)
|
||||
|
||||
@ -14,8 +14,8 @@ Displays search criteria as a set of "chips".
|
||||
## Basic usage
|
||||
|
||||
```html
|
||||
<adf-search-chip-list [searchFilter]="searchFilter"></adf-search-chip-list>
|
||||
<adf-search-filter #searchFilter></adf-search-filter>
|
||||
<adf-search-chip-list></adf-search-chip-list>
|
||||
<adf-search-filter></adf-search-filter>
|
||||
```
|
||||
|
||||
## Class members
|
||||
@ -25,4 +25,4 @@ Displays search criteria as a set of "chips".
|
||||
| Name | Type | Default value | Description |
|
||||
| ---- | ---- | ------------- | ----------- |
|
||||
| clearAll | `boolean` | false | Flag used to enable the display of a clear-all-filters button. |
|
||||
| searchFilter | [`SearchFilterComponent`](../../content-services/components/search-filter.component.md) | | Search filter to supply the data for the chips. |
|
||||
| searchFilter | [`SearchFilterComponent`](../../content-services/components/search-filter.component.md) | | Search filter to supply the data for the chips. Not required from 4.5.0 and later versions |
|
||||
|
||||
@ -78,6 +78,8 @@ in the `dateFormat` and in the `maxDate` setting:
|
||||
|
||||
## 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)
|
||||
|
||||
@ -19,6 +19,8 @@ Represents a chip based container component for custom search and faceted search
|
||||
- [Basic usage](#basic-usage)
|
||||
- [Properties](#properties)
|
||||
- [Details](#details)
|
||||
- [Widget setting for chip layout](#widget-setting-for-chip-layout)
|
||||
- [Migrate from expansion card layout](#migrate-from-expansion-card-layout)
|
||||
- [See also](#see-also)
|
||||
|
||||
## Basic usage
|
||||
@ -35,18 +37,43 @@ Represents a chip based container component for custom search and faceted search
|
||||
|
||||
## Details
|
||||
|
||||
This component is chip based layout for searching. it just alternate component for [expanded panel search filter](./search-filter.component.md)
|
||||
The component creates chip based widgets dynamically from default/selected search configuration. It uses [Search Query Builder service](../services/search-query-builder.service.md) to build and execute the query.
|
||||
|
||||
You may find it useful to check out the following resources for background information
|
||||
before customizing the search UI:
|
||||
|
||||
- [Search API](https://docs.alfresco.com/5.2/concepts/search-api.html)
|
||||
- [Alfresco Full Text Search Reference](https://docs.alfresco.com/5.2/concepts/rm-searchsyntax-intro.html)
|
||||
- [ACS API Explorer](https://api-explorer.alfresco.com/api-explorer/#!/search/search)
|
||||
### Widget setting for chip layout
|
||||
Configured widgets(`categories, facetQueries, facetIntervals, facetFields`) should have following setting for smooth interaction.
|
||||
```json
|
||||
{
|
||||
...
|
||||
"settings": {
|
||||
"allowUpdateOnChange": false,
|
||||
"hideDefaultAction": true,
|
||||
...
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Migrate from expansion card layout
|
||||
Here are the steps to move from expansion layout to chip layout
|
||||
1. Use this component to render the new layout ```<adf-search-filter-chips></adf-search-filter-chips>```
|
||||
2. Add the following settings to old configured widgets(`categories, facetQueries, facetIntervals, facetFields`) i.e
|
||||
```json
|
||||
{
|
||||
...
|
||||
"settings": {
|
||||
"allowUpdateOnChange": false,
|
||||
"hideDefaultAction": true,
|
||||
...
|
||||
}
|
||||
|
||||
}
|
||||
```
|
||||
here is the [example configuration](https://github.com/Alfresco/alfresco-ng2-components/blob/develop/demo-shell/src/app.config.json#L373)
|
||||
|
||||
|
||||
## See also
|
||||
|
||||
- [Search Filter Component](./search-filter.component.md)
|
||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
||||
- [Search Query Builder service](../services/search-query-builder.service.md)
|
||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||
- [Search check list component](search-check-list.component.md)
|
||||
|
||||
@ -14,14 +14,6 @@ Represents a main container component for custom search and faceted search setti
|
||||
- [Basic usage](#basic-usage)
|
||||
- [Properties](#properties)
|
||||
- [Details](#details)
|
||||
- [Configuration](#configuration)
|
||||
- [Extra fields and filter queries](#extra-fields-and-filter-queries)
|
||||
- [Sorting](#sorting)
|
||||
- [Categories and widgets](#categories-and-widgets)
|
||||
- [Facet Fields](#facet-fields)
|
||||
- [Facet Queries](#facet-queries)
|
||||
- [Facet Intervals](#facet-intervals)
|
||||
- [Highlight](#highlight)
|
||||
- [See also](#see-also)
|
||||
|
||||
## Basic usage
|
||||
@ -38,458 +30,15 @@ Represents a main container component for custom search and faceted search setti
|
||||
|
||||
## Details
|
||||
|
||||
The component UI uses dynamically created widgets to specify the search query and its
|
||||
The component UI uses dynamically created expansion card widgets to specify the search query and its
|
||||
options. It then uses the [Search Query Builder service](../services/search-query-builder.service.md)
|
||||
to build and execute the query.
|
||||
|
||||
You may find it useful to check out the following resources for background information
|
||||
before customizing the search UI:
|
||||
|
||||
- [Search API](https://docs.alfresco.com/5.2/concepts/search-api.html)
|
||||
- [Alfresco Full Text Search Reference](https://docs.alfresco.com/5.2/concepts/rm-searchsyntax-intro.html)
|
||||
- [ACS API Explorer](https://api-explorer.alfresco.com/api-explorer/#!/search/search)
|
||||
|
||||
### Configuration
|
||||
|
||||
You can configure the component using the `search` entry in the `app.config.json` file.
|
||||
A typical configuration is shown below:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"sorting": {
|
||||
"options": [
|
||||
{ "key": "name", "label": "Name", "type": "FIELD", "field": "cm:name", "ascending": true },
|
||||
{ "key": "content.sizeInBytes", "label": "Size", "type": "FIELD", "field": "content.size", "ascending": true },
|
||||
{ "key": "description", "label": "Description", "type": "FIELD", "field": "cm:description", "ascending": true }
|
||||
],
|
||||
"defaults": [
|
||||
{ "key": "name", "type": "FIELD", "field": "cm:name", "ascending": true }
|
||||
]
|
||||
},
|
||||
"filterQueries": [
|
||||
{ "query": "TYPE:'cm:folder' OR TYPE:'cm:content'" },
|
||||
{ "query": "NOT cm:creator:System" }
|
||||
],
|
||||
"facetFields": {
|
||||
"expanded": true,
|
||||
"fields": [
|
||||
{ "field": "content.mimetype", "mincount": 1, "label": "Type" },
|
||||
{ "field": "content.size", "mincount": 1, "label": "File Size" },
|
||||
{ "field": "creator", "mincount": 1, "label": "Creator" },
|
||||
{ "field": "modifier", "mincount": 1, "label": "Modifier" }
|
||||
]
|
||||
},
|
||||
"facetQueries": {
|
||||
"label": "My facet queries",
|
||||
"pageSize": 4,
|
||||
"queries": [
|
||||
{ "query": "created:2018", "label": "Created This Year" },
|
||||
{ "query": "content.mimetype:text/html", "label": "Type: HTML" },
|
||||
{ "query": "content.size:[0 TO 10240]", "label": "Size: xtra small"},
|
||||
{ "query": "content.size:[10240 TO 102400]", "label": "Size: small"},
|
||||
{ "query": "content.size:[102400 TO 1048576]", "label": "Size: medium" },
|
||||
{ "query": "content.size:[1048576 TO 16777216]", "label": "Size: large" },
|
||||
{ "query": "content.size:[16777216 TO 134217728]", "label": "Size: xtra large" },
|
||||
{ "query": "content.size:[134217728 TO MAX]", "label": "Size: XX large" }
|
||||
]
|
||||
},
|
||||
"categories": [
|
||||
{
|
||||
"id": "queryName",
|
||||
"name": "Name",
|
||||
"enabled": true,
|
||||
"expanded": true,
|
||||
"component": {
|
||||
"selector": "adf-search-text",
|
||||
"settings": {
|
||||
"pattern": "cm:name:'(.*?)'",
|
||||
"field": "cm:name",
|
||||
"placeholder": "Enter the name"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The
|
||||
[schema.json](https://github.com/Alfresco/alfresco-ng2-components/blob/master/lib/core/app-config/schema.json)
|
||||
file for the app config has further details about available settings, values and formats for
|
||||
the configuration options.
|
||||
|
||||
### Extra fields and filter queries
|
||||
|
||||
You can explicitly define the `include` section for the query from within the application configuration file. This array is a list of extra data fields to be added to the search
|
||||
results:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"include": ["path", "allowableOperations"]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
You can choose to filter facet field results using 'contains' instead of 'starts with', by using the `filterWithContains` boolean (default is `false`):
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"filterWithContains": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
You can choose to display a reset button by setting the 'resetButton' value to true.
|
||||
This 'clean up' button would make it easier for the final user to remove all bucket selections and all search filtering.
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"resetButton": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
You can also provide a set of queries that are always executed alongside the user-defined
|
||||
settings:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"filterQueries": [
|
||||
{ "query": "TYPE:'cm:folder' OR TYPE:'cm:content'" },
|
||||
{ "query": "NOT cm:creator:System" }
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Note that the entries of the `filterQueries` array are joined using the `AND` operator.
|
||||
|
||||
### Sorting
|
||||
|
||||
The Sorting configuration section consists of two blocks:
|
||||
|
||||
- `options`: a list of items that users can select from
|
||||
- `defaults`: predefined sorting to use by default
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"sorting": {
|
||||
"options": [
|
||||
{ "key": "name", "label": "Name", "type": "FIELD", "field": "cm:name", "ascending": true },
|
||||
{ "key": "content.sizeInBytes", "label": "Size", "type": "FIELD", "field": "content.size", "ascending": true },
|
||||
{ "key": "description", "label": "Description", "type": "FIELD", "field": "cm:description", "ascending": true }
|
||||
],
|
||||
"defaults": [
|
||||
{ "key": "name", "type": "FIELD", "field": "cm:name", "ascending": true }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The properties of the `options` objects are as follows:
|
||||
|
||||
| Name | Type | Description |
|
||||
| ---- | ---- | ----------- |
|
||||
| key | string | Unique key to identify the entry. This can also be used to map [`DataColumn`](../../../lib/core/datatable/data/data-column.model.ts) instances. |
|
||||
| label | string | Display text, which can also be an [i18n resource key](../../user-guide/internationalization.md). |
|
||||
| type | string | This specifies how to order the results. It can be based on a field, based on the position of the document in the index, or by score/relevance. |
|
||||
| field | string | The name of the field. |
|
||||
| ascending | boolean | The sorting order defined as `true` for ascending order and `false` for descending order |
|
||||
|
||||
See the [Sort](https://docs.alfresco.com/5.2/concepts/search-api-sort.html)
|
||||
element in the [ACS Search API](https://docs.alfresco.com/5.2/concepts/search-api.html)
|
||||
for further details.
|
||||
|
||||
### Categories and widgets
|
||||
|
||||
The Search Settings component and Query Builder require a `categories` section in the
|
||||
configuration.
|
||||
|
||||
Categories are used to configure the UI widgets that let the user edit the search query
|
||||
at runtime. Every category is represented by a single Angular component, which can be
|
||||
either a simple one or a composite one.
|
||||
|
||||
```ts
|
||||
export interface SearchCategory {
|
||||
id: string;
|
||||
name: string;
|
||||
enabled: boolean;
|
||||
expanded: boolean;
|
||||
component: {
|
||||
selector: string;
|
||||
settings: SearchWidgetSettings;
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
The interface above also describes entries in the `search.query.categories` section for the `app.config.json` file.
|
||||
|
||||
|
||||
|
||||
> **Note:** you must provide at least one category field in order to execute the query,
|
||||
> so that filters and selected facets are applied.
|
||||
|
||||
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/testing/src/lib/core/pages/form/widgets/widget.ts) is used for
|
||||
a category:
|
||||
|
||||
| [`Widget`](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) name | Selector | Description |
|
||||
| ------------------------------------------------------------------------------- | -------- | ----------- |
|
||||
| [Check List](search-check-list.component.md) | `check-list` | Toggles individual query fragments for the search |
|
||||
| [Date Range](search-date-range.component.md) | `date-range` | Specifies a range f dates that a field may contain |
|
||||
| [Number Range](search-number-range.component.md) | `number-range` | Specifies a range of numeric values that a field may contain |
|
||||
| [Radio List](search-radio.component.md) | `radio` | Selects one query fragment from a list of options |
|
||||
| [Slider](search-slider.component.md) | `slider` | Selects a single numeric value in a given range that a field may contain |
|
||||
| [Text](search-text.component.md) | `text` | Specifies a text value that a field may contain |
|
||||
|
||||
See the individual [Search Widget](../interfaces/search-widget.interface.md) pages for full details of their usage and settings.
|
||||
|
||||
You can also implement your own custom search widgets. See the [Search Widget Interface](../interfaces/search-widget.interface.md) interface
|
||||
page for full details of how to do this.
|
||||
|
||||
#### Widget settings
|
||||
|
||||
Each type of [widget](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) has its own settings.
|
||||
For example Number editors may parse minimum and maximum values, while Text editors can support value formats or length constraints.
|
||||
|
||||
You can use `component.settings` to pass any information to a [widget](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) using the
|
||||
[`SearchWidgetSettings`](../../../lib/content-services/src/lib/search/search-widget-settings.interface.ts) interface:
|
||||
|
||||
```ts
|
||||
export interface SearchWidgetSettings {
|
||||
field: string;
|
||||
[indexer: string]: any;
|
||||
}
|
||||
```
|
||||
|
||||
### Facet Fields
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetFields": {
|
||||
"expanded": true,
|
||||
"fields": [
|
||||
{ "field": "content.mimetype", "mincount": 1, "label": "Type" },
|
||||
{ "field": "content.size", "mincount": 1, "label": "File Size" },
|
||||
{ "field": "creator", "mincount": 1, "label": "Creator" },
|
||||
{ "field": "modifier", "mincount": 1, "label": "Modifier" },
|
||||
{ "field": "created", "mincount": 1, "label": "Created" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Every field declared within the `facetFields` group is presented by a separate collapsible category at runtime.
|
||||
|
||||
By default, users see only the top 5 entries.
|
||||
If there are more than 5 entries, a button to show more items is displayed to let the user move to
|
||||
the next block of results.
|
||||
|
||||
|
||||
|
||||
#### FacetField Properties
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| ---- | ---- | ------- | ----------- |
|
||||
| field | string | | Specifies the facet field. |
|
||||
| mincount | number | 1 | Specifies the minimum count required for a facet field to be included in the response. The default value is 1. |
|
||||
| label | string | | Specifies the label to include in place of the facet field. |
|
||||
| prefix | string | | Restricts the possible constraints to only indexed values with a specified prefix. |
|
||||
| limit | number | | Maximum number of results |
|
||||
| pageSize | number | 5 | Display page size |
|
||||
| offset | number | | Offset position |
|
||||
|
||||
### Facet Queries
|
||||
|
||||
These provide custom categories based on admin-defined facet queries.
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetQueries": {
|
||||
"label": "Facet queries",
|
||||
"pageSize": 5,
|
||||
"expanded": true,
|
||||
"queries": [
|
||||
{ "query": "created:2018", "label": "Created This Year" },
|
||||
{ "query": "content.mimetype:text/html", "label": "Type: HTML" },
|
||||
{ "query": "content.size:[0 TO 10240]", "label": "Size: xtra small"},
|
||||
{ "query": "content.size:[10240 TO 102400]", "label": "Size: small"},
|
||||
{ "query": "content.size:[102400 TO 1048576]", "label": "Size: medium" },
|
||||
{ "query": "content.size:[1048576 TO 16777216]", "label": "Size: large" },
|
||||
{ "query": "content.size:[16777216 TO 134217728]", "label": "Size: xtra large" },
|
||||
{ "query": "content.size:[134217728 TO MAX]", "label": "Size: XX large" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
By default, the queries declared in the `facetQueries` are collected into a single collapsible category.
|
||||
The `mincount` property allows setting the minimum count required for a facet field to be displayed. By default, only the queries that have 1 or more response entries are displayed at runtime.
|
||||
The component provides a `Show more` button to display more items if the number of items
|
||||
exceeds the `pageSize` value.
|
||||
|
||||
You can also provide a custom `label` (or i18n resource key) for the default resulting collapsible category.
|
||||
If you need to display more resulting collapsible categories, you can group different facet queries under custom labels by using the `group` property on those facet queries:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetQueries": {
|
||||
"label": "Facet queries",
|
||||
"pageSize": 5,
|
||||
"expanded": true,
|
||||
"mincount": 0,
|
||||
"queries": [
|
||||
{ "query": "created:2018", "label": "Created This Year" },
|
||||
{ "query": "modifier:admin", "label": "Admin modifier" },
|
||||
{ "query": "content.mimetype:text/html", "label": "Type: HTML", "group":"Type facet queries" },
|
||||
{ "query": "content.mimetype:image/png", "label": "Type: PNG", "group":"Type facet queries" },
|
||||
{ "query": "content.size:[0 TO 10240]", "label": "Size: xtra small", "group":"Size facet queries"},
|
||||
{ "query": "content.size:[10240 TO 102400]", "label": "Size: small", "group":"Size facet queries"},
|
||||
{ "query": "content.size:[102400 TO 1048576]", "label": "Size: medium", "group":"Size facet queries" },
|
||||
{ "query": "content.size:[1048576 TO 16777216]", "label": "Size: large", "group":"Size facet queries" },
|
||||
{ "query": "content.size:[16777216 TO 134217728]", "label": "Size: xtra large", "group":"Size facet queries" },
|
||||
{ "query": "content.size:[134217728 TO MAX]", "label": "Size: XX large", "group":"Size facet queries" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
This will result in the following display of the grouped facet queries:
|
||||
|
||||
|
||||
|
||||
The `pageSize` property allows you to define the number of results to display.
|
||||
Users will see `Show more` or `Show less` buttons as appropriate for the result set.
|
||||
The default page size of 5 will be used if you set the value to 0 or omit it entirely.
|
||||
|
||||
|
||||
|
||||
### Facet Intervals
|
||||
|
||||
These provide custom categories based on admin defined ranges inside `intervals`.
|
||||
You can specify exactly what you want for each interval in the config file and you can
|
||||
use overlapping ranges if necessary.
|
||||
|
||||
#### FacetIntervals Properties
|
||||
|
||||
| Name | Type | Description |
|
||||
| ---- | ---- | ----------- |
|
||||
| intervals | array | Specifies the fields to facet by interval. |
|
||||
| expanded | boolean | Toggles expanded state of the facet intervals. |
|
||||
|
||||
Note: the `sets` parameter from the Search API (which sets the intervals for all fields)
|
||||
is not yet supported.
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetIntervals":{
|
||||
"expanded": true,
|
||||
"intervals":[
|
||||
{
|
||||
"label":"TheCreated",
|
||||
"field":"cm:created",
|
||||
"sets":[
|
||||
{ "label":"lastYear", "start":"2017", "end":"2018", "endInclusive":false },
|
||||
{ "label":"currentYear", "start":"NOW/YEAR", "end":"NOW/YEAR+1YEAR" },
|
||||
{ "label":"earlier", "start":"*", "end":"2017", "endInclusive":false }
|
||||
]
|
||||
},
|
||||
{
|
||||
"label":"TheModified",
|
||||
"field":"cm:modified",
|
||||
"sets":[
|
||||
{ "label":"2016", "start":"2017", "end":"2018", "endInclusive":false },
|
||||
{ "label":"currentYear", "start":"NOW/YEAR", "end":"NOW/YEAR+1YEAR" },
|
||||
{ "label":"earlierThan2017", "start":"*", "end":"2017", "endInclusive":false }
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
You can specify a value for the `mincount` property inside each `intervals` item to set the minimum count required for a facet interval to be displayed. By default, only the intervals that have 1 or more response entries are displayed at runtime.
|
||||
Check the [schema.json](https://github.com/Alfresco/alfresco-ng2-components/blob/master/lib/core/app-config/schema.json) file
|
||||
for further details about the structure and properties of `intervals` that you can set inside the configuration file.
|
||||
|
||||
Each defined `intervals` item is collected into its own collapsible category identified uniquely
|
||||
by its `label`. The code snippet just above will result in the following display of facet intervals:
|
||||
|
||||
|
||||
|
||||
### Highlight
|
||||
|
||||
You can configure highlighting using the `search` entry in the `app.config.json` file.
|
||||
An example query for search highlighting could look like this:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"highlight": {
|
||||
"prefix": "¿",
|
||||
"postfix": "?",
|
||||
"mergeContiguous": true,
|
||||
"fields": [
|
||||
{
|
||||
"field": "cm:title"
|
||||
},
|
||||
{
|
||||
"field": "description",
|
||||
"prefix": "(",
|
||||
"postfix": ")"
|
||||
}
|
||||
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The example above changes the highlighting prefix and postfix from the default to '¿?' for all
|
||||
fields except the "description" field, which uses '()' instead. The highlight information will
|
||||
then be added in each node entry response. An example partial response is shown below:
|
||||
|
||||
```json
|
||||
"entry": {
|
||||
"createdAt": "2016-10-12T15:24:31.202+0000",
|
||||
"isFolder": true,
|
||||
"search": {
|
||||
"score": 1,
|
||||
"highlight": [
|
||||
{
|
||||
"field": "cm:title",
|
||||
"snippets": [
|
||||
"Customized ¿Workflow? Process Definitions"
|
||||
]
|
||||
},
|
||||
{
|
||||
"field": "description",
|
||||
"snippets": [
|
||||
"Customized (Workflow) Process Definitions"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
```
|
||||
|
||||
## See also
|
||||
|
||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
||||
- [Search Query Builder service](../services/search-query-builder.service.md)
|
||||
- [Search filter chips component](./search-filter-chips.component.md)
|
||||
- [Search Chip List Component](search-chip-list.component.md)
|
||||
- [Search Sorting Picker Component](search-sorting-picker.component.md)
|
||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||
|
||||
@ -7,8 +7,6 @@ Last reviewed: 2021-06-11
|
||||
|
||||
# [Search Form component](../../../lib/content-services/src/lib/search/components/search-form/search-form.component.ts "Defined in search-form.component.ts")
|
||||
|
||||
Selecting a configuration from a set of configured options.
|
||||
|
||||
|
||||
|
||||
## Basic usage
|
||||
@ -16,51 +14,14 @@ Selecting a configuration from a set of configured options.
|
||||
```json
|
||||
{
|
||||
"search": [
|
||||
{
|
||||
"categories": [
|
||||
{
|
||||
"id": "queryName",
|
||||
"name": "Name",
|
||||
"enabled": true,
|
||||
"expanded": true,
|
||||
"component": {
|
||||
"selector": "text",
|
||||
"settings": {
|
||||
"searchPrefix": "",
|
||||
"searchSuffix": "",
|
||||
"pattern": "cm:name:'(.*?)'",
|
||||
"field": "cm:name",
|
||||
"placeholder": "Enter the name",
|
||||
"allowUpdateOnChange": true
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
"name": "ALL",
|
||||
"default": true
|
||||
},
|
||||
{
|
||||
"categories": [
|
||||
{
|
||||
"id": "queryName",
|
||||
"name": "Name",
|
||||
"enabled": true,
|
||||
"expanded": true,
|
||||
"component": {
|
||||
"selector": "text",
|
||||
"settings": {
|
||||
"searchPrefix": "",
|
||||
"searchSuffix": "",
|
||||
"pattern": "cm:name:'(.*?)'",
|
||||
"field": "cm:name",
|
||||
"placeholder": "Enter the name",
|
||||
"allowUpdateOnChange": true
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
"name": "Other"
|
||||
}
|
||||
{
|
||||
"name": "Default",
|
||||
...
|
||||
},
|
||||
{
|
||||
"name": "Other",
|
||||
...
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
@ -68,8 +29,9 @@ Selecting a configuration from a set of configured options.
|
||||
|
||||
## Details
|
||||
|
||||
This component lets the user pick a configuration for a search.
|
||||
This component pick a configuration for a search from the list of configuration.
|
||||
|
||||
## See also
|
||||
|
||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
||||
- [Search Query Builder](../services/search-query-builder.service.md)
|
||||
|
||||
@ -71,6 +71,8 @@ cm:content.size:[0 TO 100]
|
||||
|
||||
## 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 date range component](search-date-range.component.md)
|
||||
|
||||
@ -62,6 +62,8 @@ buttons as appropriate.
|
||||
|
||||
## 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 date range component](search-date-range.component.md)
|
||||
|
||||
@ -69,6 +69,8 @@ or zero and the corresponsing query fragment is removed from the query.
|
||||
|
||||
## 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 date range component](search-date-range.component.md)
|
||||
|
||||
@ -12,3 +12,8 @@ Provides an ability to select one of the predefined sorting definitions for sear
|
||||
<adf-search-sorting-picker></adf-search-sorting-picker>
|
||||
<adf-search-filter></adf-search-filter>
|
||||
```
|
||||
|
||||
## See also
|
||||
|
||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
||||
- [Search filter chips component](search-filter-chips.component.md)
|
||||
|
||||
@ -59,6 +59,8 @@ details of how to use widgets in a search query.
|
||||
|
||||
## 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 date range component](search-date-range.component.md)
|
||||
|
||||
@ -122,5 +122,14 @@ constructor(queryBuilder: SearchQueryBuilderService) {
|
||||
|
||||
## See also
|
||||
|
||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
||||
- [Search filter component](../components/search-filter.component.md)
|
||||
- [Search filter chips component](../components/search-filter-chips.component.md)
|
||||
- [Search Form Component](../components/search-form.component.md)
|
||||
- [Search Widget interface](../interfaces/search-widget.interface.md)
|
||||
- [Search check list component](../components/search-check-list.component.md)
|
||||
- [Search date range component](../components/search-date-range.component.md)
|
||||
- [Search number range component](../components/search-number-range.component.md)
|
||||
- [Search radio component](../components/search-radio.component.md)
|
||||
- [Search slider component](../components/search-slider.component.md)
|
||||
- [Search text component](../components/search-text.component.md)
|
||||
|
||||
BIN
docs/docassets/images/expansion-card-layout.png
Normal file
BIN
docs/docassets/images/expansion-card-layout.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
BIN
docs/docassets/images/search-chip-layout.png
Normal file
BIN
docs/docassets/images/search-chip-layout.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 3.7 KiB |
@ -14,6 +14,7 @@ on an item below to see the corresponding guide page.
|
||||
- [Angular Material Design](angular-material-design.md)
|
||||
- [App extensions](app-extensions.md)
|
||||
- [Form Extensibility and Customisation](extensibility.md)
|
||||
- [Search Configuration Guide](search-configuration-guide.md)
|
||||
- [Internationalization in ADF](internationalization.md)
|
||||
- [Localization in ADF](user-guide/localization.md)
|
||||
- [Theming](theming.md)
|
||||
|
||||
590
docs/user-guide/search-configuration-guide.md
Normal file
590
docs/user-guide/search-configuration-guide.md
Normal file
@ -0,0 +1,590 @@
|
||||
---
|
||||
Title: Search Configuration
|
||||
Added: 2021-07-05
|
||||
---
|
||||
|
||||
# Search Configuration Guide
|
||||
|
||||
This page describes how you can configure the search configuration.
|
||||
|
||||
## Contents
|
||||
|
||||
- [Basic usage](#basic-usage)
|
||||
- [For Single](#for-single)
|
||||
- [For Multiple](#for-multiple)
|
||||
- [Supported Layouts](#supported-layouts)
|
||||
- [Steps Involved In Search Configuration](#steps-involved-in-search-configuration)
|
||||
- [Configuration](#configuration)
|
||||
- [Extra fields and filter queries](#extra-fields-and-filter-queries)
|
||||
- [Sorting](#sorting)
|
||||
- [Categories and widgets](#categories-and-widgets)
|
||||
- [Facet Fields](#facet-fields)
|
||||
- [Facet Queries](#facet-queries)
|
||||
- [Facet Intervals](#facet-intervals)
|
||||
- [Highlight](#highlight)
|
||||
- [See also](#see-also)
|
||||
|
||||
### Basic usage
|
||||
|
||||
ADF support single or multiple [search configurations](https://github.com/Alfresco/alfresco-ng2-components/blob/develop/lib/content-services/src/lib/search/models/search-configuration.interface.ts).
|
||||
|
||||
### For single:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"name": "Application search",
|
||||
"query": [
|
||||
{ "query": "TYPE:'cm:folder' OR TYPE:'cm:content'" }
|
||||
],
|
||||
"category": []
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
This configuration considered for searching in the application.
|
||||
|
||||
### For multiple:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": [
|
||||
{
|
||||
"name": "Application search",
|
||||
"default": "true",
|
||||
"query": [
|
||||
{ "query": "TYPE:'cm:folder' OR TYPE:'cm:content'" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "Customer payout",
|
||||
"query": [
|
||||
{ "query": "TYPE:'cm:folder' OR TYPE:'cm:content'" }
|
||||
{ "query": "-TYPE:'st:site' AND -ASPECT:'st:siteContainer' AND -ASPECT:'sys:hidden'" }
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
You can have arrayed config. At any point in the application only one of this configuration will be used for search.
|
||||
|
||||
The one with default considered as default configuration and user should be able to switch to other configuration.
|
||||
|
||||
### Supported Layouts
|
||||
ADF support two kinds of search layouts.
|
||||
|
||||
1. [Expansion card based layouts](../content-services/components/search-filter.component.md)
|
||||
|
||||
|
||||
|
||||
|
||||
2. [Chip based layout](../content-services/components/search-filter-chips.component.md)
|
||||
|
||||
|
||||
|
||||
The layout is generated for the default/selected search configuration.
|
||||
|
||||
### Steps involved in search configuration
|
||||
In the three steps you can specify the search configuration. i.e
|
||||
|
||||
1. Identify the search use case
|
||||
2. find/construct search query
|
||||
3. Add it in the adf search configuration section
|
||||
|
||||
|
||||
You may find it useful to check out the following resources for background information
|
||||
before customizing the search UI:
|
||||
|
||||
- [Search API](https://docs.alfresco.com/5.2/concepts/search-api.html)
|
||||
- [Alfresco Full Text Search Reference](https://docs.alfresco.com/5.2/concepts/rm-searchsyntax-intro.html)
|
||||
- [ACS API Explorer](https://api-explorer.alfresco.com/api-explorer/#!/search/search)
|
||||
|
||||
### Configuration
|
||||
|
||||
You can configure the component using the `search` entry in the `app.config.json` file.
|
||||
A typical configuration is shown below:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"sorting": {
|
||||
"options": [
|
||||
{ "key": "name", "label": "Name", "type": "FIELD", "field": "cm:name", "ascending": true },
|
||||
{ "key": "content.sizeInBytes", "label": "Size", "type": "FIELD", "field": "content.size", "ascending": true },
|
||||
{ "key": "description", "label": "Description", "type": "FIELD", "field": "cm:description", "ascending": true }
|
||||
],
|
||||
"defaults": [
|
||||
{ "key": "name", "type": "FIELD", "field": "cm:name", "ascending": true }
|
||||
]
|
||||
},
|
||||
"filterQueries": [
|
||||
{ "query": "TYPE:'cm:folder' OR TYPE:'cm:content'" },
|
||||
{ "query": "NOT cm:creator:System" }
|
||||
],
|
||||
"facetFields": {
|
||||
"expanded": true,
|
||||
"fields": [
|
||||
{ "field": "content.mimetype", "mincount": 1, "label": "Type" },
|
||||
{ "field": "content.size", "mincount": 1, "label": "File Size" },
|
||||
{ "field": "creator", "mincount": 1, "label": "Creator" },
|
||||
{ "field": "modifier", "mincount": 1, "label": "Modifier" }
|
||||
]
|
||||
},
|
||||
"facetQueries": {
|
||||
"label": "My facet queries",
|
||||
"pageSize": 4,
|
||||
"queries": [
|
||||
{ "query": "created:2018", "label": "Created This Year" },
|
||||
{ "query": "content.mimetype:text/html", "label": "Type: HTML" },
|
||||
{ "query": "content.size:[0 TO 10240]", "label": "Size: xtra small"},
|
||||
{ "query": "content.size:[10240 TO 102400]", "label": "Size: small"},
|
||||
{ "query": "content.size:[102400 TO 1048576]", "label": "Size: medium" },
|
||||
{ "query": "content.size:[1048576 TO 16777216]", "label": "Size: large" },
|
||||
{ "query": "content.size:[16777216 TO 134217728]", "label": "Size: xtra large" },
|
||||
{ "query": "content.size:[134217728 TO MAX]", "label": "Size: XX large" }
|
||||
]
|
||||
},
|
||||
"categories": [
|
||||
{
|
||||
"id": "queryName",
|
||||
"name": "Name",
|
||||
"enabled": true,
|
||||
"expanded": true,
|
||||
"component": {
|
||||
"selector": "adf-search-text",
|
||||
"settings": {
|
||||
"pattern": "cm:name:'(.*?)'",
|
||||
"field": "cm:name",
|
||||
"placeholder": "Enter the name"
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The
|
||||
[schema.json](https://github.com/Alfresco/alfresco-ng2-components/blob/master/lib/core/app-config/schema.json)
|
||||
file for the app config has further details about available settings, values and formats for
|
||||
the configuration options.
|
||||
|
||||
### Extra fields and filter queries
|
||||
|
||||
You can explicitly define the `include` section for the query from within the application configuration file. This array is a list of extra data fields to be added to the search
|
||||
results:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"include": ["path", "allowableOperations"]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
You can choose to filter facet field results using 'contains' instead of 'starts with', by using the `filterWithContains` boolean (default is `false`):
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"filterWithContains": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
You can choose to display a reset button by setting the 'resetButton' value to true.
|
||||
This 'clean up' button would make it easier for the final user to remove all bucket selections and all search filtering.
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"resetButton": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
You can also provide a set of queries that are always executed alongside the user-defined
|
||||
settings:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"filterQueries": [
|
||||
{ "query": "TYPE:'cm:folder' OR TYPE:'cm:content'" },
|
||||
{ "query": "NOT cm:creator:System" }
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Note that the entries of the `filterQueries` array are joined using the `AND` operator.
|
||||
|
||||
### Sorting
|
||||
|
||||
The Sorting configuration section consists of two blocks:
|
||||
|
||||
- `options`: a list of items that users can select from
|
||||
- `defaults`: predefined sorting to use by default
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"sorting": {
|
||||
"options": [
|
||||
{ "key": "name", "label": "Name", "type": "FIELD", "field": "cm:name", "ascending": true },
|
||||
{ "key": "content.sizeInBytes", "label": "Size", "type": "FIELD", "field": "content.size", "ascending": true },
|
||||
{ "key": "description", "label": "Description", "type": "FIELD", "field": "cm:description", "ascending": true }
|
||||
],
|
||||
"defaults": [
|
||||
{ "key": "name", "type": "FIELD", "field": "cm:name", "ascending": true }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The properties of the `options` objects are as follows:
|
||||
|
||||
| Name | Type | Description |
|
||||
| ---- | ---- | ----------- |
|
||||
| key | string | Unique key to identify the entry. This can also be used to map [`DataColumn`](../../../lib/core/datatable/data/data-column.model.ts) instances. |
|
||||
| label | string | Display text, which can also be an [i18n resource key](../../user-guide/internationalization.md). |
|
||||
| type | string | This specifies how to order the results. It can be based on a field, based on the position of the document in the index, or by score/relevance. |
|
||||
| field | string | The name of the field. |
|
||||
| ascending | boolean | The sorting order defined as `true` for ascending order and `false` for descending order |
|
||||
|
||||
See the [Sort](https://docs.alfresco.com/5.2/concepts/search-api-sort.html)
|
||||
element in the [ACS Search API](https://docs.alfresco.com/5.2/concepts/search-api.html)
|
||||
for further details.
|
||||
|
||||
### Categories and widgets
|
||||
|
||||
The Search Settings component and Query Builder require a `categories` section in the
|
||||
configuration.
|
||||
|
||||
Categories are used to configure the UI widgets that let the user edit the search query
|
||||
at runtime. Every category is represented by a single Angular component, which can be
|
||||
either a simple one or a composite one.
|
||||
|
||||
```ts
|
||||
export interface SearchCategory {
|
||||
id: string;
|
||||
name: string;
|
||||
enabled: boolean;
|
||||
expanded: boolean;
|
||||
component: {
|
||||
selector: string;
|
||||
settings: SearchWidgetSettings;
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
The interface above also describes entries in the `search.query.categories` section for the `app.config.json` file.
|
||||
|
||||
|
||||
|
||||
> **Note:** you must provide at least one category field in order to execute the query,
|
||||
> so that filters and selected facets are applied.
|
||||
|
||||
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
|
||||
a category:
|
||||
|
||||
| [`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 |
|
||||
| [Date Range](../content-services/components/search-date-range.component.md) | `date-range` | Specifies a range f 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 |
|
||||
| [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 |
|
||||
| [Text](../content-services/components/search-text.component.md) | `text` | Specifies a text value that a field may contain |
|
||||
|
||||
See the individual [Search Widget](../interfaces/search-widget.interface.md) pages for full details of their usage and settings.
|
||||
|
||||
You can also implement your own custom search widgets. See the [Search Widget Interface](../interfaces/search-widget.interface.md) interface
|
||||
page for full details of how to do this.
|
||||
|
||||
#### Widget settings
|
||||
|
||||
Each type of [widget](../../lib/content-services/src/lib/search/models/search-widget.interface.ts) has its own settings.
|
||||
For example Number editors may parse minimum and maximum values, while Text editors can support value formats or length constraints.
|
||||
|
||||
You can use `component.settings` to pass any information to a [widget](../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) using the
|
||||
[`SearchWidgetSettings`](../../lib/content-services/src/lib/search/models/search-widget-settings.interface.ts) interface:
|
||||
|
||||
```ts
|
||||
export interface SearchWidgetSettings {
|
||||
field: string;
|
||||
/* allow the user to update search in every change */
|
||||
allowUpdateOnChange?: boolean;
|
||||
/* allow the user hide default search actions. So widget can have custom actions */
|
||||
hideDefaultAction?: boolean;
|
||||
/* describes the unit of the value i.e byte for better display message */
|
||||
unit?: string;
|
||||
/* describes query format */
|
||||
format?: string;
|
||||
[indexer: string]: any;
|
||||
}
|
||||
```
|
||||
|
||||
### Facet Fields
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetFields": {
|
||||
"expanded": true,
|
||||
"fields": [
|
||||
{ "field": "content.mimetype", "mincount": 1, "label": "Type" },
|
||||
{ "field": "content.size", "mincount": 1, "label": "File Size" },
|
||||
{ "field": "creator", "mincount": 1, "label": "Creator" },
|
||||
{ "field": "modifier", "mincount": 1, "label": "Modifier" },
|
||||
{ "field": "created", "mincount": 1, "label": "Created" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Every field declared within the `facetFields` group is presented by a separate collapsible category at runtime.
|
||||
|
||||
By default, users see only the top 5 entries.
|
||||
If there are more than 5 entries, a button to show more items is displayed to let the user move to
|
||||
the next block of results.
|
||||
|
||||
Note: Facet Fields setting can be controlled by passing [settings](../../lib/content-services/src/lib/search/models/facet-field.interface.ts) as part the config.
|
||||
|
||||
|
||||
|
||||
#### FacetField Properties
|
||||
|
||||
| Name | Type | Default | Description |
|
||||
| ---- | ---- | ------- | ----------- |
|
||||
| field | string | | Specifies the facet field. |
|
||||
| mincount | number | 1 | Specifies the minimum count required for a facet field to be included in the response. The default value is 1. |
|
||||
| label | string | | Specifies the label to include in place of the facet field. |
|
||||
| prefix | string | | Restricts the possible constraints to only indexed values with a specified prefix. |
|
||||
| limit | number | | Maximum number of results |
|
||||
| pageSize | number | 5 | Display page size |
|
||||
| offset | number | | Offset position |
|
||||
|
||||
### Facet Queries
|
||||
|
||||
These provide custom categories based on admin-defined facet queries.
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetQueries": {
|
||||
"label": "Facet queries",
|
||||
"pageSize": 5,
|
||||
"expanded": true,
|
||||
"queries": [
|
||||
{ "query": "created:2018", "label": "Created This Year" },
|
||||
{ "query": "content.mimetype:text/html", "label": "Type: HTML" },
|
||||
{ "query": "content.size:[0 TO 10240]", "label": "Size: xtra small"},
|
||||
{ "query": "content.size:[10240 TO 102400]", "label": "Size: small"},
|
||||
{ "query": "content.size:[102400 TO 1048576]", "label": "Size: medium" },
|
||||
{ "query": "content.size:[1048576 TO 16777216]", "label": "Size: large" },
|
||||
{ "query": "content.size:[16777216 TO 134217728]", "label": "Size: xtra large" },
|
||||
{ "query": "content.size:[134217728 TO MAX]", "label": "Size: XX large" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
By default, the queries declared in the `facetQueries` are collected into a single collapsible category.
|
||||
The `mincount` property allows setting the minimum count required for a facet field to be displayed. By default, only the queries that have 1 or more response entries are displayed at runtime.
|
||||
The component provides a `Show more` button to display more items if the number of items
|
||||
exceeds the `pageSize` value.
|
||||
|
||||
You can provide a custom `label` (or i18n resource key) for the default resulting collapsible category.
|
||||
If you need to display more resulting collapsible categories, you can group different facet queries under custom labels by using the `group` property on those facet queries:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetQueries": {
|
||||
"label": "Facet queries",
|
||||
"pageSize": 5,
|
||||
"expanded": true,
|
||||
"mincount": 0,
|
||||
"queries": [
|
||||
{ "query": "created:2018", "label": "Created This Year" },
|
||||
{ "query": "modifier:admin", "label": "Admin modifier" },
|
||||
{ "query": "content.mimetype:text/html", "label": "Type: HTML", "group":"Type facet queries" },
|
||||
{ "query": "content.mimetype:image/png", "label": "Type: PNG", "group":"Type facet queries" },
|
||||
{ "query": "content.size:[0 TO 10240]", "label": "Size: xtra small", "group":"Size facet queries"},
|
||||
{ "query": "content.size:[10240 TO 102400]", "label": "Size: small", "group":"Size facet queries"},
|
||||
{ "query": "content.size:[102400 TO 1048576]", "label": "Size: medium", "group":"Size facet queries" },
|
||||
{ "query": "content.size:[1048576 TO 16777216]", "label": "Size: large", "group":"Size facet queries" },
|
||||
{ "query": "content.size:[16777216 TO 134217728]", "label": "Size: xtra large", "group":"Size facet queries" },
|
||||
{ "query": "content.size:[134217728 TO MAX]", "label": "Size: XX large", "group":"Size facet queries" }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Note: `settings` property used to control UI actions and interaction. i.e
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetQueries": {
|
||||
"label": "Facet queries",
|
||||
"pageSize": 5,
|
||||
"expanded": true,
|
||||
"mincount": 0,
|
||||
"queries": [
|
||||
{ "query": "created:2018", "label": "Created This Year" },
|
||||
{ "query": "modifier:admin", "label": "Admin modifier" }
|
||||
],
|
||||
"settings" : {
|
||||
"allowUpdateOnChange": false,
|
||||
"hideDefaultAction": true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
This will result in the following display of the grouped facet queries:
|
||||
|
||||
|
||||
|
||||
The `pageSize` property allows you to define the number of results to display.
|
||||
Users will see `Show more` or `Show less` buttons as appropriate for the result set.
|
||||
The default page size of 5 will be used if you set the value to 0 or omit it entirely.
|
||||
|
||||
|
||||
|
||||
### Facet Intervals
|
||||
|
||||
These provide custom categories based on admin defined ranges inside `intervals`.
|
||||
You can specify exactly what you want for each interval in the config file and you can
|
||||
use overlapping ranges if necessary.
|
||||
|
||||
#### FacetIntervals Properties
|
||||
|
||||
| Name | Type | Description |
|
||||
| ---- | ---- | ----------- |
|
||||
| intervals | array | Specifies the fields to [facet](../../lib/content-services/src/lib/search/models/facet-field.interface.ts) by interval. |
|
||||
| expanded | boolean | Toggles expanded state of the facet intervals. |
|
||||
|
||||
Note: Interval fields setting can be controlled by passing [settings](../../lib/content-services/src/lib/search/models/facet-field.interface.ts).
|
||||
|
||||
Note: the `sets` parameter from the Search API (which sets the intervals for all fields)
|
||||
is not yet supported.
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"facetIntervals":{
|
||||
"expanded": true,
|
||||
"intervals":[
|
||||
{
|
||||
"label":"TheCreated",
|
||||
"field":"cm:created",
|
||||
"sets":[
|
||||
{ "label":"lastYear", "start":"2017", "end":"2018", "endInclusive":false },
|
||||
{ "label":"currentYear", "start":"NOW/YEAR", "end":"NOW/YEAR+1YEAR" },
|
||||
{ "label":"earlier", "start":"*", "end":"2017", "endInclusive":false }
|
||||
]
|
||||
},
|
||||
{
|
||||
"label":"TheModified",
|
||||
"field":"cm:modified",
|
||||
"sets":[
|
||||
{ "label":"2016", "start":"2017", "end":"2018", "endInclusive":false },
|
||||
{ "label":"currentYear", "start":"NOW/YEAR", "end":"NOW/YEAR+1YEAR" },
|
||||
{ "label":"earlierThan2017", "start":"*", "end":"2017", "endInclusive":false }
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
You can specify a value for the `mincount` property inside each `intervals` item to set the minimum count required for a facet interval to be displayed. By default, only the intervals that have 1 or more response entries are displayed at runtime.
|
||||
Check the [schema.json](https://github.com/Alfresco/alfresco-ng2-components/blob/master/lib/core/app-config/schema.json) file
|
||||
for further details about the structure and properties of `intervals` that you can set inside the configuration file.
|
||||
|
||||
Each defined `intervals` item is collected into its own collapsible category identified uniquely
|
||||
by its `label`. The code snippet just above will result in the following display of facet intervals:
|
||||
|
||||
|
||||
|
||||
### Highlight
|
||||
|
||||
You can configure highlighting using the `search` entry in the `app.config.json` file.
|
||||
An example query for search highlighting could look like this:
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"highlight": {
|
||||
"prefix": "¿",
|
||||
"postfix": "?",
|
||||
"mergeContiguous": true,
|
||||
"fields": [
|
||||
{
|
||||
"field": "cm:title"
|
||||
},
|
||||
{
|
||||
"field": "description",
|
||||
"prefix": "(",
|
||||
"postfix": ")"
|
||||
}
|
||||
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
The example above changes the highlighting prefix and postfix from the default to '¿?' for all
|
||||
fields except the "description" field, which uses '()' instead. The highlight information will
|
||||
then be added in each node entry response. An example partial response is shown below:
|
||||
|
||||
```json
|
||||
"entry": {
|
||||
"createdAt": "2016-10-12T15:24:31.202+0000",
|
||||
"isFolder": true,
|
||||
"search": {
|
||||
"score": 1,
|
||||
"highlight": [
|
||||
{
|
||||
"field": "cm:title",
|
||||
"snippets": [
|
||||
"Customized (Workflow) Process Definitions"
|
||||
]
|
||||
},
|
||||
{
|
||||
"field": "description",
|
||||
"snippets": [
|
||||
"Customized (Workflow) Process Definitions"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
```
|
||||
|
||||
## See also
|
||||
|
||||
- [Search Query Builder](../content-services/services/search-query-builder.service.md)
|
||||
- [Search Filter Component](../content-services/components/search-filter.component.md)
|
||||
- [Search Filter Chips Component](../content-services/components/search-filter-chips.component.md)
|
||||
- [Search Form Component](../content-services/components/search-form.component.md)
|
||||
- [Search Widget interface](../interfaces/search-widget.interface.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 number range component](../content-services/components/search-number-range.component.md)
|
||||
- [Search radio component](../content-services/components/search-radio.component.md)
|
||||
- [Search slider component](../content-services/components/search-slider.component.md)
|
||||
- [Search text component](../content-services/components/search-text.component.md)
|
||||
Loading…
x
Reference in New Issue
Block a user