Igor Kulikov
4 years ago
19 changed files with 548 additions and 22 deletions
@ -0,0 +1,125 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2022 The Thingsboard Authors |
|||
|
|||
Licensed under the Apache License, Version 2.0 (the "License"); |
|||
you may not use this file except in compliance with the License. |
|||
You may obtain a copy of the License at |
|||
|
|||
http://www.apache.org/licenses/LICENSE-2.0 |
|||
|
|||
Unless required by applicable law or agreed to in writing, software |
|||
distributed under the License is distributed on an "AS IS" BASIS, |
|||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
|||
See the License for the specific language governing permissions and |
|||
limitations under the License. |
|||
|
|||
--> |
|||
<div> |
|||
<mat-card class="auto-commit-settings settings-card"> |
|||
<mat-card-title> |
|||
<div fxLayout="row"> |
|||
<span class="mat-headline" translate>admin.auto-commit-settings</span> |
|||
<span fxFlex></span> |
|||
<div tb-help="autoCommitSettings"></div> |
|||
</div> |
|||
</mat-card-title> |
|||
<mat-progress-bar color="warn" mode="indeterminate" *ngIf="isLoading$ | async"> |
|||
</mat-progress-bar> |
|||
<div style="height: 4px;" *ngIf="!(isLoading$ | async)"></div> |
|||
<mat-card-content style="padding-top: 16px;"> |
|||
<form [formGroup]="autoCommitSettingsForm" #formDirective="ngForm" (ngSubmit)="save()"> |
|||
<fieldset class="fields-group" [disabled]="isLoading$ | async"> |
|||
<legend class="group-title" translate>admin.auto-commit-entities</legend> |
|||
<div fxLayout="column"> |
|||
<div class="tb-control-list"> |
|||
<div *ngFor="let entityTypeFormGroup of entityTypesFormGroupArray(); trackBy: trackByEntityType; |
|||
let $index = index; last as isLast;" |
|||
fxLayout="row" fxLayoutAlign="start center" [ngStyle]="!isLast ? {paddingBottom: '8px'} : {}"> |
|||
<mat-expansion-panel class="entity-type-config" fxFlex [formGroup]="entityTypeFormGroup" [expanded]="entityTypesFormGroupExpanded(entityTypeFormGroup)"> |
|||
<mat-expansion-panel-header> |
|||
<div fxFlex fxLayout="row" fxLayoutAlign="start center"> |
|||
<mat-panel-title> |
|||
<div fxLayout="row" fxFlex fxLayoutAlign="start center"> |
|||
<div [innerHTML]="entityTypeText(entityTypeFormGroup)"></div> |
|||
</div> |
|||
</mat-panel-title> |
|||
<span fxFlex></span> |
|||
<button mat-icon-button style="min-width: 40px;" |
|||
type="button" |
|||
(click)="removeEntityType($index)" |
|||
matTooltip="{{ 'action.remove' | translate }}" |
|||
matTooltipPosition="above"> |
|||
<mat-icon>delete</mat-icon> |
|||
</button> |
|||
</div> |
|||
</mat-expansion-panel-header> |
|||
<ng-template matExpansionPanelContent> |
|||
<div class="entity-type-config-content" fxLayout="column" fxLayoutGap="0.5em"> |
|||
<mat-divider></mat-divider> |
|||
<div fxLayout="column" fxLayout.gt-lg="row" fxLayoutGap.gt-lg="16px"> |
|||
<div fxLayout="row" fxLayoutGap="16px"> |
|||
<tb-entity-type-select |
|||
showLabel |
|||
formControlName="entityType" |
|||
required |
|||
[filterAllowedEntityTypes]="false" |
|||
[allowedEntityTypes]="allowedEntityTypes(entityTypeFormGroup)"> |
|||
</tb-entity-type-select> |
|||
<div formGroupName="config"> |
|||
<tb-branch-autocomplete |
|||
emptyPlaceholder="{{ 'version-control.default' | translate }}" |
|||
[selectDefaultBranch]="false" |
|||
formControlName="branch"> |
|||
</tb-branch-autocomplete> |
|||
</div> |
|||
</div> |
|||
<div fxFlex fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="16px" formGroupName="config"> |
|||
<mat-checkbox formControlName="saveRelations"> |
|||
{{ 'version-control.export-entity-relations' | translate }} |
|||
</mat-checkbox> |
|||
<mat-checkbox formControlName="saveAttributes"> |
|||
{{ 'version-control.export-entity-attributes' | translate }} |
|||
</mat-checkbox> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</ng-template> |
|||
</mat-expansion-panel> |
|||
</div> |
|||
</div> |
|||
<div *ngIf="!entityTypesFormGroupArray().length"> |
|||
<span translate fxLayoutAlign="center center" |
|||
class="tb-prompt">admin.no-auto-commit-entities-prompt</span> |
|||
</div> |
|||
<div style="padding-top: 16px;" fxLayout="row"> |
|||
<button mat-raised-button color="primary" |
|||
type="button" |
|||
[disabled]="!addEnabled()" |
|||
(click)="addEntityType()"> |
|||
<span translate>version-control.add-entity-type</span> |
|||
</button> |
|||
<span fxFlex></span> |
|||
<button mat-raised-button color="primary" |
|||
type="button" |
|||
[disabled]="!entityTypesFormGroupArray().length" |
|||
(click)="removeAll()"> |
|||
<span translate>version-control.remove-all</span> |
|||
</button> |
|||
</div> |
|||
</div> |
|||
</fieldset> |
|||
<div fxLayout="row" fxLayoutAlign="end center" fxLayout.xs="column" fxLayoutAlign.xs="end" fxLayoutGap="16px"> |
|||
<button mat-raised-button color="warn" type="button" [fxShow]="settings !== null" |
|||
[disabled]="(isLoading$ | async)" (click)="delete(formDirective)"> |
|||
{{'action.delete' | translate}} |
|||
</button> |
|||
<span fxFlex></span> |
|||
<button mat-raised-button color="primary" [disabled]="(isLoading$ | async) || autoCommitSettingsForm.invalid || !autoCommitSettingsForm.dirty" |
|||
type="submit">{{'action.save' | translate}} |
|||
</button> |
|||
</div> |
|||
</form> |
|||
</mat-card-content> |
|||
</mat-card> |
|||
</div> |
|||
@ -0,0 +1,74 @@ |
|||
/** |
|||
* Copyright © 2016-2022 The Thingsboard Authors |
|||
* |
|||
* Licensed under the Apache License, Version 2.0 (the "License"); |
|||
* you may not use this file except in compliance with the License. |
|||
* You may obtain a copy of the License at |
|||
* |
|||
* http://www.apache.org/licenses/LICENSE-2.0 |
|||
* |
|||
* Unless required by applicable law or agreed to in writing, software |
|||
* distributed under the License is distributed on an "AS IS" BASIS, |
|||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
|||
* See the License for the specific language governing permissions and |
|||
* limitations under the License. |
|||
*/ |
|||
:host { |
|||
mat-card.auto-commit-settings { |
|||
margin: 8px; |
|||
.mat-divider { |
|||
position: relative; |
|||
} |
|||
} |
|||
.fields-group { |
|||
padding: 0 16px 8px; |
|||
margin-bottom: 10px; |
|||
border: 1px groove rgba(0, 0, 0, .25); |
|||
border-radius: 4px; |
|||
|
|||
legend { |
|||
color: rgba(0, 0, 0, .7); |
|||
width: fit-content; |
|||
} |
|||
|
|||
legend + * { |
|||
display: block; |
|||
margin-top: 16px; |
|||
} |
|||
} |
|||
|
|||
.tb-control-list { |
|||
overflow-y: auto; |
|||
max-height: 600px; |
|||
} |
|||
|
|||
.tb-prompt { |
|||
margin: 30px 0; |
|||
} |
|||
|
|||
mat-expansion-panel.entity-type-config { |
|||
box-shadow: none; |
|||
border: 1px groove rgba(0, 0, 0, .25); |
|||
.mat-expansion-panel-header { |
|||
padding: 0 24px 0 8px; |
|||
height: 48px; |
|||
} |
|||
.entity-type-config-content { |
|||
padding: 0 8px 8px; |
|||
tb-branch-autocomplete { |
|||
min-width: 200px; |
|||
max-width: 200px; |
|||
display: block; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
:host ::ng-deep { |
|||
.mat-expansion-panel.entity-type-config { |
|||
.mat-expansion-panel-body { |
|||
padding: 0; |
|||
} |
|||
} |
|||
} |
|||
|
|||
@ -0,0 +1,210 @@ |
|||
///
|
|||
/// Copyright © 2016-2022 The Thingsboard Authors
|
|||
///
|
|||
/// Licensed under the Apache License, Version 2.0 (the "License");
|
|||
/// you may not use this file except in compliance with the License.
|
|||
/// You may obtain a copy of the License at
|
|||
///
|
|||
/// http://www.apache.org/licenses/LICENSE-2.0
|
|||
///
|
|||
/// Unless required by applicable law or agreed to in writing, software
|
|||
/// distributed under the License is distributed on an "AS IS" BASIS,
|
|||
/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|||
/// See the License for the specific language governing permissions and
|
|||
/// limitations under the License.
|
|||
///
|
|||
|
|||
import { Component, OnInit } from '@angular/core'; |
|||
import { PageComponent } from '@shared/components/page.component'; |
|||
import { AbstractControl, FormArray, FormBuilder, FormGroup, FormGroupDirective, Validators } from '@angular/forms'; |
|||
import { Store } from '@ngrx/store'; |
|||
import { AppState } from '@core/core.state'; |
|||
import { AdminService } from '@core/http/admin.service'; |
|||
import { AutoCommitSettings, AutoVersionCreateConfig } from '@shared/models/settings.models'; |
|||
import { TranslateService } from '@ngx-translate/core'; |
|||
import { DialogService } from '@core/services/dialog.service'; |
|||
import { catchError, mergeMap } from 'rxjs/operators'; |
|||
import { of } from 'rxjs'; |
|||
import { EntityTypeVersionCreateConfig, exportableEntityTypes } from '@shared/models/vc.models'; |
|||
import { EntityType, entityTypeTranslations } from '@shared/models/entity-type.models'; |
|||
import { DomSanitizer, SafeHtml } from '@angular/platform-browser'; |
|||
|
|||
@Component({ |
|||
selector: 'tb-auto-commit-settings', |
|||
templateUrl: './auto-commit-settings.component.html', |
|||
styleUrls: ['./auto-commit-settings.component.scss', './../../pages/admin/settings-card.scss'] |
|||
}) |
|||
export class AutoCommitSettingsComponent extends PageComponent implements OnInit { |
|||
|
|||
autoCommitSettingsForm: FormGroup; |
|||
settings: AutoCommitSettings = null; |
|||
|
|||
constructor(protected store: Store<AppState>, |
|||
private adminService: AdminService, |
|||
private dialogService: DialogService, |
|||
private sanitizer: DomSanitizer, |
|||
private translate: TranslateService, |
|||
public fb: FormBuilder) { |
|||
super(store); |
|||
} |
|||
|
|||
ngOnInit() { |
|||
this.autoCommitSettingsForm = this.fb.group({ |
|||
entityTypes: this.fb.array([], []) |
|||
}); |
|||
this.adminService.autoCommitSettingsExists().pipe( |
|||
catchError(() => of(false)), |
|||
mergeMap((hasAutoCommitSettings) => { |
|||
if (hasAutoCommitSettings) { |
|||
return this.adminService.getAutoCommitSettings({ignoreErrors: true}).pipe( |
|||
catchError(() => of(null)) |
|||
); |
|||
} else { |
|||
return of(null); |
|||
} |
|||
}) |
|||
).subscribe( |
|||
(settings) => { |
|||
this.settings = settings; |
|||
this.autoCommitSettingsForm.setControl('entityTypes', |
|||
this.prepareEntityTypesFormArray(settings), {emitEvent: false}); |
|||
}); |
|||
} |
|||
|
|||
entityTypesFormGroupArray(): FormGroup[] { |
|||
return (this.autoCommitSettingsForm.get('entityTypes') as FormArray).controls as FormGroup[]; |
|||
} |
|||
|
|||
entityTypesFormGroupExpanded(entityTypeControl: AbstractControl): boolean { |
|||
return !!(entityTypeControl as any).expanded; |
|||
} |
|||
|
|||
public trackByEntityType(index: number, entityTypeControl: AbstractControl): any { |
|||
return entityTypeControl; |
|||
} |
|||
|
|||
public removeEntityType(index: number) { |
|||
(this.autoCommitSettingsForm.get('entityTypes') as FormArray).removeAt(index); |
|||
this.autoCommitSettingsForm.markAsDirty(); |
|||
} |
|||
|
|||
public addEnabled(): boolean { |
|||
const entityTypesArray = this.autoCommitSettingsForm.get('entityTypes') as FormArray; |
|||
return entityTypesArray.length < exportableEntityTypes.length; |
|||
} |
|||
|
|||
public addEntityType() { |
|||
const entityTypesArray = this.autoCommitSettingsForm.get('entityTypes') as FormArray; |
|||
const config: AutoVersionCreateConfig = { |
|||
branch: null, |
|||
saveRelations: false, |
|||
saveAttributes: false |
|||
}; |
|||
const allowed = this.allowedEntityTypes(); |
|||
let entityType: EntityType = null; |
|||
if (allowed.length) { |
|||
entityType = allowed[0]; |
|||
} |
|||
const entityTypeControl = this.createEntityTypeControl(entityType, config); |
|||
(entityTypeControl as any).expanded = true; |
|||
entityTypesArray.push(entityTypeControl); |
|||
this.autoCommitSettingsForm.updateValueAndValidity(); |
|||
this.autoCommitSettingsForm.markAsDirty(); |
|||
} |
|||
|
|||
public removeAll() { |
|||
const entityTypesArray = this.autoCommitSettingsForm.get('entityTypes') as FormArray; |
|||
entityTypesArray.clear(); |
|||
this.autoCommitSettingsForm.updateValueAndValidity(); |
|||
this.autoCommitSettingsForm.markAsDirty(); |
|||
} |
|||
|
|||
entityTypeText(entityTypeControl: AbstractControl): SafeHtml { |
|||
const entityType: EntityType = entityTypeControl.get('entityType').value; |
|||
const config: AutoVersionCreateConfig = entityTypeControl.get('config').value; |
|||
let message = entityType ? this.translate.instant(entityTypeTranslations.get(entityType).typePlural) : 'Undefined'; |
|||
let branchName; |
|||
if (config.branch) { |
|||
branchName = config.branch; |
|||
} else { |
|||
branchName = this.translate.instant('version-control.default'); |
|||
} |
|||
message += ` (<small>${this.translate.instant('version-control.auto-commit-to-branch', {branch: branchName})}</small>)`; |
|||
return this.sanitizer.bypassSecurityTrustHtml(message); |
|||
} |
|||
|
|||
allowedEntityTypes(entityTypeControl?: AbstractControl): Array<EntityType> { |
|||
let res = [...exportableEntityTypes]; |
|||
const currentEntityType: EntityType = entityTypeControl?.get('entityType')?.value; |
|||
const value: [{entityType: string, config: EntityTypeVersionCreateConfig}] = |
|||
this.autoCommitSettingsForm.get('entityTypes').value || []; |
|||
const usedEntityTypes = value.map(val => val.entityType).filter(val => val); |
|||
res = res.filter(entityType => !usedEntityTypes.includes(entityType) || entityType === currentEntityType); |
|||
return res; |
|||
} |
|||
|
|||
save(): void { |
|||
const value: [{entityType: string, config: AutoVersionCreateConfig}] = |
|||
this.autoCommitSettingsForm.get('entityTypes').value || []; |
|||
const settings: AutoCommitSettings = {}; |
|||
if (value && value.length) { |
|||
value.forEach((val) => { |
|||
settings[val.entityType] = val.config; |
|||
}); |
|||
} |
|||
this.adminService.saveAutoCommitSettings(settings).subscribe( |
|||
(savedSettings) => { |
|||
this.settings = savedSettings; |
|||
this.autoCommitSettingsForm.setControl('entityTypes', |
|||
this.prepareEntityTypesFormArray(savedSettings), {emitEvent: false}); |
|||
this.autoCommitSettingsForm.markAsPristine(); |
|||
} |
|||
); |
|||
} |
|||
|
|||
delete(formDirective: FormGroupDirective): void { |
|||
this.dialogService.confirm( |
|||
this.translate.instant('admin.delete-auto-commit-settings-title', ), |
|||
this.translate.instant('admin.delete-auto-commit-settings-text'), null, |
|||
this.translate.instant('action.delete') |
|||
).subscribe((data) => { |
|||
if (data) { |
|||
this.adminService.deleteAutoCommitSettings().subscribe( |
|||
() => { |
|||
this.settings = null; |
|||
this.autoCommitSettingsForm.setControl('entityTypes', |
|||
this.prepareEntityTypesFormArray(this.settings), {emitEvent: false}); |
|||
this.autoCommitSettingsForm.markAsPristine(); |
|||
} |
|||
); |
|||
} |
|||
}); |
|||
} |
|||
|
|||
private prepareEntityTypesFormArray(settings: AutoCommitSettings | null): FormArray { |
|||
const entityTypesControls: Array<AbstractControl> = []; |
|||
if (settings) { |
|||
for (const entityType of Object.keys(settings)) { |
|||
const config = settings[entityType]; |
|||
entityTypesControls.push(this.createEntityTypeControl(entityType as EntityType, config)); |
|||
} |
|||
} |
|||
return this.fb.array(entityTypesControls); |
|||
} |
|||
|
|||
private createEntityTypeControl(entityType: EntityType, config: AutoVersionCreateConfig): AbstractControl { |
|||
const entityTypeControl = this.fb.group( |
|||
{ |
|||
entityType: [entityType, [Validators.required]], |
|||
config: this.fb.group({ |
|||
branch: [config.branch, []], |
|||
saveRelations: [config.saveRelations, []], |
|||
saveAttributes: [config.saveAttributes, []] |
|||
}) |
|||
} |
|||
); |
|||
return entityTypeControl; |
|||
} |
|||
|
|||
|
|||
} |
|||
@ -0,0 +1,23 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2022 The Thingsboard Authors |
|||
|
|||
Licensed under the Apache License, Version 2.0 (the "License"); |
|||
you may not use this file except in compliance with the License. |
|||
You may obtain a copy of the License at |
|||
|
|||
http://www.apache.org/licenses/LICENSE-2.0 |
|||
|
|||
Unless required by applicable law or agreed to in writing, software |
|||
distributed under the License is distributed on an "AS IS" BASIS, |
|||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
|||
See the License for the specific language governing permissions and |
|||
limitations under the License. |
|||
|
|||
--> |
|||
<tb-repository-settings #repositorySettingsComponent |
|||
*ngIf="!(hasRepository$ | async); else autoCommitSettings"> |
|||
</tb-repository-settings> |
|||
<ng-template #autoCommitSettings> |
|||
<tb-auto-commit-settings #autoCommitSettingsComponent></tb-auto-commit-settings> |
|||
</ng-template> |
|||
@ -0,0 +1,51 @@ |
|||
///
|
|||
/// Copyright © 2016-2022 The Thingsboard Authors
|
|||
///
|
|||
/// Licensed under the Apache License, Version 2.0 (the "License");
|
|||
/// you may not use this file except in compliance with the License.
|
|||
/// You may obtain a copy of the License at
|
|||
///
|
|||
/// http://www.apache.org/licenses/LICENSE-2.0
|
|||
///
|
|||
/// Unless required by applicable law or agreed to in writing, software
|
|||
/// distributed under the License is distributed on an "AS IS" BASIS,
|
|||
/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|||
/// See the License for the specific language governing permissions and
|
|||
/// limitations under the License.
|
|||
///
|
|||
|
|||
import { Component, OnInit, ViewChild } from '@angular/core'; |
|||
import { PageComponent } from '@shared/components/page.component'; |
|||
import { HasConfirmForm } from '@core/guards/confirm-on-exit.guard'; |
|||
import { select, Store } from '@ngrx/store'; |
|||
import { AppState } from '@core/core.state'; |
|||
import { FormGroup } from '@angular/forms'; |
|||
import { AutoCommitSettingsComponent } from '@home/components/vc/auto-commit-settings.component'; |
|||
import { selectHasRepository } from '@core/auth/auth.selectors'; |
|||
import { RepositorySettingsComponent } from '@home/components/vc/repository-settings.component'; |
|||
|
|||
@Component({ |
|||
selector: 'tb-auto-commit-admin-settings', |
|||
templateUrl: './auto-commit-admin-settings.component.html', |
|||
styleUrls: [] |
|||
}) |
|||
export class AutoCommitAdminSettingsComponent extends PageComponent implements OnInit, HasConfirmForm { |
|||
|
|||
@ViewChild('repositorySettingsComponent', {static: false}) repositorySettingsComponent: RepositorySettingsComponent; |
|||
@ViewChild('autoCommitSettingsComponent', {static: false}) autoCommitSettingsComponent: AutoCommitSettingsComponent; |
|||
|
|||
hasRepository$ = this.store.pipe(select(selectHasRepository)); |
|||
|
|||
constructor(protected store: Store<AppState>) { |
|||
super(store); |
|||
} |
|||
|
|||
ngOnInit() { |
|||
} |
|||
|
|||
confirmForm(): FormGroup { |
|||
return this.repositorySettingsComponent ? |
|||
this.repositorySettingsComponent?.repositorySettingsForm : |
|||
this.autoCommitSettingsComponent?.autoCommitSettingsForm; |
|||
} |
|||
} |
|||
Loading…
Reference in new issue