|
|
|
@ -19,6 +19,7 @@ import { WidgetSettings, WidgetSettingsComponent } from '@shared/models/widget.m |
|
|
|
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms'; |
|
|
|
import { Store } from '@ngrx/store'; |
|
|
|
import { AppState } from '@core/core.state'; |
|
|
|
import { buildPageStepSizeValues } from '@home/components/widget/lib/table-widget.models'; |
|
|
|
|
|
|
|
@Component({ |
|
|
|
selector: 'tb-entities-table-widget-settings', |
|
|
|
@ -28,6 +29,7 @@ import { AppState } from '@core/core.state'; |
|
|
|
export class EntitiesTableWidgetSettingsComponent extends WidgetSettingsComponent { |
|
|
|
|
|
|
|
entitiesTableWidgetSettingsForm: UntypedFormGroup; |
|
|
|
pageStepSizeValues = []; |
|
|
|
|
|
|
|
constructor(protected store: Store<AppState>, |
|
|
|
private fb: UntypedFormBuilder) { |
|
|
|
@ -54,6 +56,8 @@ export class EntitiesTableWidgetSettingsComponent extends WidgetSettingsComponen |
|
|
|
displayEntityType: true, |
|
|
|
displayPagination: true, |
|
|
|
defaultPageSize: 10, |
|
|
|
pageStepIncrement: null, |
|
|
|
pageStepCount: 3, |
|
|
|
defaultSortOrder: 'entityName', |
|
|
|
useRowStyleFunction: false, |
|
|
|
rowStyleFunction: '' |
|
|
|
@ -76,45 +80,58 @@ export class EntitiesTableWidgetSettingsComponent extends WidgetSettingsComponen |
|
|
|
displayEntityType: [settings.displayEntityType, []], |
|
|
|
displayPagination: [settings.displayPagination, []], |
|
|
|
defaultPageSize: [settings.defaultPageSize, [Validators.min(1)]], |
|
|
|
pageStepCount: [settings.pageStepCount ?? 3, [Validators.min(1), Validators.max(100), |
|
|
|
Validators.required, Validators.pattern(/^\d*$/)]], |
|
|
|
pageStepIncrement: [settings.pageStepIncrement ?? settings.defaultPageSize, |
|
|
|
[Validators.min(1), Validators.required, Validators.pattern(/^\d*$/)]], |
|
|
|
defaultSortOrder: [settings.defaultSortOrder, []], |
|
|
|
useRowStyleFunction: [settings.useRowStyleFunction, []], |
|
|
|
rowStyleFunction: [settings.rowStyleFunction, [Validators.required]] |
|
|
|
}); |
|
|
|
this.pageStepSizeValues = buildPageStepSizeValues(this.entitiesTableWidgetSettingsForm.get('pageStepCount').value, |
|
|
|
this.entitiesTableWidgetSettingsForm.get('pageStepIncrement').value); |
|
|
|
} |
|
|
|
|
|
|
|
protected validatorTriggers(): string[] { |
|
|
|
return ['useRowStyleFunction', 'displayPagination', 'displayEntityName', 'displayEntityLabel']; |
|
|
|
return ['useRowStyleFunction', 'displayPagination', 'displayEntityName', 'displayEntityLabel', 'pageStepCount', |
|
|
|
'pageStepIncrement']; |
|
|
|
} |
|
|
|
|
|
|
|
protected updateValidators(emitEvent: boolean) { |
|
|
|
protected updateValidators(emitEvent: boolean, trigger: string) { |
|
|
|
if (trigger === 'pageStepCount' || trigger === 'pageStepIncrement') { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('defaultPageSize').reset(); |
|
|
|
this.pageStepSizeValues = buildPageStepSizeValues(this.entitiesTableWidgetSettingsForm.get('pageStepCount').value, |
|
|
|
this.entitiesTableWidgetSettingsForm.get('pageStepIncrement').value); |
|
|
|
return; |
|
|
|
} |
|
|
|
const useRowStyleFunction: boolean = this.entitiesTableWidgetSettingsForm.get('useRowStyleFunction').value; |
|
|
|
const displayPagination: boolean = this.entitiesTableWidgetSettingsForm.get('displayPagination').value; |
|
|
|
const displayEntityName: boolean = this.entitiesTableWidgetSettingsForm.get('displayEntityName').value; |
|
|
|
const displayEntityLabel: boolean = this.entitiesTableWidgetSettingsForm.get('displayEntityLabel').value; |
|
|
|
if (useRowStyleFunction) { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('rowStyleFunction').enable(); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('rowStyleFunction').enable({emitEvent}); |
|
|
|
} else { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('rowStyleFunction').disable(); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('rowStyleFunction').disable({emitEvent}); |
|
|
|
} |
|
|
|
if (displayPagination) { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('defaultPageSize').enable(); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('defaultPageSize').enable({emitEvent}); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('pageStepCount').enable({emitEvent: false}); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('pageStepIncrement').enable({emitEvent: false}); |
|
|
|
} else { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('defaultPageSize').disable(); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('defaultPageSize').disable({emitEvent}); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('pageStepCount').disable({emitEvent: false}); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('pageStepIncrement').disable({emitEvent: false}); |
|
|
|
} |
|
|
|
if (displayEntityName) { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityNameColumnTitle').enable(); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityNameColumnTitle').enable({emitEvent}); |
|
|
|
} else { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityNameColumnTitle').disable(); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityNameColumnTitle').disable({emitEvent}); |
|
|
|
} |
|
|
|
if (displayEntityLabel) { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityLabelColumnTitle').enable(); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityLabelColumnTitle').enable({emitEvent}); |
|
|
|
} else { |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityLabelColumnTitle').disable(); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityLabelColumnTitle').disable({emitEvent}); |
|
|
|
} |
|
|
|
this.entitiesTableWidgetSettingsForm.get('rowStyleFunction').updateValueAndValidity({emitEvent}); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('defaultPageSize').updateValueAndValidity({emitEvent}); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityNameColumnTitle').updateValueAndValidity({emitEvent}); |
|
|
|
this.entitiesTableWidgetSettingsForm.get('entityLabelColumnTitle').updateValueAndValidity({emitEvent}); |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
Igor Kulikov
1 year ago
GitHub