Adding LV1 first design of the sumOrAvg

src/app/app.component.html

@@ -24,8 +24,6 @@
   </div>
 </nav>
 -->
-
-<app-home></app-home>
-
+<app-lev0></app-lev0>
 
 

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,

src/app/core/service/level1/AvgMinMax.ts

+import {Limit} from "./Limit";
+
+export interface AvgMinMax{
+  "name": String,
+  "min": Limit,
+  "max": Limit,
+  "avg": 0,
+  "sensorType": String,
+  "isSensorGroup": boolean
+}

src/app/core/service/level1/Limit.ts

+export interface Limit{
+  "value":String,
+  "timestamp":String
+}

src/app/core/service/level1/Lv1.ts

+import {SumOrAvg} from "./SumOrAvg";
+import {AvgMinMax} from "./AvgMinMax";
+
+export interface Lv1{
+  "sumOrAvg":SumOrAvg[],
+  "avgMinMax":AvgMinMax[]
+}

src/app/core/service/level1/SumOrAvg.ts

+export interface SumOrAvg{
+  "type": String,
+  "name": String,
+  "value": Number,
+  "sensorType": String,
+  "isSensorGroup": boolean
+}

src/app/module/components/charts/light-chart/light-chart.component.html

+<div class="chart">
+  <canvas id="linechart" width="100%"></canvas>
+</div>

src/app/module/components/charts/light-chart/light-chart.component.scss

+.chart{
+  margin: 50px;
+  height: 300px;
+  width: 400px;
+}

src/app/module/components/charts/light-chart/light-chart.component.spec.ts

+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();
+  });
+});

src/app/module/components/charts/light-chart/light-chart.component.ts

+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)
+  }
+
+
+}

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('');

src/assets/Icon-awesome-cloud-rain.svg

+<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>