penyesuaian UI list room

This commit is contained in:
2024-06-13 17:14:14 +07:00
parent f6db135ac6
commit 7a07bf5b07
14 changed files with 1162 additions and 1121 deletions

View File

@@ -29,7 +29,7 @@
class="text-muted mb-1 font-weight-bold"
style="font-family: Montserrat, sans-serif; color: #ffffff !important;"
>
Building Name
Building
</h4>
<h3
class="text-muted mb-0"
@@ -68,7 +68,7 @@
>
{{ data.total }} kWh
</h3>
<h6 style="color: #ffffff !important;">Consumtion</h6>
<h6 style="color: #ffffff !important;">Consumption</h6>
</div>
<div class="form-group text-center">

View File

@@ -88,7 +88,7 @@
color: #ffffff;
"
class="barchart"
height="328"
height="400"
width="1900"
baseChart
[datasets]="barChartData"
@@ -247,7 +247,7 @@
<span
class="float-right text-bold-600"
style="color: #ffffff"
>{{ item.value }}%</span
>{{ item.value.toFixed(1) }}%</span
>
</p>
<ngb-progressbar

View File

@@ -32,6 +32,9 @@ export class DetailComponent {
// chart bar
public barChartOptions: ChartOptions = {
responsive: true,
animation: {
duration: 0 // Menonaktifkan animasi
},
scales: {
x: {
stacked: true,

View File

@@ -5,4 +5,6 @@
:host ::ng-deep .block-ui-wrapper {
background: rgba(255, 249, 249, 0.5) !important;
}
:host ::ng-deep .progress-bar {
background-color: #bef264 !important;
}

View File

@@ -1,4 +1,4 @@
<div class="app-content content">
<div class="app-content content" style="background-color: #000000 !important">
<div class="content-wrapper">
<div class="content-header row mb-1">
<app-breadcrumb class="col-12" [breadcrumb]="breadcrumb"></app-breadcrumb>
@@ -10,34 +10,34 @@
<input type="text" class="form-control" placeholder="Search..." [(ngModel)]="searchTerm"
(input)="filterRows()" />
</div>
<div class="col-md-6 text-right">
<!-- <div class="col-md-6 text-right">
<button
class="btn btn-secondary"
[routerLink]="['/monitoring/add-new-room']"
>
<i class="feather ft-plus"></i>&nbsp; Add new room
</button>
</div>
</div> -->
</div>
<div class="row mt-2">
<div
class="col-xl-3 col-lg-6 col-12"
*ngFor="let data of filteredRows"
>
<div class="card pull-up">
<div class="card pull-up" style="background-color: #252525 !important">
<div class="card-content">
<div class="card-header mb-2">
<div class="card-header mb-2" style="background-color: #252525 !important">
<div class="row">
<div class="col-12 text-center">
<h5
class="text-muted mb-1"
style="font-family: Montserrat, sans-serif"
style="font-family: Montserrat, sans-serif; color: #ffffff !important;"
>
Room Name
Room
</h5>
<h4
class="text-muted mb-0"
style="font-family: Montserrat, sans-serif"
style="font-family: Montserrat, sans-serif; color: #ffffff !important;"
>
{{ data.name }}
</h4>
@@ -49,12 +49,13 @@
<div class="media d-flex">
<div class="media-body text-left">
<!-- <h3 class="info">{{ data.value }} kWh</h3> -->
<h3 class="info">265 kWh</h3>
<h6>Consumtion</h6>
<h3 style="color: #ffffff;">{{data.totalKwh}} kWh</h3>
<h6 style="color: #ffffff;">Consumption</h6>
</div>
<div>
<i
class="feather ft-server info font-large-2 float-right"
style="color: #bef264 !important;"
></i>
</div>
</div>
@@ -63,12 +64,12 @@
height="7px"
width="100%"
type="warning"
value="75"
value="{{data.totalKwh}}"
></ngb-progressbar>
</div>
</div>
</div>
<div class="form-group text-center">
<!-- <div class="form-group text-center">
<button
type="button"
class="btn btn-icon btn-outline-primary mr-1"
@@ -87,7 +88,7 @@
>
<i class="la la-building"></i>
</button>
</div>
</div> -->
</div>
</div>
</div>