@progress/kendo-angular-grid
Version:
Kendo UI Grid for Angular - high performance data grid with paging, filtering, virtualization, CRUD, and more.
173 lines (172 loc) • 6.26 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
// eslint-disable no-access-missing-member
import { Component, Input } from '@angular/core';
import { ColumnComponent } from '../columns/column.component';
import { FilterService } from './filter.service';
import { BaseFilterCellComponent, localizeOperators } from './base-filter-cell.component';
import { isNullOrEmptyString, extractFormat } from "../utils";
import { toJSON } from './operators/filter-operator.base';
import { ContextService } from '../common/provider.service';
import * as i0 from "@angular/core";
import * as i1 from "./filter.service";
import * as i2 from "../common/provider.service";
const dateOperators = localizeOperators({
"filterEqOperator": "eq",
"filterNotEqOperator": "neq",
"filterAfterOrEqualOperator": "gte",
"filterAfterOperator": "gt",
"filterBeforeOrEqualOperator": "lte",
"filterBeforeOperator": "lt",
"filterIsNullOperator": "isnull",
"filterIsNotNullOperator": "isnotnull"
});
/**
* @hidden
*/
export class DateFilterComponent extends BaseFilterCellComponent {
ctx;
/**
* Sets the column for this filter.
* @type {ColumnComponent}
*/
column;
/**
* Sets the default filter operator.
* @type {string}
* @default 'gte'
*/
operator = "gte";
/**
* Gets the current filter for the column field.
* @readonly
* @type {FilterDescriptor}
*/
get currentFilter() {
return this.filterByField(this.column.field);
}
/**
* Sets the date format used when the component is not focused.
* Uses `column.format` if set.
*/
set format(value) {
this._format = value;
}
/**
* Gets the date format used when the component is not focused.
* Uses `column.format` if set.
* @readonly
* @type {string}
*/
get format() {
return !isNullOrEmptyString(this._format) ? this._format : this.columnFormat;
}
/**
* Sets the smallest valid date value.
* @type {Date}
*/
min;
/**
* Sets the largest valid date value.
* @type {Date}
*/
max;
/**
* Sets the descriptions for the format sections in the input field.
* [See example](slug:placeholders_datepicker#toc-format-sections-description).
*/
formatPlaceholder;
/**
* Sets the hint shown when the value is `null`.
* [See example](slug:placeholders_datepicker#toc-text-hints).
*/
placeholder;
/**
* Sets the active calendar view when the calendar opens.
* Set `activeView` within the `topView`-`bottomView` range.
* @default 'month'
*/
activeView = "month";
/**
* Defines the lowest calendar view level the user can navigate to.
* @default 'month'
*/
bottomView = "month";
/**
* Defines the highest calendar view level the user can navigate to.
* @default 'century'
*/
topView = "century";
/**
* When `true`, shows a week number column in the `month` view.
* @default false
*/
weekNumber = false;
/**
* Gets the current filter operator for the column field.
* @readonly
* @type {string}
*/
get currentOperator() {
return this.currentFilter ? this.currentFilter.operator : this.operator;
}
get columnFormat() {
return this.column && !isNullOrEmptyString(this.column.format) ?
extractFormat(this.column.format) : "d";
}
_format;
subscription;
constructor(filterService, ctx) {
super(filterService);
this.ctx = ctx;
this.defaultOperators = dateOperators(this.ctx.localization);
}
ngOnInit() {
this.subscription = this.ctx.localization.changes.subscribe(this.localizationChange.bind(this));
}
ngOnDestroy() {
if (this.subscription) {
this.subscription.unsubscribe();
}
super.ngOnDestroy();
}
localizationChange() {
this.defaultOperators = dateOperators(this.ctx.localization);
if (this.operatorList.length) {
this.operators = toJSON(this.operatorList.toArray());
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DateFilterComponent, deps: [{ token: i1.FilterService }, { token: i2.ContextService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DateFilterComponent, selector: "kendo-grid-date-filter-base", inputs: { column: "column", operator: "operator", format: "format", min: "min", max: "max", formatPlaceholder: "formatPlaceholder", placeholder: "placeholder", activeView: "activeView", bottomView: "bottomView", topView: "topView", weekNumber: "weekNumber" }, usesInheritance: true, ngImport: i0, template: ``, isInline: true });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DateFilterComponent, decorators: [{
type: Component,
args: [{
selector: 'kendo-grid-date-filter-base',
template: ``
}]
}], ctorParameters: function () { return [{ type: i1.FilterService }, { type: i2.ContextService }]; }, propDecorators: { column: [{
type: Input
}], operator: [{
type: Input
}], format: [{
type: Input
}], min: [{
type: Input
}], max: [{
type: Input
}], formatPlaceholder: [{
type: Input
}], placeholder: [{
type: Input
}], activeView: [{
type: Input
}], bottomView: [{
type: Input
}], topView: [{
type: Input
}], weekNumber: [{
type: Input
}] } });