slicing cost manager

This commit is contained in:
2024-07-16 16:33:20 +07:00
parent 768c9ee6ca
commit 7bc1fa5fe9
6 changed files with 162 additions and 121 deletions

View File

@@ -7,21 +7,20 @@
<section>
<div class="row">
<div class="col-12 col-sm-6 col-md-6 col-lg-6">
<div class="card" style="background-color: #252525 !important">
<div class="card" style="background-color: #DDE1E6 !important">
<div
class="card-header"
style="background-color: #252525 !important"
style="background-color: #DDE1E6 !important"
>
<h4
class="card-title text-center"
style="color: #ffffff !important"
class="card-title text-center text-custom-label"
>
Comparison of Previous Month Costs
</h4>
<hr
style="
border-top: 4px solid #ffffff;
border-color: #ffffff !important;
border-top: 4px solid #242222;
border-color: #242222 !important;
"
/>
</div>
@@ -36,21 +35,20 @@
</div>
</div>
<div class="col-12 col-sm-6 col-md-6 col-lg-6">
<div class="card" style="background-color: #252525 !important">
<div class="card" style="background-color: #DDE1E6 !important">
<div
class="card-header"
style="background-color: #252525 !important"
style="background-color: #DDE1E6 !important"
>
<h4
class="card-title text-center"
style="color: #ffffff !important"
class="card-title text-center text-custom-label"
>
Comparison of Actual Costs and Estimated Costs
</h4>
<hr
style="
border-top: 4px solid #ffffff;
border-color: #ffffff !important;
border-top: 4px solid #242222;
border-color: #242222 !important;
"
/>
</div>
@@ -67,7 +65,7 @@
</div>
</section>
<section id="configuration">
<div class="card" style="background-color: #252525 !important">
<div class="card" style="background-color: #FBFBFB !important">
<div class="card-content">
<div class="card-body">
<div class="row">
@@ -115,19 +113,19 @@
class="btn btn-outline-success"
(click)="doFilter()"
style="
background-color: #252525 !important;
border-color: #bef264 !important;
background-color: #DDE1E6 !important;
border-color: #DDE1E6 !important;
"
[disabled]="spinnerFilterActive"
>
<i
class="la la-search"
style="color: #ffffff !important"
style="color: #242222 !important"
*ngIf="!spinnerFilterActive"
></i>
<i
class="la la-spinner spinner"
style="color: #ffffff !important"
style="color: #242222 !important"
*ngIf="spinnerFilterActive"
></i>
</button>
@@ -148,13 +146,13 @@
/>
<div
class="input-group-append"
style="background-color: #252525 !important"
style="background-color: #FBFBFB !important"
>
<span
class="input-group-text"
style="
background-color: #252525 !important;
color: #ffffff;
background-color: #FBFBFB !important;
color: #242222;
height: 40px !important;
"
>Kwh</span
@@ -177,13 +175,13 @@
/>
<div
class="input-group-append"
style="background-color: #252525 !important"
style="background-color: #FBFBFB !important"
>
<span
class="input-group-text"
style="
background-color: #252525 !important;
color: #ffffff;
background-color: #FBFBFB !important;
color: #242222;
height: 40px !important;
"
>IDR</span
@@ -199,9 +197,9 @@
class="btn btn-secondary mr-2"
style="
width: 100%;
background-color: #bef264 !important;
border-color: #bef264 !important;
color: #000000 !important;
background-color: #37A647 !important;
border-color: #37A647 !important;
color: #ffffff !important;
"
(click)="export()"
[disabled]="spinnerExportActive"
@@ -218,9 +216,9 @@
class="btn btn-secondary mr-2"
style="
width: 100%;
background-color: #bef264 !important;
border-color: #bef264 !important;
color: #000000 !important;
background-color: #37A647 !important;
border-color: #37A647 !important;
color: #ffffff !important;
"
(click)="syncData()"
[disabled]="spinnerActive"
@@ -236,9 +234,9 @@
class="btn btn-secondary"
style="
width: 100%;
background-color: #bef264 !important;
border-color: #bef264 !important;
color: #000000 !important;
background-color: #37A647 !important;
border-color: #37A647 !important;
color: #ffffff !important;
"
(click)="addFieldValue()"
>
@@ -270,7 +268,7 @@
ngx-datatable-cell-template
let-rowIndex="rowIndex"
>
<p style="color: #ffffff !important">
<p class="style-custom-label">
{{ rowIndex + 1 }}
</p>
</ng-template>
@@ -281,10 +279,10 @@
[minWidth]="90"
>
<ng-template ngx-datatable-header-template>
<span style="color: #ffffff !important">Building</span>
<span class="style-custom-label">Building</span>
</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template>
<p style="color: #ffffff !important">{{ value }}</p>
<p class="style-custom-label">{{ value }}</p>
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column
@@ -293,10 +291,10 @@
[minWidth]="90"
>
<ng-template ngx-datatable-header-template>
<span style="color: #ffffff !important">Category</span>
<span class="style-custom-label">Category</span>
</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template>
<p style="color: #ffffff !important">{{ value }}</p>
<p class="style-custom-label">{{ value }}</p>
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column
@@ -305,10 +303,10 @@
[minWidth]="90"
>
<ng-template ngx-datatable-header-template>
<span style="color: #ffffff !important">Room</span>
<span class="style-custom-label">Room</span>
</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template>
<p style="color: #ffffff !important">{{ value }}</p>
<p class="style-custom-label">{{ value }}</p>
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column
@@ -317,12 +315,12 @@
[minWidth]="90"
>
<ng-template ngx-datatable-header-template>
<span style="color: #ffffff !important"
<span class="style-custom-label"
>Estimation Cost</span
>
</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template>
<p style="color: #ffffff !important">
<p class="style-custom-label">
{{
value.toLocaleString("id-ID", {
style: "currency",
@@ -338,10 +336,10 @@
[minWidth]="90"
>
<ng-template ngx-datatable-header-template>
<span style="color: #ffffff !important">Total Kwh</span>
<span class="style-custom-label">Total Kwh</span>
</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template>
<p style="color: #ffffff !important">{{ value }}</p>
<p class="style-custom-label">{{ value }}</p>
kWh
</ng-template>
</ngx-datatable-column>
@@ -351,10 +349,10 @@
[minWidth]="90"
>
<ng-template ngx-datatable-header-template>
<span style="color: #ffffff !important">Tanggal</span>
<span class="style-custom-label">Tanggal</span>
</ng-template>
<ng-template let-value="value" ngx-datatable-cell-template>
<p style="color: #ffffff !important">
<p class="style-custom-label">
{{ value | date : "MM/yyyy" }}
</p>
</ng-template>
@@ -365,10 +363,10 @@
[minWidth]="90"
>
<ng-template ngx-datatable-header-template>
<span style="color: #ffffff !important">Status</span>
<span class="style-custom-label">Status</span>
</ng-template>
<ng-template ngx-datatable-cell-template let-value="value">
<p style="color: #ffffff !important">
<p class="style-custom-label">
{{ value === 2 ? "Aktif" : "Tidak Aktif" }}
</p>
</ng-template>
@@ -379,7 +377,7 @@
[minWidth]="150"
>
<ng-template ngx-datatable-header-template>
<span style="color: #ffffff !important">Actions</span>
<span class="style-custom-label">Actions</span>
</ng-template>
<ng-template
ngx-datatable-cell-template
@@ -389,14 +387,14 @@
<button
class="btn btn-sm btn-warning mr-1"
style="
background-color: #000000 !important;
border-color: #bef264 !important;
background-color: #DDE1E6 !important;
border-color: #37A647 !important;
"
(click)="viewRow(row)"
>
<i
class="ficon ri-export-line"
style="color: #bef264 !important"
style="color: #37A647 !important"
></i>
</button>
</ng-template>