[ADF-2150] improved queryBody mechanism (#2852)

* [ADF-2150] changed query body parameter to a function

* [ADF-2150] added an example page where to try change query body

* [ADF-2150] improved queryBody mechanism

* [ADF-2150] fixed content node test

* [ADF-2150] extended docs added another way to use the query node

* [ADF-2150] fixed test for search on content node

* [ADF-2150] added some improvements to service config

* [ADF-2150] changed the documentation accordingly

* [ADF-2150] added PR changes

* [ADF-2150] fixed jdoc

* [ADF-2150] added checkbox to switch from service approach to input object approach

* [ADF-2150] fixed build error on demo shell
This commit is contained in:
Vito
2018-01-23 11:12:52 +01:00
committed by Eugenio Romano
parent 8788eaeb80
commit a401ebd35d
22 changed files with 430 additions and 78 deletions

View File

@@ -16,6 +16,7 @@ import { AppLayoutComponent } from './components/app-layout/app-layout.component
import { HomeComponent } from './components/home/home.component';
import { SearchBarComponent } from './components/search/search-bar.component';
import { SearchResultComponent } from './components/search/search-result.component';
import { SearchExtendedComponent } from './components/search/search-extended.component';
import { AboutComponent } from './components/about/about.component';
import { FormComponent } from './components/form/form.component';
import { FormListComponent } from './components/form/form-list.component';
@@ -68,6 +69,7 @@ import { SharedLinkViewComponent } from './components/shared-link-view/shared-li
HomeComponent,
SearchBarComponent,
SearchResultComponent,
SearchExtendedComponent,
AboutComponent,
ProcessServiceComponent,
ShowDiagramComponent,

View File

@@ -29,6 +29,7 @@ import { FormViewerComponent } from './components/process-service/form-viewer.co
import { FormNodeViewerComponent } from './components/process-service/form-node-viewer.component';
import { AppsViewComponent } from './components/process-service/apps-view.component';
import { SearchResultComponent } from './components/search/search-result.component';
import { SearchExtendedComponent } from './components/search/search-extended.component';
import { DataTableComponent } from './components/datatable/datatable.component';
import { WebscriptComponent } from './components/webscript/webscript.component';
@@ -95,6 +96,11 @@ export const appRoutes: Routes = [
component: SearchResultComponent,
canActivate: [AuthGuardEcm]
},
{
path: 'extendedSearch',
component: SearchExtendedComponent,
canActivate: [AuthGuardEcm]
},
{
path: 'activiti',
component: AppsViewComponent,

View File

@@ -41,6 +41,7 @@ export class AppLayoutComponent {
{ href: '/tag', icon: 'local_offer', title: 'APP_LAYOUT.TAG' },
{ href: '/social', icon: 'thumb_up', title: 'APP_LAYOUT.SOCIAL' },
{ href: '/settings', icon: 'settings', title: 'APP_LAYOUT.SETTINGS' },
{ href: '/extendedSearch', icon: 'search', title: 'APP_LAYOUT.SEARCH' },
{ href: '/overlay-viewer', icon: 'pageview', title: 'APP_LAYOUT.OVERLAY_VIEWER' },
{ href: '/about', icon: 'info_outline', title: 'APP_LAYOUT.ABOUT' }
];

View File

@@ -0,0 +1,44 @@
/*!
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* 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 { QueryBody } from 'alfresco-js-api';
import { SearchConfigurationInterface } from '@alfresco/adf-core';
export class TestSearchConfigurationService implements SearchConfigurationInterface {
constructor() {
}
public generateQueryBody(searchTerm: string, maxResults: string, skipCount: string): QueryBody {
const defaultQueryBody: QueryBody = {
query: {
query: searchTerm ? `${searchTerm}* OR name:${searchTerm}*` : searchTerm
},
include: ['path', 'allowableOperations'],
paging: {
maxItems: maxResults,
skipCount: skipCount
},
filterQueries: [
/*tslint:disable-next-line */
{ query: "TYPE:'cm:folder'" },
{ query: 'NOT cm:creator:System' }]
};
return defaultQueryBody;
}
}

View File

@@ -0,0 +1,39 @@
<div>
<h3>{{'APP_LAYOUT.EXTENDED_SEARCH_QUERY_BODY' | translate}}</h3>
<mat-checkbox [(ngModel)]="useServiceApproach">
{{'APP_LAYOUT.SEARCH_SERVICE_APPROACH' | translate}}
</mat-checkbox>
<div id="container-for-custom-input" class="search-extended-input-containers">
<mat-form-field>
<label>{{'APP_LAYOUT.WORD_TO_SEARCH' | translate}}</label>
<input type="text" matInput
id="custom-input" [(ngModel)]="searchedWord" [searchAutocomplete]="auto">
</mat-form-field>
</div>
<div>
<adf-search #auto="searchAutocomplete"
[queryBody]="generateQueryBody(searchedWord)"
class="example-card-search-container">
<ng-template let-data>
<mat-card class="example-card"
*ngFor="let item of data?.list?.entries; let idx = index" (click)="onClick(item)">
<mat-card-header>
<div mat-card-avatar class="example-header-image"></div>
<mat-card-title>{{ item?.entry.name }}</mat-card-title>
<mat-card-subtitle>{{ item?.entry.createdAt }}</mat-card-subtitle>
</mat-card-header>
<img mat-card-image [src]="getMimeTypeIcon(item)">
<mat-card-content>
<p>
{{'APP_LAYOUT.SEARCH_CREATED_BY' | translate}}: {{item?.entry.createdByUser?.displayName}}
</p>
</mat-card-content>
</mat-card>
<mat-card class="example-card" id="search_no_result" *ngIf="data?.list?.entries.length === 0">
<p mat-line class="adf-search-fixed-text">{{ 'SEARCH.RESULTS.NONE' | translate:{searchTerm: searchTerm} }}</p>
</mat-card>
</ng-template>
</adf-search>
</div>
</div>

View File

@@ -0,0 +1,62 @@
div.search-results-container {
padding: 0 20px 20px 20px;
}
.adf-search-title {
font-size: 22px;
padding: 15px 0 15px 0;
}
@media screen and (max-width: 600px) {
:host .col-display-name {
min-width: 100px;
}
:host .col-modified-at, :host .col-modified-by {
display: none;
}
:host div.search-results-container table {
width: 100%;
}
}
.adf-search-results-content{
display: flex;
}
.search-extended-input-containers {
display: flex;
flex-direction: row-reverse;
justify-content: space-evenly;
}
.search-extended-input-textarea {
width: 300px;
}
.search-extended-label-error {
display: flex;
flex-direction: column;
}
.example-card {
width: 200px;
flex: 0 20%;
margin: 15px;
}
.example-card-search-container {
display: flex;
flex-wrap: wrap;
}
.example-header-image {
background-size: cover;
margin-bottom: 15px;
}
.example-search-input {
width: 100px;
border: 1 solid;
border-color: black;
}

View File

@@ -0,0 +1,84 @@
/*!
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* 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, ViewChild, ViewEncapsulation } from '@angular/core';
import { NodePaging, Pagination, QueryBody, MinimalNodeEntity } from 'alfresco-js-api';
import { SearchComponent } from '@alfresco/adf-content-services';
import { ThumbnailService } from '@alfresco/adf-core';
import { SearchService, SearchConfigurationService } from '@alfresco/adf-core';
import { TestSearchConfigurationService } from './search-config-test.service';
@Component({
selector: 'app-search-extended-component',
templateUrl: './search-extended.component.html',
styleUrls: ['./search-extended.component.scss'],
encapsulation: ViewEncapsulation.None,
providers: [
{ provide: SearchConfigurationService, useClass: TestSearchConfigurationService },
SearchService
]
})
export class SearchExtendedComponent {
@ViewChild('search')
search: SearchComponent;
queryParamName = 'q';
searchedWord = '';
queryBodyString = '';
errorMessage = '';
resultNodePageList: NodePaging;
maxItems: number;
skipCount = 0;
pagination: Pagination;
queryBody: QueryBody;
useServiceApproach = false;
constructor(public thumbnailService: ThumbnailService) {
}
getMimeTypeIcon(node: MinimalNodeEntity): string {
let mimeType;
if (node.entry.content && node.entry.content.mimeType) {
mimeType = node.entry.content.mimeType;
}
if (node.entry.isFolder) {
mimeType = 'folder';
}
return this.thumbnailService.getMimeTypeIcon(mimeType);
}
generateQueryBody(searchTerm: string): QueryBody {
if (this.useServiceApproach) {
return null;
} else {
return {
query: {
query: searchTerm ? `${searchTerm}* OR name:${searchTerm}*` : searchTerm
},
include: ['path', 'allowableOperations'],
filterQueries: [
/*tslint:disable-next-line */
{ query: "TYPE:'cm:folder' OR TYPE:'cm:content'" },
{ query: 'NOT cm:creator:System' }]
};
}
}
}