From a7d1e64755b9931c0360bb02501d7aea78864e33 Mon Sep 17 00:00:00 2001
From: csba1652 <Bilal.Hassan@student.uibk.ac.at>
Date: Thu, 25 May 2023 15:44:22 +0100
Subject: [PATCH] -working on issue:9 Show a Text that asks a user to select a
station in the summary view
---
src/app/module/pages/home/home.component.html | 14 ++++++++------
.../list-icon/list-icon.component.html | 7 ++++---
.../pages/home/summary/summary.component.html | 13 +++++++++----
.../pages/home/summary/summary.component.ts | 19 +++++--------------
4 files changed, 26 insertions(+), 27 deletions(-)
diff --git a/src/app/module/pages/home/home.component.html b/src/app/module/pages/home/home.component.html
index 31cf8af..763b0fc 100644
--- a/src/app/module/pages/home/home.component.html
+++ b/src/app/module/pages/home/home.component.html
@@ -1,17 +1,19 @@
-<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="grid gap-8 sm:pl-3 min-h-screen max-h-screen w-full sm:grid-cols-[50px_1fr] grid-rows-[1fr_90px;] relative">
<!--Nav bar-->
- <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">
+ <div class="col-start-1 col-end-3 row-start-2 row-end-3
+ sm:col-start-1 sm:col-end-2 sm:row-start-1 sm:row-end-3
+ bg-white rounded-l shadow-xl sm:my-3 sm:mx-0 mb-3 ">
+ <nav class="h-full w-full flex sm:flex-col sm:flex-row items-center sm:[&>*]:m-4 [&>*]:mx-4 justify-center sm:justify-start ">
+ <a routerLink="/data" class="flex w-5 h-5 rounded-full">
<mat-icon class="bg-green-300 rounded-full">forest</mat-icon>
</a>
- <a class="w-5 h-5 ">
+ <a class="flex w-5 h-5 ">
<button #buttonRef [routerLink]='[{ outlets: { homeDash: ["summary"] } }]'>
<mat-icon>insert_chart</mat-icon>
</button>
</a>
- <a class="w-5 h-5 ">
+ <a class="flex w-5 h-5 ">
<button [routerLink]='[{ outlets: { homeDash: ["chart"] } }]'>
<mat-icon>query_stats</mat-icon>
</button>
diff --git a/src/app/module/pages/home/summary/list-icon/list-icon.component.html b/src/app/module/pages/home/summary/list-icon/list-icon.component.html
index 1fe7948..a5e14d1 100644
--- a/src/app/module/pages/home/summary/list-icon/list-icon.component.html
+++ b/src/app/module/pages/home/summary/list-icon/list-icon.component.html
@@ -1,3 +1,4 @@
+
<main *ngIf="isGrid">
<div class="w-full flex flex-row items-end justify-start flex-wrap">
<!--Data of Sum or Average -->
@@ -100,7 +101,7 @@
</div>
</main>
-<main *ngIf="!isGrid" class="grid mt-2 gap-y-14 gap-x-8 grid-cols-2 grid-auto-rows-min">
+<main *ngIf="!isGrid && avgMinMax?.length!=0" class="grid mt-2 gap-y-14 gap-x-8 grid-cols-2 grid-auto-rows-min">
<section class="col-span-2 flex w-full min-h-min ">
@@ -151,7 +152,7 @@
</div>
</section>
- <section class="col-span-1 w-full flex flex-col pl-10 ">
+ <section class="col-span-2 sm:col-span-1 w-full flex flex-col sm: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">
@@ -186,7 +187,7 @@
</div>
</section>
- <section class="col-span-1 w-full flex flex-col w-1/3 pr-10">
+ <section class="col-span-2 sm:col-span-1 w-full flex flex-col w-1/3 sm: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">
diff --git a/src/app/module/pages/home/summary/summary.component.html b/src/app/module/pages/home/summary/summary.component.html
index 52de93a..b41c36b 100644
--- a/src/app/module/pages/home/summary/summary.component.html
+++ b/src/app/module/pages/home/summary/summary.component.html
@@ -1,8 +1,10 @@
+
<div class="w-full bg-gray-100 flex flex-col">
<!--Input field -->
- <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 flex-col sm:flex-row min-h-min w-full ">
+
+ <div class="flex min-h-full w-full sm:w-1/2 sm:w-full justify-center sm:justify-start pl-8 pt-3">
<div class="flex items-center pl-2 rounded h-14 border border-indigo-600">
Tages Sensor Werte
<button (click)="isGrid=true" 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
@@ -16,7 +18,7 @@
</div>
</div>
- <div class="flex justify-center w-1/2 pt-3 items-center">
+ <div class="flex flex-col sm:flex-row justify-center w-full sm:w-1/2 pt-3 items-center">
<mat-form-field appearance="outline" class="mx-5">
<mat-select placeholder="Station" [formControl]="stationControl" >
@@ -33,7 +35,10 @@
</mat-form-field>
</div>
</div>
-
+ <div
+ class="flex border border-gray-200 dark:border-gray-700 min-h-min w-full justify-center items-center
+ font-bold"
+ *ngIf="!levelOne || levelOne.avgMinMax?.length==0">Please Select Station and Date</div>
<app-list-icon [dentrometerDailyValue]="dentrometerDailyValue"
[avgMinMax]="avgMinMax"
[sumOrAvg]="sumOrAvg"
diff --git a/src/app/module/pages/home/summary/summary.component.ts b/src/app/module/pages/home/summary/summary.component.ts
index 78fc0ef..c9eeb8d 100644
--- a/src/app/module/pages/home/summary/summary.component.ts
+++ b/src/app/module/pages/home/summary/summary.component.ts
@@ -2,14 +2,14 @@ import { Component } from '@angular/core';
import {
AvgMinMax,
DendrometerDailyValue,
- LevelOneResponse, ServerControllerService, StationControllerService,
+ LevelOneResponse, StationControllerService,
SumOrAvg
} from "../../../../../../projects/generated-api/src";
import {FormControl} from "@angular/forms";
import {DatePipe} from "@angular/common";
import {ApiService} from "../../../../shared/api.service";
-import {Router} from "@angular/router";
-//import {SharedService} from "../../../../shared/shared-service.service";
+
+
@Component({
selector: 'app-summary',
@@ -38,17 +38,6 @@ export class SummaryComponent {
ngOnInit(){
this.dateControl.valueChanges.subscribe(date => {this.reload()});
- this.api.get("http://localhost:8080/api/v1/server/get/lvl1/ibk_s_id?date=15-04-2022").subscribe(
- res=>{
- this.levelOne=res
- // @ts-ignore
- this.avgMinMax=this.levelOne.avgMinMax
- // @ts-ignore
- this.sumOrAvg=this.levelOne.sumOrAvg
- // @ts-ignore
- this.dentrometerDailyValue=this.levelOne.dendrometerDailyValues
- }
- )
//get all station from server
this.stationControllerService.getAll().subscribe(x => {
console.log('available station', x);
@@ -70,7 +59,9 @@ export class SummaryComponent {
let stationId = this.stationControl.value;
this.api.get("http://localhost:8080/api/v1/server/get/lvl1/"+stationId+"?date="+dateStart).subscribe(
res=>{
+
this.levelOne=res
+ console.log(res)
// @ts-ignore
this.avgMinMax=this.levelOne.avgMinMax
// @ts-ignore
--
GitLab