diff --git a/frontend/app/features/content/shared/due-time-selector.component.html b/frontend/app/features/content/shared/due-time-selector.component.html index 56a86e174..9c5d36f09 100644 --- a/frontend/app/features/content/shared/due-time-selector.component.html +++ b/frontend/app/features/content/shared/due-time-selector.component.html @@ -23,8 +23,8 @@ - - + + diff --git a/frontend/app/features/content/shared/references/content-selector.component.html b/frontend/app/features/content/shared/references/content-selector.component.html index b295a97df..4e05cbb29 100644 --- a/frontend/app/features/content/shared/references/content-selector.component.html +++ b/frontend/app/features/content/shared/references/content-selector.component.html @@ -87,7 +87,7 @@ - - + + \ No newline at end of file diff --git a/frontend/app/features/dashboard/declarations.ts b/frontend/app/features/dashboard/declarations.ts index 74d81eefd..744fb2e17 100644 --- a/frontend/app/features/dashboard/declarations.ts +++ b/frontend/app/features/dashboard/declarations.ts @@ -13,8 +13,10 @@ export * from './pages/cards/api-traffic-card.component'; export * from './pages/cards/asset-uploads-count-card.component'; export * from './pages/cards/asset-uploads-size-card.component'; export * from './pages/cards/asset-uploads-size-summary-card.component'; +export * from './pages/cards/content-summary-card.component'; export * from './pages/cards/github-card.component'; export * from './pages/cards/history-card.component'; +export * from './pages/cards/iframe-card.component'; export * from './pages/cards/schema-card.component'; export * from './pages/cards/support-card.component'; export * from './pages/dashboard-config.component'; diff --git a/frontend/app/features/dashboard/module.ts b/frontend/app/features/dashboard/module.ts index f1a3e785a..efedf71a3 100644 --- a/frontend/app/features/dashboard/module.ts +++ b/frontend/app/features/dashboard/module.ts @@ -12,7 +12,7 @@ import { RouterModule, Routes } from '@angular/router'; import { SqxFrameworkModule, SqxSharedModule } from '@app/shared'; import { GridsterModule } from 'angular-gridster2'; import { ChartModule } from 'angular2-chartjs'; -import { ApiCallsCardComponent, ApiCallsSummaryCardComponent, ApiCardComponent, ApiPerformanceCardComponent, ApiTrafficCardComponent, AssetUploadsCountCardComponent, AssetUploadsSizeCardComponent, AssetUploadsSizeSummaryCardComponent, DashboardConfigComponent, DashboardPageComponent, GithubCardComponent, HistoryCardComponent, SchemaCardComponent, SupportCardComponent } from './declarations'; +import { ApiCallsCardComponent, ApiCallsSummaryCardComponent, ApiCardComponent, ApiPerformanceCardComponent, ApiTrafficCardComponent, AssetUploadsCountCardComponent, AssetUploadsSizeCardComponent, AssetUploadsSizeSummaryCardComponent, ContentSummaryCardComponent, DashboardConfigComponent, DashboardPageComponent, GithubCardComponent, HistoryCardComponent, IFrameCardComponent, SchemaCardComponent, SupportCardComponent } from './declarations'; const routes: Routes = [ { @@ -38,10 +38,12 @@ const routes: Routes = [ AssetUploadsCountCardComponent, AssetUploadsSizeCardComponent, AssetUploadsSizeSummaryCardComponent, + ContentSummaryCardComponent, DashboardConfigComponent, DashboardPageComponent, GithubCardComponent, HistoryCardComponent, + IFrameCardComponent, SchemaCardComponent, SupportCardComponent ] diff --git a/frontend/app/features/dashboard/pages/cards/content-summary-card.component.html b/frontend/app/features/dashboard/pages/cards/content-summary-card.component.html new file mode 100644 index 000000000..72fc83c80 --- /dev/null +++ b/frontend/app/features/dashboard/pages/cards/content-summary-card.component.html @@ -0,0 +1,9 @@ +
+
{{options?.name}}
+
+
+
Number of items
+
{{itemCount}}
+
+
+
\ No newline at end of file diff --git a/frontend/app/features/dashboard/pages/cards/content-summary-card.component.scss b/frontend/app/features/dashboard/pages/cards/content-summary-card.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/frontend/app/features/dashboard/pages/cards/content-summary-card.component.ts b/frontend/app/features/dashboard/pages/cards/content-summary-card.component.ts new file mode 100644 index 000000000..a22fd86cd --- /dev/null +++ b/frontend/app/features/dashboard/pages/cards/content-summary-card.component.ts @@ -0,0 +1,58 @@ +/* + * Squidex Headless CMS + * + * @license + * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. + */ + +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnInit } from '@angular/core'; +import { AppDto, ContentsService, fadeAnimation, Types } from '@app/shared'; + +@Component({ + selector: 'sqx-content-summary-card', + styleUrls: ['./content-summary-card.component.scss'], + templateUrl: './content-summary-card.component.html', + animations: [ + fadeAnimation + ], + changeDetection: ChangeDetectionStrategy.OnPush +}) +export class ContentSummaryCardComponent implements OnInit { + @Input() + public app: AppDto; + + @Input() + public options: any; + + public itemCount = 0; + + constructor( + private readonly changeDetector: ChangeDetectorRef, + private readonly contentsService: ContentsService + ) { + } + + public ngOnInit() { + if (!Types.isString(this.options?.schema)) { + return; + } + + let query = this.options?.query; + + if (!Types.isObject(query)) { + query = {}; + } + + query.take = 0; + + this.contentsService.getContents(this.app.name, this.options.schema, { query }) + .subscribe(dto => { + this.itemCount = dto.total; + + this.changeDetector.detectChanges(); + }, + () => { + this.itemCount = 0; + }); + } +} \ No newline at end of file diff --git a/frontend/app/features/dashboard/pages/cards/iframe-card.component.html b/frontend/app/features/dashboard/pages/cards/iframe-card.component.html new file mode 100644 index 000000000..49ac3258f --- /dev/null +++ b/frontend/app/features/dashboard/pages/cards/iframe-card.component.html @@ -0,0 +1,6 @@ +
+
{{options?.name}}
+
+ +
+
\ No newline at end of file diff --git a/frontend/app/features/dashboard/pages/cards/iframe-card.component.scss b/frontend/app/features/dashboard/pages/cards/iframe-card.component.scss new file mode 100644 index 000000000..566c96d32 --- /dev/null +++ b/frontend/app/features/dashboard/pages/cards/iframe-card.component.scss @@ -0,0 +1,8 @@ +iframe { + @include absolute(0, 0, 0, 0); + border: 0; +} + +.card-body { + position: relative; +} \ No newline at end of file diff --git a/frontend/app/features/dashboard/pages/cards/iframe-card.component.ts b/frontend/app/features/dashboard/pages/cards/iframe-card.component.ts new file mode 100644 index 000000000..3f7d291e7 --- /dev/null +++ b/frontend/app/features/dashboard/pages/cards/iframe-card.component.ts @@ -0,0 +1,33 @@ +/* + * Squidex Headless CMS + * + * @license + * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved. + */ + +import { AfterViewInit, ChangeDetectionStrategy, Component, ElementRef, Input, ViewChild } from '@angular/core'; +import { AppDto, fadeAnimation } from '@app/shared'; + +@Component({ + selector: 'sqx-iframe-card', + styleUrls: ['./iframe-card.component.scss'], + templateUrl: './iframe-card.component.html', + animations: [ + fadeAnimation + ], + changeDetection: ChangeDetectionStrategy.OnPush +}) +export class IFrameCardComponent implements AfterViewInit { + @ViewChild('iframe', { static: false }) + public iframe: ElementRef; + + @Input() + public app: AppDto; + + @Input() + public options: any; + + public ngAfterViewInit() { + this.iframe.nativeElement.src = this.options?.src; + } +} \ No newline at end of file diff --git a/frontend/app/features/dashboard/pages/dashboard-config.component.html b/frontend/app/features/dashboard/pages/dashboard-config.component.html index 9389a575e..b393e421a 100644 --- a/frontend/app/features/dashboard/pages/dashboard-config.component.html +++ b/frontend/app/features/dashboard/pages/dashboard-config.component.html @@ -1,5 +1,5 @@ - @@ -9,7 +9,7 @@
+ (ngModelChange)="addOrRemove(item)" />
\ No newline at end of file diff --git a/frontend/app/features/dashboard/pages/dashboard-page.component.scss b/frontend/app/features/dashboard/pages/dashboard-page.component.scss index 67aaa36e1..b9c90eb70 100644 --- a/frontend/app/features/dashboard/pages/dashboard-page.component.scss +++ b/frontend/app/features/dashboard/pages/dashboard-page.component.scss @@ -5,10 +5,12 @@ &-summary { @include absolute(2rem, null, null, 2rem); + z-index: 0; } &-settings { @include absolute(1rem, 1rem, null, null); + z-index: 1000; } &-title { @@ -24,15 +26,17 @@ } } +gridster-item { + position: absolute; +} + .btn { z-index: 1000; } :host ::ng-deep { - canvas { - height: 12rem !important; - margin-bottom: 0; - margin-top: -1rem; + chart { + @include absolute(0, 1rem, 1rem, 1rem); } .subtext { @@ -41,8 +45,7 @@ .card { & { - @include force-height(16rem); - height: 100%; + @include absolute(0, 0, 0, 0); } &-image { @@ -59,6 +62,14 @@ } } + &-header { + @include truncate; + } + + &-body { + position: relative; + } + &-history { overflow-y: auto; } diff --git a/frontend/app/features/dashboard/pages/dashboard-page.component.ts b/frontend/app/features/dashboard/pages/dashboard-page.component.ts index 730811626..9bafd3b4b 100644 --- a/frontend/app/features/dashboard/pages/dashboard-page.component.ts +++ b/frontend/app/features/dashboard/pages/dashboard-page.component.ts @@ -7,9 +7,9 @@ // tslint:disable: readonly-array -import { AfterViewInit, Component, OnInit, Renderer2, ViewChild } from '@angular/core'; +import { AfterViewInit, Component, NgZone, OnInit, Renderer2, ViewChild } from '@angular/core'; import { AppsState, AuthService, CallsUsageDto, CurrentStorageDto, DateTime, fadeAnimation, LocalStoreService, ResourceOwner, StorageUsagePerDateDto, UsagesService } from '@app/shared'; -import { GridsterComponent, GridsterItem, GridType } from 'angular-gridster2'; +import { GridsterComponent, GridsterConfig, GridsterItem, GridType } from 'angular-gridster2'; import { switchMap } from 'rxjs/operators'; @Component({ @@ -39,9 +39,10 @@ export class DashboardPageComponent extends ResourceOwner implements AfterViewIn constructor( public readonly appsState: AppsState, public readonly authState: AuthService, + private readonly localStore: LocalStoreService, private readonly renderer: Renderer2, private readonly usagesService: UsagesService, - private readonly localStore: LocalStoreService + private readonly zone: NgZone ) { super(); @@ -75,8 +76,18 @@ export class DashboardPageComponent extends ResourceOwner implements AfterViewIn } public ngAfterViewInit() { - this.renderer.listen(this.grid.el, 'scroll', () => { - this.isScrolled = this.grid.el.scrollTop > 0; + this.zone.runOutsideAngular(() => { + const gridElement = this.grid.el; + + this.renderer.listen(gridElement, 'scroll', () => { + const isScrolled = gridElement.scrollTop > 0; + + if (isScrolled !== this.isScrolled) { + this.zone.run(() => { + this.isScrolled = isScrolled; + }); + } + }); }); } @@ -93,20 +104,22 @@ export class DashboardPageComponent extends ResourceOwner implements AfterViewIn } } -const DEFAULT_OPTIONS = { +const DEFAULT_OPTIONS: GridsterConfig = { displayGrid: 'onDrag&Resize', + draggable: { + enabled: true + }, fixedColWidth: 254, fixedRowHeight: 254, gridType: GridType.Fixed, + maxItemCols: 3, + maxItemRows: 2, outerMargin: true, outerMarginBottom: 16, outerMarginLeft: 16, outerMarginRight: 16, outerMarginTop: 120, - draggable: { - enabled: true - }, resizable: { - enabled: false + enabled: true } }; \ No newline at end of file diff --git a/frontend/app/features/rules/pages/rules/rule-wizard.component.html b/frontend/app/features/rules/pages/rules/rule-wizard.component.html index abff3fc4b..70390653c 100644 --- a/frontend/app/features/rules/pages/rules/rule-wizard.component.html +++ b/frontend/app/features/rules/pages/rules/rule-wizard.component.html @@ -127,14 +127,14 @@ - + - - + + - + \ No newline at end of file diff --git a/frontend/app/features/schemas/pages/schema/fields/field-wizard.component.html b/frontend/app/features/schemas/pages/schema/fields/field-wizard.component.html index 4d8a30713..9169f1582 100644 --- a/frontend/app/features/schemas/pages/schema/fields/field-wizard.component.html +++ b/frontend/app/features/schemas/pages/schema/fields/field-wizard.component.html @@ -78,13 +78,13 @@ -
+
-
+
diff --git a/frontend/app/features/schemas/pages/schemas/schema-form.component.html b/frontend/app/features/schemas/pages/schemas/schema-form.component.html index 84eb2427e..0be6278f6 100644 --- a/frontend/app/features/schemas/pages/schemas/schema-form.component.html +++ b/frontend/app/features/schemas/pages/schemas/schema-form.component.html @@ -82,8 +82,9 @@ - - + + + \ No newline at end of file diff --git a/frontend/app/features/settings/pages/clients/client-connect-form.component.html b/frontend/app/features/settings/pages/clients/client-connect-form.component.html index 2109a9b9d..1ff10c856 100644 --- a/frontend/app/features/settings/pages/clients/client-connect-form.component.html +++ b/frontend/app/features/settings/pages/clients/client-connect-form.component.html @@ -163,8 +163,6 @@ - + \ No newline at end of file diff --git a/frontend/app/features/settings/pages/contributors/import-contributors-dialog.component.html b/frontend/app/features/settings/pages/contributors/import-contributors-dialog.component.html index fbc7a0352..d928e6d4b 100644 --- a/frontend/app/features/settings/pages/contributors/import-contributors-dialog.component.html +++ b/frontend/app/features/settings/pages/contributors/import-contributors-dialog.component.html @@ -50,15 +50,15 @@ - + - + - + diff --git a/frontend/app/framework/angular/modals/dialog-renderer.component.html b/frontend/app/framework/angular/modals/dialog-renderer.component.html index 0b50a9c6e..a0182d967 100644 --- a/frontend/app/framework/angular/modals/dialog-renderer.component.html +++ b/frontend/app/framework/angular/modals/dialog-renderer.component.html @@ -11,8 +11,9 @@ - - + + + diff --git a/frontend/app/shared/components/app-form.component.html b/frontend/app/shared/components/app-form.component.html index 5fa4347d9..9d531020d 100644 --- a/frontend/app/shared/components/app-form.component.html +++ b/frontend/app/shared/components/app-form.component.html @@ -33,8 +33,9 @@ - - + + + \ No newline at end of file diff --git a/frontend/app/shared/components/assets/asset-folder-dialog.component.html b/frontend/app/shared/components/assets/asset-folder-dialog.component.html index 04d4b171d..b45c0cc5a 100644 --- a/frontend/app/shared/components/assets/asset-folder-dialog.component.html +++ b/frontend/app/shared/components/assets/asset-folder-dialog.component.html @@ -28,9 +28,9 @@ - + - - + + + \ No newline at end of file diff --git a/frontend/app/shared/components/search/search-form.component.html b/frontend/app/shared/components/search/search-form.component.html index 6e65fa01a..4649fa951 100644 --- a/frontend/app/shared/components/search/search-form.component.html +++ b/frontend/app/shared/components/search/search-form.component.html @@ -62,7 +62,9 @@ - @@ -92,8 +94,9 @@ - - + + +