From 751ebc0d031815ef35aeaf53472ee8d868b5b9d4 Mon Sep 17 00:00:00 2001 From: Igor Kulikov Date: Tue, 28 Nov 2023 11:30:46 +0200 Subject: [PATCH] UI: Minor refactoring. Replace image inputs to image gallery inputs. --- ui-ngx/src/app/core/http/asset.service.ts | 6 +-- ui-ngx/src/app/core/http/device.service.ts | 6 +-- ui-ngx/src/app/core/http/edge.service.ts | 2 +- ui-ngx/src/app/modules/common/modules-map.ts | 21 +++++++--- .../alarm/alarm-comment.component.ts | 2 +- .../dashboard-page.component.ts | 29 ++++++++++++- .../dashboard-widget-select.component.ts | 4 +- .../home/components/home-components.module.ts | 16 ------- .../shared-home-components.module.ts | 28 +------------ ...ggregated-value-card-widget.component.html | 2 +- .../aggregated-value-card-widget.component.ts | 8 ++-- .../cards/progress-bar-widget.component.html | 2 +- .../cards/progress-bar-widget.component.ts | 7 +++- .../cards/value-card-widget.component.html | 2 +- .../lib/cards/value-card-widget.component.ts | 8 ++-- .../value-chart-card-widget.component.html | 2 +- .../value-chart-card-widget.component.ts | 9 ++-- .../lib/chart/doughnut-widget.component.html | 2 +- .../lib/chart/doughnut-widget.component.ts | 9 ++-- .../chart/range-chart-widget.component.html | 2 +- .../lib/chart/range-chart-widget.component.ts | 9 ++-- .../lib/gateway/gateway-form.component.ts | 2 +- .../battery-level-widget.component.html | 2 +- .../battery-level-widget.component.ts | 7 +++- .../liquid-level-widget.component.html | 2 +- .../liquid-level-widget.component.ts | 8 ++-- .../signal-strength-widget.component.html | 2 +- .../signal-strength-widget.component.ts | 7 +++- .../background-settings-panel.component.html | 10 +---- .../background-settings-panel.component.ts | 8 ++-- .../common/background-settings.component.html | 2 +- .../common/background-settings.component.ts | 15 ++++--- ...wind-speed-direction-widget.component.html | 2 +- .../wind-speed-direction-widget.component.ts | 7 +++- .../home/dialogs/home-dialogs.service.ts | 2 +- .../app/modules/home/models/services.map.ts | 2 +- .../home/pages/admin/admin-routing.module.ts | 2 +- .../modules/home/pages/admin/admin.module.ts | 2 - .../asset-profiles-table-config.resolver.ts | 2 +- .../home/pages/dashboard/dashboard.module.ts | 2 - .../dashboards-table-config.resolver.ts | 34 ++++++++++++++- .../device-profiles-table-config.resolver.ts | 2 +- .../rulechains-table-config.resolver.ts | 2 +- .../backup-code-auth-dialog.component.ts | 2 +- .../tenant-profiles-table-config.resolver.ts | 6 +-- .../pages/widget/widget-library.module.ts | 3 -- .../widget-types-table-config.resolver.ts | 2 +- .../widgets-bundle-widgets.component.ts | 2 +- .../widgets-bundles-table-config.resolver.ts | 4 +- .../grid}/scroll-grid-datasource.ts | 0 .../grid/scroll-grid.component.html | 0 .../grid/scroll-grid.component.scss | 0 .../components/grid/scroll-grid.component.ts | 2 +- .../image/gallery-image-input.component.html | 0 .../image/gallery-image-input.component.scss | 2 +- .../image/gallery-image-input.component.ts | 2 +- .../image/image-dialog.component.html | 0 .../image/image-dialog.component.scss | 2 +- .../image/image-dialog.component.ts | 2 +- .../image/image-gallery.component.html | 0 .../image/image-gallery.component.scss | 2 +- .../image/image-gallery.component.ts | 14 +++---- .../image/image-references.component.html | 0 .../image/image-references.component.scss | 2 +- .../image/image-references.component.ts | 0 .../components/image/images-datasource.ts | 0 .../image/images-in-use-dialog.component.html | 0 .../image/images-in-use-dialog.component.scss | 0 .../image/images-in-use-dialog.component.ts | 4 +- ...ultiple-gallery-image-input.component.html | 0 ...ultiple-gallery-image-input.component.scss | 2 +- .../multiple-gallery-image-input.component.ts | 4 +- .../image/upload-image-dialog.component.html | 0 .../image/upload-image-dialog.component.ts | 0 .../src/app/shared/components/public-api.ts | 2 + ...xport-widgets-bundle-dialog.component.html | 0 .../export-widgets-bundle-dialog.component.ts | 0 .../import-dialog-csv.component.html | 0 .../import-dialog-csv.component.scss | 0 .../import-dialog-csv.component.ts | 8 ++-- .../import-dialog.component.html | 0 .../import-export/import-dialog.component.ts | 0 .../import-export/import-export.models.ts | 0 .../import-export/import-export.service.ts | 42 ++++--------------- .../table-columns-assignment.component.html | 0 .../table-columns-assignment.component.scss | 0 .../table-columns-assignment.component.ts | 2 +- .../shared/models/widget-settings.models.ts | 38 ++++++++++++----- ui-ngx/src/app/shared/shared.module.ts | 42 ++++++++++++++++++- .../assets/locale/locale.constant-en_US.json | 5 +-- 90 files changed, 283 insertions(+), 213 deletions(-) rename ui-ngx/src/app/{modules/home/models/datasource => shared/components/grid}/scroll-grid-datasource.ts (100%) rename ui-ngx/src/app/{modules/home => shared}/components/grid/scroll-grid.component.html (100%) rename ui-ngx/src/app/{modules/home => shared}/components/grid/scroll-grid.component.scss (100%) rename ui-ngx/src/app/{modules/home => shared}/components/grid/scroll-grid.component.ts (98%) rename ui-ngx/src/app/{modules/home => shared}/components/image/gallery-image-input.component.html (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/gallery-image-input.component.scss (99%) rename ui-ngx/src/app/{modules/home => shared}/components/image/gallery-image-input.component.ts (98%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-dialog.component.html (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-dialog.component.scss (98%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-dialog.component.ts (98%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-gallery.component.html (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-gallery.component.scss (99%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-gallery.component.ts (97%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-references.component.html (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-references.component.scss (98%) rename ui-ngx/src/app/{modules/home => shared}/components/image/image-references.component.ts (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/images-datasource.ts (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/images-in-use-dialog.component.html (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/images-in-use-dialog.component.scss (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/images-in-use-dialog.component.ts (96%) rename ui-ngx/src/app/{modules/home => shared}/components/image/multiple-gallery-image-input.component.html (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/multiple-gallery-image-input.component.scss (99%) rename ui-ngx/src/app/{modules/home => shared}/components/image/multiple-gallery-image-input.component.ts (96%) rename ui-ngx/src/app/{modules/home => shared}/components/image/upload-image-dialog.component.html (100%) rename ui-ngx/src/app/{modules/home => shared}/components/image/upload-image-dialog.component.ts (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/export-widgets-bundle-dialog.component.html (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/export-widgets-bundle-dialog.component.ts (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/import-dialog-csv.component.html (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/import-dialog-csv.component.scss (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/import-dialog-csv.component.ts (96%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/import-dialog.component.html (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/import-dialog.component.ts (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/import-export.models.ts (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/import-export.service.ts (96%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/table-columns-assignment.component.html (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/table-columns-assignment.component.scss (100%) rename ui-ngx/src/app/{modules/home/components => shared}/import-export/table-columns-assignment.component.ts (99%) diff --git a/ui-ngx/src/app/core/http/asset.service.ts b/ui-ngx/src/app/core/http/asset.service.ts index 6751e0e38f..3c45a9e95b 100644 --- a/ui-ngx/src/app/core/http/asset.service.ts +++ b/ui-ngx/src/app/core/http/asset.service.ts @@ -20,9 +20,9 @@ import { Observable } from 'rxjs'; import { HttpClient } from '@angular/common/http'; import { PageLink } from '@shared/models/page/page-link'; import { PageData } from '@shared/models/page/page-data'; -import { EntitySubtype } from '@app/shared/models/entity-type.models'; -import { Asset, AssetInfo, AssetSearchQuery } from '@app/shared/models/asset.models'; -import { BulkImportRequest, BulkImportResult } from '@home/components/import-export/import-export.models'; +import { EntitySubtype } from '@shared/models/entity-type.models'; +import { Asset, AssetInfo, AssetSearchQuery } from '@shared/models/asset.models'; +import { BulkImportRequest, BulkImportResult } from '@shared/import-export/import-export.models'; @Injectable({ providedIn: 'root' diff --git a/ui-ngx/src/app/core/http/device.service.ts b/ui-ngx/src/app/core/http/device.service.ts index 801bdeb8c3..fbabbaadfa 100644 --- a/ui-ngx/src/app/core/http/device.service.ts +++ b/ui-ngx/src/app/core/http/device.service.ts @@ -30,10 +30,10 @@ import { DeviceSearchQuery, PublishLaunchCommand, PublishTelemetryCommand -} from '@app/shared/models/device.models'; -import { EntitySubtype } from '@app/shared/models/entity-type.models'; +} from '@shared/models/device.models'; +import { EntitySubtype } from '@shared/models/entity-type.models'; import { AuthService } from '@core/auth/auth.service'; -import { BulkImportRequest, BulkImportResult } from '@home/components/import-export/import-export.models'; +import { BulkImportRequest, BulkImportResult } from '@shared/import-export/import-export.models'; import { PersistentRpc, RpcStatus } from '@shared/models/rpc.models'; @Injectable({ diff --git a/ui-ngx/src/app/core/http/edge.service.ts b/ui-ngx/src/app/core/http/edge.service.ts index aeb4f7d16b..4ddcc69458 100644 --- a/ui-ngx/src/app/core/http/edge.service.ts +++ b/ui-ngx/src/app/core/http/edge.service.ts @@ -23,7 +23,7 @@ import { PageData } from '@shared/models/page/page-data'; import { EntitySubtype } from '@app/shared/models/entity-type.models'; import { Edge, EdgeEvent, EdgeInfo, EdgeInstallInstructions, EdgeSearchQuery } from '@shared/models/edge.models'; import { EntityId } from '@shared/models/id/entity-id'; -import { BulkImportRequest, BulkImportResult } from '@home/components/import-export/import-export.models'; +import { BulkImportRequest, BulkImportResult } from '@shared/import-export/import-export.models'; @Injectable({ providedIn: 'root' diff --git a/ui-ngx/src/app/modules/common/modules-map.ts b/ui-ngx/src/app/modules/common/modules-map.ts index d93a84ea51..41e10d5de3 100644 --- a/ui-ngx/src/app/modules/common/modules-map.ts +++ b/ui-ngx/src/app/modules/common/modules-map.ts @@ -95,6 +95,7 @@ import * as SelectableColumnsPipe from '@shared/pipe/selectable-columns.pipe'; import * as ShortNumberPipe from '@shared/pipe/short-number.pipe'; import * as TbJsonPipe from '@shared/pipe/tbJson.pipe'; import * as TruncatePipe from '@shared/pipe/truncate.pipe'; +import * as ImagePipe from '@shared/pipe/image.pipe'; import * as coercion from '@shared/decorators/coercion'; import * as enumerable from '@shared/decorators/enumerable'; @@ -187,6 +188,9 @@ import * as UnitInputComponent from '@shared/components/unit-input.component'; import * as MaterialIconsComponent from '@shared/components/material-icons.component'; import * as TbIconComponent from '@shared/components/icon.component'; import * as HintTooltipIconComponent from '@shared/components/hint-tooltip-icon.component'; +import * as ScrollGridComponent from '@shared/components/grid/scroll-grid.component'; +import * as GalleryImageInputComponent from '@shared/components/image/gallery-image-input.component'; +import * as MultipleGalleryImageInputComponent from '@shared/components/image/multiple-gallery-image-input.component'; import * as AddEntityDialogComponent from '@home/components/entity/add-entity-dialog.component'; import * as EntitiesTableComponent from '@home/components/entity/entities-table.component'; @@ -227,10 +231,10 @@ import * as CustomActionPrettyEditorComponent from '@home/components/widget/acti import * as MobileActionEditorComponent from '@home/components/widget/action/mobile-action-editor.component'; import * as CustomDialogService from '@home/components/widget/dialog/custom-dialog.service'; import * as CustomDialogContainerComponent from '@home/components/widget/dialog/custom-dialog-container.component'; -import * as ImportDialogComponent from '@home/components/import-export/import-dialog.component'; +import * as ImportDialogComponent from '@shared/import-export/import-dialog.component'; import * as AddWidgetToDashboardDialogComponent from '@home/components/attribute/add-widget-to-dashboard-dialog.component'; -import * as ImportDialogCsvComponent from '@home/components/import-export/import-dialog-csv.component'; -import * as TableColumnsAssignmentComponent from '@home/components/import-export/table-columns-assignment.component'; +import * as ImportDialogCsvComponent from '@shared/import-export/import-dialog-csv.component'; +import * as TableColumnsAssignmentComponent from '@shared/import-export/table-columns-assignment.component'; import * as EventContentDialogComponent from '@home/components/event/event-content-dialog.component'; import * as SharedHomeComponentsModule from '@home/components/shared-home-components.module'; import * as SelectTargetLayoutDialogComponent from '@home/components/dashboard/select-target-layout-dialog.component'; @@ -401,11 +405,16 @@ class ModulesMap implements IModulesMap { '@shared/pipe/short-number.pipe': ShortNumberPipe, '@shared/pipe/tbJson.pipe': TbJsonPipe, '@shared/pipe/truncate.pipe': TruncatePipe, + '@shared/pipe/image.pipe': ImagePipe, '@shared/decorators/coercion': coercion, '@shared/decorators/enumerable': enumerable, '@shared/decorators/tb-inject': TbInject, + '@shared/import-export/import-dialog.component': ImportDialogComponent, + '@shared/import-export/import-dialog-csv.component': ImportDialogCsvComponent, + '@shared/import-export/table-columns-assignment.component': TableColumnsAssignmentComponent, + '@shared/components/footer.component': FooterComponent, '@shared/components/logo.component': LogoComponent, '@shared/components/footer-fab-buttons.component': FooterFabButtonsComponent, @@ -494,6 +503,9 @@ class ModulesMap implements IModulesMap { '@shared/components/material-icons.component': MaterialIconsComponent, '@shared/components/icon.component': TbIconComponent, '@shared/components/hint-tooltip-icon.component': HintTooltipIconComponent, + '@shared/components/grid/scroll-grid.component': ScrollGridComponent, + '@shared/components/image/gallery-image-input.component': GalleryImageInputComponent, + '@shared/components/image/multiple-gallery-image-input.component': MultipleGalleryImageInputComponent, '@home/components/entity/add-entity-dialog.component': AddEntityDialogComponent, '@home/components/entity/entities-table.component': EntitiesTableComponent, @@ -534,10 +546,7 @@ class ModulesMap implements IModulesMap { '@home/components/widget/action/mobile-action-editor.component': MobileActionEditorComponent, '@home/components/widget/dialog/custom-dialog.service': CustomDialogService, '@home/components/widget/dialog/custom-dialog-container.component': CustomDialogContainerComponent, - '@home/components/import-export/import-dialog.component': ImportDialogComponent, '@home/components/attribute/add-widget-to-dashboard-dialog.component': AddWidgetToDashboardDialogComponent, - '@home/components/import-export/import-dialog-csv.component': ImportDialogCsvComponent, - '@home/components/import-export/table-columns-assignment.component': TableColumnsAssignmentComponent, '@home/components/event/event-content-dialog.component': EventContentDialogComponent, '@home/components/shared-home-components.module': SharedHomeComponentsModule, '@home/components/dashboard/select-target-layout-dialog.component': SelectTargetLayoutDialogComponent, diff --git a/ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.ts b/ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.ts index 5ba3c39a81..623256e1e0 100644 --- a/ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.ts +++ b/ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.ts @@ -31,7 +31,7 @@ import { AlarmComment, AlarmCommentInfo, AlarmCommentType } from '@shared/models import { UtilsService } from '@core/services/utils.service'; import { EntityType } from '@shared/models/entity-type.models'; import { DatePipe } from '@angular/common'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; interface AlarmCommentsDisplayData { commentId?: string, diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts index 6fdd07c9ca..49ed46d440 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts @@ -119,7 +119,7 @@ import { ManageDashboardStatesDialogComponent, ManageDashboardStatesDialogData } from '@home/components/dashboard-page/states/manage-dashboard-states-dialog.component'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { AuthState } from '@app/core/auth/auth.models'; import { FiltersDialogComponent, FiltersDialogData } from '@home/components/filter/filters-dialog.component'; import { Filters } from '@shared/models/query/query.models'; @@ -145,7 +145,7 @@ import { IAliasController } from '@core/api/widget-api.models'; import { MatButton } from '@angular/material/button'; import { VersionControlComponent } from '@home/components/vc/version-control.component'; import { TbPopoverService } from '@shared/components/popover.service'; -import { tap } from 'rxjs/operators'; +import { map, tap } from 'rxjs/operators'; import { LayoutFixedSize, LayoutWidthType } from '@home/components/dashboard-page/layout/layout.models'; import { TbPopoverComponent } from '@shared/components/popover.component'; import { ResizeObserver } from '@juggle/resize-observer'; @@ -919,6 +919,7 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC $event.stopPropagation(); } this.importExport.importWidget(this.dashboard, this.dashboardCtx.state, + this.editMissingAliases.bind(this), this.selectTargetLayout.bind(this), this.entityAliasesUpdated.bind(this), this.filtersUpdated.bind(this)).subscribe( (importData) => { if (importData) { @@ -935,6 +936,30 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC ); } + private editMissingAliases(widgets: Array, isSingleWidget: boolean, + customTitle: string, missingEntityAliases: EntityAliases): Observable { + return this.dialog.open(EntityAliasesDialogComponent, { + disableClose: true, + panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], + data: { + entityAliases: missingEntityAliases, + widgets, + customTitle, + isSingleWidget, + disableAdd: true + } + }).afterClosed().pipe( + map((updatedEntityAliases) => { + if (updatedEntityAliases) { + return updatedEntityAliases; + } else { + throw new Error('Unable to resolve missing entity aliases!'); + } + } + )); + } + public currentDashboardIdChanged(dashboardId: string) { if (!this.widgetEditMode) { this.dashboardCtx.stateController.cleanupPreservedStates(); diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-widget-select.component.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-widget-select.component.ts index 50cf1ac790..0e73c35724 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-widget-select.component.ts +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-widget-select.component.ts @@ -31,8 +31,8 @@ import { BehaviorSubject, combineLatest } from 'rxjs'; import { isObject } from '@core/utils'; import { PageLink } from '@shared/models/page/page-link'; import { Direction } from '@shared/models/page/sort-order'; -import { GridEntitiesFetchFunction, ScrollGridColumns } from '@home/models/datasource/scroll-grid-datasource'; -import { ItemSizeStrategy } from '@home/components/grid/scroll-grid.component'; +import { GridEntitiesFetchFunction, ScrollGridColumns } from '@shared/components/grid/scroll-grid-datasource'; +import { ItemSizeStrategy } from '@shared/components/grid/scroll-grid.component'; type selectWidgetMode = 'bundles' | 'allWidgets'; diff --git a/ui-ngx/src/app/modules/home/components/home-components.module.ts b/ui-ngx/src/app/modules/home/components/home-components.module.ts index 735ef9742b..e8374f6534 100644 --- a/ui-ngx/src/app/modules/home/components/home-components.module.ts +++ b/ui-ngx/src/app/modules/home/components/home-components.module.ts @@ -51,11 +51,7 @@ import { CustomActionPrettyEditorComponent } from '@home/components/widget/actio import { MobileActionEditorComponent } from '@home/components/widget/action/mobile-action-editor.component'; import { CustomDialogService } from '@home/components/widget/dialog/custom-dialog.service'; import { CustomDialogContainerComponent } from '@home/components/widget/dialog/custom-dialog-container.component'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; -import { ImportDialogComponent } from '@home/components/import-export/import-dialog.component'; import { AddWidgetToDashboardDialogComponent } from '@home/components/attribute/add-widget-to-dashboard-dialog.component'; -import { ImportDialogCsvComponent } from '@home/components/import-export/import-dialog-csv.component'; -import { TableColumnsAssignmentComponent } from '@home/components/import-export/table-columns-assignment.component'; import { EventContentDialogComponent } from '@home/components/event/event-content-dialog.component'; import { SharedHomeComponentsModule } from '@home/components/shared-home-components.module'; import { SelectTargetLayoutDialogComponent } from '@home/components/dashboard/select-target-layout-dialog.component'; @@ -178,9 +174,6 @@ import { import { WidgetConfigComponentsModule } from '@home/components/widget/config/widget-config-components.module'; import { BasicWidgetConfigModule } from '@home/components/widget/config/basic/basic-widget-config.module'; import { DeleteTimeseriesPanelComponent } from '@home/components/attribute/delete-timeseries-panel.component'; -import { - ExportWidgetsBundleDialogComponent -} from '@home/components/import-export/export-widgets-bundle-dialog.component'; @NgModule({ declarations: @@ -229,13 +222,9 @@ import { CustomActionPrettyEditorComponent, MobileActionEditorComponent, CustomDialogContainerComponent, - ImportDialogComponent, - ImportDialogCsvComponent, - ExportWidgetsBundleDialogComponent, SelectTargetLayoutDialogComponent, SelectTargetStateDialogComponent, AddWidgetToDashboardDialogComponent, - TableColumnsAssignmentComponent, BooleanFilterPredicateComponent, StringFilterPredicateComponent, NumericFilterPredicateComponent, @@ -374,10 +363,6 @@ import { CustomActionPrettyEditorComponent, MobileActionEditorComponent, CustomDialogContainerComponent, - ImportDialogComponent, - ImportDialogCsvComponent, - ExportWidgetsBundleDialogComponent, - TableColumnsAssignmentComponent, SelectTargetLayoutDialogComponent, SelectTargetStateDialogComponent, BooleanFilterPredicateComponent, @@ -468,7 +453,6 @@ import { providers: [ WidgetComponentService, CustomDialogService, - ImportExportService, {provide: EMBED_DASHBOARD_DIALOG_TOKEN, useValue: EmbedDashboardDialogComponent}, {provide: COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN, useValue: ComplexFilterPredicateDialogComponent}, {provide: DASHBOARD_PAGE_COMPONENT_TOKEN, useValue: DashboardPageComponent}, diff --git a/ui-ngx/src/app/modules/home/components/shared-home-components.module.ts b/ui-ngx/src/app/modules/home/components/shared-home-components.module.ts index bce8a4e5f7..865e7cf224 100644 --- a/ui-ngx/src/app/modules/home/components/shared-home-components.module.ts +++ b/ui-ngx/src/app/modules/home/components/shared-home-components.module.ts @@ -22,14 +22,6 @@ import { SHARED_HOME_COMPONENTS_MODULE_TOKEN } from '@home/components/tokens'; import { AlarmCommentComponent } from '@home/components/alarm/alarm-comment.component'; import { AlarmCommentDialogComponent } from '@home/components/alarm/alarm-comment-dialog.component'; import { AlarmAssigneeComponent } from '@home/components/alarm/alarm-assignee.component'; -import { ScrollGridComponent } from '@home/components/grid/scroll-grid.component'; -import { ImageGalleryComponent } from '@home/components/image/image-gallery.component'; -import { UploadImageDialogComponent } from '@home/components/image/upload-image-dialog.component'; -import { ImageDialogComponent } from '@home/components/image/image-dialog.component'; -import { ImageReferencesComponent } from '@home/components/image/image-references.component'; -import { ImagesInUseDialogComponent } from '@home/components/image/images-in-use-dialog.component'; -import { GalleryImageInputComponent } from '@home/components/image/gallery-image-input.component'; -import { MultipleGalleryImageInputComponent } from '@home/components/image/multiple-gallery-image-input.component'; @NgModule({ providers: [ @@ -40,15 +32,7 @@ import { MultipleGalleryImageInputComponent } from '@home/components/image/multi AlarmDetailsDialogComponent, AlarmCommentComponent, AlarmCommentDialogComponent, - AlarmAssigneeComponent, - ScrollGridComponent, - ImageGalleryComponent, - UploadImageDialogComponent, - ImageDialogComponent, - ImageReferencesComponent, - ImagesInUseDialogComponent, - GalleryImageInputComponent, - MultipleGalleryImageInputComponent + AlarmAssigneeComponent ], imports: [ CommonModule, @@ -58,15 +42,7 @@ import { MultipleGalleryImageInputComponent } from '@home/components/image/multi AlarmDetailsDialogComponent, AlarmCommentComponent, AlarmCommentDialogComponent, - AlarmAssigneeComponent, - ScrollGridComponent, - ImageGalleryComponent, - UploadImageDialogComponent, - ImageDialogComponent, - ImageReferencesComponent, - ImagesInUseDialogComponent, - GalleryImageInputComponent, - MultipleGalleryImageInputComponent + AlarmAssigneeComponent ] }) export class SharedHomeComponentsModule { } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/aggregated-value-card-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/cards/aggregated-value-card-widget.component.html index 8133acedfb..e4f620b16e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/aggregated-value-card-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/aggregated-value-card-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/aggregated-value-card-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/cards/aggregated-value-card-widget.component.ts index 874d6ca1b4..94a6c9d985 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/aggregated-value-card-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/aggregated-value-card-widget.component.ts @@ -51,6 +51,7 @@ import { DataKey } from '@shared/models/widget.models'; import { formatNumberValue, formatValue, isDefined, isDefinedAndNotNull, isNumeric } from '@core/utils'; import { map } from 'rxjs/operators'; import { ResizeObserver } from '@juggle/resize-observer'; +import { ImagePipe } from '@shared/pipe/image.pipe'; const valuesLayoutHeight = 66; const valuesLayoutVerticalPadding = 16; @@ -96,7 +97,7 @@ export class AggregatedValueCardWidgetComponent implements OnInit, AfterViewInit dateStyle: ComponentStyle = {}; dateColor: string; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; private flot: TbFlot; @@ -109,7 +110,8 @@ export class AggregatedValueCardWidgetComponent implements OnInit, AfterViewInit private panelResize$: ResizeObserver; - constructor(private renderer: Renderer2, + constructor(private imagePipe: ImagePipe, + private renderer: Renderer2, private cd: ChangeDetectorRef) { } @@ -151,7 +153,7 @@ export class AggregatedValueCardWidgetComponent implements OnInit, AfterViewInit this.dateStyle = textStyle(this.settings.dateFont); this.dateColor = this.settings.dateColor; - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/progress-bar-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/cards/progress-bar-widget.component.html index 3f788aaf82..71b41ffc88 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/progress-bar-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/progress-bar-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/progress-bar-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/cards/progress-bar-widget.component.ts index 43d2c6300c..455a3aedd2 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/progress-bar-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/progress-bar-widget.component.ts @@ -43,6 +43,8 @@ import { import { WidgetComponent } from '@home/components/widget/widget.component'; import { progressBarDefaultSettings, ProgressBarLayout, ProgressBarWidgetSettings } from './progress-bar-widget.models'; import { ResizeObserver } from '@juggle/resize-observer'; +import { Observable } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; const defaultLayoutHeight = 80; const simplifiedLayoutHeight = 75; @@ -93,7 +95,7 @@ export class ProgressBarWidgetComponent implements OnInit, OnDestroy, AfterViewI value: number; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; progressBarPanelResize$: ResizeObserver; @@ -102,6 +104,7 @@ export class ProgressBarWidgetComponent implements OnInit, OnDestroy, AfterViewI private units = ''; constructor(private date: DatePipe, + private imagePipe: ImagePipe, private widgetComponent: WidgetComponent, private renderer: Renderer2, private cd: ChangeDetectorRef) { @@ -144,7 +147,7 @@ export class ProgressBarWidgetComponent implements OnInit, OnDestroy, AfterViewI this.ticksStyle.color = this.settings.ticksColor; } - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-card-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-card-widget.component.html index 16ad55078e..5ee040558a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-card-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-card-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-card-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-card-widget.component.ts index a80d1d850b..8c855b2bd5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-card-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-card-widget.component.ts @@ -44,6 +44,7 @@ import { valueCardDefaultSettings, ValueCardLayout, ValueCardWidgetSettings } fr import { WidgetComponent } from '@home/components/widget/widget.component'; import { Observable } from 'rxjs'; import { ResizeObserver } from '@juggle/resize-observer'; +import { ImagePipe } from '@shared/pipe/image.pipe'; const squareLayoutSize = 160; const squareLayoutPadding = 48; @@ -92,7 +93,7 @@ export class ValueCardWidgetComponent implements OnInit, AfterViewInit, OnDestro dateStyle: ComponentStyle = {}; dateColor: ColorProcessor; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; private panelResize$: ResizeObserver; @@ -101,7 +102,8 @@ export class ValueCardWidgetComponent implements OnInit, AfterViewInit, OnDestro private decimals = 0; private units = ''; - constructor(private renderer: Renderer2, + constructor(private imagePipe: ImagePipe, + private renderer: Renderer2, private widgetComponent: WidgetComponent, private cd: ChangeDetectorRef) { } @@ -142,7 +144,7 @@ export class ValueCardWidgetComponent implements OnInit, AfterViewInit, OnDestro this.dateStyle = textStyle(this.settings.dateFont); this.dateColor = ColorProcessor.fromSettings(this.settings.dateColor); - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-chart-card-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-chart-card-widget.component.html index b1789800eb..b8847a5ba0 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-chart-card-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-chart-card-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-chart-card-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-chart-card-widget.component.ts index b187aa7969..f1649bee6e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-chart-card-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/cards/value-chart-card-widget.component.ts @@ -48,6 +48,8 @@ import { TbFlot } from '@home/components/widget/lib/flot-widget'; import { DataKey } from '@shared/models/widget.models'; import { TbFlotKeySettings, TbFlotSettings } from '@home/components/widget/lib/flot-widget.models'; import { getTsValueByLatestDataKey } from '@home/components/widget/lib/cards/aggregated-value-card.models'; +import { Observable } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; const layoutHeight = 56; const valueRelativeMaxWidth = 0.5; @@ -84,7 +86,7 @@ export class ValueChartCardWidgetComponent implements OnInit, AfterViewInit, OnD valueStyle: ComponentStyle = {}; valueColor: ColorProcessor; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; private flot: TbFlot; @@ -98,7 +100,8 @@ export class ValueChartCardWidgetComponent implements OnInit, AfterViewInit, OnD private valueFontSize: number; - constructor(private renderer: Renderer2, + constructor(private imagePipe: ImagePipe, + private renderer: Renderer2, private widgetComponent: WidgetComponent, private cd: ChangeDetectorRef) { } @@ -129,7 +132,7 @@ export class ValueChartCardWidgetComponent implements OnInit, AfterViewInit, OnD this.valueStyle = textStyle(this.settings.valueFont); this.valueColor = ColorProcessor.fromSettings(this.settings.valueColor); - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); if (this.ctx.defaultSubscription.firstDatasource?.dataKeys?.length) { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.html index 5c74c160f6..c39d277355 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.ts index 1595c59110..cd209add91 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/chart/doughnut-widget.component.ts @@ -53,6 +53,8 @@ import { DataKey } from '@shared/models/widget.models'; import { TooltipComponent, TooltipComponentOption } from 'echarts/components'; import { PieChart, PieSeriesOption } from 'echarts/charts'; import { SVGRenderer } from 'echarts/renderers'; +import { Observable } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; echarts.use([ TooltipComponent, @@ -117,7 +119,7 @@ export class DoughnutWidgetComponent implements OnInit, OnDestroy, AfterViewInit totalValueColor: ColorProcessor; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; legendItems: DoughnutLegendItem[]; @@ -145,7 +147,8 @@ export class DoughnutWidgetComponent implements OnInit, OnDestroy, AfterViewInit private svgShape: Svg; private totalTextNode: Text; - constructor(private widgetComponent: WidgetComponent, + constructor(private imagePipe: ImagePipe, + private widgetComponent: WidgetComponent, private renderer: Renderer2, private translate: TranslateService, private cd: ChangeDetectorRef) { @@ -167,7 +170,7 @@ export class DoughnutWidgetComponent implements OnInit, OnDestroy, AfterViewInit this.totalValueColor = ColorProcessor.fromSettings(this.settings.totalValueColor); } - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); if (this.showLegend) { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/chart/range-chart-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/chart/range-chart-widget.component.html index db9e828a0c..62b7784aa4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/chart/range-chart-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/chart/range-chart-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/chart/range-chart-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/chart/range-chart-widget.component.ts index 80e59c3512..4ff772b3e9 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/chart/range-chart-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/chart/range-chart-widget.component.ts @@ -57,6 +57,8 @@ import { LineChart, LineSeriesOption, } from 'echarts/charts'; import { CanvasRenderer } from 'echarts/renderers'; import { rangeChartDefaultSettings, RangeChartWidgetSettings } from './range-chart-widget.models'; import { DataSet } from '@shared/models/widget.models'; +import { Observable } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; echarts.use([ TooltipComponent, @@ -225,7 +227,7 @@ export class RangeChartWidgetComponent implements OnInit, OnDestroy, AfterViewIn showLegend: boolean; legendClass: string; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; legendLabelStyle: ComponentStyle; @@ -246,7 +248,8 @@ export class RangeChartWidgetComponent implements OnInit, OnDestroy, AfterViewIn private tooltipDateFormat: DateFormatProcessor; - constructor(private renderer: Renderer2, + constructor(private imagePipe: ImagePipe, + private renderer: Renderer2, private cd: ChangeDetectorRef) { } @@ -265,7 +268,7 @@ export class RangeChartWidgetComponent implements OnInit, OnDestroy, AfterViewIn } - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); this.rangeItems = toRangeItems(this.settings.rangeColors); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-form.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-form.component.ts index 0314120995..6980aca106 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-form.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-form.component.ts @@ -57,7 +57,7 @@ import { AttributeService } from '@core/http/attribute.service'; import { AttributeData, AttributeScope } from '@shared/models/telemetry/telemetry.models'; import { forkJoin, Observable } from 'rxjs'; import { tap } from 'rxjs/operators'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { ResizeObserver } from '@juggle/resize-observer'; // @dynamic diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/battery-level-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/battery-level-widget.component.html index cc2fe2cf8f..9eafcf7284 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/battery-level-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/battery-level-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/battery-level-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/battery-level-widget.component.ts index 31f98aff6c..45deff473d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/battery-level-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/battery-level-widget.component.ts @@ -46,6 +46,8 @@ import { BatteryLevelWidgetSettings } from '@home/components/widget/lib/indicator/battery-level-widget.models'; import { ResizeObserver } from '@juggle/resize-observer'; +import { Observable } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; const verticalBatteryDimensions = { shapeAspectRatio: 64 / 113, @@ -125,7 +127,7 @@ export class BatteryLevelWidgetComponent implements OnInit, OnDestroy, AfterView batteryShapeColor: ColorProcessor; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; batteryBoxResize$: ResizeObserver; @@ -136,6 +138,7 @@ export class BatteryLevelWidgetComponent implements OnInit, OnDestroy, AfterView private units = ''; constructor(private date: DatePipe, + private imagePipe: ImagePipe, private widgetComponent: WidgetComponent, private renderer: Renderer2, private cd: ChangeDetectorRef) { @@ -190,7 +193,7 @@ export class BatteryLevelWidgetComponent implements OnInit, OnDestroy, AfterView this.batteryShapeColor = ColorProcessor.fromSettings(this.settings.batteryShapeColor); - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); this.hasCardClickAction = this.ctx.actionsApi.getActionDescriptors('cardClick').length > 0; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/liquid-level-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/liquid-level-widget.component.html index 4c14686b9c..430d9260b5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/liquid-level-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/liquid-level-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/liquid-level-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/liquid-level-widget.component.ts index 847937581b..edce9912bb 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/liquid-level-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/liquid-level-widget.component.ts @@ -58,6 +58,7 @@ import { ResourcesService } from '@core/services/resources.service'; import { NULL_UUID } from '@shared/models/id/has-uuid'; import { TranslateService } from '@ngx-translate/core'; import ITooltipsterInstance = JQueryTooltipster.ITooltipsterInstance; +import { ImagePipe } from '@shared/pipe/image.pipe'; @Component({ selector: 'tb-liquid-level-widget', @@ -76,7 +77,7 @@ export class LiquidLevelWidgetComponent implements OnInit { @Input() widgetTitlePanel: TemplateRef; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; hasCardClickAction = false; @@ -106,7 +107,8 @@ export class LiquidLevelWidgetComponent implements OnInit { private capacityUnits = Object.values(CapacityUnits); - constructor(private cd: ChangeDetectorRef, + constructor(private imagePipe: ImagePipe, + private cd: ChangeDetectorRef, private resourcesService: ResourcesService, private translate: TranslateService) { } @@ -116,7 +118,7 @@ export class LiquidLevelWidgetComponent implements OnInit { this.settings = {...levelCardDefaultSettings, ...this.ctx.settings}; this.declareStyles(); - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); this.hasCardClickAction = this.ctx.actionsApi.getActionDescriptors('cardClick').length > 0; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/signal-strength-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/signal-strength-widget.component.html index a2bf74e942..f857c186d7 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/signal-strength-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/signal-strength-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/signal-strength-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/signal-strength-widget.component.ts index 8427cf362b..79e4084423 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/indicator/signal-strength-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/indicator/signal-strength-widget.component.ts @@ -51,6 +51,8 @@ import { } from '@home/components/widget/lib/indicator/signal-strength-widget.models'; import tinycolor from 'tinycolor2'; import { TranslateService } from '@ngx-translate/core'; +import { Observable } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; const shapeWidth = 149; const shapeHeight = 113; @@ -104,7 +106,7 @@ export class SignalStrengthWidgetComponent implements OnInit, OnDestroy, AfterVi }; tooltipDateStyle: ComponentStyle = {}; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; shapeResize$: ResizeObserver; @@ -128,6 +130,7 @@ export class SignalStrengthWidgetComponent implements OnInit, OnDestroy, AfterVi private noData = false; constructor(public widgetComponent: WidgetComponent, + private imagePipe: ImagePipe, private translate: TranslateService, private renderer: Renderer2, private cd: ChangeDetectorRef) { @@ -186,7 +189,7 @@ export class SignalStrengthWidgetComponent implements OnInit, OnDestroy, AfterVi this.tooltipDateLabelStyle = {...this.tooltipDateStyle, ...this.tooltipDateLabelStyle}; } - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); this.hasCardClickAction = this.ctx.actionsApi.getActionDescriptors('cardClick').length > 0; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings-panel.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings-panel.component.html index 42c4472cca..cd406cf01e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings-panel.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings-panel.component.html @@ -27,13 +27,7 @@
- -
-
widgets.background.image-url
- - - -
+
widgets.color.color
widgets.background.preview
-
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings-panel.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings-panel.component.ts index ab94b95800..a68c14b0b3 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings-panel.component.ts @@ -27,6 +27,8 @@ import { TbPopoverComponent } from '@shared/components/popover.component'; import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; +import { Observable } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; @Component({ selector: 'tb-background-settings-panel', @@ -54,10 +56,11 @@ export class BackgroundSettingsPanelComponent extends PageComponent implements O backgroundSettingsFormGroup: UntypedFormGroup; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; constructor(private fb: UntypedFormBuilder, + private imagePipe: ImagePipe, protected store: Store) { super(store); } @@ -66,7 +69,6 @@ export class BackgroundSettingsPanelComponent extends PageComponent implements O this.backgroundSettingsFormGroup = this.fb.group( { type: [this.backgroundSettings?.type, []], - imageBase64: [this.backgroundSettings?.imageBase64, []], imageUrl: [this.backgroundSettings?.imageUrl, []], color: [this.backgroundSettings?.color, []], overlay: this.fb.group({ @@ -113,7 +115,7 @@ export class BackgroundSettingsPanelComponent extends PageComponent implements O private updateBackgroundStyle() { const background: BackgroundSettings = this.backgroundSettingsFormGroup.value; - this.backgroundStyle = backgroundStyle(background); + this.backgroundStyle$ = backgroundStyle(background, this.imagePipe); this.overlayStyle = overlayStyle(background.overlay); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings.component.html index e9e1b99b0e..f3304eeca0 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings.component.html @@ -22,7 +22,7 @@ #matButton (click)="openBackgroundSettingsPopup($event, matButton)">
-
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings.component.ts index 62a2495942..32f9b3e88b 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/background-settings.component.ts @@ -21,13 +21,15 @@ import { backgroundStyle, BackgroundType, ComponentStyle, - overlayStyle + overlayStyle, validateAndUpdateBackgroundSettings } from '@shared/models/widget-settings.models'; import { MatButton } from '@angular/material/button'; import { TbPopoverService } from '@shared/components/popover.service'; import { BackgroundSettingsPanelComponent } from '@home/components/widget/lib/settings/common/background-settings-panel.component'; +import { Observable, of } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; @Component({ selector: 'tb-background-settings', @@ -51,13 +53,14 @@ export class BackgroundSettingsComponent implements OnInit, ControlValueAccessor modelValue: BackgroundSettings; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; private propagateChange = null; - constructor(private popoverService: TbPopoverService, + constructor(private imagePipe: ImagePipe, + private popoverService: TbPopoverService, private renderer: Renderer2, private viewContainerRef: ViewContainerRef) {} @@ -77,7 +80,7 @@ export class BackgroundSettingsComponent implements OnInit, ControlValueAccessor } writeValue(value: BackgroundSettings): void { - this.modelValue = value; + this.modelValue = validateAndUpdateBackgroundSettings(value); this.updateBackgroundStyle(); } @@ -109,10 +112,10 @@ export class BackgroundSettingsComponent implements OnInit, ControlValueAccessor private updateBackgroundStyle() { if (!this.disabled) { - this.backgroundStyle = backgroundStyle(this.modelValue); + this.backgroundStyle$ = backgroundStyle(this.modelValue, this.imagePipe); this.overlayStyle = overlayStyle(this.modelValue.overlay); } else { - this.backgroundStyle = {}; + this.backgroundStyle$ = of({}); this.overlayStyle = {}; } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.html index cc3c4c040a..425a2cd172 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.html @@ -15,7 +15,7 @@ limitations under the License. --> -
+
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.ts index bf43218f82..119fe76a97 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/weather/wind-speed-direction-widget.component.ts @@ -47,6 +47,8 @@ import { formatValue, isDefinedAndNotNull, isNumeric } from '@core/utils'; import { ResizeObserver } from '@juggle/resize-observer'; import { Path, Svg, SVG, Text } from '@svgdotjs/svg.js'; import { DataKey } from '@shared/models/widget.models'; +import { Observable } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; const shapeSize = 180; const cx = shapeSize / 2; @@ -87,7 +89,7 @@ export class WindSpeedDirectionWidgetComponent implements OnInit, OnDestroy, Aft centerValueColor: ColorProcessor; - backgroundStyle: ComponentStyle = {}; + backgroundStyle$: Observable; overlayStyle: ComponentStyle = {}; shapeResize$: ResizeObserver; @@ -109,6 +111,7 @@ export class WindSpeedDirectionWidgetComponent implements OnInit, OnDestroy, Aft private centerValueText = 'N/A'; constructor(private widgetComponent: WidgetComponent, + private imagePipe: ImagePipe, private renderer: Renderer2, private cd: ChangeDetectorRef) { } @@ -135,7 +138,7 @@ export class WindSpeedDirectionWidgetComponent implements OnInit, OnDestroy, Aft this.centerValueColor = ColorProcessor.fromSettings(this.settings.centerValueColor); - this.backgroundStyle = backgroundStyle(this.settings.background); + this.backgroundStyle$ = backgroundStyle(this.settings.background, this.imagePipe); this.overlayStyle = overlayStyle(this.settings.background.overlay); this.hasCardClickAction = this.ctx.actionsApi.getActionDescriptors('cardClick').length > 0; diff --git a/ui-ngx/src/app/modules/home/dialogs/home-dialogs.service.ts b/ui-ngx/src/app/modules/home/dialogs/home-dialogs.service.ts index 1b6af3bf43..b009000548 100644 --- a/ui-ngx/src/app/modules/home/dialogs/home-dialogs.service.ts +++ b/ui-ngx/src/app/modules/home/dialogs/home-dialogs.service.ts @@ -21,7 +21,7 @@ import { Observable } from 'rxjs'; import { ImportDialogCsvComponent, ImportDialogCsvData -} from '@home/components/import-export/import-dialog-csv.component'; +} from '@shared/import-export/import-dialog-csv.component'; @Injectable() export class HomeDialogsService { diff --git a/ui-ngx/src/app/modules/home/models/services.map.ts b/ui-ngx/src/app/modules/home/models/services.map.ts index 0608507295..4c5a8f4c04 100644 --- a/ui-ngx/src/app/modules/home/models/services.map.ts +++ b/ui-ngx/src/app/modules/home/models/services.map.ts @@ -33,7 +33,7 @@ import { UserService } from '@core/http/user.service'; import { AlarmService } from '@core/http/alarm.service'; import { Router } from '@angular/router'; import { BroadcastService } from '@core/services/broadcast.service'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { DeviceProfileService } from '@core/http/device-profile.service'; import { AssetProfileService } from '@core/http/asset-profile.service'; import { OtaPackageService } from '@core/http/ota-package.service'; diff --git a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts index 7be45724e8..0526313da4 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts @@ -39,7 +39,7 @@ import { TwoFactorAuthSettingsComponent } from '@home/pages/admin/two-factor-aut import { widgetsLibraryRoutes } from '@home/pages/widget/widget-library-routing.module'; import { RouterTabsComponent } from '@home/components/router-tabs.component'; import { auditLogsRoutes } from '@home/pages/audit-log/audit-log-routing.module'; -import { ImageGalleryComponent } from '@home/components/image/image-gallery.component'; +import { ImageGalleryComponent } from '@shared/components/image/image-gallery.component'; @Injectable() export class OAuth2LoginProcessingUrlResolver implements Resolve { diff --git a/ui-ngx/src/app/modules/home/pages/admin/admin.module.ts b/ui-ngx/src/app/modules/home/pages/admin/admin.module.ts index 2d8bfe98fe..533fd0fea1 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/admin.module.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/admin.module.ts @@ -33,7 +33,6 @@ import { QueueComponent } from '@home/pages/admin/queue/queue.component'; import { RepositoryAdminSettingsComponent } from '@home/pages/admin/repository-admin-settings.component'; import { AutoCommitAdminSettingsComponent } from '@home/pages/admin/auto-commit-admin-settings.component'; import { TwoFactorAuthSettingsComponent } from '@home/pages/admin/two-factor-auth-settings.component'; -import { SharedHomeComponentsModule } from '@home/components/shared-home-components.module'; @NgModule({ declarations: @@ -55,7 +54,6 @@ import { SharedHomeComponentsModule } from '@home/components/shared-home-compone imports: [ CommonModule, SharedModule, - SharedHomeComponentsModule, HomeComponentsModule, AdminRoutingModule ] diff --git a/ui-ngx/src/app/modules/home/pages/asset-profile/asset-profiles-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/asset-profile/asset-profiles-table-config.resolver.ts index f33eccf090..1862a9d5c0 100644 --- a/ui-ngx/src/app/modules/home/pages/asset-profile/asset-profiles-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/asset-profile/asset-profiles-table-config.resolver.ts @@ -29,7 +29,7 @@ import { EntityType, entityTypeResources, entityTypeTranslations } from '@shared import { EntityAction } from '@home/models/entity/entity-component.models'; import { DialogService } from '@core/services/dialog.service'; import { MatDialog } from '@angular/material/dialog'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { HomeDialogsService } from '@home/dialogs/home-dialogs.service'; import { AssetProfile, TB_SERVICE_QUEUE } from '@shared/models/asset.models'; import { AssetProfileService } from '@core/http/asset-profile.service'; diff --git a/ui-ngx/src/app/modules/home/pages/dashboard/dashboard.module.ts b/ui-ngx/src/app/modules/home/pages/dashboard/dashboard.module.ts index cd60a6ddee..b9feff9be7 100644 --- a/ui-ngx/src/app/modules/home/pages/dashboard/dashboard.module.ts +++ b/ui-ngx/src/app/modules/home/pages/dashboard/dashboard.module.ts @@ -24,7 +24,6 @@ import { DashboardRoutingModule } from './dashboard-routing.module'; import { MakeDashboardPublicDialogComponent } from '@modules/home/pages/dashboard/make-dashboard-public-dialog.component'; import { HomeComponentsModule } from '@modules/home/components/home-components.module'; import { DashboardTabsComponent } from '@home/pages/dashboard/dashboard-tabs.component'; -import { SharedHomeComponentsModule } from '@home/components/shared-home-components.module'; @NgModule({ declarations: [ @@ -36,7 +35,6 @@ import { SharedHomeComponentsModule } from '@home/components/shared-home-compone imports: [ CommonModule, SharedModule, - SharedHomeComponentsModule, HomeComponentsModule, HomeDialogsModule, DashboardRoutingModule diff --git a/ui-ngx/src/app/modules/home/pages/dashboard/dashboards-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/dashboard/dashboards-table-config.resolver.ts index 084faebefc..70fe58fc1c 100644 --- a/ui-ngx/src/app/modules/home/pages/dashboard/dashboards-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/dashboard/dashboards-table-config.resolver.ts @@ -63,13 +63,19 @@ import { MakeDashboardPublicDialogData } from '@modules/home/pages/dashboard/make-dashboard-public-dialog.component'; import { DashboardTabsComponent } from '@home/pages/dashboard/dashboard-tabs.component'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { EdgeService } from '@core/http/edge.service'; import { AddEntitiesToEdgeDialogComponent, AddEntitiesToEdgeDialogData } from '@home/dialogs/add-entities-to-edge-dialog.component'; import { HomeDialogsService } from '@home/dialogs/home-dialogs.service'; +import { Widget } from '@shared/models/widget.models'; +import { EntityAliases } from '@shared/models/alias.models'; +import { + EntityAliasesDialogComponent, + EntityAliasesDialogData +} from '@home/components/alias/entity-aliases-dialog.component'; @Injectable() export class DashboardsTableConfigResolver implements Resolve> { @@ -382,7 +388,7 @@ export class DashboardsTableConfigResolver implements Resolve { if (dashboard) { this.config.updateData(); @@ -391,6 +397,30 @@ export class DashboardsTableConfigResolver implements Resolve, isSingleWidget: boolean, + customTitle: string, missingEntityAliases: EntityAliases): Observable { + return this.dialog.open(EntityAliasesDialogComponent, { + disableClose: true, + panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], + data: { + entityAliases: missingEntityAliases, + widgets, + customTitle, + isSingleWidget, + disableAdd: true + } + }).afterClosed().pipe( + map((updatedEntityAliases) => { + if (updatedEntityAliases) { + return updatedEntityAliases; + } else { + throw new Error('Unable to resolve missing entity aliases!'); + } + } + )); + } + exportDashboard($event: Event, dashboard: DashboardInfo) { if ($event) { $event.stopPropagation(); diff --git a/ui-ngx/src/app/modules/home/pages/device-profile/device-profiles-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/device-profile/device-profiles-table-config.resolver.ts index 9f026d626e..28ceb285ad 100644 --- a/ui-ngx/src/app/modules/home/pages/device-profile/device-profiles-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/device-profile/device-profiles-table-config.resolver.ts @@ -41,7 +41,7 @@ import { AddDeviceProfileDialogComponent, AddDeviceProfileDialogData } from '@home/components/profile/add-device-profile-dialog.component'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { HomeDialogsService } from '@home/dialogs/home-dialogs.service'; @Injectable() diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechains-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rulechains-table-config.resolver.ts index 37714a992c..bcbf1b8844 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rulechains-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechains-table-config.resolver.ts @@ -36,7 +36,7 @@ import { RuleChainService } from '@core/http/rule-chain.service'; import { RuleChainComponent } from '@modules/home/pages/rulechain/rulechain.component'; import { DialogService } from '@core/services/dialog.service'; import { RuleChainTabsComponent } from '@home/pages/rulechain/rulechain-tabs.component'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { ItemBufferService } from '@core/services/item-buffer.service'; import { EdgeService } from '@core/http/edge.service'; import { forkJoin, Observable } from 'rxjs'; diff --git a/ui-ngx/src/app/modules/home/pages/security/authentication-dialog/backup-code-auth-dialog.component.ts b/ui-ngx/src/app/modules/home/pages/security/authentication-dialog/backup-code-auth-dialog.component.ts index 8963e0f8da..6853e8c71c 100644 --- a/ui-ngx/src/app/modules/home/pages/security/authentication-dialog/backup-code-auth-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/pages/security/authentication-dialog/backup-code-auth-dialog.component.ts @@ -28,7 +28,7 @@ import { TwoFactorAuthProviderType } from '@shared/models/two-factor-auth.models'; import { mergeMap, tap } from 'rxjs/operators'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { deepClone } from '@core/utils'; import printTemplate from '!raw-loader!./backup-code-print-template.raw'; diff --git a/ui-ngx/src/app/modules/home/pages/tenant-profile/tenant-profiles-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/tenant-profile/tenant-profiles-table-config.resolver.ts index 5701bff6bf..402a04aa72 100644 --- a/ui-ngx/src/app/modules/home/pages/tenant-profile/tenant-profiles-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/tenant-profile/tenant-profiles-table-config.resolver.ts @@ -29,12 +29,10 @@ import { DatePipe } from '@angular/common'; import { EntityType, entityTypeResources, entityTypeTranslations } from '@shared/models/entity-type.models'; import { EntityAction } from '@home/models/entity/entity-component.models'; import { TenantProfileService } from '@core/http/tenant-profile.service'; -import { TenantProfileComponent } from '../../components/profile/tenant-profile.component'; +import { TenantProfileComponent } from '@home/components/profile/tenant-profile.component'; import { TenantProfileTabsComponent } from './tenant-profile-tabs.component'; import { DialogService } from '@core/services/dialog.service'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; -import { map } from 'rxjs/operators'; -import { guid } from '@core/utils'; +import { ImportExportService } from '@shared/import-export/import-export.service'; @Injectable() export class TenantProfilesTableConfigResolver implements Resolve> { diff --git a/ui-ngx/src/app/modules/home/pages/widget/widget-library.module.ts b/ui-ngx/src/app/modules/home/pages/widget/widget-library.module.ts index 1a33f9ed6d..32178c1be3 100644 --- a/ui-ngx/src/app/modules/home/pages/widget/widget-library.module.ts +++ b/ui-ngx/src/app/modules/home/pages/widget/widget-library.module.ts @@ -28,13 +28,11 @@ import { WidgetTypeComponent } from '@home/pages/widget/widget-type.component'; import { WidgetTypeTabsComponent } from '@home/pages/widget/widget-type-tabs.component'; import { WidgetsBundleWidgetsComponent } from '@home/pages/widget/widgets-bundle-widgets.component'; import { WidgetTypeAutocompleteComponent } from '@home/pages/widget/widget-type-autocomplete.component'; -import { SharedHomeComponentsModule } from '@home/components/shared-home-components.module'; @NgModule({ declarations: [ WidgetTypeComponent, WidgetsBundleComponent, - // WidgetLibraryComponent, WidgetTypeAutocompleteComponent, WidgetsBundleWidgetsComponent, WidgetEditorComponent, @@ -46,7 +44,6 @@ import { SharedHomeComponentsModule } from '@home/components/shared-home-compone imports: [ CommonModule, SharedModule, - SharedHomeComponentsModule, HomeComponentsModule, WidgetLibraryRoutingModule ] diff --git a/ui-ngx/src/app/modules/home/pages/widget/widget-types-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/widget/widget-types-table-config.resolver.ts index 32ae457cbf..8086e7f646 100644 --- a/ui-ngx/src/app/modules/home/pages/widget/widget-types-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/widget/widget-types-table-config.resolver.ts @@ -33,7 +33,7 @@ import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { getCurrentAuthUser } from '@app/core/auth/auth.selectors'; import { Authority } from '@shared/models/authority.enum'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { Direction } from '@shared/models/page/sort-order'; import { BaseWidgetType, diff --git a/ui-ngx/src/app/modules/home/pages/widget/widgets-bundle-widgets.component.ts b/ui-ngx/src/app/modules/home/pages/widget/widgets-bundle-widgets.component.ts index 23cc43bada..105c18c123 100644 --- a/ui-ngx/src/app/modules/home/pages/widget/widgets-bundle-widgets.component.ts +++ b/ui-ngx/src/app/modules/home/pages/widget/widgets-bundle-widgets.component.ts @@ -26,7 +26,7 @@ import { NULL_UUID } from '@shared/models/id/has-uuid'; import { WidgetsBundle } from '@shared/models/widgets-bundle.model'; import { widgetType as WidgetDataType, WidgetTypeInfo } from '@shared/models/widget.models'; import { CdkDragDrop } from '@angular/cdk/drag-drop'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { WidgetService } from '@core/http/widget.service'; import { FormControl, Validators } from '@angular/forms'; import { MatDialog } from '@angular/material/dialog'; diff --git a/ui-ngx/src/app/modules/home/pages/widget/widgets-bundles-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/widget/widgets-bundles-table-config.resolver.ts index 41ef171147..31863528f1 100644 --- a/ui-ngx/src/app/modules/home/pages/widget/widgets-bundles-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/widget/widgets-bundles-table-config.resolver.ts @@ -36,11 +36,9 @@ import { AppState } from '@core/core.state'; import { getCurrentAuthState, getCurrentAuthUser } from '@app/core/auth/auth.selectors'; import { Authority } from '@shared/models/authority.enum'; import { DialogService } from '@core/services/dialog.service'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { Direction } from '@shared/models/page/sort-order'; -import { map } from 'rxjs/operators'; import { WidgetsBundleTabsComponent } from '@home/pages/widget/widgets-bundle-tabs.component'; -import { TenantInfo } from '@shared/models/tenant.model'; @Injectable() export class WidgetsBundlesTableConfigResolver implements Resolve> { diff --git a/ui-ngx/src/app/modules/home/models/datasource/scroll-grid-datasource.ts b/ui-ngx/src/app/shared/components/grid/scroll-grid-datasource.ts similarity index 100% rename from ui-ngx/src/app/modules/home/models/datasource/scroll-grid-datasource.ts rename to ui-ngx/src/app/shared/components/grid/scroll-grid-datasource.ts diff --git a/ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.html b/ui-ngx/src/app/shared/components/grid/scroll-grid.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.html rename to ui-ngx/src/app/shared/components/grid/scroll-grid.component.html diff --git a/ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.scss b/ui-ngx/src/app/shared/components/grid/scroll-grid.component.scss similarity index 100% rename from ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.scss rename to ui-ngx/src/app/shared/components/grid/scroll-grid.component.scss diff --git a/ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.ts b/ui-ngx/src/app/shared/components/grid/scroll-grid.component.ts similarity index 98% rename from ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.ts rename to ui-ngx/src/app/shared/components/grid/scroll-grid.component.ts index cf9f9f4cd3..9925fcbf5d 100644 --- a/ui-ngx/src/app/modules/home/components/grid/scroll-grid.component.ts +++ b/ui-ngx/src/app/shared/components/grid/scroll-grid.component.ts @@ -30,7 +30,7 @@ import { GridEntitiesFetchFunction, ScrollGridColumns, ScrollGridDatasource -} from '@home/models/datasource/scroll-grid-datasource'; +} from '@shared/components/grid/scroll-grid-datasource'; import { BreakpointObserver } from '@angular/cdk/layout'; import { isObject } from '@app/core/utils'; import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling'; diff --git a/ui-ngx/src/app/modules/home/components/image/gallery-image-input.component.html b/ui-ngx/src/app/shared/components/image/gallery-image-input.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/gallery-image-input.component.html rename to ui-ngx/src/app/shared/components/image/gallery-image-input.component.html diff --git a/ui-ngx/src/app/modules/home/components/image/gallery-image-input.component.scss b/ui-ngx/src/app/shared/components/image/gallery-image-input.component.scss similarity index 99% rename from ui-ngx/src/app/modules/home/components/image/gallery-image-input.component.scss rename to ui-ngx/src/app/shared/components/image/gallery-image-input.component.scss index 77b3aaec7a..47ae1e96a9 100644 --- a/ui-ngx/src/app/modules/home/components/image/gallery-image-input.component.scss +++ b/ui-ngx/src/app/shared/components/image/gallery-image-input.component.scss @@ -14,7 +14,7 @@ * limitations under the License. */ -@import "../../../../../scss/constants"; +@import "../../../../scss/constants"; $containerHeight: 96px !default; diff --git a/ui-ngx/src/app/modules/home/components/image/gallery-image-input.component.ts b/ui-ngx/src/app/shared/components/image/gallery-image-input.component.ts similarity index 98% rename from ui-ngx/src/app/modules/home/components/image/gallery-image-input.component.ts rename to ui-ngx/src/app/shared/components/image/gallery-image-input.component.ts index d9b1d90475..cf934bf3c5 100644 --- a/ui-ngx/src/app/modules/home/components/image/gallery-image-input.component.ts +++ b/ui-ngx/src/app/shared/components/image/gallery-image-input.component.ts @@ -38,7 +38,7 @@ import { import { ImageService } from '@core/http/image.service'; import { MatButton } from '@angular/material/button'; import { TbPopoverService } from '@shared/components/popover.service'; -import { ImageGalleryComponent } from '@home/components/image/image-gallery.component'; +import { ImageGalleryComponent } from '@shared/components/image/image-gallery.component'; export enum ImageLinkType { none = 'none', diff --git a/ui-ngx/src/app/modules/home/components/image/image-dialog.component.html b/ui-ngx/src/app/shared/components/image/image-dialog.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/image-dialog.component.html rename to ui-ngx/src/app/shared/components/image/image-dialog.component.html diff --git a/ui-ngx/src/app/modules/home/components/image/image-dialog.component.scss b/ui-ngx/src/app/shared/components/image/image-dialog.component.scss similarity index 98% rename from ui-ngx/src/app/modules/home/components/image/image-dialog.component.scss rename to ui-ngx/src/app/shared/components/image/image-dialog.component.scss index f812ff4fb9..497714b6dd 100644 --- a/ui-ngx/src/app/modules/home/components/image/image-dialog.component.scss +++ b/ui-ngx/src/app/shared/components/image/image-dialog.component.scss @@ -14,7 +14,7 @@ * limitations under the License. */ -@import '../../../../../scss/constants'; +@import '../../../../scss/constants'; :host { .tb-image-dialog { diff --git a/ui-ngx/src/app/modules/home/components/image/image-dialog.component.ts b/ui-ngx/src/app/shared/components/image/image-dialog.component.ts similarity index 98% rename from ui-ngx/src/app/modules/home/components/image/image-dialog.component.ts rename to ui-ngx/src/app/shared/components/image/image-dialog.component.ts index c248275b99..4cf2e818b1 100644 --- a/ui-ngx/src/app/modules/home/components/image/image-dialog.component.ts +++ b/ui-ngx/src/app/shared/components/image/image-dialog.component.ts @@ -27,7 +27,7 @@ import { ImageResourceInfo, imageResourceType } from '@shared/models/resource.mo import { UploadImageDialogComponent, UploadImageDialogData -} from '@home/components/image/upload-image-dialog.component'; +} from '@shared/components/image/upload-image-dialog.component'; import { UrlHolder } from '@shared/pipe/image.pipe'; export interface ImageDialogData { diff --git a/ui-ngx/src/app/modules/home/components/image/image-gallery.component.html b/ui-ngx/src/app/shared/components/image/image-gallery.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/image-gallery.component.html rename to ui-ngx/src/app/shared/components/image/image-gallery.component.html diff --git a/ui-ngx/src/app/modules/home/components/image/image-gallery.component.scss b/ui-ngx/src/app/shared/components/image/image-gallery.component.scss similarity index 99% rename from ui-ngx/src/app/modules/home/components/image/image-gallery.component.scss rename to ui-ngx/src/app/shared/components/image/image-gallery.component.scss index e82fcc84b1..83dd278e4b 100644 --- a/ui-ngx/src/app/modules/home/components/image/image-gallery.component.scss +++ b/ui-ngx/src/app/shared/components/image/image-gallery.component.scss @@ -14,7 +14,7 @@ * limitations under the License. */ -@import "../../../../../scss/constants"; +@import "../../../../scss/constants"; $tb-button-selected-color: rgb(255, 110, 64) !default; diff --git a/ui-ngx/src/app/modules/home/components/image/image-gallery.component.ts b/ui-ngx/src/app/shared/components/image/image-gallery.component.ts similarity index 97% rename from ui-ngx/src/app/modules/home/components/image/image-gallery.component.ts rename to ui-ngx/src/app/shared/components/image/image-gallery.component.ts index 0bad2f1f42..d046294ed6 100644 --- a/ui-ngx/src/app/modules/home/components/image/image-gallery.component.ts +++ b/ui-ngx/src/app/shared/components/image/image-gallery.component.ts @@ -53,21 +53,21 @@ import { BaseData, HasId } from '@shared/models/base-data'; import { NULL_UUID } from '@shared/models/id/has-uuid'; import { getCurrentAuthUser } from '@core/auth/auth.selectors'; import { Authority } from '@shared/models/authority.enum'; -import { GridEntitiesFetchFunction, ScrollGridColumns } from '@home/models/datasource/scroll-grid-datasource'; -import { ItemSizeStrategy, ScrollGridComponent } from '@home/components/grid/scroll-grid.component'; +import { GridEntitiesFetchFunction, ScrollGridColumns } from '@shared/components/grid/scroll-grid-datasource'; +import { ItemSizeStrategy, ScrollGridComponent } from '@shared/components/grid/scroll-grid.component'; import { MatDialog } from '@angular/material/dialog'; import { UploadImageDialogComponent, UploadImageDialogData -} from '@home/components/image/upload-image-dialog.component'; -import { ImageDialogComponent, ImageDialogData } from '@home/components/image/image-dialog.component'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; +} from '@shared/components/image/upload-image-dialog.component'; +import { ImageDialogComponent, ImageDialogData } from '@shared/components/image/image-dialog.component'; +import { ImportExportService } from '@shared/import-export/import-export.service'; import { ActionNotificationShow } from '@core/notification/notification.actions'; import { ImagesInUseDialogComponent, ImagesInUseDialogData -} from '@home/components/image/images-in-use-dialog.component'; -import { ImagesDatasource } from '@home/components/image/images-datasource'; +} from '@shared/components/image/images-in-use-dialog.component'; +import { ImagesDatasource } from '@shared/components/image/images-datasource'; interface GridImagesFilter { search: string; diff --git a/ui-ngx/src/app/modules/home/components/image/image-references.component.html b/ui-ngx/src/app/shared/components/image/image-references.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/image-references.component.html rename to ui-ngx/src/app/shared/components/image/image-references.component.html diff --git a/ui-ngx/src/app/modules/home/components/image/image-references.component.scss b/ui-ngx/src/app/shared/components/image/image-references.component.scss similarity index 98% rename from ui-ngx/src/app/modules/home/components/image/image-references.component.scss rename to ui-ngx/src/app/shared/components/image/image-references.component.scss index e9a527e747..4f69db0add 100644 --- a/ui-ngx/src/app/modules/home/components/image/image-references.component.scss +++ b/ui-ngx/src/app/shared/components/image/image-references.component.scss @@ -13,7 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -@import "../../../../../scss/constants"; +@import "../../../../scss/constants"; :host { ul.tb-references { diff --git a/ui-ngx/src/app/modules/home/components/image/image-references.component.ts b/ui-ngx/src/app/shared/components/image/image-references.component.ts similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/image-references.component.ts rename to ui-ngx/src/app/shared/components/image/image-references.component.ts diff --git a/ui-ngx/src/app/modules/home/components/image/images-datasource.ts b/ui-ngx/src/app/shared/components/image/images-datasource.ts similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/images-datasource.ts rename to ui-ngx/src/app/shared/components/image/images-datasource.ts diff --git a/ui-ngx/src/app/modules/home/components/image/images-in-use-dialog.component.html b/ui-ngx/src/app/shared/components/image/images-in-use-dialog.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/images-in-use-dialog.component.html rename to ui-ngx/src/app/shared/components/image/images-in-use-dialog.component.html diff --git a/ui-ngx/src/app/modules/home/components/image/images-in-use-dialog.component.scss b/ui-ngx/src/app/shared/components/image/images-in-use-dialog.component.scss similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/images-in-use-dialog.component.scss rename to ui-ngx/src/app/shared/components/image/images-in-use-dialog.component.scss diff --git a/ui-ngx/src/app/modules/home/components/image/images-in-use-dialog.component.ts b/ui-ngx/src/app/shared/components/image/images-in-use-dialog.component.ts similarity index 96% rename from ui-ngx/src/app/modules/home/components/image/images-in-use-dialog.component.ts rename to ui-ngx/src/app/shared/components/image/images-in-use-dialog.component.ts index 2211f7e071..ccb530b642 100644 --- a/ui-ngx/src/app/modules/home/components/image/images-in-use-dialog.component.ts +++ b/ui-ngx/src/app/shared/components/image/images-in-use-dialog.component.ts @@ -21,10 +21,10 @@ import { AppState } from '@core/core.state'; import { DialogComponent } from '@shared/components/dialog.component'; import { Router } from '@angular/router'; import { ImageReferences, ImageResourceInfo, ImageResourceInfoWithReferences } from '@shared/models/resource.models'; -import { ImagesDatasource } from '@home/components/image/images-datasource'; +import { ImagesDatasource } from '@shared/components/image/images-datasource'; import { MatButton } from '@angular/material/button'; import { TbPopoverService } from '@shared/components/popover.service'; -import { ImageReferencesComponent } from '@home/components/image/image-references.component'; +import { ImageReferencesComponent } from '@shared/components/image/image-references.component'; import { TranslateService } from '@ngx-translate/core'; export interface ImagesInUseDialogData { diff --git a/ui-ngx/src/app/modules/home/components/image/multiple-gallery-image-input.component.html b/ui-ngx/src/app/shared/components/image/multiple-gallery-image-input.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/multiple-gallery-image-input.component.html rename to ui-ngx/src/app/shared/components/image/multiple-gallery-image-input.component.html diff --git a/ui-ngx/src/app/modules/home/components/image/multiple-gallery-image-input.component.scss b/ui-ngx/src/app/shared/components/image/multiple-gallery-image-input.component.scss similarity index 99% rename from ui-ngx/src/app/modules/home/components/image/multiple-gallery-image-input.component.scss rename to ui-ngx/src/app/shared/components/image/multiple-gallery-image-input.component.scss index bd1eb6ef67..a0cf328630 100644 --- a/ui-ngx/src/app/modules/home/components/image/multiple-gallery-image-input.component.scss +++ b/ui-ngx/src/app/shared/components/image/multiple-gallery-image-input.component.scss @@ -13,7 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -@import "../../../../../scss/constants"; +@import "../../../../scss/constants"; $imagesContainerHeight: 106px !default; $selectContainerHeight: 96px !default; diff --git a/ui-ngx/src/app/modules/home/components/image/multiple-gallery-image-input.component.ts b/ui-ngx/src/app/shared/components/image/multiple-gallery-image-input.component.ts similarity index 96% rename from ui-ngx/src/app/modules/home/components/image/multiple-gallery-image-input.component.ts rename to ui-ngx/src/app/shared/components/image/multiple-gallery-image-input.component.ts index aa36ef4881..f84265be61 100644 --- a/ui-ngx/src/app/modules/home/components/image/multiple-gallery-image-input.component.ts +++ b/ui-ngx/src/app/shared/components/image/multiple-gallery-image-input.component.ts @@ -23,10 +23,10 @@ import { moveItemInArray } from '@angular/cdk/drag-drop'; import { DndDropEvent } from 'ngx-drag-drop'; import { isUndefined } from '@core/utils'; import { coerceBoolean } from '@shared/decorators/coercion'; -import { ImageLinkType } from '@home/components/image/gallery-image-input.component'; +import { ImageLinkType } from '@shared/components/image/gallery-image-input.component'; import { TbPopoverService } from '@shared/components/popover.service'; import { MatButton } from '@angular/material/button'; -import { ImageGalleryComponent } from '@home/components/image/image-gallery.component'; +import { ImageGalleryComponent } from '@shared/components/image/image-gallery.component'; @Component({ selector: 'tb-multiple-gallery-image-input', diff --git a/ui-ngx/src/app/modules/home/components/image/upload-image-dialog.component.html b/ui-ngx/src/app/shared/components/image/upload-image-dialog.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/upload-image-dialog.component.html rename to ui-ngx/src/app/shared/components/image/upload-image-dialog.component.html diff --git a/ui-ngx/src/app/modules/home/components/image/upload-image-dialog.component.ts b/ui-ngx/src/app/shared/components/image/upload-image-dialog.component.ts similarity index 100% rename from ui-ngx/src/app/modules/home/components/image/upload-image-dialog.component.ts rename to ui-ngx/src/app/shared/components/image/upload-image-dialog.component.ts diff --git a/ui-ngx/src/app/shared/components/public-api.ts b/ui-ngx/src/app/shared/components/public-api.ts index 4647fc6bad..6439d455ed 100644 --- a/ui-ngx/src/app/shared/components/public-api.ts +++ b/ui-ngx/src/app/shared/components/public-api.ts @@ -29,3 +29,5 @@ export * from './unit-input.component'; export * from './material-icons.component'; export * from './icon.component'; export * from './hint-tooltip-icon.component'; +export * from './grid/scroll-grid-datasource'; +export * from './grid/scroll-grid.component'; diff --git a/ui-ngx/src/app/modules/home/components/import-export/export-widgets-bundle-dialog.component.html b/ui-ngx/src/app/shared/import-export/export-widgets-bundle-dialog.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/import-export/export-widgets-bundle-dialog.component.html rename to ui-ngx/src/app/shared/import-export/export-widgets-bundle-dialog.component.html diff --git a/ui-ngx/src/app/modules/home/components/import-export/export-widgets-bundle-dialog.component.ts b/ui-ngx/src/app/shared/import-export/export-widgets-bundle-dialog.component.ts similarity index 100% rename from ui-ngx/src/app/modules/home/components/import-export/export-widgets-bundle-dialog.component.ts rename to ui-ngx/src/app/shared/import-export/export-widgets-bundle-dialog.component.ts diff --git a/ui-ngx/src/app/modules/home/components/import-export/import-dialog-csv.component.html b/ui-ngx/src/app/shared/import-export/import-dialog-csv.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/import-export/import-dialog-csv.component.html rename to ui-ngx/src/app/shared/import-export/import-dialog-csv.component.html diff --git a/ui-ngx/src/app/modules/home/components/import-export/import-dialog-csv.component.scss b/ui-ngx/src/app/shared/import-export/import-dialog-csv.component.scss similarity index 100% rename from ui-ngx/src/app/modules/home/components/import-export/import-dialog-csv.component.scss rename to ui-ngx/src/app/shared/import-export/import-dialog-csv.component.scss diff --git a/ui-ngx/src/app/modules/home/components/import-export/import-dialog-csv.component.ts b/ui-ngx/src/app/shared/import-export/import-dialog-csv.component.ts similarity index 96% rename from ui-ngx/src/app/modules/home/components/import-export/import-dialog-csv.component.ts rename to ui-ngx/src/app/shared/import-export/import-dialog-csv.component.ts index 9782f18ae6..eb29f17017 100644 --- a/ui-ngx/src/app/modules/home/components/import-export/import-dialog-csv.component.ts +++ b/ui-ngx/src/app/shared/import-export/import-dialog-csv.component.ts @@ -35,9 +35,9 @@ import { CsvToJsonConfig, CsvToJsonResult, ImportEntityColumnType -} from '@home/components/import-export/import-export.models'; -import { ImportExportService } from '@home/components/import-export/import-export.service'; -import { TableColumnsAssignmentComponent } from '@home/components/import-export/table-columns-assignment.component'; +} from '@shared/import-export/import-export.models'; +import { ImportExportService } from '@shared/import-export/import-export.service'; +import { TableColumnsAssignmentComponent } from '@shared/import-export/table-columns-assignment.component'; import { Ace } from 'ace-builds'; import { getAce } from '@shared/models/ace/ace.models'; @@ -68,7 +68,7 @@ export class ImportDialogCsvComponent extends DialogComponent, isSingleWidget: boolean, + customTitle: string, missingEntityAliases: EntityAliases) => Observable; + // @dynamic @Injectable() export class ImportExportService { @@ -152,7 +151,7 @@ export class ImportExportService { ); } - public importDashboard(): Observable { + public importDashboard(onEditMissingAliases: editMissingAliasesFunction): Observable { return this.openImportDialog('dashboard.import', 'dashboard.dashboard-file').pipe( mergeMap((dashboard: Dashboard) => { if (!this.validateImportedDashboard(dashboard)) { @@ -171,7 +170,7 @@ export class ImportExportService { return this.processEntityAliases(entityAliases, aliasIds).pipe( mergeMap((missingEntityAliases) => { if (Object.keys(missingEntityAliases).length > 0) { - return this.editMissingAliases(this.dashboardUtils.getWidgetsArray(dashboard), + return onEditMissingAliases(this.dashboardUtils.getWidgetsArray(dashboard), false, 'dashboard.dashboard-import-missing-aliases-title', missingEntityAliases).pipe( mergeMap((updatedEntityAliases) => { @@ -205,6 +204,7 @@ export class ImportExportService { } public importWidget(dashboard: Dashboard, targetState: string, + onEditMissingAliases: editMissingAliasesFunction, targetLayoutFunction: () => Observable, onAliasesUpdateFunction: () => void, onFiltersUpdateFunction: () => void): Observable { @@ -255,7 +255,7 @@ export class ImportExportService { return this.processEntityAliases(entityAliases, aliasIds).pipe( mergeMap((missingEntityAliases) => { if (Object.keys(missingEntityAliases).length > 0) { - return this.editMissingAliases([widget], + onEditMissingAliases([widget], false, 'dashboard.widget-import-missing-aliases-title', missingEntityAliases).pipe( mergeMap((updatedEntityAliases) => { @@ -971,30 +971,6 @@ export class ImportExportService { ); } - private editMissingAliases(widgets: Array, isSingleWidget: boolean, - customTitle: string, missingEntityAliases: EntityAliases): Observable { - return this.dialog.open(EntityAliasesDialogComponent, { - disableClose: true, - panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], - data: { - entityAliases: missingEntityAliases, - widgets, - customTitle, - isSingleWidget, - disableAdd: true - } - }).afterClosed().pipe( - map((updatedEntityAliases) => { - if (updatedEntityAliases) { - return updatedEntityAliases; - } else { - throw new Error('Unable to resolve missing entity aliases!'); - } - } - )); - } - private prepareAliasesInfo(aliasesInfo: AliasesInfo): AliasesInfo { const datasourceAliases = aliasesInfo.datasourceAliases; const targetDeviceAliases = aliasesInfo.targetDeviceAliases; diff --git a/ui-ngx/src/app/modules/home/components/import-export/table-columns-assignment.component.html b/ui-ngx/src/app/shared/import-export/table-columns-assignment.component.html similarity index 100% rename from ui-ngx/src/app/modules/home/components/import-export/table-columns-assignment.component.html rename to ui-ngx/src/app/shared/import-export/table-columns-assignment.component.html diff --git a/ui-ngx/src/app/modules/home/components/import-export/table-columns-assignment.component.scss b/ui-ngx/src/app/shared/import-export/table-columns-assignment.component.scss similarity index 100% rename from ui-ngx/src/app/modules/home/components/import-export/table-columns-assignment.component.scss rename to ui-ngx/src/app/shared/import-export/table-columns-assignment.component.scss diff --git a/ui-ngx/src/app/modules/home/components/import-export/table-columns-assignment.component.ts b/ui-ngx/src/app/shared/import-export/table-columns-assignment.component.ts similarity index 99% rename from ui-ngx/src/app/modules/home/components/import-export/table-columns-assignment.component.ts rename to ui-ngx/src/app/shared/import-export/table-columns-assignment.component.ts index 096f7b3cfc..57f3607a2b 100644 --- a/ui-ngx/src/app/modules/home/components/import-export/table-columns-assignment.component.ts +++ b/ui-ngx/src/app/shared/import-export/table-columns-assignment.component.ts @@ -23,7 +23,7 @@ import { CsvColumnParam, ImportEntityColumnType, importEntityColumnTypeTranslations -} from '@home/components/import-export/import-export.models'; +} from '@shared/import-export/import-export.models'; import { BehaviorSubject, Observable } from 'rxjs'; import { CollectionViewer, DataSource } from '@angular/cdk/collections'; diff --git a/ui-ngx/src/app/shared/models/widget-settings.models.ts b/ui-ngx/src/app/shared/models/widget-settings.models.ts index 57e652c236..6b98051929 100644 --- a/ui-ngx/src/app/shared/models/widget-settings.models.ts +++ b/ui-ngx/src/app/shared/models/widget-settings.models.ts @@ -22,6 +22,9 @@ import { DateAgoPipe } from '@shared/pipe/date-ago.pipe'; import { TranslateService } from '@ngx-translate/core'; import { AlarmFilterConfig } from '@shared/models/query/query.models'; import { AlarmSearchStatus } from '@shared/models/alarm.models'; +import { Observable, of } from 'rxjs'; +import { ImagePipe } from '@shared/pipe/image.pipe'; +import { map } from 'rxjs/operators'; export type ComponentStyle = {[klass: string]: any}; @@ -416,14 +419,12 @@ export class LastUpdateAgoDateFormatProcessor extends DateFormatProcessor { export enum BackgroundType { image = 'image', - imageUrl = 'imageUrl', color = 'color' } export const backgroundTypeTranslations = new Map( [ [BackgroundType.image, 'widgets.background.background-type-image'], - [BackgroundType.imageUrl, 'widgets.background.background-type-image-url'], [BackgroundType.color, 'widgets.background.background-type-color'] ] ); @@ -436,7 +437,6 @@ export interface OverlaySettings { export interface BackgroundSettings { type: BackgroundType; - imageBase64?: string; imageUrl?: string; color?: string; overlay: OverlaySettings; @@ -507,19 +507,35 @@ export const isFontSet = (font: Font): boolean => (!!font && !!font.style && !!f export const isFontPartiallySet = (font: Font): boolean => (!!font && (!!font.style || !!font.weight || !!font.size || !!font.family)); -export const backgroundStyle = (background: BackgroundSettings): ComponentStyle => { +export const validateAndUpdateBackgroundSettings = (background: BackgroundSettings): BackgroundSettings => { + if (background) { + if (background.type === BackgroundType.image && (background as any).imageBase64) { + background.imageUrl = (background as any).imageBase64; + } + if (background.type === 'imageUrl' as any) { + background.type = BackgroundType.image; + } + delete (background as any).imageBase64; + } + return background; +}; + +export const backgroundStyle = (background: BackgroundSettings, imagePipe: ImagePipe): Observable => { + background = validateAndUpdateBackgroundSettings(background); if (background.type === BackgroundType.color) { - return { + return of({ background: background.color - }; + }); } else { - const imageUrl = background.type === BackgroundType.image ? background.imageBase64 : background.imageUrl; + const imageUrl = background.imageUrl; if (imageUrl) { - return { - background: `url(${imageUrl}) no-repeat 50% 50% / cover` - }; + return imagePipe.transform(imageUrl, {asString: true, ignoreLoadingImage: true}).pipe( + map((transformedUrl) => ({ + background: `url(${transformedUrl}) no-repeat 50% 50% / cover` + })) + ); } else { - return {}; + return of({}); } } }; diff --git a/ui-ngx/src/app/shared/shared.module.ts b/ui-ngx/src/app/shared/shared.module.ts index f1302e0b24..ebff0d0a63 100644 --- a/ui-ngx/src/app/shared/shared.module.ts +++ b/ui-ngx/src/app/shared/shared.module.ts @@ -201,6 +201,19 @@ import { TbIconComponent } from '@shared/components/icon.component'; import { HintTooltipIconComponent } from '@shared/components/hint-tooltip-icon.component'; import { StringAutocompleteComponent } from '@shared/components/string-autocomplete.component'; import { ImagePipe } from '@shared/pipe/image.pipe'; +import { ImportExportService } from '@shared/import-export/import-export.service'; +import { ImportDialogComponent } from '@shared/import-export/import-dialog.component'; +import { ImportDialogCsvComponent } from '@shared/import-export/import-dialog-csv.component'; +import { ExportWidgetsBundleDialogComponent } from '@shared/import-export/export-widgets-bundle-dialog.component'; +import { TableColumnsAssignmentComponent } from '@shared/import-export/table-columns-assignment.component'; +import { ScrollGridComponent } from '@shared/components/grid/scroll-grid.component'; +import { ImageGalleryComponent } from '@shared/components/image/image-gallery.component'; +import { UploadImageDialogComponent } from '@shared/components/image/upload-image-dialog.component'; +import { ImageDialogComponent } from '@shared/components/image/image-dialog.component'; +import { ImageReferencesComponent } from '@shared/components/image/image-references.component'; +import { ImagesInUseDialogComponent } from '@shared/components/image/images-in-use-dialog.component'; +import { GalleryImageInputComponent } from '@shared/components/image/gallery-image-input.component'; +import { MultipleGalleryImageInputComponent } from '@shared/components/image/multiple-gallery-image-input.component'; export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) { return markedOptionsService; @@ -236,6 +249,7 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) { provide: SHARED_MODULE_TOKEN, useValue: SharedModule }, { provide: MatPaginatorIntl, useClass: CustomPaginatorIntl }, TbPopoverService, + ImportExportService, { provide: MAT_SELECT_CONFIG, useValue: { @@ -382,7 +396,19 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) MaterialIconsComponent, RuleChainSelectComponent, TbIconComponent, - HintTooltipIconComponent + HintTooltipIconComponent, + ImportDialogComponent, + ImportDialogCsvComponent, + ExportWidgetsBundleDialogComponent, + TableColumnsAssignmentComponent, + ScrollGridComponent, + ImageGalleryComponent, + UploadImageDialogComponent, + ImageDialogComponent, + ImageReferencesComponent, + ImagesInUseDialogComponent, + GalleryImageInputComponent, + MultipleGalleryImageInputComponent ], imports: [ CommonModule, @@ -619,7 +645,19 @@ export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) MaterialIconsComponent, RuleChainSelectComponent, TbIconComponent, - HintTooltipIconComponent + HintTooltipIconComponent, + ImportDialogComponent, + ImportDialogCsvComponent, + ExportWidgetsBundleDialogComponent, + TableColumnsAssignmentComponent, + ScrollGridComponent, + ImageGalleryComponent, + UploadImageDialogComponent, + ImageDialogComponent, + ImageReferencesComponent, + ImagesInUseDialogComponent, + GalleryImageInputComponent, + MultipleGalleryImageInputComponent ] }) export class SharedModule { } diff --git a/ui-ngx/src/assets/locale/locale.constant-en_US.json b/ui-ngx/src/assets/locale/locale.constant-en_US.json index f29faeaffd..d8006debeb 100644 --- a/ui-ngx/src/assets/locale/locale.constant-en_US.json +++ b/ui-ngx/src/assets/locale/locale.constant-en_US.json @@ -5122,9 +5122,8 @@ "background": { "background": "Background", "background-settings": "Background settings", - "background-type-image": "Upload image", - "background-type-image-url": "Image URL", - "background-type-color": "Solid color", + "background-type-image": "Image", + "background-type-color": "Color", "image-url": "Image URL", "overlay": "Overlay", "enable-overlay": "Enable overlay",