From bba6229c2b1a2fa42fd4b451d60d1a5d34421a1f Mon Sep 17 00:00:00 2001 From: Peter Date: Thu, 5 Oct 2023 13:18:57 +0200 Subject: [PATCH] Adjust data and components. --- .../main/java/com/rossa/api/config/data.sql | 2 +- rossa-tech-cli/src/app/app.component.css | 0 rossa-tech-cli/src/app/app.component.html | 10 ++- rossa-tech-cli/src/app/app.component.scss | 6 ++ rossa-tech-cli/src/app/app.component.ts | 2 +- rossa-tech-cli/src/app/app.module.ts | 2 + .../dashboard/dashboard.component.html | 62 +++++++++++-------- .../dashboard/dashboard.component.ts | 9 ++- .../components/footer/footer.component.html | 8 +++ .../components/footer/footer.component.scss | 8 +++ .../app/components/footer/footer.component.ts | 31 ++++++++++ .../components/header/header.component.html | 20 +++--- rossa-tech-cli/src/app/constants.ts | 2 +- .../src/app/core/dataModels/Meter.ts | 22 ------- .../src/app/core/dataModels/Meterdata.ts | 6 +- .../src/app/core/services/database.service.ts | 3 +- .../app/core/services/meterData.service.ts | 26 +++++--- .../meter-data-add-dialog.component.ts | 7 ++- .../src/environments/environment.prod.ts | 5 +- .../src/environments/environment.ts | 1 + rossa-tech-cli/src/styles.scss | 34 +++++++++- rossa-tech-cli/tsconfig.json | 5 +- 22 files changed, 184 insertions(+), 87 deletions(-) delete mode 100644 rossa-tech-cli/src/app/app.component.css create mode 100644 rossa-tech-cli/src/app/components/footer/footer.component.html create mode 100644 rossa-tech-cli/src/app/components/footer/footer.component.scss create mode 100644 rossa-tech-cli/src/app/components/footer/footer.component.ts delete mode 100644 rossa-tech-cli/src/app/core/dataModels/Meter.ts diff --git a/api/src/main/java/com/rossa/api/config/data.sql b/api/src/main/java/com/rossa/api/config/data.sql index 34d6229..32f758c 100644 --- a/api/src/main/java/com/rossa/api/config/data.sql +++ b/api/src/main/java/com/rossa/api/config/data.sql @@ -1,5 +1,5 @@ INSERT INTO meters (name) VALUES ('1LOG'); -INSERT INTO meters (name) VALUES ('1HEM'); +INSERT INTO meters (name) VALUES ('1EHM'); INSERT INTO meters (name) VALUES ('WATER'); INSERT INTO meters (name) VALUES ('GARDEN'); diff --git a/rossa-tech-cli/src/app/app.component.css b/rossa-tech-cli/src/app/app.component.css deleted file mode 100644 index e69de29..0000000 diff --git a/rossa-tech-cli/src/app/app.component.html b/rossa-tech-cli/src/app/app.component.html index 09a2e25..8681a78 100644 --- a/rossa-tech-cli/src/app/app.component.html +++ b/rossa-tech-cli/src/app/app.component.html @@ -1,3 +1,9 @@ - +
- \ No newline at end of file + + + + + + +
\ No newline at end of file diff --git a/rossa-tech-cli/src/app/app.component.scss b/rossa-tech-cli/src/app/app.component.scss index e69de29..a197755 100644 --- a/rossa-tech-cli/src/app/app.component.scss +++ b/rossa-tech-cli/src/app/app.component.scss @@ -0,0 +1,6 @@ +div.app-wrapper { + height: 100%; + display: flex; + flex-direction: column; + justify-content: space-between; +} diff --git a/rossa-tech-cli/src/app/app.component.ts b/rossa-tech-cli/src/app/app.component.ts index f24c727..ae45b94 100644 --- a/rossa-tech-cli/src/app/app.component.ts +++ b/rossa-tech-cli/src/app/app.component.ts @@ -3,7 +3,7 @@ import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', - styleUrls: ['./app.component.css'], + styleUrls: ['./app.component.scss'], }) export class AppComponent { title = 'rossa-tech'; diff --git a/rossa-tech-cli/src/app/app.module.ts b/rossa-tech-cli/src/app/app.module.ts index 359b6ef..72e1f43 100644 --- a/rossa-tech-cli/src/app/app.module.ts +++ b/rossa-tech-cli/src/app/app.module.ts @@ -34,6 +34,7 @@ import { MatDatepickerModule } from '@angular/material/datepicker'; import { MatNativeDateModule } from '@angular/material/core'; import { MatSnackBarModule } from '@angular/material/snack-bar'; import { HeaderComponent } from './components/header/header.component'; +import { FooterComponent } from './components/footer/footer.component'; // import { ChartComponent } from './components/subcomponents/chart/chart.component'; // import { NgChartsModule } from 'ng2-charts'; @@ -73,6 +74,7 @@ import { HeaderComponent } from './components/header/header.component'; MatNativeDateModule, MatSnackBarModule, HeaderComponent, + FooterComponent, // NgChartsModule, ], providers: [ diff --git a/rossa-tech-cli/src/app/components/dashboard/dashboard.component.html b/rossa-tech-cli/src/app/components/dashboard/dashboard.component.html index ea7679a..efc9b99 100644 --- a/rossa-tech-cli/src/app/components/dashboard/dashboard.component.html +++ b/rossa-tech-cli/src/app/components/dashboard/dashboard.component.html @@ -1,29 +1,39 @@ -
-
- -
+
+
+ +
- - - - - - - - - - - - - - - +
+
+

+ MeterList +

+
+
+ +
+
+ +
+
+
+
+

+ Charts +

+
+
+ +
+
+ +
+
+
+
\ No newline at end of file diff --git a/rossa-tech-cli/src/app/components/dashboard/dashboard.component.ts b/rossa-tech-cli/src/app/components/dashboard/dashboard.component.ts index bfafefb..3f98ebc 100644 --- a/rossa-tech-cli/src/app/components/dashboard/dashboard.component.ts +++ b/rossa-tech-cli/src/app/components/dashboard/dashboard.component.ts @@ -16,6 +16,7 @@ import { MeterDataService } from 'src/app/core/services/meterData.service'; import { MeterDataAddDialogComponent } from 'src/app/dialogs/meter-data-add-dialog/meter-data-add-dialog.component'; import { MeterDataListComponent } from '../subcomponents/meter-data-list/meter-data-list.component'; import { ChartComponent } from '../subcomponents/chart/chart.component'; +import { MatButtonModule } from '@angular/material/button'; @Component({ selector: 'app-dashboard', @@ -27,13 +28,14 @@ import { ChartComponent } from '../subcomponents/chart/chart.component'; MatGridListModule, MeterDataListComponent, ChartComponent, + MatButtonModule, ], }) export class DashboardComponent { usageTypes = UsageType; preparedMeterData: PreparedMeterData[] = []; meterDataEnergy: PreparedMeterData[] = []; - // meterDataWater: MeterData[] = []; + meterDataWater: PreparedMeterData[] = []; displayedColumns: string[] = ['date', 'amount', 'meter']; // injects @@ -61,6 +63,11 @@ export class DashboardComponent { this.meterDataEnergy = data; }, }); + this.meterDataService.waterMeterData.subscribe({ + next: (data: PreparedMeterData[]) => { + this.meterDataWater = data; + }, + }); this.meterDataService.preparedMeterData.subscribe({ next: (data: PreparedMeterData[]) => { this.preparedMeterData = data; diff --git a/rossa-tech-cli/src/app/components/footer/footer.component.html b/rossa-tech-cli/src/app/components/footer/footer.component.html new file mode 100644 index 0000000..d48fb98 --- /dev/null +++ b/rossa-tech-cli/src/app/components/footer/footer.component.html @@ -0,0 +1,8 @@ + \ No newline at end of file diff --git a/rossa-tech-cli/src/app/components/footer/footer.component.scss b/rossa-tech-cli/src/app/components/footer/footer.component.scss new file mode 100644 index 0000000..2d55ffa --- /dev/null +++ b/rossa-tech-cli/src/app/components/footer/footer.component.scss @@ -0,0 +1,8 @@ +div.footer-wrapper { + display: flex; + flex-direction: row; + height: 36px; + justify-content: flex-end; + padding-right: 16px; + align-items: center; +} diff --git a/rossa-tech-cli/src/app/components/footer/footer.component.ts b/rossa-tech-cli/src/app/components/footer/footer.component.ts new file mode 100644 index 0000000..5e3beaa --- /dev/null +++ b/rossa-tech-cli/src/app/components/footer/footer.component.ts @@ -0,0 +1,31 @@ +import { Component, OnInit, inject } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { HttpErrorResponse } from '@angular/common/http'; +import { LoaderService } from '../loader/loader.service'; +import { environment } from 'src/environments/environment'; +import { AuthService } from 'src/app/auth/auth.service'; + +@Component({ + selector: 'app-footer', + templateUrl: './footer.component.html', + styleUrls: ['./footer.component.scss'], + standalone: true, + imports: [CommonModule], +}) +export class FooterComponent implements OnInit { + versionWeb: number | undefined = environment.version; + versionApi: number | undefined; + userLoggedIn: Boolean = false; + + //injects + private authService: AuthService = inject(AuthService); + // private loaderService: LoaderService = inject(LoaderService); + + constructor() {} + + ngOnInit(): void { + this.authService.isLoggedIn.subscribe((res) => { + this.userLoggedIn = res; + }); + } +} diff --git a/rossa-tech-cli/src/app/components/header/header.component.html b/rossa-tech-cli/src/app/components/header/header.component.html index 2c5410c..0990740 100644 --- a/rossa-tech-cli/src/app/components/header/header.component.html +++ b/rossa-tech-cli/src/app/components/header/header.component.html @@ -1,16 +1,16 @@
- - +
- +
\ No newline at end of file diff --git a/rossa-tech-cli/src/app/constants.ts b/rossa-tech-cli/src/app/constants.ts index 4bdd695..fb70bf6 100644 --- a/rossa-tech-cli/src/app/constants.ts +++ b/rossa-tech-cli/src/app/constants.ts @@ -1 +1 @@ -export const METERS = ['1LOG', '1HEM', 'WATER', 'GARDEN']; +export const METERS = ['1LOG', '1EHM', 'WATER', 'GARDEN']; diff --git a/rossa-tech-cli/src/app/core/dataModels/Meter.ts b/rossa-tech-cli/src/app/core/dataModels/Meter.ts deleted file mode 100644 index 3581f41..0000000 --- a/rossa-tech-cli/src/app/core/dataModels/Meter.ts +++ /dev/null @@ -1,22 +0,0 @@ -export class Meter { - id: number; - name: '1LOG' | '1HEM' | 'WATER' | 'GARDEN'; - type?: 'ENERGY' | 'WATER'; - - constructor( - id: number, - name?: '1LOG' | '1HEM' | 'WATER' | 'GARDEN', - type?: 'ENERGY' | 'WATER' - ) { - this.id = id || 0; - this.name = name || '1LOG'; - this.type = type || 'ENERGY'; - } -} - -export enum Meters { - '1LOG' = '1LOG', - '1HEM' = '1HEM', - 'WATER' = 'WATER', - 'GARDEN' = 'GARDEN', -} diff --git a/rossa-tech-cli/src/app/core/dataModels/Meterdata.ts b/rossa-tech-cli/src/app/core/dataModels/Meterdata.ts index 62dbfdb..b130d7f 100644 --- a/rossa-tech-cli/src/app/core/dataModels/Meterdata.ts +++ b/rossa-tech-cli/src/app/core/dataModels/Meterdata.ts @@ -1,11 +1,11 @@ export class Meter { id: number; - name: '1LOG' | '1HEM' | 'WATER' | 'GARDEN'; + name: '1LOG' | '1EHM' | 'WATER' | 'GARDEN'; type?: 'ENERGY' | 'WATER'; constructor( id: number, - name?: '1LOG' | '1HEM' | 'WATER' | 'GARDEN', + name?: '1LOG' | '1EHM' | 'WATER' | 'GARDEN', type?: 'ENERGY' | 'WATER' ) { this.id = id || 0; @@ -16,7 +16,7 @@ export class Meter { export enum Meters { '1LOG' = '1LOG', - '1HEM' = '1HEM', + '1EHM' = '1EHM', 'WATER' = 'WATER', 'GARDEN' = 'GARDEN', } diff --git a/rossa-tech-cli/src/app/core/services/database.service.ts b/rossa-tech-cli/src/app/core/services/database.service.ts index 66bf8b0..3b2d9c7 100644 --- a/rossa-tech-cli/src/app/core/services/database.service.ts +++ b/rossa-tech-cli/src/app/core/services/database.service.ts @@ -7,8 +7,7 @@ import { import { Observable, throwError } from 'rxjs'; import { catchError } from 'rxjs/operators'; import { environment } from 'src/environments/environment'; -import { MeterData } from '../dataModels/Meterdata'; -import { Meter } from '../dataModels/Meter'; +import { Meter, MeterData } from '../dataModels/Meterdata'; @Injectable({ providedIn: 'root', diff --git a/rossa-tech-cli/src/app/core/services/meterData.service.ts b/rossa-tech-cli/src/app/core/services/meterData.service.ts index 7527b0e..f12b943 100644 --- a/rossa-tech-cli/src/app/core/services/meterData.service.ts +++ b/rossa-tech-cli/src/app/core/services/meterData.service.ts @@ -2,6 +2,7 @@ import { Injectable } from '@angular/core'; import { MeterData, MeterDataForYear, + Meters, PreparedMeterData, } from '../dataModels/Meterdata'; import { UsageType } from '../dataModels/UsageType'; @@ -13,7 +14,6 @@ import { Observable, of } from 'rxjs'; export class MeterDataService { public preparedMeterDataObject: PreparedMeterData[] = []; private meterDataObject: MeterData[] = new Array(); - // public energyMeterDataObject: MeterData[] = []; constructor() {} @@ -21,18 +21,28 @@ export class MeterDataService { this.meterDataObject = meterData; } - // get meterData(): Observable { - // return - // } - get preparedMeterData(): Observable { return of(this.preparedMeterDataObject); } get energyMeterData(): Observable { - // console.log(this.energyMeterDataObject); - return of(this.preparedMeterDataObject.slice(0, 2)); - // return of(this.energyMeterDataObject); + const energyMeters: PreparedMeterData[] = + this.preparedMeterDataObject.filter( + (md: PreparedMeterData) => + md.meter.name === Meters['1EHM'] || md.meter.name === Meters['1LOG'] + ); + console.log({ energyMeters }); + return of(energyMeters); + } + + get waterMeterData(): Observable { + const waterMeters: PreparedMeterData[] = + this.preparedMeterDataObject.filter( + (md: PreparedMeterData) => + md.meter.name === Meters.GARDEN || md.meter.name === Meters.WATER + ); + console.log({ waterMeters }); + return of(waterMeters); } getMeterAmoutforYear(meterName: string, year: number): number { diff --git a/rossa-tech-cli/src/app/dialogs/meter-data-add-dialog/meter-data-add-dialog.component.ts b/rossa-tech-cli/src/app/dialogs/meter-data-add-dialog/meter-data-add-dialog.component.ts index e58b655..b9695e4 100644 --- a/rossa-tech-cli/src/app/dialogs/meter-data-add-dialog/meter-data-add-dialog.component.ts +++ b/rossa-tech-cli/src/app/dialogs/meter-data-add-dialog/meter-data-add-dialog.component.ts @@ -7,12 +7,12 @@ import { ReactiveFormsModule, Validators, } from '@angular/forms'; +import { MatButtonModule } from '@angular/material/button'; import { MatDatepickerModule } from '@angular/material/datepicker'; import { MatDialogModule, MatDialogRef } from '@angular/material/dialog'; import { MatInputModule } from '@angular/material/input'; import { MatSelectModule } from '@angular/material/select'; -import { Meter, Meters } from 'src/app/core/dataModels/Meter'; -import { MeterData } from 'src/app/core/dataModels/Meterdata'; +import { Meter, MeterData, Meters } from 'src/app/core/dataModels/Meterdata'; import { UsageType } from 'src/app/core/dataModels/UsageType'; import { DatabaseService } from 'src/app/core/services/database.service'; @@ -29,6 +29,7 @@ import { DatabaseService } from 'src/app/core/services/database.service'; FormsModule, ReactiveFormsModule, CommonModule, + MatButtonModule, ], }) export class MeterDataAddDialogComponent implements OnInit { @@ -78,7 +79,7 @@ export class MeterDataAddDialogComponent implements OnInit { } setUsageType(meterName: string): void { - if (meterName === Meters['1HEM'] || meterName === Meters['1LOG']) { + if (meterName === Meters['1EHM'] || meterName === Meters['1LOG']) { this.usageType = this.usageTypes.ENERGY; } else if (meterName === Meters.GARDEN || meterName === Meters.WATER) { this.usageType = this.usageTypes.WATER; diff --git a/rossa-tech-cli/src/environments/environment.prod.ts b/rossa-tech-cli/src/environments/environment.prod.ts index be3bac4..48d98eb 100644 --- a/rossa-tech-cli/src/environments/environment.prod.ts +++ b/rossa-tech-cli/src/environments/environment.prod.ts @@ -1,5 +1,6 @@ export const environment = { production: true, - env: "prod", - apiBaseUrl: "http://192.168.178.21:8182/api", + env: 'prod', + apiBaseUrl: 'http://192.168.178.21:8182/api', + version: 0.2, }; diff --git a/rossa-tech-cli/src/environments/environment.ts b/rossa-tech-cli/src/environments/environment.ts index 503929f..f343578 100644 --- a/rossa-tech-cli/src/environments/environment.ts +++ b/rossa-tech-cli/src/environments/environment.ts @@ -6,6 +6,7 @@ export const environment = { production: false, env: 'local', apiBaseUrl: 'http://localhost:8080', + version: 0.2, // apiBaseUrl: 'http://192.168.178.21:8182/api', }; diff --git a/rossa-tech-cli/src/styles.scss b/rossa-tech-cli/src/styles.scss index e346bbb..6885857 100644 --- a/rossa-tech-cli/src/styles.scss +++ b/rossa-tech-cli/src/styles.scss @@ -71,7 +71,7 @@ button { border-top: #a6a6a6 1px solid; display: flex; flex-direction: row; - justify-content: end; + justify-content: flex-end; } } @@ -79,3 +79,35 @@ button { .mat-mdc-table .mat-mdc-row { height: 42px; } + +div.content-wrapper { + display: flex; + flex-direction: column; + width: 100%; + + div.content { + min-height: 500px; + overflow: auto; + height: 100%; + padding: 16px; + + div.meter-list, + div.charts { + display: flex; + flex-direction: column; + + h2.headline { + font-size: 26px; + } + + div.divider { + display: flex; + flex-direction: row; + + div { + flex: 1; + } + } + } + } +} diff --git a/rossa-tech-cli/tsconfig.json b/rossa-tech-cli/tsconfig.json index caa410f..048a617 100644 --- a/rossa-tech-cli/tsconfig.json +++ b/rossa-tech-cli/tsconfig.json @@ -17,10 +17,7 @@ "importHelpers": true, "target": "ES2022", "module": "es2020", - "lib": [ - "es2020", - "dom" - ], + "lib": ["es2020", "dom"], "useDefineForClassFields": false }, "angularCompilerOptions": {