feat: adiciona tela de pesagem e refeições registradas

larissaperinoto · Jul 8, 2024 · 8df12c0 · 8df12c0
1 parent bd34a93
commit 8df12c0
Show file tree

Hide file tree

Showing 11 changed files with 161 additions and 391 deletions.
diff --git a/.gitignore b/.gitignore
@@ -30,7 +30,7 @@ yarn-error.log
 .history/*
 
 # Miscellaneous
-/.angular/cache
+.angular
 .sass-cache/
 /connect.lock
 /coverage

diff --git a/app/package-lock.json b/app/package-lock.json
diff --git a/app/src/app/app.component.css b/app/src/app/app.component.css
@@ -0,0 +1,28 @@
+.screen {
+  display: flex;
+  background-color: #f5f5f5;
+  width: 100%;
+  height: 100%;
+}
+
+.container_1 {
+  width: 70%;
+  border-right: 2px solid gray;
+}
+
+.container_2 {
+  overflow-y: scroll;
+  padding: 0 2%;
+  width: 30%;
+  background-color: #ffffff;
+}
+
+.container_2 h2 {
+  font-size: 18px;
+  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
+    "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
+}
+
+.container_2::-webkit-scrollbar {
+  width: 2px;
+}
diff --git a/app/src/app/app.component.html b/app/src/app/app.component.html
diff --git a/app/src/app/app.component.spec.ts b/app/src/app/app.component.spec.ts
diff --git a/app/src/app/app.component.ts b/app/src/app/app.component.ts
@@ -1,13 +1,38 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { RouterOutlet } from '@angular/router';
+import { WebsocketService } from './socket.service';
+import { MealComponent } from './meal/meal.component';
 
 @Component({
   selector: 'app-root',
   standalone: true,
-  imports: [RouterOutlet],
+  imports: [RouterOutlet, MealComponent],
   templateUrl: './app.component.html',
-  styleUrl: './app.component.css'
+  styleUrl: './app.component.css',
 })
-export class AppComponent {
-  title = 'app';
+export class AppComponent implements OnInit {
+  weight: any = 0;
+  buffetType: any = '';
+  total: any = '';
+  meals: any[] = [];
+
+  constructor(private socketService: WebsocketService) {}
+
+  ngOnInit(): void {
+    this.socketService.getWeight().subscribe((data) => {
+      this.weight = data;
+    });
+
+    this.socketService.getBuffetType().subscribe((data) => {
+      this.buffetType = data;
+    });
+
+    this.socketService.getTotal().subscribe((data) => {
+      this.total = data;
+    });
+
+    this.socketService.getOrder().subscribe((data) => {
+      this.meals.unshift(JSON.parse(data as string));
+    });
+  }
 }
diff --git a/app/src/app/meal/meal.component.css b/app/src/app/meal/meal.component.css
@@ -0,0 +1,38 @@
+.orderCard {
+  background-color: #ffffff;
+  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
+    "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
+  padding: 1%;
+  border-bottom: 1px solid gray;
+  border-top: 1px solid gray;
+  font-size: 14px;
+  line-height: 10px;
+}
+
+.cardTitle {
+  font-size: 14px;
+  font-weight: 200;
+}
+
+.modal {
+  width: 50%;
+  margin: auto;
+  margin-top: 20%;
+  padding: 2%;
+  border: 1px solid gray;
+  border-radius: 10px;
+  background-color: #ffffff;
+  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1), 0 4px 6px rgba(0, 0, 0, 0.1);
+  font-size: 26px;
+}
+
+.modalTitle {
+  font-size: 28px;
+  font-weight: 400;
+}
+
+.modalWeight {
+  font-size: 28px;
+  font-weight: 600;
+  color: red;
+}
diff --git a/app/src/app/meal/meal.component.html b/app/src/app/meal/meal.component.html
@@ -0,0 +1,8 @@
+<div class="{{ containerClass }}">
+  <h1 class="{{ titleClass }}">
+    Peso (Kg): <span class="{{ weightClass }}">{{ weight }} </span>
+  </h1>
+  <p>Categoria: {{ buffetType }}</p>
+  <p>Total: {{ total }}</p>
+  <p>{{ datetime }}</p>
+</div>
diff --git a/app/src/app/meal/meal.component.ts b/app/src/app/meal/meal.component.ts
@@ -0,0 +1,19 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'app-meal',
+  standalone: true,
+  imports: [],
+  templateUrl: './meal.component.html',
+  styleUrl: './meal.component.css',
+})
+export class MealComponent {
+  @Input() weight = '';
+  @Input() total = '';
+  @Input() buffetType = '';
+  @Input() datetime = '';
+
+  @Input() titleClass = 'cardTitle';
+  @Input() weightClass = '';
+  @Input() containerClass = 'orderCard';
+}
diff --git a/app/src/index.html b/app/src/index.html
@@ -1,13 +1,13 @@
-<!doctype html>
+<!DOCTYPE html>
 <html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>App</title>
-  <base href="/">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
-</head>
-<body>
-  <app-root></app-root>
-</body>
+  <head>
+    <meta charset="utf-8" />
+    <title>Buffet</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="icon" type="image/x-icon" href="favicon.ico" />
+  </head>
+  <body>
+    <app-root></app-root>
+  </body>
 </html>
diff --git a/app/src/styles.css b/app/src/styles.css
@@ -1 +1,6 @@
 /* You can add global styles to this file, and also import other style files */
+body {
+  padding: 0;
+  margin: 0;
+  height: 100vh;
+}