[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
2025-07-24 17:32:15 +00:00 · 2018-01-23 11:12:52 +01:00
parent 8788eaeb80
commit a401ebd35d
22 changed files with 430 additions and 78 deletions
--- a/demo-shell/resources/i18n/en.json
+++ b/demo-shell/resources/i18n/en.json
@@ -25,7 +25,12 @@
        "SOCIAL": "Social",
        "SETTINGS": "Settings",
        "OVERLAY_VIEWER": "Overlay Viewer",
-        "ABOUT": "About"
+        "ABOUT": "About",
+        "SEARCH": "Extended Search",
+        "EXTENDED_SEARCH_QUERY_BODY": "Extended Search with Query Body",
+        "WORD_TO_SEARCH":"Search Word",
+        "SEARCH_CREATED_BY" : "Created By",
+        "SEARCH_SERVICE_APPROACH": "Check this to disable the input property and use the service approach"
    },
    "DOCUMENT_LIST": {
        "MULTISELECT_CHECKBOXES" :"Multiselect (with checkboxes)",
--- a/demo-shell/src/app/app.module.ts
+++ b/demo-shell/src/app/app.module.ts
@@ -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,
--- a/demo-shell/src/app/app.routes.ts
+++ b/demo-shell/src/app/app.routes.ts
@@ -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,
--- a/demo-shell/src/app/components/app-layout/app-layout.component.ts
+++ b/demo-shell/src/app/components/app-layout/app-layout.component.ts
@@ -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' }
    ];
--- a/demo-shell/src/app/components/search/search-config-test.service.ts
+++ b/demo-shell/src/app/components/search/search-config-test.service.ts
@@ -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;
+    }
+}
--- a/demo-shell/src/app/components/search/search-extended.component.html
+++ b/demo-shell/src/app/components/search/search-extended.component.html
@@ -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>
--- a/demo-shell/src/app/components/search/search-extended.component.scss
+++ b/demo-shell/src/app/components/search/search-extended.component.scss
@@ -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;
+  }
--- a/demo-shell/src/app/components/search/search-extended.component.ts
+++ b/demo-shell/src/app/components/search/search-extended.component.ts
@@ -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' }]
+            };
+        }
+    }
+}