diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index f114c583b0b44ccb35562bff8765a28c82c5cbe2..d29e4fc09ce2c48717799779b875a1ab7838c4f6 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -22,6 +22,7 @@ import {Lev0Ver2Component} from "./module/components/lev0Ver2/lev0.component";
import {ProViewComponent} from "./module/components/pro-view/pro-view.component";
import {HomeTailwindcssComponent} from "./module/pages/home-tailwindcss/home-tailwindcss.component";
import {LoginTailwindcssComponent} from "./module/pages/login-tailwindcss/login-tailwindcss.component";
+import {Lev0Ver3Component} from "./module/components/lev0-ver3/lev0-ver3.component";
const routes: Routes = [
{path: '', redirectTo: 'login', pathMatch: 'full'},
@@ -34,7 +35,8 @@ const routes: Routes = [
children: [
{ path: '', component: Lev0Ver2Component, outlet: 'homeDash' },
{ path: 'chart', component: ProViewComponent, outlet: 'homeDash' },
- { path: 'dayData', component: Lev0Ver2Component, outlet: 'homeDash' }
+ { path: 'dayData', component: Lev0Ver2Component, outlet: 'homeDash' },
+ { path: 'dayDataList', component: Lev0Ver3Component, outlet: 'homeDash' }
]
},
{path: 'signup', component: SignupComponent},
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 545b76535576f1de17fc864eca332340e4c1125a..7890aed65995c4dedb1001e801b788456c944815 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -26,6 +26,7 @@
-->
+
<router-outlet name="main"></router-outlet>
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 7c24c8a134d55ef52e76a42da0bf90106dbb86a5..bc8cbcabe57d23b4e284c90a8ecf9aacc8581a63 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -50,6 +50,7 @@ import { MobileHomeComponent } from './module/pages/mobile-home/mobile-home.comp
import {FontAwesomeModule} from "@fortawesome/angular-fontawesome";
import { SliderComponent } from './module/components/slider/slider.component';
import {MatSliderModule} from "@angular/material/slider";
+import {MatCardModule} from "@angular/material/card";
@NgModule({
declarations: [
@@ -84,26 +85,27 @@ import {MatSliderModule} from "@angular/material/slider";
SliderComponent
],
- imports: [
- BrowserModule,
- AppRoutingModule,
- ReactiveFormsModule,
- HttpClientModule,
- FormsModule,
- BrowserAnimationsModule,
- MatIconModule,
- MatFormFieldModule,
- MatSelectModule,
- MatDatepickerModule,
- MatInputModule,
- MatNativeDateModule,
- MatAutocompleteModule,
- MatCheckboxModule,
- ApiModule,
- MatButtonModule,
- FontAwesomeModule,
- MatSliderModule,
- ],
+ imports: [
+ BrowserModule,
+ AppRoutingModule,
+ ReactiveFormsModule,
+ HttpClientModule,
+ FormsModule,
+ BrowserAnimationsModule,
+ MatIconModule,
+ MatFormFieldModule,
+ MatSelectModule,
+ MatDatepickerModule,
+ MatInputModule,
+ MatNativeDateModule,
+ MatAutocompleteModule,
+ MatCheckboxModule,
+ ApiModule,
+ MatButtonModule,
+ FontAwesomeModule,
+ MatSliderModule,
+ MatCardModule,
+ ],
providers: [EventEmitterService,{provide:HTTP_INTERCEPTORS,useClass:InterceptorService,multi:true},ServerControllerService],
bootstrap: [AppComponent],
})
diff --git a/src/app/module/components/lev0-ver3/lev0-ver3.component.html b/src/app/module/components/lev0-ver3/lev0-ver3.component.html
index 4a3aa1f9dce5e04c86ca8b99ad58d48d63ead525..b9fcd31d31cc42bcfb189f525d8ec39e8eb3127d 100644
--- a/src/app/module/components/lev0-ver3/lev0-ver3.component.html
+++ b/src/app/module/components/lev0-ver3/lev0-ver3.component.html
@@ -1,44 +1,181 @@
+<div class="w-full bg-gray-100 flex flex-col">
+ <div class="flex min-h-min w-full ">
+ <div class="flex min-h-full w-1/2 justify-start pl-8 pt-3">
+ <div class="flex items-center pl-2 rounded h-14 border border-indigo-600">
+ Tages Sensor Wertee
+ <button (click)="sendSignal1(1)" type="button" class="ml-8 h-full px-4 inline-flex justify-center items-center gap-2 rounded-md border-2 border-indigo-200 font-semibold text-indigo-500 hover:text-white hover:bg-indigo-500 hover:border-indigo-500 focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800">
+ <mat-icon >grid_view</mat-icon>
+ </button>
+ <button (click)="sendSignal1(2)" type="button" class="h-full px-4 inline-flex justify-center items-center gap-2 rounded-md border-2 border-indigo-200 font-semibold text-indigo-500 hover:text-white hover:bg-indigo-500 hover:border-indigo-500 focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800">
+ <mat-icon>table_rows</mat-icon>
+ </button>
+ </div>
+ </div>
+ <div class="flex justify-center w-1/2 pt-3 items-center">
+
+ <mat-form-field appearance="outline" class="mx-5">
+ <mat-select placeholder="Station" [formControl]="stationControl" >
+ <mat-option *ngFor="let topping of availableStation" [value]="topping" >{{topping}} </mat-option>
+ </mat-select>
+ </mat-form-field>
+
+ <mat-form-field appearance="outline" class="mr-2">
+ <mat-label>Wähle ein Datum</mat-label>
+ <input matInput [matDatepicker]="picker" [formControl]="dateControl">
+ <mat-hint>MM/DD/YYYY</mat-hint>
+ <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
+ <mat-datepicker #picker></mat-datepicker>
+ </mat-form-field>
+ </div>
+ </div>
-<!--
-<div class="flex w-full min-h-min ">
+<main class="grid mt-2 gap-y-14 gap-x-8 grid-cols-2 grid-auto-rows-min">
- <div class="min-h-full w-10 flex justify-end items-center">
- <button (click)="scrollLeft()">
- <mat-icon>arrow_back_ios</mat-icon>
- </button>
- </div>
+ <section class="col-span-2 flex w-full min-h-min ">
+
+
+ <div class="min-h-full w-10 flex justify-end items-center">
+ <button (click)="scrollLeft()">
+ <mat-icon>arrow_back_ios</mat-icon>
+ </button>
+ </div>
- <div #scrollContainer class="flex w-full overflow-x-auto scrollbar-hide bg-gray-400 rounded-xl items-center
- [&>*]:m-4 [&>*]:flex-shrink-0
+ <div class="flex flex-col w-full bg-white/30 shadow-xl ease-in duration-300
+ shadow-cyan-200/50 hover:shadow-cyan-400/50 rounded-xl">
+ <div class="flex items-center text-sm text-slate-400 py-2 pl-8 border-gray-200 border-b-[1px] ">
+ Summe oder Durchschnits eines Sensor/<div class="flex rounded bg-gray-200">Gruppe</div>...
+ </div>
+ <div #scrollContainer class="flex w-full overflow-x-auto scrollbar-hide items-center
+ [&>*]:mx-4 [&>*]:flex-shrink-0
[&>*]:rounded ">
- <div class="h-full flex items-center" *ngFor="let x of num_t">
- <div class="flex-col flex items-center justify-center py-4 [&>*]:m-0.5">
- <h1 class="text-xs font-bold">Solar Radiation</h1>
- <mat-icon>sunny</mat-icon>
- <div class="display-flex">
- <h1 class="text-xm font-bold mr-0.5"> 22</h1>
- <h3 class="text-xs font-bold"> w/m<sup>2</sup></h3>
+ <div class="h-full flex items-center my-4" *ngFor="let sumAvg of sumOrAvg">
+ <div [ngClass]="{'bg-gray-200 rounded-xl':sumAvg.isSensorGroup}" class="flex-col flex items-center justify-center [&>*]:m-1">
+ <h3 class="text-green-400 text-xs font-bold">
+ {{typeMapper.get( sumAvg.type+"")}}
+ </h3>
+ <h1 class="text-xs font-bold pb-1">{{sumAvg.name}}</h1>
+ <mat-icon >{{iconMapper.get(sumAvg.measurementType+"")}}</mat-icon>
+ <div class="display-flex pt-1">
+ <h1 class="text-xm font-bold mr-0.5"> {{sumAvg.value?.toFixed(3)}}{{" "}}</h1>
+ <h3 class="text-xs font-bold" *ngIf="sumAvg.measurementType?.toString()=='SOLAR_RADIATION' "> w/m<sup>2</sup></h3>
+ <h3 class="text-xs font-bold" *ngIf="sumAvg.measurementType?.toString()!='SOLAR_RADIATION' ">
+ {{" "+unitMapper.get(sumAvg.measurementType+"")}}
+ </h3>
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </div>
+
+
+ <div class="min-h-full w-10 flex justify-start items-center">
+ <button (click)="scrollRight()">
+ <mat-icon>arrow_forward_ios</mat-icon>
+ </button>
+ </div>
+ </section>
+
+
+ <section class="col-span-1 w-full flex flex-col pl-10 ">
+ <div class="-m-1.5 overflow-x-auto bg-white/30 rounded-3xl
+ shadow-xl shadow-blue-200/50 hover:shadow-blue-400/50 ease-in duration-300">
+ <div class="p-1.5 min-w-full inline-block align-middle">
+ <div class="overflow-hidden">
+ <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
+ <thead>
+ <tr>
+ <td colspan="3" class="text-sm text-slate-400 p-2">Minimum Maximum und Mittelwert eines Sensor/Gruppe...</td>
+ </tr>
+
+ </thead>
+ <tbody class="divide-y divide-gray-200 dark:divide-gray-700" *ngFor="let sumAvg of sumOrAvg">
+ <tr [ngClass]="{'bg-gray-200':sumAvg.isSensorGroup}">
+ <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-200">
+ <h1 class="text-xs font-bold">{{sumAvg.name}}</h1>
+ </td>
+ <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-gray-200">
+ <i class="material-icons" style="color: black">{{iconMapper.get(sumAvg.measurementType+"")}}</i>
+ </td>
+
+ <td class="px-6 py-4 w-full whitespace-nowrap text-sm text-gray-800 dark:text-gray-200">
+ <app-slider class="w-full -translate-y-2"></app-slider>
+ </td>
+
+ </tr>
+
+ </table>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ <section class="col-span-1 w-full flex flex-col w-1/3 pr-10">
+ <div class="-m-1.5 overflow-x-auto scrollbar-hide rounded-3xl bg-white/30
+ shadow-xl shadow-indigo-200/50 hover:shadow-indigo-400/50 ease-in duration-300">
+ <div class="p-1.5 min-w-full inline-block align-middle">
+ <div class="overflow-hidden">
+ <table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
+ <thead>
+ <tr>
+ <th scope="col" class="px-3 py-3 text-left text-xs font-medium text-gray-500 uppercase">
+ <div class="text-xs text-slate-400">
+ DendrometerSensor/Gruppe...
</div>
- </div>
+ </th>
+ <th scope="col" class="px-3 py-3 text-left text-xs font-medium text-gray-500 uppercase">
+ <div class="flex mx-2 flex items-center border-black ">
+ <i class="material-icons text-blue-500 text-2xl mr-2">unfold_less</i>
+ <h5 class="text-gray-500 text-xs">Maximum daily shrinkage</h5>
+ </div>
+ </th>
+ <th scope="col" class="px-3 py-3 text-left text-xs font-medium text-gray-500 uppercase">
+ <div class="flex mx-2 flex items-center border-black ">
+ <i class="material-icons text-yellow-500 text-2xl mr-2">vertical_align_top</i>
+ <h5 class="text-gray-500 text-xs">Radius increment</h5>
+ </div>
+ </th>
+ </tr>
- <div class="h-3/5 bg-dark w-0.5 ml-2"></div>
- </div>
- </div>
+ </thead>
+ <tbody class="divide-y divide-gray-200 dark:divide-gray-700" *ngFor="let dent of dentrometerDailyValue">
+
+ <tr [ngClass]="{'bg-gray-200':dent.isSensorGroup}">
+ <td class="px-3 py-4 whitespace-nowrap text-sm font-medium text-gray-800 dark:text-gray-200">
+ <h1 class="flex font-bold text-4sm justify-center">{{dent.name}} 🌲</h1>
+ </td>
+ <td class="px-3 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-gray-200">
+ <div class="flex items-end justify-center">
+ <h1 class=" flex justify-center text-xl font-bold">{{dent.mds?.value?.toFixed(2)}}</h1>
+ <h3 class="mb-1 ml-1 text-slate-400">mm </h3>
+ </div>
+ </td>
+ <td class="px-3 py-4 whitespace-nowrap text-sm text-gray-800 dark:text-gray-200">
+ <div class="flex items-end justify-center">
+ <h1 class=" flex justify-center text-xl font-bold">{{dent.deltaR?.value?.toFixed(2)}}</h1>
+ <h3 class="mb-1 ml-1 text-slate-400">mm </h3>
+ </div>
+ </td>
+ </tr>
+
+ </table>
+ </div>
+ </div>
+ </div>
+ </section>
- <div class="min-h-full w-10 flex justify-start items-center">
- <button (click)="scrollRight()">
- <mat-icon>arrow_forward_ios</mat-icon>
- </button>
- </div>
-</div>
+</main>
-<div class="bg-violet-500"> </div>
+</div>
+
+<!--
+<div class="bg-white"> </div>
<div class="flex w-1/2 rounded-xl bg-violet-300 flex-col divide-y divide-slate-800 [&>*]:py-4 ">
<div class=" flex items-center [&>*]:mx-2">
<h1 class="text-xs font-bold">Solar Radiation</h1>
@@ -58,53 +195,11 @@
<mat-icon>sunny</mat-icon>
<app-slider class="w-32 -translate-y-2"></app-slider>
</div>
-
-
-</div>
-
-
-
-<div class="flex w-2/3 p-2 divide-y divide-slate-800 bg-white justify-center items-end rounded"
- *ngFor="let dent of dentrometerDailyValue"
- [ngStyle]="{'box-shadow':dent.isSensorGroup ? '15px 15px rgb(173,216,230,0.4) ,30px 30px rgb(173,216,230,0.2)':''}">
-
- <h1 class="flex font-bold text-4sm mb-6 justify-center">{{dent.name}}</h1>
-
- <div class="mx-8 flex justify-between">
-
- <div class="flex-col content-center items-center justify-center">
- <div class="flex mx-2 flex items-center border-b-2 border-black ">
- <i class="material-icons text-blue-500 text-2xl mr-2">unfold_less</i>
- <h5 class="text-gray-500 text-xs">Maximum daily shrinkage</h5>
- </div>
- <div class="flex items-end justify-center">
- <h1 class=" flex justify-center text-3xl font-bold">{{dent.mds?.value?.toFixed(2)}}</h1>
- <h3 class="mb-1 ml-1 text-slate-400">mm </h3>
- </div>
- </div>
-
- <div class="flex-col">
- <div class="flex mx-2 flex items-center border-b-2 border-black ">
- <i class="material-icons text-yellow-500 text-2xl mr-2">vertical_align_top</i>
- <h5 class="text-gray-500 text-xs">Radius increment</h5>
- </div>
- <div class="flex items-end justify-center">
- <h1 class=" flex justify-center text-3xl font-bold">{{dent.deltaR?.value?.toFixed(2)}}</h1>
- <h3 class="mb-1 ml-1 text-slate-400">mm </h3>
- </div>
- </div>
-
- </div>
</div>
-->
-
-
-
-
-
<!--
<div class="w-full bg-gray-100 flex flex-col">
@@ -233,6 +328,13 @@
-->
+
+
+
+
+
+
+<!--
<div class="w-full flex flex-row items-end justify-start flex-wrap">
<div *ngFor="let avgMMax of avgMinMax;let iX=index;">
<div class="card-group" [ngStyle]="{'box-shadow':avgMMax.isSensorGroup ? '15px 15px rgb(173,216,230,0.4) ,30px 30px rgb(173,216,230,0.2)':''}">
@@ -272,5 +374,5 @@
</div>
</div>
</div>
-
+-->
diff --git a/src/app/module/components/lev0-ver3/lev0-ver3.component.ts b/src/app/module/components/lev0-ver3/lev0-ver3.component.ts
index ede6b5baafddc8007fddc74be2d70cd878f9a167..b4afdd10c010cd1651b9c31efe9eda197cb53803 100644
--- a/src/app/module/components/lev0-ver3/lev0-ver3.component.ts
+++ b/src/app/module/components/lev0-ver3/lev0-ver3.component.ts
@@ -16,6 +16,7 @@ import {
import {Lv1} from "../../../core/service/level1/Lv1";
import {map, startWith} from "rxjs/operators";
import { StationControllerService } from 'projects/swagger-client/src';
+import {SharedService} from "../../../shared/shared-service.service";
@@ -30,7 +31,8 @@ export class Lev0Ver3Component {
constructor(private api:ApiService,
private serverControllerService:ServerControllerService,
- private stationControllerService: StationControllerService
+ private stationControllerService: StationControllerService,
+ private sharedService: SharedService,
) {
this.dateControl.valueChanges.subscribe(date => {
this.reload()
@@ -138,5 +140,9 @@ export class Lev0Ver3Component {
faChevronRight = faChevronRight;
faLongArrowAltUp = faLongArrowAltUp;
faLongArrowAltDown = faLongArrowAltDown;
+
+ sendSignal1(number: number) {
+ this.sharedService.setNumber(number);
+ }
}
diff --git a/src/app/module/components/lev0Ver2/lev0.component.html b/src/app/module/components/lev0Ver2/lev0.component.html
index 4985c12aab9ce92a8cb09ec05f64d7766b861ba4..69bc0c649dbf71778e1c9d4b7294a23aac3535e8 100644
--- a/src/app/module/components/lev0Ver2/lev0.component.html
+++ b/src/app/module/components/lev0Ver2/lev0.component.html
@@ -1,4 +1,4 @@
-<div class="w-full bg-gray-100 flex flex-col">
+<!--<div class="w-full bg-gray-100 flex flex-col">
<div class="w-full flex flex-row items-end justify-start flex-wrap ">
<div class="header">
@@ -50,9 +50,67 @@
</div>
+ -->
+
+<div class="w-full bg-gray-100 flex flex-col">
+
+ <div class="flex min-h-min w-full ">
+ <div class="flex min-h-full w-1/2 justify-start pl-8 pt-3">
+ <div class="flex items-center pl-2 rounded h-14 border border-indigo-600">
+ Tages Sensor Wertee
+ <button (click)="sendSignal1(1)" type="button" class="ml-8 h-full px-4 inline-flex justify-center items-center gap-2 rounded-md border-2 border-indigo-200 font-semibold text-indigo-500 hover:text-white hover:bg-indigo-500 hover:border-indigo-500 focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800">
+ <mat-icon >grid_view</mat-icon>
+ </button>
+ <button (click)="sendSignal1(2)" type="button" class="h-full px-4 inline-flex justify-center items-center gap-2 rounded-md border-2 border-indigo-200 font-semibold text-indigo-500 hover:text-white hover:bg-indigo-500 hover:border-indigo-500 focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800">
+ <mat-icon>table_rows</mat-icon>
+ </button>
+ </div>
+ </div>
+
+ <div class="flex justify-center w-1/2 pt-3 items-center">
+
+ <mat-form-field appearance="outline" class="mx-5">
+ <mat-select placeholder="Station" [formControl]="stationControl" >
+ <mat-option *ngFor="let topping of availableStation" [value]="topping" >{{topping}} </mat-option>
+ </mat-select>
+ </mat-form-field>
+
+ <mat-form-field appearance="outline" class="mr-2">
+ <mat-label>Wähle ein Datum</mat-label>
+ <input matInput [matDatepicker]="picker" [formControl]="dateControl">
+ <mat-hint>MM/DD/YYYY</mat-hint>
+ <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
+ <mat-datepicker #picker></mat-datepicker>
+ </mat-form-field>
+ </div>
+ </div>
+ <div class="w-full flex flex-row items-end justify-start flex-wrap">
+
+ <div *ngFor="let sumAvg of sumOrAvg" >
+ <div class="card-b">
+ <div class="header-left">
+ <h5>{{sumAvg.name}}</h5>
+ <h2 *ngIf="sumAvg.measurementType?.toString()=='SOLAR_RADIATION' ">
+ {{sumAvg.value?.toFixed(3)}}{{" "}}w/m<sup>2</sup>
+ </h2>
+ <h2 *ngIf="sumAvg.measurementType?.toString()!='SOLAR_RADIATION' ">
+ {{sumAvg.value?.toFixed(3)}}{{" "+unitMapper.get(sumAvg.measurementType+"")}}
+ </h2>
+ <div><h4>{{typeMapper.get( sumAvg.type+"")}}</h4></div>
+ </div>
+ <div class="header-right">
+ <i class="material-icons" style="font-size:80px;color: black">{{iconMapper.get(sumAvg.measurementType+"")}}</i>
+ </div>
+
+ </div>
+ </div>
+
+
+
+ </div>
<div class="w-full flex flex-row items-end justify-start flex-wrap">
diff --git a/src/app/module/components/lev0Ver2/lev0.component.ts b/src/app/module/components/lev0Ver2/lev0.component.ts
index 8046d35489d670bf96f7eb1cfb1931c3d21cd2b0..428ac0ce2f330ac51a5c9fb21d3dedad34048e08 100644
--- a/src/app/module/components/lev0Ver2/lev0.component.ts
+++ b/src/app/module/components/lev0Ver2/lev0.component.ts
@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import {Component, EventEmitter, Output} from '@angular/core';
import {ApiService} from "../../../shared/api.service";
@@ -16,6 +16,8 @@ import {
import {Lv1} from "../../../core/service/level1/Lv1";
import {map, startWith} from "rxjs/operators";
import { StationControllerService } from 'projects/swagger-client/src';
+import {Router} from "@angular/router";
+import {SharedService} from "../../../shared/shared-service.service";
@@ -26,10 +28,15 @@ import { StationControllerService } from 'projects/swagger-client/src';
styleUrls: ['./lev0.component.scss']
})
export class Lev0Ver2Component {
+
+
+
dentrometerDailyValue:DendrometerDailyValue[]=[]
constructor(private api:ApiService,
+ private router: Router,
private serverControllerService:ServerControllerService,
+ private sharedService: SharedService,
private stationControllerService: StationControllerService
) {
this.dateControl.valueChanges.subscribe(date => {
@@ -115,5 +122,16 @@ export class Lev0Ver2Component {
}
)
}
+
+ goToAdmin() {
+ console.log("go to admin")
+ this.router.navigate(['/admin(main:homeDash/(homeDash:dayData))']);
+ // @ts-ignore
+ this.router.navigate(['/dayData']);
+ }
+
+ sendSignal1(number: number) {
+ this.sharedService.setNumber(number);
+ }
}
diff --git a/src/app/module/pages/home-tailwindcss/home-tailwindcss.component.html b/src/app/module/pages/home-tailwindcss/home-tailwindcss.component.html
index dee7260f7236e30396d266845979b5a8193ae3f2..f5bcb5761a3a8b8ff788be00b069e31395e832b7 100644
--- a/src/app/module/pages/home-tailwindcss/home-tailwindcss.component.html
+++ b/src/app/module/pages/home-tailwindcss/home-tailwindcss.component.html
@@ -23,9 +23,16 @@
</div>
-->
-<div class="grid gap-8 pl-3 min-h-screen max-h-screen w-full grid-cols-[50px_1fr] grid-rows-[50px_1fr;]">
+<div class="grid gap-8 pl-3 min-h-screen max-h-screen w-full grid-cols-[50px_1fr] grid-rows-[50px_1fr;] relative">
+<!--
+ <div class="absolute top-4 left-1/2">
+ <button type="button" class="py-2 px-4 inline-flex justify-center items-center gap-2 rounded-md border-2 border-blue-200 font-semibold text-blue-500 hover:text-white hover:bg-blue-500 hover:border-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-200 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800">
+ Button
+ </button>
+</div>
+-->
<div class="col-start-1 col-end-2 row-start-1 row-end-3 bg-white rounded-l shadow-xl my-3">
<nav class="h-full w-full flex flex-col items-center [&>*]:m-4">
<a routerLink="/data" class="w-5 h-5 rounded-full">
@@ -49,15 +56,22 @@
</a>
-->
<a class="w-5 h-5 ">
- <button [routerLink]='[{ outlets: { homeDash: ["dayData"] } }]'>
+ <button #buttonRef [routerLink]='[{ outlets: { homeDash: ["dayData"] } }]'>
<mat-icon >insert_chart</mat-icon>
</button>
</a>
+
<a class="w-5 h-5 ">
<button [routerLink]='[{ outlets: { homeDash: ["chart"] } }]'>
<mat-icon >query_stats</mat-icon>
</button>
</a>
+
+ <a class="hidden">
+ <button #buttonRef2 [routerLink]='[{ outlets: { homeDash: ["dayDataList"] } }]'>
+ <mat-icon >insert_chart</mat-icon>
+ </button>
+ </a>
</nav>
</div>
@@ -79,8 +93,9 @@
-->
<div class="sm:col-start-2 sm:col-end-3 sm:row-start-1 sm:row-end-3
col-start-1 col-end-3 row-start-1 row-end-2 overflow-y-auto h-full scrollbar-hide rounded-l ">
- <router-outlet name="homeDash"></router-outlet>
+ <router-outlet name="homeDash" ></router-outlet>
</div>
</div>
+
diff --git a/src/app/module/pages/home-tailwindcss/home-tailwindcss.component.ts b/src/app/module/pages/home-tailwindcss/home-tailwindcss.component.ts
index adf3b4d7f69e4525e64da0ddd48a786cf4d46816..a03e7c85fc4f2dc001a1751f2eedd42344b7b2f7 100644
--- a/src/app/module/pages/home-tailwindcss/home-tailwindcss.component.ts
+++ b/src/app/module/pages/home-tailwindcss/home-tailwindcss.component.ts
@@ -1,4 +1,6 @@
-import { Component } from '@angular/core';
+import {Component, ElementRef, ViewChild} from '@angular/core';
+import {SharedService} from "../../../shared/shared-service.service";
+import {Router} from "@angular/router";
@Component({
selector: 'app-home-tailwindcss',
@@ -7,4 +9,29 @@ import { Component } from '@angular/core';
})
export class HomeTailwindcssComponent {
+ // @ts-ignore
+ @ViewChild('buttonRef') buttonRef: ElementRef;
+ // @ts-ignore
+ @ViewChild('buttonRef2') buttonRef2: ElementRef;
+
+ number = 0;
+
+ constructor(private sharedService: SharedService,
+ private router: Router) {}
+
+ ngOnInit() {
+ this.sharedService.number$.subscribe(number => {
+ this.number = number;
+ this.onNumberChange();
+ });
+ }
+
+ onNumberChange() {
+ // Do something with the updated number
+ console.log(`Number changed to ${this.number}`);
+ if (this.number == 1)
+ this.buttonRef.nativeElement.click();
+ if (this.number == 2)
+ this.buttonRef2.nativeElement.click();
+ }
}