diff --git a/src/app/app.component.ts b/src/app/app.component.ts index e12be28..ad004fb 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -6,6 +6,7 @@ import { ViewChild } from '@angular/core'; import { MatSidenav } from '@angular/material/sidenav'; import { NavService } from './components/menu-list-item/nav.service'; import { NavItem } from './components/menu-list-item/nav-item'; +import { tableLinks } from 'src/app/tableLinks'; @Component({ selector: 'app-root', @@ -20,28 +21,12 @@ export class AppComponent { @ViewChild('sidenav') public sideNav:MatSidenav; @ViewChild('appDrawer') appDrawer: ElementRef; - navItems: NavItem[] = [ { displayName: 'Tabellen', iconName: 'recent_actors', route: 'tableOverview', - children: [ - { - displayName: 'Lastenräder', - iconName: 'directions_bike', - route: 'table/bikes' - }, - { - displayName: 'Beteiligte', - iconName: 'group', - route: 'table/participants' - }, - { - displayName: 'Standorte', - iconName: 'place', - route: 'table/lendingStations' - }] + children: tableLinks }]; diff --git a/src/app/pages/table-overview/table-overview.component.html b/src/app/pages/table-overview/table-overview.component.html index 4072018..d37fd6b 100644 --- a/src/app/pages/table-overview/table-overview.component.html +++ b/src/app/pages/table-overview/table-overview.component.html @@ -1,27 +1,21 @@ - -
-
- - Lastenräder - Aktive - Standorte - Personen - -
- - Equipmenttypen - Equipment - Zeitscheiben - Organisation - Kontaktinformation - Anbieter - Engagements - Engagementtypen - Lastenradevents - Lastenradeventtypen - Workshops - Workshoptypen - +
+ +
- - diff --git a/src/app/pages/table-overview/table-overview.component.scss b/src/app/pages/table-overview/table-overview.component.scss index 76d2043..4346f46 100644 --- a/src/app/pages/table-overview/table-overview.component.scss +++ b/src/app/pages/table-overview/table-overview.component.scss @@ -1,12 +1,34 @@ -mat-grid-tile { - cursor: pointer; - background: grey; -} - -.grid-list-spacer { - margin: 15px; -} - -.big-list { - margin-bottom: 30px; +.page-wrapper { + display: flex; + height: 100%; + .link-box { + flex-basis: 50%; + height: 100%; + overflow: auto; + .text-wrapper { + padding: 2em; + } + } + .banner-box { + flex-basis: 50%; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + text-align: center; + .center-text { + margin: 0.5em; + position: absolute; + word-break: break-word; + color: white; + z-index: 5; + } + .banner-img-box { + height: 100%; + filter: blur(2px); + img { + height: 100%; + } + } + } } diff --git a/src/app/pages/table-overview/table-overview.component.ts b/src/app/pages/table-overview/table-overview.component.ts index b494e94..1617649 100644 --- a/src/app/pages/table-overview/table-overview.component.ts +++ b/src/app/pages/table-overview/table-overview.component.ts @@ -1,4 +1,6 @@ import { Component, OnInit } from '@angular/core'; +import { AuthService } from 'src/app/services/auth.service'; +import { tableLinks } from 'src/app/tableLinks'; @Component({ selector: 'app-table-overview', @@ -7,9 +9,17 @@ import { Component, OnInit } from '@angular/core'; }) export class TableOverviewComponent implements OnInit { - constructor() { } + username = "fLotte Nutzer" + tableLinks = tableLinks; + + constructor(private auth: AuthService) { + } ngOnInit(): void { + this.auth.currentUser.subscribe(user => { + const name = user?.user?.name; + this.username = name || this.username + }); } } diff --git a/src/app/pages/tables/bike-events/bike-events.component.ts b/src/app/pages/tables/bike-events/bike-events.component.ts index 9ace369..a1b7d3c 100644 --- a/src/app/pages/tables/bike-events/bike-events.component.ts +++ b/src/app/pages/tables/bike-events/bike-events.component.ts @@ -118,7 +118,7 @@ export class BikeEventsComponent implements OnInit { tableDataGQLCreateInputType: string = 'BikeEventCreateInput'; tableDataGQLUpdateInputType: string = 'BikeEventUpdateInput'; - headline = 'Lastenradevent'; + headline = 'Lastenradevents'; headlineIconName = 'event'; loadingRowIds: string[] = []; diff --git a/src/app/pages/tables/organisations/organisations.component.ts b/src/app/pages/tables/organisations/organisations.component.ts index 6814652..da98814 100644 --- a/src/app/pages/tables/organisations/organisations.component.ts +++ b/src/app/pages/tables/organisations/organisations.component.ts @@ -50,7 +50,7 @@ export class OrganisationsComponent implements OnInit { tableDataGQLCreateInputType: string = 'OrganisationCreateInput'; tableDataGQLUpdateInputType: string = 'OrganisationUpdateInput'; - headline = 'Organisation'; + headline = 'Organisationen'; headlineIconName = 'business'; loadingRowIds: string[] = []; diff --git a/src/app/tableLinks.ts b/src/app/tableLinks.ts new file mode 100644 index 0000000..fb46a3c --- /dev/null +++ b/src/app/tableLinks.ts @@ -0,0 +1,83 @@ + +export const tableLinks = [ + { + displayName: 'Lastenräder', + iconName: 'directions_bike', + route: 'table/bikes' + }, + { + displayName: 'Aktive', + iconName: 'directions_run', + route: 'table/participants' + }, + { + displayName: 'Standorte', + iconName: 'location_on', + route: 'table/lendingStations' + }, + { + displayName: 'Personen', + iconName: 'person', + route: 'table/persons' + }, + { + displayName: 'Kontaktinformationen', + iconName: 'contact_page', + route: 'table/contactInformation' + }, + { + displayName: 'Zeitscheiben', + iconName: 'access_time', + route: 'table/timeFrames' + }, + { + displayName: 'Lastenfahrrad-Eventtypen', + iconName: 'build', + route: 'table/bikeEventTypes' + }, + { + displayName: 'Lastenfahrrad-Events', + iconName: 'event', + route: 'table/bikeEvents' + }, + { + displayName: 'Equipmenttypen', + iconName: 'toys', + route: 'table/equipmentTypes' + }, + { + displayName: 'Equipment', + iconName: 'battery_full', + route: 'table/equipments' + }, + { + displayName: 'Engagementypen', + iconName: 'track_changes', + route: 'table/engagementTypes' + }, + { + displayName: 'Engagements', + iconName: 'update', + route: 'table/engagements' + }, + { + displayName: 'Organisationen', + iconName: 'business', + route: 'table/organisations' + }, + { + displayName: 'Anbieter', + iconName: 'people', + route: 'table/providers' + }, + { + displayName: 'Workshops', + iconName: 'school', + route: 'table/workshops' + }, + { + displayName: 'Workshoptypen', + iconName: 'multiline_chart', + route: 'table/workshopTypes' + }, + ] \ No newline at end of file diff --git a/src/assets/rain.png b/src/assets/rain.png new file mode 100644 index 0000000..9a01b9f Binary files /dev/null and b/src/assets/rain.png differ