From cc29a9c98d1130ec90277906303f24aa5c36d278 Mon Sep 17 00:00:00 2001 From: FlayInAHook Date: Wed, 18 Nov 2020 12:28:38 +0100 Subject: [PATCH 1/3] fixed table spacing --- src/app/pages/tables/bikes/bikes.component.scss | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/app/pages/tables/bikes/bikes.component.scss b/src/app/pages/tables/bikes/bikes.component.scss index 39658b7..04baa08 100644 --- a/src/app/pages/tables/bikes/bikes.component.scss +++ b/src/app/pages/tables/bikes/bikes.component.scss @@ -11,7 +11,9 @@ } .table-container { flex: 1; - width: 100%; + width: auto; + margin-left: 0.5em; + margin-right: 0.5em; max-width: 100%; overflow: auto; table { From 658b79402b31e62c7a494e6b91072907f87dcade Mon Sep 17 00:00:00 2001 From: FlayInAHook Date: Wed, 18 Nov 2020 13:09:04 +0100 Subject: [PATCH 2/3] added angular flex module, fixed sidenav still wip --- package-lock.json | 8 +++++++ package.json | 1 + src/app/app.component.ts | 6 +---- src/app/app.module.ts | 2 ++ .../menu-list-item.component.html | 23 +++++++++---------- .../menu-list-item.component.scss | 5 ++++ .../menu-list-item.component.ts | 11 +++++++-- src/styles.scss | 4 ++++ 8 files changed, 41 insertions(+), 19 deletions(-) diff --git a/package-lock.json b/package-lock.json index 02f6f4c..c776c76 100644 --- a/package-lock.json +++ b/package-lock.json @@ -730,6 +730,14 @@ "tslib": "^2.0.0" } }, + "@angular/flex-layout": { + "version": "11.0.0-beta.33", + "resolved": "https://registry.npmjs.org/@angular/flex-layout/-/flex-layout-11.0.0-beta.33.tgz", + "integrity": "sha512-unfhw3abZuKtdwQicRStHCYGbANPTHYg4WNRQk/RC5Mxq+4WOp4Q8HI7GqRHCGUYDCGUP7w1sU/oDt8f09nM8w==", + "requires": { + "tslib": "^2.0.0" + } + }, "@angular/forms": { "version": "10.0.14", "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-10.0.14.tgz", diff --git a/package.json b/package.json index 2369f52..4e9ebb9 100644 --- a/package.json +++ b/package.json @@ -18,6 +18,7 @@ "@angular/common": "~10.0.14", "@angular/compiler": "~10.0.14", "@angular/core": "~10.0.14", + "@angular/flex-layout": "^11.0.0-beta.33", "@angular/forms": "~10.0.14", "@angular/localize": "^10.2.3", "@angular/material": "^10.2.7", diff --git a/src/app/app.component.ts b/src/app/app.component.ts index f0b7d33..0b102cb 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -22,14 +22,10 @@ export class AppComponent { navItems: NavItem[] = [ - { - displayName: 'Tabellenübersicht ', - iconName: 'recent_actors', - route: 'tableOverview' - }, { displayName: 'Tabellen', iconName: 'recent_actors', + route: 'tableOverview', children: [ { displayName: 'Lastenräder', diff --git a/src/app/app.module.ts b/src/app/app.module.ts index ff0d3db..b4d73f2 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -4,6 +4,7 @@ import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http'; import { DragDropModule } from '@angular/cdk/drag-drop'; +import { FlexLayoutModule } from '@angular/flex-layout'; // Angular Material Components import { MatToolbarModule } from '@angular/material/toolbar'; @@ -58,6 +59,7 @@ import { TokenInterceptor } from './helper/token.interceptor' AppRoutingModule, BrowserAnimationsModule, FormsModule, + FlexLayoutModule, ReactiveFormsModule, MatToolbarModule, MatButtonModule, diff --git a/src/app/components/menu-list-item/menu-list-item.component.html b/src/app/components/menu-list-item/menu-list-item.component.html index 62a708b..34abf60 100644 --- a/src/app/components/menu-list-item/menu-list-item.component.html +++ b/src/app/components/menu-list-item/menu-list-item.component.html @@ -1,16 +1,15 @@ - - {{item.iconName}} - {{item.displayName}} - - - - expand_more - + + + {{item.iconName}} + {{item.displayName}} + + + + + expand_more +
- - +
diff --git a/src/app/components/menu-list-item/menu-list-item.component.scss b/src/app/components/menu-list-item/menu-list-item.component.scss index 149e979..2629bc7 100644 --- a/src/app/components/menu-list-item/menu-list-item.component.scss +++ b/src/app/components/menu-list-item/menu-list-item.component.scss @@ -26,3 +26,8 @@ margin-right: 40px; } } + +span { + display: inline-flex; + vertical-align: middle; +} \ No newline at end of file diff --git a/src/app/components/menu-list-item/menu-list-item.component.ts b/src/app/components/menu-list-item/menu-list-item.component.ts index b0d3476..98b4704 100644 --- a/src/app/components/menu-list-item/menu-list-item.component.ts +++ b/src/app/components/menu-list-item/menu-list-item.component.ts @@ -43,12 +43,19 @@ export class MenuListItemComponent implements OnInit { } onItemSelected(item: NavItem) { - if (!item.children || !item.children.length) { + /*if (!item.children || !item.children.length) { this.router.navigate([item.route]); this.navService.closeNav(); } if (item.children && item.children.length) { this.expanded = !this.expanded; - } + }*/ + + this.router.navigate([item.route]); + this.navService.closeNav(); + } + + expand(item: NavItem) { + this.expanded = !this.expanded; } } diff --git a/src/styles.scss b/src/styles.scss index 42b42d7..4396c37 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -16,4 +16,8 @@ h1:before { height: 1px; bottom: 0; border-bottom: 3px solid #7fc600; +} + +.mat-list-item-content { + width: 100%; } \ No newline at end of file From 0983ec85ed8df746798b848937915016c1ef6f63 Mon Sep 17 00:00:00 2001 From: FlayInAHook Date: Wed, 18 Nov 2020 14:15:13 +0100 Subject: [PATCH 3/3] added loading indicator for tables --- src/app/pages/tables/bikes/bikes.component.html | 13 ++++++++++++- src/app/pages/tables/bikes/bikes.component.ts | 6 ++++++ 2 files changed, 18 insertions(+), 1 deletion(-) diff --git a/src/app/pages/tables/bikes/bikes.component.html b/src/app/pages/tables/bikes/bikes.component.html index eac2a82..5ec8ed2 100644 --- a/src/app/pages/tables/bikes/bikes.component.html +++ b/src/app/pages/tables/bikes/bikes.component.html @@ -15,7 +15,7 @@