From 0785ae0d1149dc8a19a8e32d50c49cdea77a817a Mon Sep 17 00:00:00 2001
From: csba1652 <Bilal.Hassan@student.uibk.ac.at>
Date: Mon, 16 Jan 2023 20:59:20 +0100
Subject: [PATCH] Adding LV1 first design of the sumOrAvg
---
src/app/app.component.html | 4 +-
src/app/app.module.ts | 6 +-
src/app/core/service/level1/AvgMinMax.ts | 10 ++
src/app/core/service/level1/Limit.ts | 4 +
src/app/core/service/level1/Lv1.ts | 7 ++
src/app/core/service/level1/SumOrAvg.ts | 7 ++
.../light-chart/light-chart.component.html | 3 +
.../light-chart/light-chart.component.scss | 5 +
.../light-chart/light-chart.component.spec.ts | 23 ++++
.../light-chart/light-chart.component.ts | 98 ++++++++++++++++++
src/app/module/pages/login/login.component.ts | 12 +++
src/assets/Icon-awesome-cloud-rain.png | Bin 0 -> 1526 bytes
src/assets/Icon-awesome-cloud-rain.svg | 3 +
13 files changed, 178 insertions(+), 4 deletions(-)
create mode 100644 src/app/core/service/level1/AvgMinMax.ts
create mode 100644 src/app/core/service/level1/Limit.ts
create mode 100644 src/app/core/service/level1/Lv1.ts
create mode 100644 src/app/core/service/level1/SumOrAvg.ts
create mode 100644 src/app/module/components/charts/light-chart/light-chart.component.html
create mode 100644 src/app/module/components/charts/light-chart/light-chart.component.scss
create mode 100644 src/app/module/components/charts/light-chart/light-chart.component.spec.ts
create mode 100644 src/app/module/components/charts/light-chart/light-chart.component.ts
create mode 100644 src/assets/Icon-awesome-cloud-rain.png
create mode 100644 src/assets/Icon-awesome-cloud-rain.svg
diff --git a/src/app/app.component.html b/src/app/app.component.html
index cda1dc1..b66bc67 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -24,8 +24,6 @@
</div>
</nav>
-->
-
-<app-home></app-home>
-
+<app-lev0></app-lev0>
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 36e9d2b..cc41dd0 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -5,7 +5,7 @@ import {AppRoutingModule} from './app-routing.module';
import {AppComponent} from './app.component';
import {AdminDashboardComponent} from './module/pages/admin-dashboard/admin-dashboard.component';
import {FormsModule, ReactiveFormsModule} from "@angular/forms";
-import {MatFormFieldModule, MatLabel} from '@angular/material/form-field';
+import {MatFormFieldModule} from '@angular/material/form-field';
import {HttpClientModule} from "@angular/common/http";
import { LoginComponent } from './module/pages/login/login.component';
import { SignupComponent } from './module/pages/signup/signup.component';
@@ -30,6 +30,8 @@ import { DataHeaderComponent } from './module/components/header/data-header/data
import { ConfigHeaderComponent } from './module/components/header/config-header/config-header.component';
import { ComingSoonComponent } from './module/components/coming-soon/coming-soon.component';
import { CoomingSoonHeaderComponent } from './module/components/cooming-soon-header/cooming-soon-header.component';
+import { Lev0Component } from './module/components/lev0/lev0.component';
+import { LightChartComponent } from './module/components/charts/light-chart/light-chart.component';
@@ -52,6 +54,8 @@ import { CoomingSoonHeaderComponent } from './module/components/cooming-soon-hea
ConfigHeaderComponent,
ComingSoonComponent,
CoomingSoonHeaderComponent,
+ Lev0Component,
+ LightChartComponent,
],
imports: [
BrowserModule,
diff --git a/src/app/core/service/level1/AvgMinMax.ts b/src/app/core/service/level1/AvgMinMax.ts
new file mode 100644
index 0000000..83817cd
--- /dev/null
+++ b/src/app/core/service/level1/AvgMinMax.ts
@@ -0,0 +1,10 @@
+import {Limit} from "./Limit";
+
+export interface AvgMinMax{
+ "name": String,
+ "min": Limit,
+ "max": Limit,
+ "avg": 0,
+ "sensorType": String,
+ "isSensorGroup": boolean
+}
diff --git a/src/app/core/service/level1/Limit.ts b/src/app/core/service/level1/Limit.ts
new file mode 100644
index 0000000..7876887
--- /dev/null
+++ b/src/app/core/service/level1/Limit.ts
@@ -0,0 +1,4 @@
+export interface Limit{
+ "value":String,
+ "timestamp":String
+}
diff --git a/src/app/core/service/level1/Lv1.ts b/src/app/core/service/level1/Lv1.ts
new file mode 100644
index 0000000..e5e07ec
--- /dev/null
+++ b/src/app/core/service/level1/Lv1.ts
@@ -0,0 +1,7 @@
+import {SumOrAvg} from "./SumOrAvg";
+import {AvgMinMax} from "./AvgMinMax";
+
+export interface Lv1{
+ "sumOrAvg":SumOrAvg[],
+ "avgMinMax":AvgMinMax[]
+}
diff --git a/src/app/core/service/level1/SumOrAvg.ts b/src/app/core/service/level1/SumOrAvg.ts
new file mode 100644
index 0000000..01efe61
--- /dev/null
+++ b/src/app/core/service/level1/SumOrAvg.ts
@@ -0,0 +1,7 @@
+export interface SumOrAvg{
+ "type": String,
+ "name": String,
+ "value": Number,
+ "sensorType": String,
+ "isSensorGroup": boolean
+}
diff --git a/src/app/module/components/charts/light-chart/light-chart.component.html b/src/app/module/components/charts/light-chart/light-chart.component.html
new file mode 100644
index 0000000..21fea0d
--- /dev/null
+++ b/src/app/module/components/charts/light-chart/light-chart.component.html
@@ -0,0 +1,3 @@
+<div class="chart">
+ <canvas id="linechart" width="100%"></canvas>
+</div>
diff --git a/src/app/module/components/charts/light-chart/light-chart.component.scss b/src/app/module/components/charts/light-chart/light-chart.component.scss
new file mode 100644
index 0000000..5b4203f
--- /dev/null
+++ b/src/app/module/components/charts/light-chart/light-chart.component.scss
@@ -0,0 +1,5 @@
+.chart{
+ margin: 50px;
+ height: 300px;
+ width: 400px;
+}
diff --git a/src/app/module/components/charts/light-chart/light-chart.component.spec.ts b/src/app/module/components/charts/light-chart/light-chart.component.spec.ts
new file mode 100644
index 0000000..35d9d87
--- /dev/null
+++ b/src/app/module/components/charts/light-chart/light-chart.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LightChartComponent } from './light-chart.component';
+
+describe('LightChartComponent', () => {
+ let component: LightChartComponent;
+ let fixture: ComponentFixture<LightChartComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ LightChartComponent ]
+ })
+ .compileComponents();
+
+ fixture = TestBed.createComponent(LightChartComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/module/components/charts/light-chart/light-chart.component.ts b/src/app/module/components/charts/light-chart/light-chart.component.ts
new file mode 100644
index 0000000..037db68
--- /dev/null
+++ b/src/app/module/components/charts/light-chart/light-chart.component.ts
@@ -0,0 +1,98 @@
+import {Component, OnInit} from '@angular/core';
+import {Chart} from "chart.js/auto";
+
+@Component({
+ selector: 'app-light-chart',
+ templateUrl: './light-chart.component.html',
+ styleUrls: ['./light-chart.component.scss']
+})
+export class LightChartComponent implements OnInit{
+ labels:any=["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]
+ labelsTime:any=["0:00", "1:00", "2:00","3:00", "4:00", "5:00","6:00", "7:00","8:00", "9:00", "10:00" ,"11:00","12:00",
+ "13:00", "14:00", "15:00","16:00", "17:00","18:00", "19:00", "20:00" ,"21:00","22:00","23:00"]
+
+ dataTima:any= [14, 15, 15, 15, 14, 16, 17,17,17,18,19,19,19,22,23,23,24,23,20,19,18,18,19,18]
+ dataTime2:any= [24, 25, 25, 25, 24, 26, 27,27,27,28,29,29,19,22,23,23,24,23,20,19,18,18,19,18]
+ dataConst:any= [14, 14, 14, 14, 14, 14, 14,14,14,14,14,14,14,14,14,14,14,14,14,14,14,14,14,14]
+ dataConstMax:any= [24, 24, 24, 24, 24, 24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24,24]
+ dataDay:any=[1400, 3000, 2500, 4500, 2500, 3400, 3000]
+//*************************lineChart-Trio*****************************
+ data:any ={
+ labels:this.labelsTime,
+ datasets: [ {
+ label: "Temperature-1",
+ data: this.dataTima,
+ fill:true,
+ // fillColor: '#d20f0f',
+ borderColor:"rgba(255, 10, 13, 0.8)",
+ backgroundColor: "rgba(255, 10, 13, 0.1)",
+ tension:0.2,
+
+ },
+ {
+ label: "Min",
+ data: this.dataConst,
+ fill:true,
+ // fillColor: '#d20f0f',
+ borderColor:"rgba(130,220,16,0.8)",
+ backgroundColor: "rgba(255, 10, 13, 0.0)",
+ tension:0.2,
+ radius:0,
+ hoverRadius:0,
+ },
+ {
+ label: "Max",
+ data: this.dataConstMax,
+ fill:true,
+ // fillColor: '#d20f0f',
+ borderColor:"rgba(220,16,16,0.8)",
+ backgroundColor: "rgba(255, 10, 13, 0.0)",
+ tension:0.2,
+ radius:0,
+ hoverRadius:0,
+ hitRadius:3
+ }
+ ]
+ }
+
+ linConfig:any={
+ type:'line',
+ data:this.data,
+ options:{
+
+ responsive:true,
+ radius:5,
+ hoverRadius:12,
+ hitRadius:30,
+ tooltips: {
+ mode: 'index',
+ intersect: true
+ },
+ plugins:{
+ legend: {
+ display: false
+ }
+ },
+
+ /* scales: {y: { title: { display: true, text: 'mm' }},
+
+ xAxes: {
+ title: {
+ display: true,
+ text: "test",
+ font: {
+ size: 15
+ }
+ }
+ }
+ }
+ */
+ }
+ }
+ linechart: any;
+ ngOnInit(): void {
+ this.linechart = new Chart('linechart', this.linConfig)
+ }
+
+
+}
diff --git a/src/app/module/pages/login/login.component.ts b/src/app/module/pages/login/login.component.ts
index 3196e5b..eedb9f2 100644
--- a/src/app/module/pages/login/login.component.ts
+++ b/src/app/module/pages/login/login.component.ts
@@ -3,6 +3,7 @@ import {Router} from "@angular/router";
import {FormBuilder, FormGroup} from "@angular/forms";
import {ApiService} from "../../../shared/api.service";
import {EventEmitterService} from "../../../shared/event.emitter.service";
+import {Lv1} from "../../../core/service/level1/Lv1";
@Component({
selector: 'app-login',
@@ -12,6 +13,7 @@ import {EventEmitterService} from "../../../shared/event.emitter.service";
export class LoginComponent {
formLogin!: FormGroup;
+ lv1:Lv1| undefined;
constructor(private fb: FormBuilder, private router: Router, private api: ApiService
, private eventEmitterService: EventEmitterService) {
@@ -23,6 +25,8 @@ export class LoginComponent {
login() {
this.api.post("http://localhost:8080/api/v1/auth/login", this.formLogin.value).subscribe((res: any) => {
+
+ console.log(res)
if (res && res.token) {
const role = res.roles[0];
localStorage.setItem('token', res.token);
@@ -35,6 +39,14 @@ export class LoginComponent {
}
this.formLogin.reset();
}
+ this.api.get("http://localhost:8080/api/v1/server/get/lvl1/IBK?from=15.04.2022 00:00:00&to=15.04.2022 23:30:00").subscribe(
+ res=>{
+ this.lv1=res
+ console.log(res)
+ console.log("avgMinMax",this.lv1?.avgMinMax[0].min.value)
+ console.log("sumOrAvg",this.lv1?.sumOrAvg[0].type)
+ }
+ )
}, err => {
alert("Wrong username or password. Try again!")
this.formLogin.controls['password'].setValue('');
diff --git a/src/assets/Icon-awesome-cloud-rain.png b/src/assets/Icon-awesome-cloud-rain.png
new file mode 100644
index 0000000000000000000000000000000000000000..9e9c84fc9e9c4ce79fedccd431c1397ccc671bc6
GIT binary patch
literal 1526
zcmV<S1qu3zP)<h;3K|Lk000e1NJLTq002w?002w~1^@s6$Cptn00004b3#c}2nYxW
zd<bNS000H8Nkl<ZcwX(Cjdjy75XWHxU;@kplnF>DpiDrR0GNPu0?GuW695wsCIBYD
zodB2s?q{svDz<fZRzjNS-qULuOQ*a4edyD<eQP`PMA)85sifSMa?*D5Q~rMKl#lY6
z?`{m;&L}D1yp}RI@C2+6QqHB+hIaq0Y7W5gpf^UK`V_usf!k}3n+h1A_NfiK99Ab>
zpSK~KgI{(YQvf6M@GLwmC*fhI2GB6tomPNv@^`Bq>IIC1{yry45w9`ODyhq$g2BRI
z(rsSLKjg)?Quv&eJb>j6!y$zL?Lp)*3@R@TUcHpMuX1{w2e2;#md$F(mKmP%v;~M<
z+2>KIeyt%s%FhZIVel>`Vdm!mhG%)e3Zi5K%>o$7{ktI?GUGOx9iTmuQcvMz0qlQx
z*A(6Q+J+E!^R)m*XN*oaotUz$yh>;RBOHHtJK3{#mm&|*;vy|zGvUrCbqGW*yXRFz
z3)r?Ns$TiM?c8Ch1#BUbF|;2F6~K&^WNybGW~Sm{M#!{)v3_G`;!tSoAvqVMcD*Fp
zg>e`$*@GiI*)FeBou)kOnJ~b+rmW*qGVIfHfMa)K5V#@0s@9`s`=redWw~g9+vu_n
zuwCtU?NEPLS9lxS<=1v_W5585{jNfP5g@;@!?C6=V1yxHv2HB%4}oRtY0WoXz*sBJ
z3R1lYtS7nwu(?z_#A!n=``5yV^M$pC?Q)+!mlC_?!vL_v!%CvpLC?hY48Rsr4rwPs
zr@pV&JpfxtdF*R{bgfPSjFX`1=v4P9{0hK+``R95tMdYw&F&3gO#dI++8u4}CL~MJ
z*W15I`fO#q(6>42n$5JLOk8z7z-7IYu$HXlpZmIYM_Y@X*o(6G*4h86jl`eb?VaLf
z!{9XwZyt96BbPB^h6}bj><_<Iv*-?L##_{Lc~JJn{y71OekNtTuitkFQb79)*alc}
zNOpsZ@Z{9wSVzuF(H+Oxps|Bo4nsJ^r5sCM`z*RHq^yQgbL!-qb^u4xqa4DO%@_-&
z3`EmX3hU}o(g4=SfRMfE$8msj?T|JF7SFwaX?P!GodTHAtOc+Fm=OVE_2OX#Fe3uS
z>Rt~Eb23)(xrylt_i0)5GC#^qGhxVl()9wW2e3*y<17<uHq|m~v=DybB%U`m%yXrL
zJmDPn+Af4v2M=H@mBNkcjSFYmjz{Ws50=;aP#O5b0`Ka+0%SIb2eA00{DBBjZ%Lut
z23d-nTyzd(Hi#9lx%3q8mkqA$9U%5y>N^!aD+jN*NhM!|R1%(HXbi3<D_}$SFmiZV
z94<i#zyh?X6nmG;%PfF(b5|^U4yDE}^_fE_5^%^ERAW%V;Htqz3mER4x-dLt#2hn*
zS*adZOx>_#ih&GC(gLQrFpPyfFQIFUfg;SwxSVUHg*4Dy7*yp-4PbNWP<t@q2~CYL
z0!Y@^_Sm=6zIRZ!1|JR06kyD{tv|h>vQ&$J#TYa}Da)v4F$Vn4rQnf+lmg7E5FJ@&
z(5c+gC%D$jEZ!CR!MjG^2TuV;-tg?>r}!dZ)q3xkLHnL*=Y4pJCU?bsj7CUGF^>lz
zfF>+wQqS{C1)rrIZBw+A3f)<Ks(yGrI@+fItA&f_Y;qp}TZ!zR+u@^mECraiQ_alZ
zlVk7#t%rF-ax_P#0AuUMdOPu|%}<&TAjw(}iM11C_Ut@A3OBlgkpirePU8h@3W(&;
z++kq#f?usMRLdBtYfUN10VM?(x>>xexz?CMwDX*K9$PrtJZUio-B`Q~V<0;q50VBj
z8ZV`!MjS#B0Rg~52)UAy3eBYT2RcoyQ)vcR$c`MNqy-En3n_Horx?ocOdBe(P?dav
zC-=?yP=>yF?j^vWeV->Yh#<Sl&=$aguyh{64uF{4)?Q7bb^r%|LKQ*@_~)Xo?C^xQ
c3aB8!ABgr1+%j@KumAu607*qoM6N<$f^6%~tN;K2
literal 0
HcmV?d00001
diff --git a/src/assets/Icon-awesome-cloud-rain.svg b/src/assets/Icon-awesome-cloud-rain.svg
new file mode 100644
index 0000000..73468dc
--- /dev/null
+++ b/src/assets/Icon-awesome-cloud-rain.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="75.557" height="75.557" viewBox="0 0 75.557 75.557">
+ <path id="Icon_awesome-cloud-rain" data-name="Icon awesome-cloud-rain" d="M61.39,18.889c-.089,0-.162.03-.236.03a11.524,11.524,0,0,0,.236-2.391A11.759,11.759,0,0,0,40.582,8.972,16.472,16.472,0,0,0,9.445,16.528a16.782,16.782,0,0,0,.31,3.129,14.131,14.131,0,0,0,4.412,27.567H61.39a14.167,14.167,0,0,0,0-28.334Zm-48.4,36.332c-1.889,6.552-5.9,8.323-5.9,12.942a7.241,7.241,0,0,0,7.083,7.393,7.241,7.241,0,0,0,7.083-7.393c0-4.634-4.014-6.36-5.9-12.942A1.218,1.218,0,0,0,12.986,55.222Zm23.612,0c-1.889,6.552-5.9,8.323-5.9,12.942a7.09,7.09,0,1,0,14.167,0c0-4.634-4.014-6.36-5.9-12.942A1.218,1.218,0,0,0,36.6,55.222Zm23.612,0c-1.889,6.552-5.9,8.323-5.9,12.942a7.09,7.09,0,1,0,14.167,0c0-4.634-4.014-6.36-5.9-12.942A1.218,1.218,0,0,0,60.21,55.222Z"/>
+</svg>
--
GitLab