mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2026-09-09 18:03:21 +00:00
ACS-4985 Fixed issue with nx build, some clean ups, using changes in configuration
This commit is contained in:
committed by
Jatin_Chugh
parent
778809b505
commit
b59ea2600a
-46
@@ -1,46 +0,0 @@
|
|||||||
<mat-radio-group [(ngModel)]="dateRangeTypeValue">
|
|
||||||
<span class="adf-search-data-range-horizontal-container">
|
|
||||||
<mat-radio-button [value]="DateRangeType.ANY" data-automation-id="date-range-advanced-anytime">
|
|
||||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.ANYTIME' | translate }}
|
|
||||||
</mat-radio-button>
|
|
||||||
</span>
|
|
||||||
<span class="adf-search-date-range-horizontal-container">
|
|
||||||
<mat-radio-button [value]="DateRangeType.IN_LAST" data-automation-id="date-range-advanced-in-last">
|
|
||||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.IN_LAST' | translate }}
|
|
||||||
</mat-radio-button>
|
|
||||||
<mat-form-field class="adf-search-date-range-form-field adf-search-date-range-input-field">
|
|
||||||
<input matInput type="number" min="1" [(ngModel)]="inLastValue" data-automation-id="date-range-advanced-in-last-input">
|
|
||||||
</mat-form-field>
|
|
||||||
<mat-form-field class="adf-search-date-range-form-field">
|
|
||||||
<mat-select [(ngModel)]="inLastValueType" data-automation-id="date-range-advanced-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-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-advanced-in-last-option-months" [value]="InLastDateType.MONTHS">{{ 'SEARCH.DATE_RANGE_ADVANCED.IN_LAST_LABELS.MONTHS' | translate }}</mat-option>
|
|
||||||
</mat-select>
|
|
||||||
</mat-form-field>
|
|
||||||
</span>
|
|
||||||
<span class="adf-search-date-range-horizontal-container">
|
|
||||||
<mat-radio-button [value]="DateRangeType.BETWEEN" data-automation-id="date-range-advanced-between">
|
|
||||||
{{ 'SEARCH.DATE_RANGE_ADVANCED.OPTIONS.BETWEEN' | translate }}
|
|
||||||
</mat-radio-button>
|
|
||||||
<mat-form-field class="adf-search-date-range-form-field">
|
|
||||||
<mat-date-range-input [rangePicker]="picker" [max]="maxDate">
|
|
||||||
<input matStartDate placeholder="{{ 'SEARCH.DATE_RANGE_ADVANCED.BETWEEN_PLACEHOLDERS.START_DATE' | translate }}"
|
|
||||||
data-automation-id="date-range-advanced-between-start-input" [(ngModel)]="betweenStartDate">
|
|
||||||
<input matEndDate placeholder="{{ 'SEARCH.DATE_RANGE_ADVANCED.BETWEEN_PLACEHOLDERS.END_DATE' | translate }}"
|
|
||||||
data-automation-id="date-range-advanced-between-end-input" [(ngModel)]="betweenEndDate">
|
|
||||||
</mat-date-range-input>
|
|
||||||
<mat-datepicker-toggle matSuffix [for]="picker" data-automation-id="date-range-advanced-between-datepicker-toggle"></mat-datepicker-toggle>
|
|
||||||
<mat-date-range-picker #picker></mat-date-range-picker>
|
|
||||||
</mat-form-field>
|
|
||||||
</span>
|
|
||||||
</mat-radio-group>
|
|
||||||
|
|
||||||
<div class="adf-facet-buttons adf-facet-buttons--topSpace" *ngIf="!settings?.hideDefaultAction">
|
|
||||||
<button mat-button color="primary" type="button" (click)="reset()" data-automation-id="date-range-advanced-clear-btn">
|
|
||||||
{{ 'SEARCH.FILTER.ACTIONS.CLEAR' | translate }}
|
|
||||||
</button>
|
|
||||||
<button mat-button color="primary" (click)="submitValues()" data-automation-id="date-range-advanced-apply-btn">
|
|
||||||
{{ 'SEARCH.FILTER.ACTIONS.APPLY' | translate }}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
-25
@@ -1,25 +0,0 @@
|
|||||||
.adf-search-date-range-advanced {
|
|
||||||
.mat-radio-group {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mat-radio-button {
|
|
||||||
margin: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.adf-search-date-range-horizontal-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.adf-search-date-range-input-field {
|
|
||||||
width: 75px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.adf-search-date-range-form-field {
|
|
||||||
padding-left: 10px;
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
-258
@@ -1,258 +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 { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
import { By } from '@angular/platform-browser';
|
|
||||||
import { TranslateModule } from '@ngx-translate/core';
|
|
||||||
import { ContentTestingModule } from '../../../testing/content.testing.module';
|
|
||||||
import { SearchDateRangeAdvancedComponent } from './search-date-range-advanced.component';
|
|
||||||
import { endOfDay, formatISO, startOfDay } from 'date-fns';
|
|
||||||
|
|
||||||
describe('SearchDateRangeAdvancedComponent', () => {
|
|
||||||
let component: SearchDateRangeAdvancedComponent;
|
|
||||||
let fixture: ComponentFixture<SearchDateRangeAdvancedComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
declarations: [SearchDateRangeAdvancedComponent],
|
|
||||||
imports: [
|
|
||||||
TranslateModule.forRoot(),
|
|
||||||
ContentTestingModule
|
|
||||||
]
|
|
||||||
}).compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(SearchDateRangeAdvancedComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
component.id = 'date-range-advanced';
|
|
||||||
component.settings = {
|
|
||||||
field: 'test-field',
|
|
||||||
hideDefaultAction: false
|
|
||||||
}
|
|
||||||
component.context = {
|
|
||||||
queryFragments: {
|
|
||||||
date: ''
|
|
||||||
},
|
|
||||||
update: jasmine.createSpy()
|
|
||||||
} as any;
|
|
||||||
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
const getElementByDataAutomationId = (dataAutomationId) => {
|
|
||||||
return fixture.debugElement.query(By.css(`[data-automation-id="${dataAutomationId}"]`)).nativeElement;
|
|
||||||
}
|
|
||||||
|
|
||||||
const clickElementByAutomationId = async (elementDataAutomationId) => {
|
|
||||||
const el = getElementByDataAutomationId(elementDataAutomationId);
|
|
||||||
el.dispatchEvent(new Event('click'));
|
|
||||||
await fixture.whenStable();
|
|
||||||
fixture.detectChanges();
|
|
||||||
}
|
|
||||||
|
|
||||||
const enterValueInInputField = async (inputElementId: string, value: string) => {
|
|
||||||
const inputField = getElementByDataAutomationId(inputElementId);
|
|
||||||
inputField.value = value;
|
|
||||||
inputField.dispatchEvent(new Event('input'));
|
|
||||||
await fixture.whenStable();
|
|
||||||
fixture.detectChanges();
|
|
||||||
}
|
|
||||||
|
|
||||||
const selectDropdownOption = (itemId: string) => {
|
|
||||||
const matSelect = fixture.debugElement.query(By.css('[data-automation-id="date-range-advanced-in-last-dropdown"]')).nativeElement;
|
|
||||||
matSelect.click();
|
|
||||||
fixture.detectChanges();
|
|
||||||
const matOption = fixture.debugElement.query(By.css(`[data-automation-id="${itemId}"]`)).nativeElement;
|
|
||||||
matOption.click();
|
|
||||||
fixture.detectChanges();
|
|
||||||
};
|
|
||||||
|
|
||||||
it('should not set any date filter in context when Anytime option is selected', async () => {
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.ANY;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
expect(component.context.queryFragments[component.id]).toBe('');
|
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should set proper date filter in context when In the last option is selected', async () => {
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.IN_LAST;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await enterValueInInputField('date-range-advanced-in-last-input', '5');
|
|
||||||
await selectDropdownOption('date-range-advanced-in-last-option-days')
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
let query = 'test-field:[NOW/DAY-5DAYS TO NOW/DAY+1DAY]';
|
|
||||||
expect(component.context.queryFragments[component.id]).toBe(query);
|
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
|
||||||
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.IN_LAST;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await enterValueInInputField('date-range-advanced-in-last-input', '3');
|
|
||||||
await selectDropdownOption('date-range-advanced-in-last-option-weeks');
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
query = 'test-field:[NOW/DAY-3WEEKS TO NOW/DAY+1DAY]';
|
|
||||||
expect(component.context.queryFragments[component.id]).toBe(query);
|
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
|
||||||
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.IN_LAST;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await enterValueInInputField('date-range-advanced-in-last-input', '6');
|
|
||||||
await selectDropdownOption('date-range-advanced-in-last-option-months');
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
query = 'test-field:[NOW/DAY-6MONTHS TO NOW/DAY+1DAY]';
|
|
||||||
expect(component.context.queryFragments[component.id]).toBe(query);
|
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should not set any date filter in context when In the last or Between option is selected, but no value is provided', async () => {
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.IN_LAST;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await selectDropdownOption('date-range-advanced-in-last-option-weeks')
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
expect(component.context.queryFragments[component.id]).toBe('');
|
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
|
||||||
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.BETWEEN;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
expect(component.context.queryFragments[component.id]).toBe('');
|
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should set proper date filter in context when Between option is selected', async () => {
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.BETWEEN;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await enterValueInInputField('date-range-advanced-between-start-input', '6/5/2023');
|
|
||||||
await enterValueInInputField('date-range-advanced-between-end-input', '6/10/2023');
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
let query = `test-field:['${formatISO(startOfDay(component.betweenStartDate))}' TO '${formatISO(endOfDay(component.betweenEndDate))}']`;
|
|
||||||
expect(component.context.queryFragments[component.id]).toEqual(query);
|
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should clear context when widget is reset', async () => {
|
|
||||||
component.context.queryFragments[component.id] = '[NOW/DAY-5DAYS TO NOW/DAY+1DAY]';
|
|
||||||
await clickElementByAutomationId('date-range-advanced-clear-btn');
|
|
||||||
expect(component.context.queryFragments[component.id]).toBe('');
|
|
||||||
expect(component.context.update).toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should update display label with proper text when In the last/Between option is selected and values are properly set', async () => {
|
|
||||||
spyOn(component.displayValue$, 'next');
|
|
||||||
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.IN_LAST;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await enterValueInInputField('date-range-advanced-in-last-input', '5');
|
|
||||||
await selectDropdownOption('date-range-advanced-in-last-option-days')
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
expect(component.displayValue$.next).toHaveBeenCalledWith('SEARCH.DATE_RANGE_ADVANCED.IN_LAST_DISPLAY_LABELS.DAYS');
|
|
||||||
|
|
||||||
await enterValueInInputField('date-range-advanced-in-last-input', '3');
|
|
||||||
await selectDropdownOption('date-range-advanced-in-last-option-weeks')
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
expect(component.displayValue$.next).toHaveBeenCalledWith('SEARCH.DATE_RANGE_ADVANCED.IN_LAST_DISPLAY_LABELS.WEEKS');
|
|
||||||
|
|
||||||
await enterValueInInputField('date-range-advanced-in-last-input', '7');
|
|
||||||
await selectDropdownOption('date-range-advanced-in-last-option-months')
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
expect(component.displayValue$.next).toHaveBeenCalledWith('SEARCH.DATE_RANGE_ADVANCED.IN_LAST_DISPLAY_LABELS.MONTHS');
|
|
||||||
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.BETWEEN;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await enterValueInInputField('date-range-advanced-between-start-input', '6/5/2023');
|
|
||||||
await enterValueInInputField('date-range-advanced-between-end-input', '6/10/2023');
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
expect(component.displayValue$.next).toHaveBeenCalledWith('05-Jun-23 - 10-Jun-23');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should not update display label if anytime option is selected', async() => {
|
|
||||||
spyOn(component.displayValue$, 'next');
|
|
||||||
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.ANY;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
expect(component.displayValue$.next).toHaveBeenCalledWith('');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should not update display label if no valid value was provided', async () => {
|
|
||||||
spyOn(component.displayValue$, 'next');
|
|
||||||
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.IN_LAST;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await selectDropdownOption('date-range-advanced-in-last-option-weeks')
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
expect(component.displayValue$.next).toHaveBeenCalledWith('');
|
|
||||||
|
|
||||||
component.dateRangeTypeValue = component.DateRangeType.BETWEEN;
|
|
||||||
fixture.detectChanges();
|
|
||||||
await fixture.whenStable();
|
|
||||||
await clickElementByAutomationId('date-range-advanced-apply-btn');
|
|
||||||
fixture.detectChanges();
|
|
||||||
expect(component.displayValue$.next).toHaveBeenCalledWith('');
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should set values if initial value is provided', () => {
|
|
||||||
let value: any = {
|
|
||||||
dateRangeType: component.DateRangeType.ANY
|
|
||||||
}
|
|
||||||
component.startValue = value;
|
|
||||||
component.ngOnInit();
|
|
||||||
expect(component.getCurrentValue()).toEqual(value);
|
|
||||||
|
|
||||||
value = {
|
|
||||||
dateRangeType: component.DateRangeType.IN_LAST,
|
|
||||||
inLastValue: 5,
|
|
||||||
inLastValueType: component.InLastDateType.WEEKS
|
|
||||||
}
|
|
||||||
component.startValue = value;
|
|
||||||
component.ngOnInit();
|
|
||||||
expect(component.getCurrentValue()).toEqual(value);
|
|
||||||
|
|
||||||
value = {
|
|
||||||
dateRangeType: component.DateRangeType.BETWEEN,
|
|
||||||
betweenStartDate: '6/5/2023',
|
|
||||||
betweenEndDate: '6/10/2023'
|
|
||||||
}
|
|
||||||
component.startValue = value;
|
|
||||||
component.ngOnInit();
|
|
||||||
expect(component.getCurrentValue()).toEqual(value);
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should not allow selecting a date after the current date when Between option is selected, and no maxDate is provided', async () => {
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should not allow selecting a date after the maxDate when Between option is selected and maxDate is provided', async () => {
|
|
||||||
});
|
|
||||||
});
|
|
||||||
-221
@@ -1,221 +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 { Subject } from 'rxjs';
|
|
||||||
import { endOfDay, format, formatISO, parse, startOfDay } from 'date-fns';
|
|
||||||
import { DateAdapter, NativeDateAdapter } from '@angular/material/core';
|
|
||||||
import { TranslationService } 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';
|
|
||||||
|
|
||||||
enum DateRangeType {
|
|
||||||
ANY = 'ANY',
|
|
||||||
IN_LAST = 'IN_LAST',
|
|
||||||
BETWEEN = 'BETWEEN',
|
|
||||||
}
|
|
||||||
|
|
||||||
enum InLastDateType {
|
|
||||||
DAYS = 'DAYS',
|
|
||||||
WEEKS = 'WEEKS',
|
|
||||||
MONTHS = 'MONTHS'
|
|
||||||
}
|
|
||||||
|
|
||||||
interface SearchDateRangeAdvanced {
|
|
||||||
dateRangeType: DateRangeType;
|
|
||||||
|
|
||||||
[indexer: string]: any;
|
|
||||||
}
|
|
||||||
|
|
||||||
const DEFAULT_DATE_DISPLAY_FORMAT: string = 'dd-MMM-yy';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'adf-search-date-range-advanced',
|
|
||||||
templateUrl: './search-date-range-advanced.component.html',
|
|
||||||
styleUrls: ['./search-date-range-advanced.component.scss'],
|
|
||||||
providers: [
|
|
||||||
{provide: DateAdapter, useClass: NativeDateAdapter},
|
|
||||||
],
|
|
||||||
encapsulation: ViewEncapsulation.None,
|
|
||||||
host: {class: 'adf-search-date-range-advanced'}
|
|
||||||
})
|
|
||||||
export class SearchDateRangeAdvancedComponent implements SearchWidget, OnInit {
|
|
||||||
displayValue$: Subject<string> = new Subject<string>();
|
|
||||||
isActive: boolean;
|
|
||||||
|
|
||||||
id: string;
|
|
||||||
settings?: SearchWidgetSettings;
|
|
||||||
context?: SearchQueryBuilderService;
|
|
||||||
startValue: SearchDateRangeAdvanced;
|
|
||||||
disableUpdateOnSubmit: boolean;
|
|
||||||
maxDate: any;
|
|
||||||
dateRangeTypeValue: DateRangeType = DateRangeType.ANY;
|
|
||||||
inLastValue: string;
|
|
||||||
inLastValueType: InLastDateType = InLastDateType.DAYS;
|
|
||||||
betweenStartDate: any;
|
|
||||||
betweenEndDate: any;
|
|
||||||
|
|
||||||
DateRangeType = DateRangeType;
|
|
||||||
InLastDateType = InLastDateType;
|
|
||||||
|
|
||||||
private datePickerFormat: string;
|
|
||||||
|
|
||||||
constructor(private translate: TranslationService) {
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
this.datePickerFormat = this.settings?.dateFormat ? this.settings.dateFormat : DEFAULT_DATE_DISPLAY_FORMAT;
|
|
||||||
if (this.settings) {
|
|
||||||
if (!this.settings.maxDate || this.settings.maxDate === 'today') {
|
|
||||||
this.maxDate = endOfDay(new Date());
|
|
||||||
} else {
|
|
||||||
this.maxDate = endOfDay(parse(this.settings.maxDate, this.datePickerFormat, new Date()));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (this.startValue) {
|
|
||||||
this.setValue(this.startValue);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
getCurrentValue(): SearchDateRangeAdvanced {
|
|
||||||
let currentValue = {};
|
|
||||||
switch (this.dateRangeTypeValue) {
|
|
||||||
case DateRangeType.IN_LAST:
|
|
||||||
currentValue = {
|
|
||||||
inLastValue: this.inLastValue,
|
|
||||||
inLastValueType: this.inLastValueType
|
|
||||||
};
|
|
||||||
break;
|
|
||||||
case DateRangeType.BETWEEN:
|
|
||||||
currentValue = {
|
|
||||||
betweenStartDate: this.betweenStartDate,
|
|
||||||
betweenEndDate: this.betweenEndDate
|
|
||||||
};
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
return {
|
|
||||||
dateRangeType: this.dateRangeTypeValue,
|
|
||||||
...currentValue
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
hasValidValue(): boolean {
|
|
||||||
let isValid = false;
|
|
||||||
switch (this.dateRangeTypeValue) {
|
|
||||||
case DateRangeType.ANY:
|
|
||||||
isValid = true;
|
|
||||||
break;
|
|
||||||
case DateRangeType.IN_LAST:
|
|
||||||
if (this.inLastValue) {
|
|
||||||
isValid = true;
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case DateRangeType.BETWEEN:
|
|
||||||
if (this.betweenStartDate && this.betweenEndDate) {
|
|
||||||
isValid = true;
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
default:
|
|
||||||
isValid = false;
|
|
||||||
}
|
|
||||||
return isValid;
|
|
||||||
}
|
|
||||||
|
|
||||||
reset(): void {
|
|
||||||
this.isActive = false;
|
|
||||||
|
|
||||||
this.dateRangeTypeValue = DateRangeType.ANY;
|
|
||||||
this.inLastValue = '';
|
|
||||||
this.inLastValueType = InLastDateType.DAYS;
|
|
||||||
this.betweenStartDate = '';
|
|
||||||
this.betweenEndDate = '';
|
|
||||||
|
|
||||||
if (this.id && this.context) {
|
|
||||||
this.context.queryFragments[this.id] = '';
|
|
||||||
if (!this.disableUpdateOnSubmit) {
|
|
||||||
this.updateQuery();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
setValue(value: SearchDateRangeAdvanced) {
|
|
||||||
this.dateRangeTypeValue = value.dateRangeType ? value.dateRangeType : DateRangeType.ANY;
|
|
||||||
switch (this.dateRangeTypeValue) {
|
|
||||||
case DateRangeType.IN_LAST:
|
|
||||||
this.inLastValue = value.inLastValue;
|
|
||||||
this.inLastValueType = value.inLastValueType;
|
|
||||||
break;
|
|
||||||
case DateRangeType.BETWEEN:
|
|
||||||
this.betweenStartDate = value.betweenStartDate;
|
|
||||||
this.betweenEndDate = value.betweenEndDate;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
submitValues(): void {
|
|
||||||
let query = '';
|
|
||||||
this.isActive = true;
|
|
||||||
switch (this.dateRangeTypeValue) {
|
|
||||||
case DateRangeType.IN_LAST:
|
|
||||||
if (this.hasValidValue()) {
|
|
||||||
query = `${this.settings.field}:[NOW/DAY-${this.inLastValue}${this.inLastValueType} TO NOW/DAY+1DAY]`;
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case DateRangeType.BETWEEN:
|
|
||||||
if (this.hasValidValue()) {
|
|
||||||
const start = formatISO(startOfDay(this.betweenStartDate));
|
|
||||||
const end = formatISO(endOfDay(this.betweenEndDate));
|
|
||||||
query = `${this.settings.field}:['${start}' TO '${end}']`;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.context.queryFragments[this.id] = query;
|
|
||||||
this.updateDisplayValue();
|
|
||||||
if (!this.disableUpdateOnSubmit) {
|
|
||||||
this.updateQuery();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
updateDisplayValue(): void {
|
|
||||||
let displayLabel = '';
|
|
||||||
switch (this.dateRangeTypeValue) {
|
|
||||||
case DateRangeType.IN_LAST:
|
|
||||||
if (this.hasValidValue()) {
|
|
||||||
displayLabel = this.translate.instant(`SEARCH.DATE_RANGE_ADVANCED.IN_LAST_DISPLAY_LABELS.${this.inLastValueType}`, {value: this.inLastValue});
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
case DateRangeType.BETWEEN:
|
|
||||||
if (this.hasValidValue()) {
|
|
||||||
const start = format(startOfDay(this.betweenStartDate), this.datePickerFormat);
|
|
||||||
const end = format(endOfDay(this.betweenEndDate), this.datePickerFormat);
|
|
||||||
displayLabel = `${start} - ${end}`;
|
|
||||||
}
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
this.displayValue$.next(displayLabel);
|
|
||||||
}
|
|
||||||
|
|
||||||
private updateQuery() {
|
|
||||||
if (this.id && this.context) {
|
|
||||||
this.context.update();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//TODO: Format dates for Between date range type
|
|
||||||
+8
@@ -0,0 +1,8 @@
|
|||||||
|
import { SearchFilterTabDirective } from './search-filter-tab.directive';
|
||||||
|
|
||||||
|
describe('SearchFilterTabDirective', () => {
|
||||||
|
it('should create an instance', () => {
|
||||||
|
const directive = new SearchFilterTabDirective();
|
||||||
|
expect(directive).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
-9
@@ -3,12 +3,3 @@
|
|||||||
<ng-container *ngTemplateOutlet="tabContent.templateRef"></ng-container>
|
<ng-container *ngTemplateOutlet="tabContent.templateRef"></ng-container>
|
||||||
</mat-tab>
|
</mat-tab>
|
||||||
</mat-tab-group>
|
</mat-tab-group>
|
||||||
|
|
||||||
<div class="adf-facet-buttons adf-facet-buttons--topSpace" *ngIf="!settings?.hideDefaultAction">
|
|
||||||
<button mat-button color="primary" type="button" (click)="reset()" data-automation-id="tab-clear-btn">
|
|
||||||
{{ 'SEARCH.FILTER.ACTIONS.CLEAR' | translate }}
|
|
||||||
</button>
|
|
||||||
<button mat-button color="primary" (click)="submitValues()" data-automation-id="tab-apply-btn">
|
|
||||||
{{ 'SEARCH.FILTER.ACTIONS.APPLY' | translate }}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|||||||
Reference in New Issue
Block a user