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