@webilix/ngx-table-m3 0.0.33 → 0.0.35
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -30,10 +30,10 @@ class FilterDateComponent {
|
|
|
30
30
|
data = inject(FILTER_DATA);
|
|
31
31
|
value = inject(FILTER_VALUE);
|
|
32
32
|
onChange = inject(FILTER_CHANGE);
|
|
33
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
34
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
33
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
34
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: FilterDateComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "filter-date" } }, ngImport: i0, template: "<ngx-calendar-date\n [value]=\"this.value\"\n [minDate]=\"this.data.filter.minDate\"\n [maxDate]=\"this.data.filter.maxDate\"\n (onChange)=\"onChange($event.date)\"\n></ngx-calendar-date>\n", styles: [""], dependencies: [{ kind: "component", type: NgxCalendarDateComponent, selector: "ngx-calendar-date", inputs: ["value", "minDate", "maxDate"], outputs: ["onChange"] }] });
|
|
35
35
|
}
|
|
36
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
36
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterDateComponent, decorators: [{
|
|
37
37
|
type: Component,
|
|
38
38
|
args: [{ host: { selector: 'filter-date' }, imports: [NgxCalendarDateComponent], template: "<ngx-calendar-date\n [value]=\"this.value\"\n [minDate]=\"this.data.filter.minDate\"\n [maxDate]=\"this.data.filter.maxDate\"\n (onChange)=\"onChange($event.date)\"\n></ngx-calendar-date>\n" }]
|
|
39
39
|
}] });
|
|
@@ -89,10 +89,10 @@ class FilterMultiSelectComponent {
|
|
|
89
89
|
this.value.push(id);
|
|
90
90
|
this.onChange(this.value.length === 0 ? undefined : this.value);
|
|
91
91
|
}
|
|
92
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
93
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
92
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterMultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
93
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: FilterMultiSelectComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "filter-multi-select" }, properties: { "className": "this.className" } }, ngImport: i0, template: "@if (data.filter.options.length > 20) {\n<div class=\"filter-item-search\">\n <input\n type=\"text\"\n [placeholder]=\"'\u062C\u0633\u062A\u062C\u0648'\"\n [class.ngx-table-m3-en]=\"data.filter.english\"\n (input)=\"setOptions(searchInput.value.trim())\"\n #searchInput\n />\n</div>\n}\n\n<div class=\"filter-items\">\n @for (item of options; track $index) {\n <mat-checkbox [checked]=\"(value || []).includes(item.id)\" (change)=\"updateValue(item.id, $event.checked)\">\n <div class=\"title\" [class.ngx-table-m3-en]=\"data.filter.english\">{{ item.title }}</div>\n </mat-checkbox>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }] });
|
|
94
94
|
}
|
|
95
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
95
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterMultiSelectComponent, decorators: [{
|
|
96
96
|
type: Component,
|
|
97
97
|
args: [{ host: { selector: 'filter-multi-select' }, imports: [MatCheckbox], template: "@if (data.filter.options.length > 20) {\n<div class=\"filter-item-search\">\n <input\n type=\"text\"\n [placeholder]=\"'\u062C\u0633\u062A\u062C\u0648'\"\n [class.ngx-table-m3-en]=\"data.filter.english\"\n (input)=\"setOptions(searchInput.value.trim())\"\n #searchInput\n />\n</div>\n}\n\n<div class=\"filter-items\">\n @for (item of options; track $index) {\n <mat-checkbox [checked]=\"(value || []).includes(item.id)\" (change)=\"updateValue(item.id, $event.checked)\">\n <div class=\"title\" [class.ngx-table-m3-en]=\"data.filter.english\">{{ item.title }}</div>\n </mat-checkbox>\n }\n</div>\n" }]
|
|
98
98
|
}], propDecorators: { className: [{
|
|
@@ -184,10 +184,10 @@ class FilterNumberComponent {
|
|
|
184
184
|
updateQuery() {
|
|
185
185
|
this.onChange(this.query && this.mode ? { query: this.query, mode: this.mode } : undefined);
|
|
186
186
|
}
|
|
187
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
188
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
187
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
188
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: FilterNumberComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "filter-number" }, properties: { "className": "this.className" } }, providers: [provideNgxMask()], viewQueries: [{ propertyName: "fromInput", first: true, predicate: ["fromInput"], descendants: true }, { propertyName: "numberInput", first: true, predicate: ["numberInput"], descendants: true }], ngImport: i0, template: "<div class=\"filter-number\">\n @if (!this.data.filter.mode) {\n <div class=\"modes\">\n @for (item of modes; track $index) {\n <div class=\"mode\" [class.selected]=\"item.type === mode\" (click)=\"setMode(item.type)\">\n {{ item.title }}\n </div>\n }\n </div>\n }\n\n <!-- INPUTS -->\n <div class=\"inputs\" [style.display]=\"mode ? 'flex' : 'none'\">\n <!-- BETWEEN -->\n <input\n type=\"text\"\n [inputMode]=\"'numeric'\"\n [ngModel]=\"fromQuery\"\n [placeholder]=\"'\u062D\u062F\u0627\u0642\u0644'\"\n class=\"ngx-table-m3-en\"\n [mask]=\"'separator.0'\"\n thousandSeparator=\",\"\n decimalMarker=\".\"\n [allowNegativeNumbers]=\"true\"\n [maxLength]=\"15\"\n [inputTransformFn]=\"inputTransformFn\"\n [style.display]=\"mode === 'BETWEEN' ? 'initial' : 'none'\"\n (input)=\"setQuery(fromInput.value, toInput.value)\"\n #fromInput\n />\n <input\n type=\"text\"\n [inputMode]=\"'numeric'\"\n [ngModel]=\"toQuery\"\n [placeholder]=\"'\u062D\u062F\u0627\u06A9\u062A\u0631'\"\n class=\"ngx-table-m3-en\"\n [mask]=\"'separator.0'\"\n thousandSeparator=\",\"\n decimalMarker=\".\"\n [allowNegativeNumbers]=\"true\"\n [maxLength]=\"15\"\n [inputTransformFn]=\"inputTransformFn\"\n [style.display]=\"mode === 'BETWEEN' ? 'initial' : 'none'\"\n (input)=\"setQuery(fromInput.value, toInput.value)\"\n #toInput\n />\n <!-- OTHERS -->\n <input\n type=\"text\"\n [inputMode]=\"'numeric'\"\n [ngModel]=\"numberQuery\"\n [placeholder]=\"'\u0645\u0642\u062F\u0627\u0631'\"\n class=\"ngx-table-m3-en\"\n [mask]=\"'separator.0'\"\n thousandSeparator=\",\"\n decimalMarker=\".\"\n [allowNegativeNumbers]=\"true\"\n [maxLength]=\"15\"\n [inputTransformFn]=\"inputTransformFn\"\n [style.display]=\"mode !== 'BETWEEN' ? 'initial' : 'none'\"\n (input)=\"setQuery(numberInput.value, '')\"\n #numberInput\n />\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }] });
|
|
189
189
|
}
|
|
190
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
190
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterNumberComponent, decorators: [{
|
|
191
191
|
type: Component,
|
|
192
192
|
args: [{ host: { selector: 'filter-number' }, imports: [FormsModule, NgxMaskDirective], providers: [provideNgxMask()], template: "<div class=\"filter-number\">\n @if (!this.data.filter.mode) {\n <div class=\"modes\">\n @for (item of modes; track $index) {\n <div class=\"mode\" [class.selected]=\"item.type === mode\" (click)=\"setMode(item.type)\">\n {{ item.title }}\n </div>\n }\n </div>\n }\n\n <!-- INPUTS -->\n <div class=\"inputs\" [style.display]=\"mode ? 'flex' : 'none'\">\n <!-- BETWEEN -->\n <input\n type=\"text\"\n [inputMode]=\"'numeric'\"\n [ngModel]=\"fromQuery\"\n [placeholder]=\"'\u062D\u062F\u0627\u0642\u0644'\"\n class=\"ngx-table-m3-en\"\n [mask]=\"'separator.0'\"\n thousandSeparator=\",\"\n decimalMarker=\".\"\n [allowNegativeNumbers]=\"true\"\n [maxLength]=\"15\"\n [inputTransformFn]=\"inputTransformFn\"\n [style.display]=\"mode === 'BETWEEN' ? 'initial' : 'none'\"\n (input)=\"setQuery(fromInput.value, toInput.value)\"\n #fromInput\n />\n <input\n type=\"text\"\n [inputMode]=\"'numeric'\"\n [ngModel]=\"toQuery\"\n [placeholder]=\"'\u062D\u062F\u0627\u06A9\u062A\u0631'\"\n class=\"ngx-table-m3-en\"\n [mask]=\"'separator.0'\"\n thousandSeparator=\",\"\n decimalMarker=\".\"\n [allowNegativeNumbers]=\"true\"\n [maxLength]=\"15\"\n [inputTransformFn]=\"inputTransformFn\"\n [style.display]=\"mode === 'BETWEEN' ? 'initial' : 'none'\"\n (input)=\"setQuery(fromInput.value, toInput.value)\"\n #toInput\n />\n <!-- OTHERS -->\n <input\n type=\"text\"\n [inputMode]=\"'numeric'\"\n [ngModel]=\"numberQuery\"\n [placeholder]=\"'\u0645\u0642\u062F\u0627\u0631'\"\n class=\"ngx-table-m3-en\"\n [mask]=\"'separator.0'\"\n thousandSeparator=\",\"\n decimalMarker=\".\"\n [allowNegativeNumbers]=\"true\"\n [maxLength]=\"15\"\n [inputTransformFn]=\"inputTransformFn\"\n [style.display]=\"mode !== 'BETWEEN' ? 'initial' : 'none'\"\n (input)=\"setQuery(numberInput.value, '')\"\n #numberInput\n />\n </div>\n</div>\n" }]
|
|
193
193
|
}], propDecorators: { className: [{
|
|
@@ -288,10 +288,10 @@ class FilterSearchComponent {
|
|
|
288
288
|
this.mode = mode;
|
|
289
289
|
this.onChange(this.query ? { query: this.query, mode: this.mode || 'PHRASE' } : undefined);
|
|
290
290
|
}
|
|
291
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
292
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
291
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
292
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: FilterSearchComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "filter-search" }, properties: { "className": "this.className" } }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<div class=\"filter-search\">\n <input\n type=\"text\"\n [ngModel]=\"query || ''\"\n [placeholder]=\"'\u062C\u0633\u062A\u062C\u0648'\"\n [class.ngx-table-m3-en]=\"data.filter.english\"\n (input)=\"updateQuery(searchInput.value)\"\n #searchInput\n />\n</div>\n\n@if (!data.filter.mode) {\n<div class=\"filter-items\">\n <mat-radio-group (change)=\"updateMode($event.value)\">\n <mat-radio-button [value]=\"'PHRASE'\" [checked]=\"mode === 'PHRASE'\">\n <div class=\"title\">\u0639\u0628\u0627\u0631\u062A \u06A9\u0627\u0645\u0644</div>\n </mat-radio-button>\n <mat-radio-button [value]=\"'ALL'\" [checked]=\"mode === 'ALL'\">\n <div class=\"title\">\u0647\u0645\u0647 \u06A9\u0644\u0645\u0627\u062A</div>\n </mat-radio-button>\n <mat-radio-button [value]=\"'EACH'\" [checked]=\"mode === 'EACH'\">\n <div class=\"title\">\u0647\u0631 \u06A9\u062F\u0627\u0645 \u0627\u0632 \u06A9\u0644\u0645\u0627\u062A</div>\n </mat-radio-button>\n </mat-radio-group>\n</div>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }] });
|
|
293
293
|
}
|
|
294
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
294
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterSearchComponent, decorators: [{
|
|
295
295
|
type: Component,
|
|
296
296
|
args: [{ host: { selector: 'filter-search' }, imports: [FormsModule, MatRadioButton, MatRadioGroup], template: "<div class=\"filter-search\">\n <input\n type=\"text\"\n [ngModel]=\"query || ''\"\n [placeholder]=\"'\u062C\u0633\u062A\u062C\u0648'\"\n [class.ngx-table-m3-en]=\"data.filter.english\"\n (input)=\"updateQuery(searchInput.value)\"\n #searchInput\n />\n</div>\n\n@if (!data.filter.mode) {\n<div class=\"filter-items\">\n <mat-radio-group (change)=\"updateMode($event.value)\">\n <mat-radio-button [value]=\"'PHRASE'\" [checked]=\"mode === 'PHRASE'\">\n <div class=\"title\">\u0639\u0628\u0627\u0631\u062A \u06A9\u0627\u0645\u0644</div>\n </mat-radio-button>\n <mat-radio-button [value]=\"'ALL'\" [checked]=\"mode === 'ALL'\">\n <div class=\"title\">\u0647\u0645\u0647 \u06A9\u0644\u0645\u0627\u062A</div>\n </mat-radio-button>\n <mat-radio-button [value]=\"'EACH'\" [checked]=\"mode === 'EACH'\">\n <div class=\"title\">\u0647\u0631 \u06A9\u062F\u0627\u0645 \u0627\u0632 \u06A9\u0644\u0645\u0627\u062A</div>\n </mat-radio-button>\n </mat-radio-group>\n</div>\n}\n" }]
|
|
297
297
|
}], propDecorators: { className: [{
|
|
@@ -352,10 +352,10 @@ class FilterSelectComponent {
|
|
|
352
352
|
this.value = id;
|
|
353
353
|
this.onChange(this.value);
|
|
354
354
|
}
|
|
355
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
356
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
355
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
356
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: FilterSelectComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "filter-select" }, properties: { "className": "this.className" } }, ngImport: i0, template: "@if (data.filter.options.length > 20) {\n<div class=\"filter-item-search\">\n <input\n type=\"text\"\n [placeholder]=\"'\u062C\u0633\u062A\u062C\u0648'\"\n [class.ngx-table-m3-en]=\"data.filter.english\"\n (input)=\"setOptions(searchInput.value.trim())\"\n #searchInput\n />\n</div>\n}\n\n<div class=\"filter-items\">\n <mat-radio-group (change)=\"updateValue($event.value)\">\n @for (item of options; track $index) {\n <mat-radio-button [value]=\"item.id\" [checked]=\"item.id === value\">\n <div class=\"title\" [class.ngx-table-m3-en]=\"data.filter.english\">{{ item.title }}</div>\n </mat-radio-button>\n }\n </mat-radio-group>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }] });
|
|
357
357
|
}
|
|
358
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
358
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterSelectComponent, decorators: [{
|
|
359
359
|
type: Component,
|
|
360
360
|
args: [{ host: { selector: 'filter-select' }, imports: [MatRadioButton, MatRadioGroup], template: "@if (data.filter.options.length > 20) {\n<div class=\"filter-item-search\">\n <input\n type=\"text\"\n [placeholder]=\"'\u062C\u0633\u062A\u062C\u0648'\"\n [class.ngx-table-m3-en]=\"data.filter.english\"\n (input)=\"setOptions(searchInput.value.trim())\"\n #searchInput\n />\n</div>\n}\n\n<div class=\"filter-items\">\n <mat-radio-group (change)=\"updateValue($event.value)\">\n @for (item of options; track $index) {\n <mat-radio-button [value]=\"item.id\" [checked]=\"item.id === value\">\n <div class=\"title\" [class.ngx-table-m3-en]=\"data.filter.english\">{{ item.title }}</div>\n </mat-radio-button>\n }\n </mat-radio-group>\n</div>\n" }]
|
|
361
361
|
}], propDecorators: { className: [{
|
|
@@ -412,10 +412,10 @@ class FilterComponent {
|
|
|
412
412
|
if (event.code === 'Enter' && this.value)
|
|
413
413
|
this.closeContainer({ value: this.value });
|
|
414
414
|
}
|
|
415
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
416
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
415
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
416
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: FilterComponent, isStandalone: true, selector: "filter", host: { listeners: { "window:keydown": "onKeydown($event)" }, properties: { "className": "this.className" } }, ngImport: i0, template: "<div class=\"filter-content\">\n <ng-container *ngComponentOutlet=\"filterInfo[data.filter.filter.type].component; injector: injector\"></ng-container>\n</div>\n\n<div class=\"filter-footer\">\n <button mat-stroked-button type=\"button\" [disabled]=\"!value\" (click)=\"closeContainer({ value: undefined })\">\n \u0644\u063A\u0648 \u0641\u06CC\u0644\u062A\u0631\n </button>\n <button mat-flat-button type=\"button\" class=\"confirm\" [disabled]=\"!value\" (click)=\"closeContainer({value})\">\n \u062A\u0627\u06CC\u06CC\u062F\n </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host .filter-content{display:block;overflow-x:hidden;overflow-y:auto;max-height:60vh}\n"], dependencies: [{ kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }] });
|
|
417
417
|
}
|
|
418
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
418
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterComponent, decorators: [{
|
|
419
419
|
type: Component,
|
|
420
420
|
args: [{ selector: 'filter', host: { '(window:keydown)': 'onKeydown($event)' }, imports: [MatButton, NgComponentOutlet], template: "<div class=\"filter-content\">\n <ng-container *ngComponentOutlet=\"filterInfo[data.filter.filter.type].component; injector: injector\"></ng-container>\n</div>\n\n<div class=\"filter-footer\">\n <button mat-stroked-button type=\"button\" [disabled]=\"!value\" (click)=\"closeContainer({ value: undefined })\">\n \u0644\u063A\u0648 \u0641\u06CC\u0644\u062A\u0631\n </button>\n <button mat-flat-button type=\"button\" class=\"confirm\" [disabled]=\"!value\" (click)=\"closeContainer({value})\">\n \u062A\u0627\u06CC\u06CC\u062F\n </button>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host .filter-content{display:block;overflow-x:hidden;overflow-y:auto;max-height:60vh}\n"] }]
|
|
421
421
|
}], propDecorators: { className: [{
|
|
@@ -463,10 +463,10 @@ class FilterService {
|
|
|
463
463
|
.bottomSheet((response) => resolve({ ...filter, value: response.value }), () => resolve(undefined));
|
|
464
464
|
});
|
|
465
465
|
}
|
|
466
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
467
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
466
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterService, deps: [{ token: i1$1.ActivatedRoute }, { token: i2.NgxHelperContainerService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
467
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterService });
|
|
468
468
|
}
|
|
469
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
469
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: FilterService, decorators: [{
|
|
470
470
|
type: Injectable
|
|
471
471
|
}], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i2.NgxHelperContainerService }] });
|
|
472
472
|
|
|
@@ -555,10 +555,10 @@ class ViewActionComponent {
|
|
|
555
555
|
if (result)
|
|
556
556
|
this.router.navigate(result);
|
|
557
557
|
}
|
|
558
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
559
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
558
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewActionComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
559
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: ViewActionComponent, isStandalone: true, selector: "view-action", inputs: { actions: "actions", item: "item", viewConfig: "viewConfig", isMobile: "isMobile" }, host: { properties: { "className": "this.className" } }, usesOnChanges: true, ngImport: i0, template: "<!-- ROW -->\n@for (item of inRow; track $index) {\n<!-- DESKTOP -->\n@if (!isMobile) {\n<button\n mat-button\n type=\"button\"\n class=\"desktop-view\"\n [style.color]=\"item.isDisabled ? '' : item.color\"\n [disabled]=\"item.isDisabled\"\n (click)=\"onClick(item.action)\"\n>\n {{ item.title }}\n</button>\n}\n<!-- MOBILE -->\n@else {\n<button mat-icon-button type=\"button\" [disabled]=\"item.isDisabled\" (click)=\"onClick(item.action)\">\n <mat-icon [style.color]=\"item.isDisabled ? '' : item.color\" [class.disabled]=\"item.isDisabled\">{{ item.icon }}</mat-icon>\n</button>\n} }\n\n<!-- MENU -->\n@if (this.inMenu.length > 0) {\n<!-- DESKTOP -->\n@if (!isMobile) {\n<button mat-button type=\"button\" class=\"desktop-view\" [matMenuTriggerFor]=\"actionMenu\">\n {{ viewConfig.actionMenuTitle }}\n</button>\n}\n<!-- MOBILE -->\n@else {\n<button mat-icon-button type=\"button\" [matMenuTriggerFor]=\"actionMenu\">\n <mat-icon>more_vert</mat-icon>\n</button>\n}\n\n<mat-menu #actionMenu=\"matMenu\" [xPosition]=\"'before'\" class=\"ngx-table-action-menu\">\n @for (item of inMenu; track $index) {\n <!-- DIVIDER -->\n @if (item === 'DIVIDER') {\n <mat-divider></mat-divider>\n }\n\n <!-- MENU ITEM -->\n @else {\n <button\n mat-menu-item\n type=\"button\"\n [class.disabled]=\"item.isDisabled\"\n [style.color]=\"item.isDisabled ? '' : item.color\"\n (click)=\"onClick(item.action)\"\n [disabled]=\"item.isDisabled\"\n >\n <span class=\"title\">{{ item.title }}</span>\n <mat-icon [style.color]=\"item.isDisabled ? '' : item.color\">{{ item.icon }}</mat-icon>\n </button>\n } }\n</mat-menu>\n}\n", styles: ["::ng-deep .ngx-table-action-menu .title{font-size:90%!important}::ng-deep .ngx-table-action-menu mat-icon{font-size:120%;margin:0 0 0 .75rem!important}::ng-deep .ngx-table-action-menu .mat-mdc-menu-content{padding:0}::ng-deep .ngx-table-action-menu .mat-mdc-menu-item{direction:rtl;text-align:right}::ng-deep .ngx-table-action-menu .mat-divider{margin:0;border-top-color:var(--outline-variant)}\n"], dependencies: [{ kind: "component", type: MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
|
|
560
560
|
}
|
|
561
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
561
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewActionComponent, decorators: [{
|
|
562
562
|
type: Component,
|
|
563
563
|
args: [{ selector: 'view-action', imports: [MatButton, MatDivider, MatIconButton, MatIcon, MatMenuModule], template: "<!-- ROW -->\n@for (item of inRow; track $index) {\n<!-- DESKTOP -->\n@if (!isMobile) {\n<button\n mat-button\n type=\"button\"\n class=\"desktop-view\"\n [style.color]=\"item.isDisabled ? '' : item.color\"\n [disabled]=\"item.isDisabled\"\n (click)=\"onClick(item.action)\"\n>\n {{ item.title }}\n</button>\n}\n<!-- MOBILE -->\n@else {\n<button mat-icon-button type=\"button\" [disabled]=\"item.isDisabled\" (click)=\"onClick(item.action)\">\n <mat-icon [style.color]=\"item.isDisabled ? '' : item.color\" [class.disabled]=\"item.isDisabled\">{{ item.icon }}</mat-icon>\n</button>\n} }\n\n<!-- MENU -->\n@if (this.inMenu.length > 0) {\n<!-- DESKTOP -->\n@if (!isMobile) {\n<button mat-button type=\"button\" class=\"desktop-view\" [matMenuTriggerFor]=\"actionMenu\">\n {{ viewConfig.actionMenuTitle }}\n</button>\n}\n<!-- MOBILE -->\n@else {\n<button mat-icon-button type=\"button\" [matMenuTriggerFor]=\"actionMenu\">\n <mat-icon>more_vert</mat-icon>\n</button>\n}\n\n<mat-menu #actionMenu=\"matMenu\" [xPosition]=\"'before'\" class=\"ngx-table-action-menu\">\n @for (item of inMenu; track $index) {\n <!-- DIVIDER -->\n @if (item === 'DIVIDER') {\n <mat-divider></mat-divider>\n }\n\n <!-- MENU ITEM -->\n @else {\n <button\n mat-menu-item\n type=\"button\"\n [class.disabled]=\"item.isDisabled\"\n [style.color]=\"item.isDisabled ? '' : item.color\"\n (click)=\"onClick(item.action)\"\n [disabled]=\"item.isDisabled\"\n >\n <span class=\"title\">{{ item.title }}</span>\n <mat-icon [style.color]=\"item.isDisabled ? '' : item.color\">{{ item.icon }}</mat-icon>\n </button>\n } }\n</mat-menu>\n}\n", styles: ["::ng-deep .ngx-table-action-menu .title{font-size:90%!important}::ng-deep .ngx-table-action-menu mat-icon{font-size:120%;margin:0 0 0 .75rem!important}::ng-deep .ngx-table-action-menu .mat-mdc-menu-content{padding:0}::ng-deep .ngx-table-action-menu .mat-mdc-menu-item{direction:rtl;text-align:right}::ng-deep .ngx-table-action-menu .mat-divider{margin:0;border-top-color:var(--outline-variant)}\n"] }]
|
|
564
564
|
}], ctorParameters: () => [{ type: i1$1.Router }], propDecorators: { className: [{
|
|
@@ -588,10 +588,10 @@ class ColumnDateComponent {
|
|
|
588
588
|
column = inject(COLUMN_TYPE);
|
|
589
589
|
value = inject(COLUMN_VALUE);
|
|
590
590
|
config = inject(COLUMN_CONFIG);
|
|
591
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
592
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
591
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnDateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
592
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: ColumnDateComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-date" } }, ngImport: i0, template: "<div [style.display]=\"'inline-block'\" [class.ngx-table-m3-deactive]=\"config.isDeactive\">\n {{ value | ngxHelperDate : { format: column.format } }}\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: NgxHelperDatePipe, name: "ngxHelperDate" }] });
|
|
593
593
|
}
|
|
594
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
594
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnDateComponent, decorators: [{
|
|
595
595
|
type: Component,
|
|
596
596
|
args: [{ host: { selector: 'column-date' }, imports: [NgxHelperDatePipe], template: "<div [style.display]=\"'inline-block'\" [class.ngx-table-m3-deactive]=\"config.isDeactive\">\n {{ value | ngxHelperDate : { format: column.format } }}\n</div>\n" }]
|
|
597
597
|
}] });
|
|
@@ -609,10 +609,10 @@ class ColumnDurationComponent {
|
|
|
609
609
|
column = inject(COLUMN_TYPE);
|
|
610
610
|
value = inject(COLUMN_VALUE);
|
|
611
611
|
config = inject(COLUMN_CONFIG);
|
|
612
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
613
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
612
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnDurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
613
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: ColumnDurationComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-duration" } }, ngImport: i0, template: "<div\n [style.display]=\"'inline-block'\"\n [style.direction]=\"config.isEN || column.format === 'FULL' ? 'ltr' : 'rtl'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperDuration : { english: config.isEN, format: column.format } }}\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: NgxHelperDurationPipe, name: "ngxHelperDuration" }] });
|
|
614
614
|
}
|
|
615
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
615
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnDurationComponent, decorators: [{
|
|
616
616
|
type: Component,
|
|
617
617
|
args: [{ host: { selector: 'column-duration' }, imports: [NgxHelperDurationPipe], template: "<div\n [style.display]=\"'inline-block'\"\n [style.direction]=\"config.isEN || column.format === 'FULL' ? 'ltr' : 'rtl'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperDuration : { english: config.isEN, format: column.format } }}\n</div>\n" }]
|
|
618
618
|
}] });
|
|
@@ -641,10 +641,10 @@ class ColumnFileSizeComponent {
|
|
|
641
641
|
column = inject(COLUMN_TYPE);
|
|
642
642
|
value = inject(COLUMN_VALUE);
|
|
643
643
|
config = inject(COLUMN_CONFIG);
|
|
644
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
645
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
644
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnFileSizeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
645
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: ColumnFileSizeComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-file-size" } }, ngImport: i0, template: "<div\n [style.display]=\"'inline-block'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperFileSize : { english: config.isEN } }}\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: NgxHelperFileSizePipe, name: "ngxHelperFileSize" }] });
|
|
646
646
|
}
|
|
647
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
647
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnFileSizeComponent, decorators: [{
|
|
648
648
|
type: Component,
|
|
649
649
|
args: [{ host: { selector: 'column-file-size' }, imports: [NgxHelperFileSizePipe], template: "<div\n [style.display]=\"'inline-block'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperFileSize : { english: config.isEN } }}\n</div>\n" }]
|
|
650
650
|
}] });
|
|
@@ -662,10 +662,10 @@ class ColumnMobileComponent {
|
|
|
662
662
|
column = inject(COLUMN_TYPE);
|
|
663
663
|
value = inject(COLUMN_VALUE);
|
|
664
664
|
config = inject(COLUMN_CONFIG);
|
|
665
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
666
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
665
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnMobileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
666
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: ColumnMobileComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-mobile" } }, ngImport: i0, template: "<div\n [style.display]=\"'inline-block'\"\n [style.direction]=\"'ltr'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperMobile }}\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: NgxHelperMobilePipe, name: "ngxHelperMobile" }] });
|
|
667
667
|
}
|
|
668
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
668
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnMobileComponent, decorators: [{
|
|
669
669
|
type: Component,
|
|
670
670
|
args: [{ host: { selector: 'column-mobile' }, imports: [NgxHelperMobilePipe], template: "<div\n [style.display]=\"'inline-block'\"\n [style.direction]=\"'ltr'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperMobile }}\n</div>\n" }]
|
|
671
671
|
}] });
|
|
@@ -683,10 +683,10 @@ class ColumnNumberComponent {
|
|
|
683
683
|
column = inject(COLUMN_TYPE);
|
|
684
684
|
value = inject(COLUMN_VALUE);
|
|
685
685
|
config = inject(COLUMN_CONFIG);
|
|
686
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
687
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
686
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
687
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: ColumnNumberComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-number" } }, ngImport: i0, template: "<div\n [style.display]=\"'inline-block'\"\n [style.direction]=\"'ltr'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperNumber : { english: config.isEN, fractionDigits: column.fractionDigits } }}\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: NgxHelperNumberPipe, name: "ngxHelperNumber" }] });
|
|
688
688
|
}
|
|
689
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
689
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnNumberComponent, decorators: [{
|
|
690
690
|
type: Component,
|
|
691
691
|
args: [{ host: { selector: 'column-number' }, imports: [NgxHelperNumberPipe], template: "<div\n [style.display]=\"'inline-block'\"\n [style.direction]=\"'ltr'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperNumber : { english: config.isEN, fractionDigits: column.fractionDigits } }}\n</div>\n" }]
|
|
692
692
|
}] });
|
|
@@ -704,10 +704,10 @@ class ColumnPeriodComponent {
|
|
|
704
704
|
column = inject(COLUMN_TYPE);
|
|
705
705
|
value = inject(COLUMN_VALUE);
|
|
706
706
|
config = inject(COLUMN_CONFIG);
|
|
707
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
708
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
707
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnPeriodComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
708
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: ColumnPeriodComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-period" } }, ngImport: i0, template: "<div [style.display]=\"'inline-block'\" [class.ngx-table-m3-deactive]=\"config.isDeactive\">\n {{ value | ngxHelperPeriod }}\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: NgxHelperPeriodPipe, name: "ngxHelperPeriod" }] });
|
|
709
709
|
}
|
|
710
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
710
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnPeriodComponent, decorators: [{
|
|
711
711
|
type: Component,
|
|
712
712
|
args: [{ host: { selector: 'column-period' }, imports: [NgxHelperPeriodPipe], template: "<div [style.display]=\"'inline-block'\" [class.ngx-table-m3-deactive]=\"config.isDeactive\">\n {{ value | ngxHelperPeriod }}\n</div>\n" }]
|
|
713
713
|
}] });
|
|
@@ -743,10 +743,10 @@ class ColumnTagComponent {
|
|
|
743
743
|
if (action)
|
|
744
744
|
this.router.navigate(action);
|
|
745
745
|
}
|
|
746
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
747
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
746
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnTagComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
747
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: ColumnTagComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-tag" } }, ngImport: i0, template: "<div [style.display]=\"'inline-block'\" [class.ngx-table-m3-deactive]=\"config.isDeactive\">\n @for (item of value; track $index) {\n <div class=\"tag\" [class.tag-action]=\"!!column.onTagClick\" (click)=\"onTagClick(item.id)\">\n @if (column.onTagClick) { <mat-icon>open_in_new</mat-icon> }\n <div class=\"title\">{{ item.title }}</div>\n </div>\n }\n</div>\n", styles: [".tag{display:flex;align-items:center;column-gap:.5rem}.tag .title{flex:1;font-size:85%}.tag mat-icon{font-size:85%;padding:0}.tag-action{cursor:pointer}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
748
748
|
}
|
|
749
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
749
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnTagComponent, decorators: [{
|
|
750
750
|
type: Component,
|
|
751
751
|
args: [{ host: { selector: 'column-tag' }, imports: [MatIcon], template: "<div [style.display]=\"'inline-block'\" [class.ngx-table-m3-deactive]=\"config.isDeactive\">\n @for (item of value; track $index) {\n <div class=\"tag\" [class.tag-action]=\"!!column.onTagClick\" (click)=\"onTagClick(item.id)\">\n @if (column.onTagClick) { <mat-icon>open_in_new</mat-icon> }\n <div class=\"title\">{{ item.title }}</div>\n </div>\n }\n</div>\n", styles: [".tag{display:flex;align-items:center;column-gap:.5rem}.tag .title{flex:1;font-size:85%}.tag mat-icon{font-size:85%;padding:0}.tag-action{cursor:pointer}\n"] }]
|
|
752
752
|
}], ctorParameters: () => [{ type: i1$1.Router }] });
|
|
@@ -767,10 +767,10 @@ class ColumnTextComponent {
|
|
|
767
767
|
column = inject(COLUMN_TYPE);
|
|
768
768
|
value = inject(COLUMN_VALUE);
|
|
769
769
|
config = inject(COLUMN_CONFIG);
|
|
770
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
771
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
770
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
771
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: ColumnTextComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-text" } }, ngImport: i0, template: "<div\n [style.display]=\"'inline-block'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value }}\n</div>\n", styles: [""] });
|
|
772
772
|
}
|
|
773
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
773
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnTextComponent, decorators: [{
|
|
774
774
|
type: Component,
|
|
775
775
|
args: [{ host: { selector: 'column-text' }, imports: [], template: "<div\n [style.display]=\"'inline-block'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value }}\n</div>\n" }]
|
|
776
776
|
}] });
|
|
@@ -788,10 +788,10 @@ class ColumnWeightComponent {
|
|
|
788
788
|
column = inject(COLUMN_TYPE);
|
|
789
789
|
value = inject(COLUMN_VALUE);
|
|
790
790
|
config = inject(COLUMN_CONFIG);
|
|
791
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
792
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
791
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnWeightComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
792
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.1", type: ColumnWeightComponent, isStandalone: true, selector: "ng-component", host: { attributes: { "selector": "column-weight" } }, ngImport: i0, template: "<div\n [style.display]=\"'inline-block'\"\n [style.direction]=\"config.isEN ? 'ltr' : 'rtl'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperWeight : { short:column.short, english: config.isEN, } }}\n</div>\n", styles: [""], dependencies: [{ kind: "pipe", type: NgxHelperWeightPipe, name: "ngxHelperWeight" }] });
|
|
793
793
|
}
|
|
794
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
794
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ColumnWeightComponent, decorators: [{
|
|
795
795
|
type: Component,
|
|
796
796
|
args: [{ host: { selector: 'column-weight' }, imports: [NgxHelperWeightPipe], template: "<div\n [style.display]=\"'inline-block'\"\n [style.direction]=\"config.isEN ? 'ltr' : 'rtl'\"\n [class.ngx-table-m3-en]=\"config.isEN\"\n [class.ngx-table-m3-deactive]=\"config.isDeactive\"\n>\n {{ value | ngxHelperWeight : { short:column.short, english: config.isEN, } }}\n</div>\n" }]
|
|
797
797
|
}] });
|
|
@@ -915,10 +915,10 @@ class ViewService {
|
|
|
915
915
|
}
|
|
916
916
|
return orders;
|
|
917
917
|
}
|
|
918
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
919
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
918
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewService, deps: [{ token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
919
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewService });
|
|
920
920
|
}
|
|
921
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
921
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewService, decorators: [{
|
|
922
922
|
type: Injectable
|
|
923
923
|
}], ctorParameters: () => [{ type: i1$1.ActivatedRoute }] });
|
|
924
924
|
|
|
@@ -1014,10 +1014,10 @@ class ViewValueComponent {
|
|
|
1014
1014
|
this.copyTimeout = undefined;
|
|
1015
1015
|
}, 2000);
|
|
1016
1016
|
}
|
|
1017
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1018
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1017
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewValueComponent, deps: [{ token: i1$1.Router }, { token: ViewService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1018
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: ViewValueComponent, isStandalone: true, selector: "view-value", inputs: { column: "column", item: "item", viewConfig: "viewConfig", isDeactive: "isDeactive", isCard: "isCard", isCardTitle: "isCardTitle", isCardSubTitle: "isCardSubTitle" }, host: { properties: { "className": "this.className", "style.text-align": "this.textAlign" } }, usesOnChanges: true, ngImport: i0, template: "<!-- EMPTY VALUE -->\n@if (value === undefined) { }\n\n<!-- SHOW VALUE -->\n@else {\n<div class=\"value-container\" [style.color]=\"color\" [class.card-title]=\"isCardTitle\" [class.card-sub-title]=\"isCardSubTitle\">\n <div\n class=\"value\"\n [style.cursor]=\"hasClick || copyText ? 'pointer' : 'default'\"\n (click)=\"hasClick ? onClick() : copyText ? onCopy() : null\"\n [cdkCopyToClipboard]=\"copyText || ''\"\n >\n <ng-container *ngComponentOutlet=\"columnInfo[column.type].component; injector: injector\"></ng-container>\n <!-- CLICK -->\n @if (hasClick) { <mat-icon>open_in_new</mat-icon> }\n <!-- COPY -->\n @if (copyText) { <mat-icon>{{ isCopied ? 'done_all' : 'copy' }}</mat-icon> }\n </div>\n\n <!-- SUB VALUE -->\n @if (subValue) {\n <div class=\"sub-value\" [class.ngx-table-m3-en]=\"subValue.isEN\">{{ subValue.value }}</div>\n }\n</div>\n}\n", styles: [""], dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "ngmodule", type: ClipboardModule }, { kind: "directive", type: i3.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
1019
1019
|
}
|
|
1020
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1020
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewValueComponent, decorators: [{
|
|
1021
1021
|
type: Component,
|
|
1022
1022
|
args: [{ selector: 'view-value', imports: [NgComponentOutlet, ClipboardModule, MatIcon], template: "<!-- EMPTY VALUE -->\n@if (value === undefined) { }\n\n<!-- SHOW VALUE -->\n@else {\n<div class=\"value-container\" [style.color]=\"color\" [class.card-title]=\"isCardTitle\" [class.card-sub-title]=\"isCardSubTitle\">\n <div\n class=\"value\"\n [style.cursor]=\"hasClick || copyText ? 'pointer' : 'default'\"\n (click)=\"hasClick ? onClick() : copyText ? onCopy() : null\"\n [cdkCopyToClipboard]=\"copyText || ''\"\n >\n <ng-container *ngComponentOutlet=\"columnInfo[column.type].component; injector: injector\"></ng-container>\n <!-- CLICK -->\n @if (hasClick) { <mat-icon>open_in_new</mat-icon> }\n <!-- COPY -->\n @if (copyText) { <mat-icon>{{ isCopied ? 'done_all' : 'copy' }}</mat-icon> }\n </div>\n\n <!-- SUB VALUE -->\n @if (subValue) {\n <div class=\"sub-value\" [class.ngx-table-m3-en]=\"subValue.isEN\">{{ subValue.value }}</div>\n }\n</div>\n}\n" }]
|
|
1023
1023
|
}], ctorParameters: () => [{ type: i1$1.Router }, { type: ViewService }], propDecorators: { className: [{
|
|
@@ -1102,10 +1102,10 @@ class ViewCardToolbarComponent {
|
|
|
1102
1102
|
break;
|
|
1103
1103
|
}
|
|
1104
1104
|
}
|
|
1105
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1106
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1105
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewCardToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1106
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: ViewCardToolbarComponent, isStandalone: true, selector: "view-card-toolbar", inputs: { orders: "orders", filters: "filters", viewConfig: "viewConfig" }, outputs: { orderChanged: "orderChanged", updateFilter: "updateFilter", clearFilter: "clearFilter" }, host: { properties: { "className": "this.className" } }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"toolbar-container\"\n [style.position]=\"viewConfig.stickyView?.top ? 'sticky' : 'static'\"\n [style.top]=\"viewConfig.stickyView?.top?.mobileView || undefined\"\n (mousedown)=\"swipe($event, 'START', toolbarContainer, toolbarItems)\"\n (mousemove)=\"swipe($event, 'MOVE', toolbarContainer, toolbarItems)\"\n (mouseup)=\"swipe($event, 'END', toolbarContainer, toolbarItems)\"\n (touchstart)=\"swipe($event, 'START', toolbarContainer, toolbarItems)\"\n (touchmove)=\"swipe($event, 'MOVE', toolbarContainer, toolbarItems)\"\n (touchend)=\"swipe($event, 'END', toolbarContainer, toolbarItems)\"\n #toolbarContainer\n>\n <div class=\"toolbar-items\" #toolbarItems>\n <!-- ORDER -->\n @if (orderKeys.length > 0) {\n <div class=\"item\" [matMenuTriggerFor]=\"orderMenu\">\n <mat-icon>swap_vert</mat-icon>\n <span>\u062A\u0631\u062A\u06CC\u0628 \u0646\u0645\u0627\u06CC\u0634</span>\n </div>\n <mat-menu #orderMenu=\"matMenu\" [xPosition]=\"'after'\" class=\"ngx-table-order-menu\">\n @for (item of orderKeys; track $index) {\n <!-- DIVIDER -->\n @if ($index !== 0) {<mat-divider></mat-divider>}\n\n <!-- TYPES -->\n @switch (orders[item].type) {\n <!-- ORDR -->\n @case ('ORDER') {\n <button\n mat-menu-item\n type=\"button\"\n [disabled]=\"orders[item].current === 'ASC'\"\n (click)=\"updateOrder(item, 'ASC')\"\n >\n <mat-icon>north</mat-icon>\n <span>{{ orders[item].title }}</span>\n </button>\n <button\n mat-menu-item\n type=\"button\"\n [disabled]=\"orders[item].current === 'DESC'\"\n (click)=\"updateOrder(item, 'DESC')\"\n >\n <mat-icon>south</mat-icon>\n <span>{{ orders[item].title }}</span>\n </button>\n }\n <!-- ASC, DESC -->\n @default {\n <button\n mat-menu-item\n type=\"button\"\n [disabled]=\"orders[item].current\"\n (click)=\"updateOrder(item, orders[item].type)\"\n >\n <mat-icon>{{ orders[item].type === 'ASC' ? 'north' : 'south' }}</mat-icon>\n <span>{{ orders[item].title }}</span>\n </button>\n } } }\n </mat-menu>\n }\n\n <!-- CLEAR -->\n @if (showClear) {\n <div class=\"item clear\" (click)=\"clearFilter.next()\">\n <span>\u0644\u063A\u0648 \u0641\u06CC\u0644\u062A\u0631\u0647\u0627</span>\n <mat-icon>filter_alt_off</mat-icon>\n </div>\n\n }\n\n <!-- FILTER -->\n @for (item of filterKeys; track $index) {\n <div class=\"item\" [class.active]=\"filters[item].value\" (click)=\"updateFilter.next(item)\">\n <mat-icon>filter_alt</mat-icon>\n <span>{{ filters[item].title }}</span>\n </div>\n }\n </div>\n</div>\n\n<div\n class=\"toolbar-seperator\"\n [style.position]=\"viewConfig.stickyView?.top ? 'sticky' : 'static'\"\n [style.top]=\"\n 'calc(' + (viewConfig.stickyView?.top?.mobileView || undefined) + ' + var(--ngx-table-m3-toolbar-height) + 2px)'\n \"\n></div>\n", styles: ["::ng-deep .ngx-table-order-menu mat-icon{font-size:100%;margin:0 0 0 .75rem!important}::ng-deep .ngx-table-order-menu .mat-mdc-menu-content{padding:0}::ng-deep .ngx-table-order-menu .mat-mdc-menu-item{direction:rtl;text-align:right}::ng-deep .ngx-table-order-menu .mat-mdc-menu-item .mat-mdc-menu-item-text{font-size:90%!important}::ng-deep .ngx-table-order-menu .mat-divider{margin:0!important;border-top-color:var(--outline-variant)}\n"], dependencies: [{ kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
|
|
1107
1107
|
}
|
|
1108
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewCardToolbarComponent, decorators: [{
|
|
1109
1109
|
type: Component,
|
|
1110
1110
|
args: [{ selector: 'view-card-toolbar', imports: [MatDivider, MatIcon, MatMenuModule], template: "<div\n class=\"toolbar-container\"\n [style.position]=\"viewConfig.stickyView?.top ? 'sticky' : 'static'\"\n [style.top]=\"viewConfig.stickyView?.top?.mobileView || undefined\"\n (mousedown)=\"swipe($event, 'START', toolbarContainer, toolbarItems)\"\n (mousemove)=\"swipe($event, 'MOVE', toolbarContainer, toolbarItems)\"\n (mouseup)=\"swipe($event, 'END', toolbarContainer, toolbarItems)\"\n (touchstart)=\"swipe($event, 'START', toolbarContainer, toolbarItems)\"\n (touchmove)=\"swipe($event, 'MOVE', toolbarContainer, toolbarItems)\"\n (touchend)=\"swipe($event, 'END', toolbarContainer, toolbarItems)\"\n #toolbarContainer\n>\n <div class=\"toolbar-items\" #toolbarItems>\n <!-- ORDER -->\n @if (orderKeys.length > 0) {\n <div class=\"item\" [matMenuTriggerFor]=\"orderMenu\">\n <mat-icon>swap_vert</mat-icon>\n <span>\u062A\u0631\u062A\u06CC\u0628 \u0646\u0645\u0627\u06CC\u0634</span>\n </div>\n <mat-menu #orderMenu=\"matMenu\" [xPosition]=\"'after'\" class=\"ngx-table-order-menu\">\n @for (item of orderKeys; track $index) {\n <!-- DIVIDER -->\n @if ($index !== 0) {<mat-divider></mat-divider>}\n\n <!-- TYPES -->\n @switch (orders[item].type) {\n <!-- ORDR -->\n @case ('ORDER') {\n <button\n mat-menu-item\n type=\"button\"\n [disabled]=\"orders[item].current === 'ASC'\"\n (click)=\"updateOrder(item, 'ASC')\"\n >\n <mat-icon>north</mat-icon>\n <span>{{ orders[item].title }}</span>\n </button>\n <button\n mat-menu-item\n type=\"button\"\n [disabled]=\"orders[item].current === 'DESC'\"\n (click)=\"updateOrder(item, 'DESC')\"\n >\n <mat-icon>south</mat-icon>\n <span>{{ orders[item].title }}</span>\n </button>\n }\n <!-- ASC, DESC -->\n @default {\n <button\n mat-menu-item\n type=\"button\"\n [disabled]=\"orders[item].current\"\n (click)=\"updateOrder(item, orders[item].type)\"\n >\n <mat-icon>{{ orders[item].type === 'ASC' ? 'north' : 'south' }}</mat-icon>\n <span>{{ orders[item].title }}</span>\n </button>\n } } }\n </mat-menu>\n }\n\n <!-- CLEAR -->\n @if (showClear) {\n <div class=\"item clear\" (click)=\"clearFilter.next()\">\n <span>\u0644\u063A\u0648 \u0641\u06CC\u0644\u062A\u0631\u0647\u0627</span>\n <mat-icon>filter_alt_off</mat-icon>\n </div>\n\n }\n\n <!-- FILTER -->\n @for (item of filterKeys; track $index) {\n <div class=\"item\" [class.active]=\"filters[item].value\" (click)=\"updateFilter.next(item)\">\n <mat-icon>filter_alt</mat-icon>\n <span>{{ filters[item].title }}</span>\n </div>\n }\n </div>\n</div>\n\n<div\n class=\"toolbar-seperator\"\n [style.position]=\"viewConfig.stickyView?.top ? 'sticky' : 'static'\"\n [style.top]=\"\n 'calc(' + (viewConfig.stickyView?.top?.mobileView || undefined) + ' + var(--ngx-table-m3-toolbar-height) + 2px)'\n \"\n></div>\n", styles: ["::ng-deep .ngx-table-order-menu mat-icon{font-size:100%;margin:0 0 0 .75rem!important}::ng-deep .ngx-table-order-menu .mat-mdc-menu-content{padding:0}::ng-deep .ngx-table-order-menu .mat-mdc-menu-item{direction:rtl;text-align:right}::ng-deep .ngx-table-order-menu .mat-mdc-menu-item .mat-mdc-menu-item-text{font-size:90%!important}::ng-deep .ngx-table-order-menu .mat-divider{margin:0!important;border-top-color:var(--outline-variant)}\n"] }]
|
|
1111
1111
|
}], propDecorators: { className: [{
|
|
@@ -1197,10 +1197,10 @@ class ViewCardComponent {
|
|
|
1197
1197
|
return true;
|
|
1198
1198
|
return this.viewService.getValue(column, item) !== undefined;
|
|
1199
1199
|
}
|
|
1200
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1201
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1200
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewCardComponent, deps: [{ token: FilterService }, { token: ViewService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1201
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: ViewCardComponent, isStandalone: true, selector: "view-card", inputs: { ngxTable: "ngxTable", data: "data", viewConfig: "viewConfig" }, outputs: { orderChanged: "orderChanged", filterChanged: "filterChanged", filterCleared: "filterCleared" }, host: { properties: { "className": "this.className" } }, providers: [FilterService, ViewService], usesOnChanges: true, ngImport: i0, template: "<!-- TOOLBAR -->\n@if (hasToolbar) {\n<view-card-toolbar\n [orders]=\"orders\"\n [filters]=\"filters\"\n [viewConfig]=\"viewConfig\"\n (orderChanged)=\"orderChanged.next($event)\"\n (updateFilter)=\"updateFilter($event)\"\n (clearFilter)=\"filterCleared.next()\"\n></view-card-toolbar>\n}\n\n<!-- DATA -->\n<div class=\"card-container\">\n @for (item of data; track $index; let dataIndex = $index) {\n <div class=\"card\">\n <div class=\"card-header\" [style.position]=\"viewConfig.stickyView?.top ? 'sticky' : 'static'\" [style.top]=\"top\">\n <!-- ICON -->\n @if (hasIcon) {\n <!-- MATERIAL ICON -->\n @if (icons[$index].icon) {\n <mat-icon class=\"icon\" [style.color]=\"icons[$index].color\" [style.font-size]=\"viewConfig.iconSize\">\n {{ icons[$index].icon }}\n </mat-icon>\n }\n <!-- EMOJI -->\n @else {\n <td class=\"emoji\" [style.font-size]=\"viewConfig.emojiSize\">{{ emojis[$index] || '' }}</td>\n } }\n\n <!-- TITLE -->\n <div class=\"title\" [style.color]=\"colors[dataIndex]\">\n <view-value\n [column]=\"ngxTable.columns[this.titleIndex]\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isDeactive]=\"deactives.includes(dataIndex)\"\n [isCard]=\"true\"\n [isCardTitle]=\"true\"\n ></view-value>\n <!-- SUB TITLE -->\n @if (subTitleIndex !== undefined) {\n <view-value\n [column]=\"ngxTable.columns[this.subTitleIndex]\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isCard]=\"true\"\n [isCardSubTitle]=\"true\"\n ></view-value>\n }\n </div>\n\n <!-- ACTION -->\n @if (hasAction) {\n <view-action\n [actions]=\"ngxTable.actions || []\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isMobile]=\"true\"\n ></view-action>\n }\n </div>\n\n <!-- CONTENT -->\n @if (hasContent && showContent(dataIndex)) {\n <div class=\"card-content\" [style.color]=\"colors[dataIndex]\">\n @for (column of ngxTable.columns; track $index; let columnIndex = $index) {\n <!-- CHECK TITLE AND SUBTITLE AND VALUE -->\n @if (columnIndex !== titleIndex && columnIndex !== subTitleIndex && showItem(column, item)) {\n <div class=\"item\">\n <div class=\"title\">{{ column.title }}{{ !!column.title ? ' :' : '' }}</div>\n <div class=\"value\">\n <view-value [column]=\"column\" [item]=\"item\" [viewConfig]=\"viewConfig\" [isCard]=\"true\"></view-value>\n </div>\n </div>\n } }\n\n <!-- DESCRIPTION -->\n @if (descriptions[dataIndex]) {\n <div class=\"description\" [innerHTML]=\"descriptions[dataIndex] || '' | ngxHelperMultiLine\"></div>\n }\n </div>\n }\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ViewActionComponent, selector: "view-action", inputs: ["actions", "item", "viewConfig", "isMobile"] }, { kind: "component", type: ViewValueComponent, selector: "view-value", inputs: ["column", "item", "viewConfig", "isDeactive", "isCard", "isCardTitle", "isCardSubTitle"] }, { kind: "component", type: ViewCardToolbarComponent, selector: "view-card-toolbar", inputs: ["orders", "filters", "viewConfig"], outputs: ["orderChanged", "updateFilter", "clearFilter"] }, { kind: "pipe", type: NgxHelperMultiLinePipe, name: "ngxHelperMultiLine" }] });
|
|
1202
1202
|
}
|
|
1203
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1203
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewCardComponent, decorators: [{
|
|
1204
1204
|
type: Component,
|
|
1205
1205
|
args: [{ selector: 'view-card', imports: [MatIcon, NgxHelperMultiLinePipe, ViewActionComponent, ViewValueComponent, ViewCardToolbarComponent], providers: [FilterService, ViewService], template: "<!-- TOOLBAR -->\n@if (hasToolbar) {\n<view-card-toolbar\n [orders]=\"orders\"\n [filters]=\"filters\"\n [viewConfig]=\"viewConfig\"\n (orderChanged)=\"orderChanged.next($event)\"\n (updateFilter)=\"updateFilter($event)\"\n (clearFilter)=\"filterCleared.next()\"\n></view-card-toolbar>\n}\n\n<!-- DATA -->\n<div class=\"card-container\">\n @for (item of data; track $index; let dataIndex = $index) {\n <div class=\"card\">\n <div class=\"card-header\" [style.position]=\"viewConfig.stickyView?.top ? 'sticky' : 'static'\" [style.top]=\"top\">\n <!-- ICON -->\n @if (hasIcon) {\n <!-- MATERIAL ICON -->\n @if (icons[$index].icon) {\n <mat-icon class=\"icon\" [style.color]=\"icons[$index].color\" [style.font-size]=\"viewConfig.iconSize\">\n {{ icons[$index].icon }}\n </mat-icon>\n }\n <!-- EMOJI -->\n @else {\n <td class=\"emoji\" [style.font-size]=\"viewConfig.emojiSize\">{{ emojis[$index] || '' }}</td>\n } }\n\n <!-- TITLE -->\n <div class=\"title\" [style.color]=\"colors[dataIndex]\">\n <view-value\n [column]=\"ngxTable.columns[this.titleIndex]\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isDeactive]=\"deactives.includes(dataIndex)\"\n [isCard]=\"true\"\n [isCardTitle]=\"true\"\n ></view-value>\n <!-- SUB TITLE -->\n @if (subTitleIndex !== undefined) {\n <view-value\n [column]=\"ngxTable.columns[this.subTitleIndex]\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isCard]=\"true\"\n [isCardSubTitle]=\"true\"\n ></view-value>\n }\n </div>\n\n <!-- ACTION -->\n @if (hasAction) {\n <view-action\n [actions]=\"ngxTable.actions || []\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isMobile]=\"true\"\n ></view-action>\n }\n </div>\n\n <!-- CONTENT -->\n @if (hasContent && showContent(dataIndex)) {\n <div class=\"card-content\" [style.color]=\"colors[dataIndex]\">\n @for (column of ngxTable.columns; track $index; let columnIndex = $index) {\n <!-- CHECK TITLE AND SUBTITLE AND VALUE -->\n @if (columnIndex !== titleIndex && columnIndex !== subTitleIndex && showItem(column, item)) {\n <div class=\"item\">\n <div class=\"title\">{{ column.title }}{{ !!column.title ? ' :' : '' }}</div>\n <div class=\"value\">\n <view-value [column]=\"column\" [item]=\"item\" [viewConfig]=\"viewConfig\" [isCard]=\"true\"></view-value>\n </div>\n </div>\n } }\n\n <!-- DESCRIPTION -->\n @if (descriptions[dataIndex]) {\n <div class=\"description\" [innerHTML]=\"descriptions[dataIndex] || '' | ngxHelperMultiLine\"></div>\n }\n </div>\n }\n </div>\n }\n</div>\n" }]
|
|
1206
1206
|
}], ctorParameters: () => [{ type: FilterService }, { type: ViewService }], propDecorators: { className: [{
|
|
@@ -1267,10 +1267,10 @@ class ViewPaginationComponent {
|
|
|
1267
1267
|
const parentHeight = element.parentElement?.offsetHeight;
|
|
1268
1268
|
this.hasShadow = !!parentHeight && elementPosition < parentHeight;
|
|
1269
1269
|
}
|
|
1270
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1271
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1270
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewPaginationComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1271
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: ViewPaginationComponent, isStandalone: true, selector: "view-pagination", inputs: { type: "type", pagination: "pagination", viewConfig: "viewConfig", isMobile: "isMobile", stickyBottom: "stickyBottom" }, outputs: { pageChanged: "pageChanged" }, host: { listeners: { "window:scroll": "onScroll()" }, properties: { "className": "this.className", "style.position": "this.stylePosition", "style.bottom": "this.styleBottom" } }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"pagination-content\"\n [class.desktop-view]=\"!isMobile\"\n [class.mobile-view]=\"isMobile\"\n [class.has-shadow]=\"hasShadow\"\n>\n <div class=\"counts\">\n <div class=\"title\">\u0635\u0641\u062D\u0647 {{ pagination.page.current | number }} \u0627\u0632 {{ pagination.page.total | number }}</div>\n <div class=\"total\">{{ pagination.item.total | number }} {{ type }}</div>\n </div>\n\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"pagination.page.current === pagination.page.total\"\n (click)=\"pageChanged.next(pagination.page.total)\"\n >\n <mat-icon>keyboard_double_arrow_right</mat-icon>\n </button>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"pagination.page.current === pagination.page.total\"\n (click)=\"pageChanged.next(pagination.page.current + 1)\"\n >\n <mat-icon>chevron_right</mat-icon>\n </button>\n\n <button mat-icon-button [matMenuTriggerFor]=\"pageMenu\"><mat-icon>tag</mat-icon></button>\n <mat-menu #pageMenu=\"matMenu\" class=\"ngx-table-m3-pagination\">\n @for (page of pages; track $index) {\n <button\n mat-menu-item\n type=\"button\"\n [disabled]=\"page === pagination.page.current\"\n class=\"ngx-table-m3-pagination-item\"\n (click)=\"pageChanged.next(page)\"\n >\n {{ page | number }}\n </button>\n }\n </mat-menu>\n\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"pagination.page.current === 1\"\n (click)=\"pageChanged.next(pagination.page.current - 1)\"\n >\n <mat-icon>chevron_left</mat-icon>\n </button>\n <button mat-icon-button type=\"button\" [disabled]=\"pagination.page.current === 1\" (click)=\"pageChanged.next(1)\">\n <mat-icon>keyboard_double_arrow_left</mat-icon>\n </button>\n</div>\n", styles: ["::ng-deep .ngx-table-m3-pagination .mat-mdc-menu-content{padding:0}::ng-deep .ngx-table-m3-pagination-item{text-align:center!important}\n"], dependencies: [{ kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "pipe", type: DecimalPipe, name: "number" }] });
|
|
1272
1272
|
}
|
|
1273
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1273
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewPaginationComponent, decorators: [{
|
|
1274
1274
|
type: Component,
|
|
1275
1275
|
args: [{ selector: 'view-pagination', host: { '(window:scroll)': 'onScroll()' }, imports: [DecimalPipe, MatIconButton, MatIcon, MatMenuModule], template: "<div\n class=\"pagination-content\"\n [class.desktop-view]=\"!isMobile\"\n [class.mobile-view]=\"isMobile\"\n [class.has-shadow]=\"hasShadow\"\n>\n <div class=\"counts\">\n <div class=\"title\">\u0635\u0641\u062D\u0647 {{ pagination.page.current | number }} \u0627\u0632 {{ pagination.page.total | number }}</div>\n <div class=\"total\">{{ pagination.item.total | number }} {{ type }}</div>\n </div>\n\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"pagination.page.current === pagination.page.total\"\n (click)=\"pageChanged.next(pagination.page.total)\"\n >\n <mat-icon>keyboard_double_arrow_right</mat-icon>\n </button>\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"pagination.page.current === pagination.page.total\"\n (click)=\"pageChanged.next(pagination.page.current + 1)\"\n >\n <mat-icon>chevron_right</mat-icon>\n </button>\n\n <button mat-icon-button [matMenuTriggerFor]=\"pageMenu\"><mat-icon>tag</mat-icon></button>\n <mat-menu #pageMenu=\"matMenu\" class=\"ngx-table-m3-pagination\">\n @for (page of pages; track $index) {\n <button\n mat-menu-item\n type=\"button\"\n [disabled]=\"page === pagination.page.current\"\n class=\"ngx-table-m3-pagination-item\"\n (click)=\"pageChanged.next(page)\"\n >\n {{ page | number }}\n </button>\n }\n </mat-menu>\n\n <button\n mat-icon-button\n type=\"button\"\n [disabled]=\"pagination.page.current === 1\"\n (click)=\"pageChanged.next(pagination.page.current - 1)\"\n >\n <mat-icon>chevron_left</mat-icon>\n </button>\n <button mat-icon-button type=\"button\" [disabled]=\"pagination.page.current === 1\" (click)=\"pageChanged.next(1)\">\n <mat-icon>keyboard_double_arrow_left</mat-icon>\n </button>\n</div>\n", styles: ["::ng-deep .ngx-table-m3-pagination .mat-mdc-menu-content{padding:0}::ng-deep .ngx-table-m3-pagination-item{text-align:center!important}\n"] }]
|
|
1276
1276
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { className: [{
|
|
@@ -1372,10 +1372,10 @@ class ViewTableComponent {
|
|
|
1372
1372
|
this.filters[id] = { ...this.filters[id], value: undefined };
|
|
1373
1373
|
this.filterChanged.next({ id, value: undefined });
|
|
1374
1374
|
}
|
|
1375
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1376
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1375
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewTableComponent, deps: [{ token: ViewService }, { token: FilterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1376
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: ViewTableComponent, isStandalone: true, selector: "view-table", inputs: { ngxTable: "ngxTable", data: "data", viewConfig: "viewConfig" }, outputs: { orderChanged: "orderChanged", filterChanged: "filterChanged", filterCleared: "filterCleared" }, host: { properties: { "className": "this.className" } }, providers: [FilterService, ViewService], usesOnChanges: true, ngImport: i0, template: "<table [cellPadding]=\"0\" [cellSpacing]=\"0\" [width]=\"'100%'\" [border]=\"0\">\n <!-- HEADER -->\n\n <thead\n [style.position]=\"viewConfig.stickyView?.top ? 'sticky' : 'static'\"\n [style.top]=\"viewConfig.stickyView?.top?.desktopView || undefined\"\n >\n <!-- ACTIVE FILTERS -->\n @if (activeFilters.length > 0) {\n <tr>\n <!-- ICON -->\n @if (hasIcon) {\n <th class=\"active-filters\"></th>\n }\n\n <!-- TOOLBAR -->\n <th class=\"active-filters\" [colSpan]=\"ngxTable.columns.length + (this.hasAction ? 1 : 0)\">\n <div class=\"toolbar\">\n @for (item of activeFilters; track $index) {\n <div class=\"item\">\n <div class=\"title\" (click)=\"updateFilter(item.id)\">{{ item.title }}:</div>\n <div class=\"value\" (click)=\"updateFilter(item.id)\" [class.ngx-table-m3-en]=\"item.english\">\n {{ item.value }}\n </div>\n <div class=\"icon\" (click)=\"clearFilter(item.id)\">\n <mat-icon>close</mat-icon>\n </div>\n </div>\n }\n\n <!-- CLEAR ALL -->\n @if (activeFilters.length > 2) {\n <div class=\"item clear\" (click)=\"filterCleared.next()\">\n <div class=\"title\">\u0644\u063A\u0648 \u0641\u06CC\u0644\u062A\u0631\u0647\u0627</div>\n <div class=\"icon\"><mat-icon>filter_alt_off</mat-icon></div>\n </div>\n }\n </div>\n </th>\n </tr>\n }\n\n <tr>\n <!-- ICON -->\n @if (hasIcon) {\n <th></th>\n }\n\n <!-- COLUMNS -->\n @for (column of ngxTable.columns; track $index) {\n <th [style.text-align]=\"(column.textAlign || 'RIGHT').toLowerCase()\">\n <div\n class=\"column\"\n [class.flex-end]=\"column.textAlign === 'LEFT'\"\n [class.flex-center]=\"column.textAlign === 'CENTER'\"\n >\n <div class=\"title\">{{ column.title }}</div>\n\n <!-- ORDER -->\n @if (column.tools && orders[column.tools.id]) {\n <mat-icon\n (click)=\"updateOrder(column.tools.id)\"\n [style.cursor]=\"\n orders[column.tools.id].type === 'ORDER' || !orders[column.tools.id].current\n ? 'pointer'\n : 'default'\n \"\n >\n {{\n orders[column.tools.id].current === 'ASC'\n ? 'north'\n : orders[column.tools.id].current === 'DESC'\n ? 'south'\n : 'swap_vert'\n }}\n </mat-icon>\n }\n\n <!-- FILTER -->\n @if (column.tools && filters[column.tools.id]) {\n <mat-icon [style.cursor]=\"'pointer'\" (click)=\"updateFilter(column.tools.id)\">filter_alt</mat-icon>\n }\n </div>\n </th>\n }\n\n <!-- ACTION -->\n @if (hasAction) {\n <th></th>\n }\n </tr>\n </thead>\n\n <!-- BODY -->\n <tbody>\n @for (item of data; track $index; let dataIndex = $index) {\n <tr\n [style.color]=\"colors[dataIndex]\"\n [class.odd-row]=\"viewConfig.alternateRows && dataIndex % 2 === 1\"\n [class.even-row]=\"viewConfig.alternateRows && dataIndex % 2 === 0\"\n >\n <!-- ICON -->\n @if (hasIcon) {\n <!-- MATERIAL ICON -->\n @if (icons[$index].icon) {\n <td class=\"icon\">\n <mat-icon [style.color]=\"icons[$index].color\" [style.font-size]=\"viewConfig.iconSize\">\n {{ icons[$index].icon }}\n </mat-icon>\n </td>\n }\n <!-- EMOJI -->\n @else {\n <td class=\"emoji\" [style.font-size]=\"viewConfig.emojiSize\">{{ emojis[$index] || '' }}</td>\n } }\n\n <!-- DATA -->\n @for (column of ngxTable.columns; track $index; let columnIndex = $index) {\n <td>\n <view-value\n [column]=\"column\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isDeactive]=\"columnIndex === titleIndex && deactives.includes(dataIndex)\"\n ></view-value>\n </td>\n }\n\n <!-- ACTION -->\n @if (hasAction) {\n <td class=\"action\">\n <view-action\n [actions]=\"ngxTable.actions || []\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isMobile]=\"false\"\n ></view-action>\n </td>\n }\n </tr>\n\n <!-- DESCRIPTION -->\n @if (descriptions[dataIndex]) {\n <tr\n [style.color]=\"colors[dataIndex]\"\n [class.odd-row]=\"viewConfig.alternateRows && dataIndex % 2 === 1\"\n [class.even-row]=\"viewConfig.alternateRows && dataIndex % 2 === 0\"\n >\n @if (hasIcon) {\n <td class=\"description\"></td>\n }\n <td\n class=\"description\"\n [colSpan]=\"ngxTable.columns.length + (hasAction ? 1 : 0)\"\n [innerHTML]=\"descriptions[dataIndex] || '' | ngxHelperMultiLine\"\n ></td>\n </tr>\n } }\n </tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ViewActionComponent, selector: "view-action", inputs: ["actions", "item", "viewConfig", "isMobile"] }, { kind: "component", type: ViewValueComponent, selector: "view-value", inputs: ["column", "item", "viewConfig", "isDeactive", "isCard", "isCardTitle", "isCardSubTitle"] }, { kind: "pipe", type: NgxHelperMultiLinePipe, name: "ngxHelperMultiLine" }] });
|
|
1377
1377
|
}
|
|
1378
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1378
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: ViewTableComponent, decorators: [{
|
|
1379
1379
|
type: Component,
|
|
1380
1380
|
args: [{ selector: 'view-table', imports: [MatIcon, NgxHelperMultiLinePipe, ViewActionComponent, ViewValueComponent], providers: [FilterService, ViewService], template: "<table [cellPadding]=\"0\" [cellSpacing]=\"0\" [width]=\"'100%'\" [border]=\"0\">\n <!-- HEADER -->\n\n <thead\n [style.position]=\"viewConfig.stickyView?.top ? 'sticky' : 'static'\"\n [style.top]=\"viewConfig.stickyView?.top?.desktopView || undefined\"\n >\n <!-- ACTIVE FILTERS -->\n @if (activeFilters.length > 0) {\n <tr>\n <!-- ICON -->\n @if (hasIcon) {\n <th class=\"active-filters\"></th>\n }\n\n <!-- TOOLBAR -->\n <th class=\"active-filters\" [colSpan]=\"ngxTable.columns.length + (this.hasAction ? 1 : 0)\">\n <div class=\"toolbar\">\n @for (item of activeFilters; track $index) {\n <div class=\"item\">\n <div class=\"title\" (click)=\"updateFilter(item.id)\">{{ item.title }}:</div>\n <div class=\"value\" (click)=\"updateFilter(item.id)\" [class.ngx-table-m3-en]=\"item.english\">\n {{ item.value }}\n </div>\n <div class=\"icon\" (click)=\"clearFilter(item.id)\">\n <mat-icon>close</mat-icon>\n </div>\n </div>\n }\n\n <!-- CLEAR ALL -->\n @if (activeFilters.length > 2) {\n <div class=\"item clear\" (click)=\"filterCleared.next()\">\n <div class=\"title\">\u0644\u063A\u0648 \u0641\u06CC\u0644\u062A\u0631\u0647\u0627</div>\n <div class=\"icon\"><mat-icon>filter_alt_off</mat-icon></div>\n </div>\n }\n </div>\n </th>\n </tr>\n }\n\n <tr>\n <!-- ICON -->\n @if (hasIcon) {\n <th></th>\n }\n\n <!-- COLUMNS -->\n @for (column of ngxTable.columns; track $index) {\n <th [style.text-align]=\"(column.textAlign || 'RIGHT').toLowerCase()\">\n <div\n class=\"column\"\n [class.flex-end]=\"column.textAlign === 'LEFT'\"\n [class.flex-center]=\"column.textAlign === 'CENTER'\"\n >\n <div class=\"title\">{{ column.title }}</div>\n\n <!-- ORDER -->\n @if (column.tools && orders[column.tools.id]) {\n <mat-icon\n (click)=\"updateOrder(column.tools.id)\"\n [style.cursor]=\"\n orders[column.tools.id].type === 'ORDER' || !orders[column.tools.id].current\n ? 'pointer'\n : 'default'\n \"\n >\n {{\n orders[column.tools.id].current === 'ASC'\n ? 'north'\n : orders[column.tools.id].current === 'DESC'\n ? 'south'\n : 'swap_vert'\n }}\n </mat-icon>\n }\n\n <!-- FILTER -->\n @if (column.tools && filters[column.tools.id]) {\n <mat-icon [style.cursor]=\"'pointer'\" (click)=\"updateFilter(column.tools.id)\">filter_alt</mat-icon>\n }\n </div>\n </th>\n }\n\n <!-- ACTION -->\n @if (hasAction) {\n <th></th>\n }\n </tr>\n </thead>\n\n <!-- BODY -->\n <tbody>\n @for (item of data; track $index; let dataIndex = $index) {\n <tr\n [style.color]=\"colors[dataIndex]\"\n [class.odd-row]=\"viewConfig.alternateRows && dataIndex % 2 === 1\"\n [class.even-row]=\"viewConfig.alternateRows && dataIndex % 2 === 0\"\n >\n <!-- ICON -->\n @if (hasIcon) {\n <!-- MATERIAL ICON -->\n @if (icons[$index].icon) {\n <td class=\"icon\">\n <mat-icon [style.color]=\"icons[$index].color\" [style.font-size]=\"viewConfig.iconSize\">\n {{ icons[$index].icon }}\n </mat-icon>\n </td>\n }\n <!-- EMOJI -->\n @else {\n <td class=\"emoji\" [style.font-size]=\"viewConfig.emojiSize\">{{ emojis[$index] || '' }}</td>\n } }\n\n <!-- DATA -->\n @for (column of ngxTable.columns; track $index; let columnIndex = $index) {\n <td>\n <view-value\n [column]=\"column\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isDeactive]=\"columnIndex === titleIndex && deactives.includes(dataIndex)\"\n ></view-value>\n </td>\n }\n\n <!-- ACTION -->\n @if (hasAction) {\n <td class=\"action\">\n <view-action\n [actions]=\"ngxTable.actions || []\"\n [item]=\"item\"\n [viewConfig]=\"viewConfig\"\n [isMobile]=\"false\"\n ></view-action>\n </td>\n }\n </tr>\n\n <!-- DESCRIPTION -->\n @if (descriptions[dataIndex]) {\n <tr\n [style.color]=\"colors[dataIndex]\"\n [class.odd-row]=\"viewConfig.alternateRows && dataIndex % 2 === 1\"\n [class.even-row]=\"viewConfig.alternateRows && dataIndex % 2 === 0\"\n >\n @if (hasIcon) {\n <td class=\"description\"></td>\n }\n <td\n class=\"description\"\n [colSpan]=\"ngxTable.columns.length + (hasAction ? 1 : 0)\"\n [innerHTML]=\"descriptions[dataIndex] || '' | ngxHelperMultiLine\"\n ></td>\n </tr>\n } }\n </tbody>\n</table>\n" }]
|
|
1381
1381
|
}], ctorParameters: () => [{ type: ViewService }, { type: FilterService }], propDecorators: { className: [{
|
|
@@ -1534,12 +1534,12 @@ class NgxTableComponent {
|
|
|
1534
1534
|
this.setQueryParams();
|
|
1535
1535
|
this.filterChanged.next(this.filter);
|
|
1536
1536
|
}
|
|
1537
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1538
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1537
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: NgxTableComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }, { token: FilterService }, { token: ViewService }, { token: NGX_TABLE_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1538
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.1", type: NgxTableComponent, isStandalone: true, selector: "ngx-table", inputs: { loading: "loading", ngxTable: "ngxTable", data: "data", pagination: "pagination" }, outputs: { filterChanged: "filterChanged" }, host: { listeners: { "window:resize": "onResize()" } }, providers: [FilterService, ViewService], usesOnChanges: true, ngImport: i0, template: "@if (loading) {\n<div class=\"ngx-table-m3-loader\">\n <ngx-helper-loader [mode]=\"'SPINNER'\"></ngx-helper-loader>\n</div>\n}\n\n<!-- EMPTY -->\n@if (!loading && ngxTable.columns.length <= 0 ) {\n<div class=\"ngx-table-m3-empty\">\u0633\u062A\u0648\u0646\u200C\u0647\u0627\u06CC \u062C\u062F\u0648\u0644 \u0628\u0647 \u0635\u0648\u0631\u062A \u0635\u062D\u06CC\u062D \u0645\u0634\u062E\u0635 \u0646\u0634\u062F\u0647 \u0627\u0633\u062A.</div>\n}\n\n<!-- EMPTY -->\n@if (!loading && ngxTable.columns.length > 0 && data.length === 0 && !hasFilter) {\n<div class=\"ngx-table-m3-empty\">{{ ngxTable.type }} \u062B\u0628\u062A \u0646\u0634\u062F\u0647 \u0627\u0633\u062A.</div>\n}\n\n<!-- DATA -->\n@if (!loading && ngxTable.columns.length > 0 && (data.length > 0 || hasFilter)) {\n<content class=\"ngx-table-m3\">\n <!-- DESKTOP -->\n @if (!isMobile) {\n <view-table\n [ngxTable]=\"ngxTable\"\n [data]=\"data\"\n [viewConfig]=\"viewConfig\"\n (orderChanged)=\"orderChanged($event)\"\n (filterChanged)=\"filterItemChanged($event)\"\n (filterCleared)=\"filterCleared()\"\n ></view-table>\n }\n\n <!-- MOBILE -->\n @if (isMobile) {\n <view-card\n [ngxTable]=\"ngxTable\"\n [data]=\"data\"\n [viewConfig]=\"viewConfig\"\n (orderChanged)=\"orderChanged($event)\"\n (filterChanged)=\"filterItemChanged($event)\"\n (filterCleared)=\"filterCleared()\"\n ></view-card>\n }\n\n <!-- PAGINATION -->\n @if (pagination && pagination.page.total> 1) {\n <view-pagination\n [type]=\"ngxTable.type\"\n [pagination]=\"pagination\"\n [viewConfig]=\"viewConfig\"\n [isMobile]=\"isMobile\"\n [stickyBottom]=\"viewConfig.stickyView?.bottom\"\n (pageChanged)=\"pageChanged($event)\"\n ></view-pagination>\n }\n\n <!-- EMPTY -->\n @if ( data.length === 0) {\n <div class=\"ngx-table-m3-empty\">{{ ngxTable.type }} \u062B\u0628\u062A \u0646\u0634\u062F\u0647 \u0627\u0633\u062A.</div>\n }\n</content>\n}\n", styles: ["content{display:block;direction:rtl;position:relative}\n"], dependencies: [{ kind: "component", type: NgxHelperLoaderComponent, selector: "ngx-helper-loader", inputs: ["mode", "size", "color", "padding", "margin"] }, { kind: "component", type: ViewCardComponent, selector: "view-card", inputs: ["ngxTable", "data", "viewConfig"], outputs: ["orderChanged", "filterChanged", "filterCleared"] }, { kind: "component", type: ViewPaginationComponent, selector: "view-pagination", inputs: ["type", "pagination", "viewConfig", "isMobile", "stickyBottom"], outputs: ["pageChanged"] }, { kind: "component", type: ViewTableComponent, selector: "view-table", inputs: ["ngxTable", "data", "viewConfig"], outputs: ["orderChanged", "filterChanged", "filterCleared"] }] });
|
|
1539
1539
|
}
|
|
1540
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1540
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.1", ngImport: i0, type: NgxTableComponent, decorators: [{
|
|
1541
1541
|
type: Component,
|
|
1542
|
-
args: [{ selector: 'ngx-table', host: { '(window:resize)': 'onResize(
|
|
1542
|
+
args: [{ selector: 'ngx-table', host: { '(window:resize)': 'onResize()' }, imports: [NgxHelperLoaderComponent, ViewCardComponent, ViewPaginationComponent, ViewTableComponent], providers: [FilterService, ViewService], template: "@if (loading) {\n<div class=\"ngx-table-m3-loader\">\n <ngx-helper-loader [mode]=\"'SPINNER'\"></ngx-helper-loader>\n</div>\n}\n\n<!-- EMPTY -->\n@if (!loading && ngxTable.columns.length <= 0 ) {\n<div class=\"ngx-table-m3-empty\">\u0633\u062A\u0648\u0646\u200C\u0647\u0627\u06CC \u062C\u062F\u0648\u0644 \u0628\u0647 \u0635\u0648\u0631\u062A \u0635\u062D\u06CC\u062D \u0645\u0634\u062E\u0635 \u0646\u0634\u062F\u0647 \u0627\u0633\u062A.</div>\n}\n\n<!-- EMPTY -->\n@if (!loading && ngxTable.columns.length > 0 && data.length === 0 && !hasFilter) {\n<div class=\"ngx-table-m3-empty\">{{ ngxTable.type }} \u062B\u0628\u062A \u0646\u0634\u062F\u0647 \u0627\u0633\u062A.</div>\n}\n\n<!-- DATA -->\n@if (!loading && ngxTable.columns.length > 0 && (data.length > 0 || hasFilter)) {\n<content class=\"ngx-table-m3\">\n <!-- DESKTOP -->\n @if (!isMobile) {\n <view-table\n [ngxTable]=\"ngxTable\"\n [data]=\"data\"\n [viewConfig]=\"viewConfig\"\n (orderChanged)=\"orderChanged($event)\"\n (filterChanged)=\"filterItemChanged($event)\"\n (filterCleared)=\"filterCleared()\"\n ></view-table>\n }\n\n <!-- MOBILE -->\n @if (isMobile) {\n <view-card\n [ngxTable]=\"ngxTable\"\n [data]=\"data\"\n [viewConfig]=\"viewConfig\"\n (orderChanged)=\"orderChanged($event)\"\n (filterChanged)=\"filterItemChanged($event)\"\n (filterCleared)=\"filterCleared()\"\n ></view-card>\n }\n\n <!-- PAGINATION -->\n @if (pagination && pagination.page.total> 1) {\n <view-pagination\n [type]=\"ngxTable.type\"\n [pagination]=\"pagination\"\n [viewConfig]=\"viewConfig\"\n [isMobile]=\"isMobile\"\n [stickyBottom]=\"viewConfig.stickyView?.bottom\"\n (pageChanged)=\"pageChanged($event)\"\n ></view-pagination>\n }\n\n <!-- EMPTY -->\n @if ( data.length === 0) {\n <div class=\"ngx-table-m3-empty\">{{ ngxTable.type }} \u062B\u0628\u062A \u0646\u0634\u062F\u0647 \u0627\u0633\u062A.</div>\n }\n</content>\n}\n", styles: ["content{display:block;direction:rtl;position:relative}\n"] }]
|
|
1543
1543
|
}], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: FilterService }, { type: ViewService }, { type: undefined, decorators: [{
|
|
1544
1544
|
type: Optional
|
|
1545
1545
|
}, {
|