perbaikan UI
This commit is contained in:
parent
57bcbcccde
commit
9377bebcb4
|
@ -13,7 +13,7 @@
|
|||
href="https://allbestsistem.com/"
|
||||
target="_blank"
|
||||
style="background-color: #ffffff !important;"
|
||||
>Smart Building Management Systems (V@2024-08-19.2)
|
||||
>Smart Building Management Systems (V@2024-08-20.2)
|
||||
</a></span
|
||||
>
|
||||
</p>
|
||||
|
|
|
@ -31,6 +31,5 @@ export class SelectIconComponent {
|
|||
} else {
|
||||
this.iconSelected.emit(undefined);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
@ -45,7 +45,7 @@
|
|||
<label for="status" style="color: #242222">Status:</label>
|
||||
<select
|
||||
id="projectinput5"
|
||||
class="form-control"
|
||||
class="form-control custom-select"
|
||||
formControlName="status"
|
||||
>
|
||||
<option *ngFor="let data of dataMasterStatus" [value]="data.id">
|
||||
|
|
|
@ -1,10 +1,15 @@
|
|||
<div class="modal-header" style="background-color: #FBFBFB !important">
|
||||
<div class="modal-header" style="background-color: #fbfbfb !important">
|
||||
<h4 class="modal-title" style="color: #242222">{{ labelModal }}</h4>
|
||||
<button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')">
|
||||
<button
|
||||
type="button"
|
||||
class="close"
|
||||
aria-label="Close"
|
||||
(click)="activeModal.dismiss('Cross click')"
|
||||
>
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body" style="background-color: #FBFBFB !important">
|
||||
<div class="modal-body" style="background-color: #fbfbfb !important">
|
||||
<form [formGroup]="myForm">
|
||||
<div class="form-row">
|
||||
<div class="form-group col-md-6">
|
||||
|
@ -15,9 +20,15 @@
|
|||
id="name"
|
||||
formControlName="name"
|
||||
maxlength="50"
|
||||
[ngClass]="{'is-invalid': myForm.get('name').invalid && myForm.get('name').touched}"
|
||||
[ngClass]="{
|
||||
'is-invalid':
|
||||
myForm.get('name').invalid && myForm.get('name').touched
|
||||
}"
|
||||
/>
|
||||
<div *ngIf="myForm.get('name').invalid && myForm.get('name').touched" class="text-danger">
|
||||
<div
|
||||
*ngIf="myForm.get('name').invalid && myForm.get('name').touched"
|
||||
class="text-danger"
|
||||
>
|
||||
Name is required.
|
||||
</div>
|
||||
</div>
|
||||
|
@ -29,9 +40,15 @@
|
|||
id="email"
|
||||
formControlName="email"
|
||||
maxlength="50"
|
||||
[ngClass]="{'is-invalid': myForm.get('email').invalid && myForm.get('email').touched}"
|
||||
[ngClass]="{
|
||||
'is-invalid':
|
||||
myForm.get('email').invalid && myForm.get('email').touched
|
||||
}"
|
||||
/>
|
||||
<div *ngIf="myForm.get('email').invalid && myForm.get('email').touched" class="text-danger">
|
||||
<div
|
||||
*ngIf="myForm.get('email').invalid && myForm.get('email').touched"
|
||||
class="text-danger"
|
||||
>
|
||||
Please enter a valid email.
|
||||
</div>
|
||||
</div>
|
||||
|
@ -44,9 +61,15 @@
|
|||
formControlName="phone"
|
||||
pattern="^[0-9]*$"
|
||||
maxlength="13"
|
||||
[ngClass]="{'is-invalid': myForm.get('phone').invalid && myForm.get('phone').touched}"
|
||||
[ngClass]="{
|
||||
'is-invalid':
|
||||
myForm.get('phone').invalid && myForm.get('phone').touched
|
||||
}"
|
||||
/>
|
||||
<div *ngIf="myForm.get('phone').invalid && myForm.get('phone').touched" class="text-danger">
|
||||
<div
|
||||
*ngIf="myForm.get('phone').invalid && myForm.get('phone').touched"
|
||||
class="text-danger"
|
||||
>
|
||||
Please enter a valid phone number.
|
||||
</div>
|
||||
</div>
|
||||
|
@ -58,9 +81,15 @@
|
|||
id="owner"
|
||||
maxlength="30"
|
||||
formControlName="owner"
|
||||
[ngClass]="{'is-invalid': myForm.get('owner').invalid && myForm.get('owner').touched}"
|
||||
[ngClass]="{
|
||||
'is-invalid':
|
||||
myForm.get('owner').invalid && myForm.get('owner').touched
|
||||
}"
|
||||
/>
|
||||
<div *ngIf="myForm.get('owner').invalid && myForm.get('owner').touched" class="text-danger">
|
||||
<div
|
||||
*ngIf="myForm.get('owner').invalid && myForm.get('owner').touched"
|
||||
class="text-danger"
|
||||
>
|
||||
Owner is required.
|
||||
</div>
|
||||
</div>
|
||||
|
@ -72,9 +101,15 @@
|
|||
id="address"
|
||||
formControlName="address"
|
||||
maxlength="90"
|
||||
[ngClass]="{'is-invalid': myForm.get('address').invalid && myForm.get('address').touched}"
|
||||
[ngClass]="{
|
||||
'is-invalid':
|
||||
myForm.get('address').invalid && myForm.get('address').touched
|
||||
}"
|
||||
/>
|
||||
<div *ngIf="myForm.get('address').invalid && myForm.get('address').touched" class="text-danger">
|
||||
<div
|
||||
*ngIf="myForm.get('address').invalid && myForm.get('address').touched"
|
||||
class="text-danger"
|
||||
>
|
||||
Address is required.
|
||||
</div>
|
||||
</div>
|
||||
|
@ -86,9 +121,14 @@
|
|||
id="kwh"
|
||||
formControlName="kwh"
|
||||
maxlength="15"
|
||||
[ngClass]="{'is-invalid': myForm.get('kwh').invalid && myForm.get('kwh').touched}"
|
||||
[ngClass]="{
|
||||
'is-invalid': myForm.get('kwh').invalid && myForm.get('kwh').touched
|
||||
}"
|
||||
/>
|
||||
<div *ngIf="myForm.get('kwh').invalid && myForm.get('kwh').touched" class="text-danger">
|
||||
<div
|
||||
*ngIf="myForm.get('kwh').invalid && myForm.get('kwh').touched"
|
||||
class="text-danger"
|
||||
>
|
||||
Please enter a valid KWH.
|
||||
</div>
|
||||
</div>
|
||||
|
@ -96,29 +136,37 @@
|
|||
<label for="statusId" style="color: #242222">Status:</label>
|
||||
<select
|
||||
id="statusId"
|
||||
class="form-control"
|
||||
class="form-control custom-select"
|
||||
formControlName="statusId"
|
||||
[ngClass]="{'is-invalid': myForm.get('statusId').invalid && myForm.get('statusId').touched}"
|
||||
[ngClass]="{
|
||||
'is-invalid':
|
||||
myForm.get('statusId').invalid && myForm.get('statusId').touched
|
||||
}"
|
||||
>
|
||||
<option *ngFor="let data of filteredDataStatus" [value]="data.id">
|
||||
{{ data.name }}
|
||||
</option>
|
||||
</select>
|
||||
<div *ngIf="myForm.get('statusId').invalid && myForm.get('statusId').touched" class="text-danger">
|
||||
<div
|
||||
*ngIf="
|
||||
myForm.get('statusId').invalid && myForm.get('statusId').touched
|
||||
"
|
||||
class="text-danger"
|
||||
>
|
||||
Status is required.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer" style="background-color: #FBFBFB !important">
|
||||
<div class="modal-footer" style="background-color: #fbfbfb !important">
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-secondary"
|
||||
style="
|
||||
color: #242222 !important;
|
||||
background-color: #FBFBFB !important;
|
||||
border-color: #FBFBFB !important;
|
||||
background-color: #fbfbfb !important;
|
||||
border-color: #fbfbfb !important;
|
||||
"
|
||||
(click)="activeModal.dismiss('Cross click')"
|
||||
>
|
||||
|
@ -126,7 +174,7 @@
|
|||
</button>
|
||||
<button
|
||||
type="button"
|
||||
style="color: #ffffff !important; background-color: #37A647 !important"
|
||||
style="color: #ffffff !important; background-color: #37a647 !important"
|
||||
class="btn btn-primary"
|
||||
(click)="addRow()"
|
||||
>
|
||||
|
|
|
@ -138,7 +138,7 @@
|
|||
<p
|
||||
class="card-subtitle line-on-side text-muted text-center font-small-3 mx-2 my-1"
|
||||
>
|
||||
<span>(v@2024.08.19.2)</span>
|
||||
<span>(v@2024.08.20.2)</span>
|
||||
</p>
|
||||
<!-- <div class="card-body">
|
||||
<a
|
||||
|
|
Loading…
Reference in New Issue