penyesuaian UI cooming soon

This commit is contained in:
Fuzi_fauzia 2024-06-13 23:01:28 +07:00
parent 33007acc77
commit 863a493b66
22 changed files with 527 additions and 441 deletions

View File

@ -118,7 +118,7 @@ import { HttpErrorInterceptorService } from './interceptors/http-error-intercept
BlockTemplateComponent, BlockTemplateComponent,
FullLayoutComponent, FullLayoutComponent,
PrivacyPolicyComponent, PrivacyPolicyComponent,
TermsConditionComponent, TermsConditionComponent
], ],
providers: [ providers: [
AuthGuard, AuthGuard,

View File

@ -1,38 +1 @@
<div class="app-content content bg-maintenance-image"> <app-coming-soon></app-coming-soon>
<div class="content-wrapper">
<div class="content-body">
<section class="flexbox-container">
<div class="col-12 d-flex align-items-center justify-content-center">
<div class="col-md-4 col-10 box-shadow-2 p-0">
<div class="card border-grey border-lighten-3 px-1 py-1 box-shadow-3 m-0">
<div class="card-body">
<span class="card-title text-center">
<img src="../../../../assets/images/logo/logo-dark-lg.png" class="img-fluid mx-auto d-block pt-2"
width="250" alt="logo">
</span>
</div>
<div class="card-body text-center">
<h3>Coming Soon</h3>
<p>We're sorry for the inconvenience.
<br> Please check back later.</p>
<div class="mt-2"><i class="la la-cog spinner font-large-2"></i></div>
</div>
<hr>
<!-- <p class="socialIcon card-text text-center pt-2 pb-2">
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-facebook"><span
class="la la-facebook"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-twitter"><span
class="la la-twitter"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-linkedin"><span
class="la la-linkedin font-medium-4"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-github"><span
class="la la-github font-medium-4"></span></a>
</p> -->
</div>
</div>
</div>
</section>
</div>
</div>
</div>

View File

@ -12,13 +12,15 @@ import { NgxDatatableModule } from '@swimlane/ngx-datatable';
import { BlockUIModule } from 'ng-block-ui'; import { BlockUIModule } from 'ng-block-ui';
import { BlockTemplateComponent } from 'src/app/_layout/blockui/block-template.component'; import { BlockTemplateComponent } from 'src/app/_layout/blockui/block-template.component';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { ComingSoonComponent } from '../coming-soon/coming-soon.component';
@NgModule({ @NgModule({
declarations: [ declarations: [
CalculationComponent, CalculationComponent,
ReductionComponent ReductionComponent,
ComingSoonComponent
], ],
imports: [ imports: [
CommonModule, CommonModule,

View File

@ -1,38 +1 @@
<div class="app-content content bg-maintenance-image"> <app-coming-soon></app-coming-soon>
<div class="content-wrapper">
<div class="content-body">
<section class="flexbox-container">
<div class="col-12 d-flex align-items-center justify-content-center">
<div class="col-md-4 col-10 box-shadow-2 p-0">
<div class="card border-grey border-lighten-3 px-1 py-1 box-shadow-3 m-0">
<div class="card-body">
<span class="card-title text-center">
<img src="../../../../assets/images/logo/logo-dark-lg.png" class="img-fluid mx-auto d-block pt-2"
width="250" alt="logo">
</span>
</div>
<div class="card-body text-center">
<h3>Coming Soon</h3>
<p>We're sorry for the inconvenience.
<br> Please check back later.</p>
<div class="mt-2"><i class="la la-cog spinner font-large-2"></i></div>
</div>
<hr>
<!-- <p class="socialIcon card-text text-center pt-2 pb-2">
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-facebook"><span
class="la la-facebook"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-twitter"><span
class="la la-twitter"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-linkedin"><span
class="la la-linkedin font-medium-4"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-github"><span
class="la la-github font-medium-4"></span></a>
</p> -->
</div>
</div>
</div>
</section>
</div>
</div>
</div>

View File

@ -0,0 +1,43 @@
.bg-maintenance-image {
background-size: cover;
display: flex;
justify-content: center;
align-items: center;
}
.centered-card {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.box-shadow-2 {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.box-shadow-3 {
box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);
}
.card {
background-color: rgba(255, 255, 255, 0.5);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 20px;
max-width: 400px;
width: 100%;
}
.spinner {
animation: spin 1s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}

View File

@ -0,0 +1,33 @@
<div class="app-content content bg-maintenance-image">
<div class="content-wrapper">
<div class="content-body">
<section class="flexbox-container">
<div class="centered-card">
<div class="card box-shadow-3">
<div class="card-body">
<span class="card-title text-center">
<img
src="assets/images/logo/logo-dark-lg.png"
class="img-fluid mx-auto d-block pt-2"
width="250"
alt="logo"
/>
</span>
</div>
<div class="card-body text-center">
<h3 style="font-weight: 600; color: #000000">Coming Soon</h3>
<p style="color: #000000">
We're working hard to bring you this page. <br />
Please check back later.
</p>
<div class="mt-2">
<i class="la la-cog spinner font-large-2"></i>
</div>
</div>
<hr />
</div>
</div>
</section>
</div>
</div>
</div>

View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ComingSoonComponent } from './coming-soon.component';
describe('ComingSoonComponent', () => {
let component: ComingSoonComponent;
let fixture: ComponentFixture<ComingSoonComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ComingSoonComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(ComingSoonComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,10 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-coming-soon',
templateUrl: './coming-soon.component.html',
styleUrls: ['./coming-soon.component.css']
})
export class ComingSoonComponent {
}

View File

@ -0,0 +1,44 @@
.bg-maintenance-image {
background-size: cover;
display: flex;
justify-content: center;
align-items: center;
}
.centered-card {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.box-shadow-2 {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.box-shadow-3 {
box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);
}
.card {
background-color: rgba(255, 255, 255, 0.5);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 20px;
max-width: 400px;
width: 100%;
}
.spinner {
animation: spin 1s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}

View File

@ -1,38 +1,33 @@
<div class="app-content content bg-maintenance-image"> <div class="app-content content bg-maintenance-image">
<div class="content-wrapper"> <div class="content-wrapper">
<div class="content-body"> <div class="content-body">
<section class="flexbox-container"> <section class="flexbox-container">
<div class="col-12 d-flex align-items-center justify-content-center"> <div class="centered-card">
<div class="col-md-4 col-10 box-shadow-2 p-0"> <div class="card box-shadow-3">
<div class="card border-grey border-lighten-3 px-1 py-1 box-shadow-3 m-0"> <div class="card-body">
<div class="card-body"> <span class="card-title text-center">
<span class="card-title text-center"> <img
<img src="../../../../assets/images/logo/logo-dark-lg.png" class="img-fluid mx-auto d-block pt-2" src="assets/images/logo/logo-dark-lg.png"
width="250" alt="logo"> class="img-fluid mx-auto d-block pt-2"
</span> width="250"
</div> alt="logo"
<div class="card-body text-center"> />
<h3>Coming Soon</h3> </span>
<p>We're sorry for the inconvenience. </div>
<br> Please check back later.</p> <div class="card-body text-center">
<div class="mt-2"><i class="la la-cog spinner font-large-2"></i></div> <h3 style="font-weight: 600; color: #000000">Coming Soon</h3>
</div> <p style="color: #000000">
<hr> We're working hard to bring you this page. <br />
<!-- <p class="socialIcon card-text text-center pt-2 pb-2"> Please check back later.
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-facebook"><span </p>
class="la la-facebook"></span></a> <div class="mt-2">
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-twitter"><span <i class="la la-cog spinner font-large-2"></i>
class="la la-twitter"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-linkedin"><span
class="la la-linkedin font-medium-4"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-github"><span
class="la la-github font-medium-4"></span></a>
</p> -->
</div>
</div> </div>
</div> </div>
</section> <hr />
</div> </div>
</div>
</section>
</div> </div>
</div> </div>
</div>

View File

@ -5,6 +5,7 @@ import { BlockUI, NgBlockUI } from "ng-block-ui";
import { TableApiService } from "src/app/_services/table-api.service"; import { TableApiService } from "src/app/_services/table-api.service";
import { BuildingService } from "../../service/monitoring-api.service"; import { BuildingService } from "../../service/monitoring-api.service";
import { AddEditMasterComponent } from "../add-edit-master/add-edit-master.component"; import { AddEditMasterComponent } from "../add-edit-master/add-edit-master.component";
import { ToastrService } from "ngx-toastr";
@Component({ @Component({
selector: "app-master-category", selector: "app-master-category",
@ -25,7 +26,8 @@ export class MasterCategoryComponent implements OnInit {
private tableApiservice: TableApiService, private tableApiservice: TableApiService,
private modalService: NgbModal, private modalService: NgbModal,
private router: Router, private router: Router,
private monitoringApiService: BuildingService private monitoringApiService: BuildingService,
private toastr: ToastrService
) {} ) {}
ngOnInit() { ngOnInit() {
@ -87,12 +89,22 @@ export class MasterCategoryComponent implements OnInit {
(result) => { (result) => {
console.log(result); console.log(result);
if (result) { if (result) {
this.monitoringApiService this.monitoringApiService.postHeaderDetailParam(result).subscribe(
.postHeaderDetailParam(result) (res) => {
.subscribe((res) => {
console.log(res);
this.fetchData(); this.fetchData();
}); this.toastr.success("Success", "Save Completed.", {
timeOut: 2000,
closeButton: true,
});
},
(error) => {
console.error(error);
this.toastr.error("Error", "Something went wrong!", {
timeOut: 2000,
closeButton: true,
});
}
);
} }
}, },
(reason) => { (reason) => {
@ -115,10 +127,22 @@ export class MasterCategoryComponent implements OnInit {
if (result) { if (result) {
this.monitoringApiService this.monitoringApiService
.putHeaderDetailParam(result, row.id) .putHeaderDetailParam(result, row.id)
.subscribe((res) => { .subscribe(
console.log(res); (res) => {
this.fetchData(); this.fetchData();
}); this.toastr.success("Success", "Update Completed.", {
timeOut: 2000,
closeButton: true,
});
},
(error) => {
console.error(error);
this.toastr.error("Error", "Something went wrong!", {
timeOut: 2000,
closeButton: true,
});
}
);
} }
}, },
(reason) => { (reason) => {
@ -130,11 +154,22 @@ export class MasterCategoryComponent implements OnInit {
deleteRow(row) { deleteRow(row) {
const confirmDelete = confirm("Are you sure you want to delete this item?"); const confirmDelete = confirm("Are you sure you want to delete this item?");
if (confirmDelete) { if (confirmDelete) {
this.monitoringApiService this.monitoringApiService.deleteHeaderDetailParam(row.id).subscribe(
.deleteHeaderDetailParam(row.id) (res) => {
.subscribe((res) => {
this.fetchData(); this.fetchData();
}); this.toastr.success("Success", "Delete Completed.", {
timeOut: 2000,
closeButton: true,
});
},
(error) => {
console.error(error);
this.toastr.error("Error", "Something went wrong!", {
timeOut: 2000,
closeButton: true,
});
}
);
} }
} }
} }

View File

@ -0,0 +1,44 @@
.bg-maintenance-image {
background-size: cover;
display: flex;
justify-content: center;
align-items: center;
}
.centered-card {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.box-shadow-2 {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.box-shadow-3 {
box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);
}
.card {
background-color: rgba(255, 255, 255, 0.5);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 20px;
max-width: 400px;
width: 100%;
}
.spinner {
animation: spin 1s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}

View File

@ -1,38 +1,33 @@
<div class="app-content content bg-maintenance-image"> <div class="app-content content bg-maintenance-image">
<div class="content-wrapper"> <div class="content-wrapper">
<div class="content-body"> <div class="content-body">
<section class="flexbox-container"> <section class="flexbox-container">
<div class="col-12 d-flex align-items-center justify-content-center"> <div class="centered-card">
<div class="col-md-4 col-10 box-shadow-2 p-0"> <div class="card box-shadow-3">
<div class="card border-grey border-lighten-3 px-1 py-1 box-shadow-3 m-0"> <div class="card-body">
<div class="card-body"> <span class="card-title text-center">
<span class="card-title text-center"> <img
<img src="../../../../assets/images/logo/logo-dark-lg.png" class="img-fluid mx-auto d-block pt-2" src="assets/images/logo/logo-dark-lg.png"
width="250" alt="logo"> class="img-fluid mx-auto d-block pt-2"
</span> width="250"
</div> alt="logo"
<div class="card-body text-center"> />
<h3>This page is under maintenance</h3> </span>
<p>We're sorry for the inconvenience. </div>
<br> Please check back later.</p> <div class="card-body text-center">
<div class="mt-2"><i class="la la-cog spinner font-large-2"></i></div> <h3 style="font-weight: 600; color: #000000">Coming Soon</h3>
</div> <p style="color: #000000">
<hr> We're working hard to bring you this page. <br />
<!-- <p class="socialIcon card-text text-center pt-2 pb-2"> Please check back later.
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-facebook"><span </p>
class="la la-facebook"></span></a> <div class="mt-2">
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-twitter"><span <i class="la la-cog spinner font-large-2"></i>
class="la la-twitter"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-linkedin"><span
class="la la-linkedin font-medium-4"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-github"><span
class="la la-github font-medium-4"></span></a>
</p> -->
</div>
</div> </div>
</div> </div>
</section> <hr />
</div> </div>
</div>
</section>
</div> </div>
</div> </div>
</div>

View File

@ -26,6 +26,7 @@ import { MasterRoomComponent } from './master-room/master-room.component';
import { MasterBuildingComponent } from './master-building/master-building.component'; import { MasterBuildingComponent } from './master-building/master-building.component';
import { AddEditMasterBuildingComponent } from './master-building/add-edit-master-building/add-edit-master-building.component'; import { AddEditMasterBuildingComponent } from './master-building/add-edit-master-building/add-edit-master-building.component';
import { AddEditMasterRoomComponent } from './master-room/add-edit-master-room/add-edit-master-room.component'; import { AddEditMasterRoomComponent } from './master-room/add-edit-master-room/add-edit-master-room.component';
import { ToastrModule } from 'ngx-toastr';
@ -56,6 +57,7 @@ import { AddEditMasterRoomComponent } from './master-room/add-edit-master-room/a
PerfectScrollbarModule, PerfectScrollbarModule,
BreadcrumbModule, BreadcrumbModule,
ReactiveFormsModule, ReactiveFormsModule,
ToastrModule.forRoot(),
NgbModule, NgbModule,
BlockUIModule.forRoot({ BlockUIModule.forRoot({
template: BlockTemplateComponent template: BlockTemplateComponent

View File

@ -0,0 +1,44 @@
.bg-maintenance-image {
background-size: cover;
display: flex;
justify-content: center;
align-items: center;
}
.centered-card {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.box-shadow-2 {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.box-shadow-3 {
box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);
}
.card {
background-color: rgba(255, 255, 255, 0.5);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 20px;
max-width: 400px;
width: 100%;
}
.spinner {
animation: spin 1s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}

View File

@ -1,38 +1,33 @@
<div class="app-content content bg-maintenance-image"> <div class="app-content content bg-maintenance-image">
<div class="content-wrapper"> <div class="content-wrapper">
<div class="content-body"> <div class="content-body">
<section class="flexbox-container"> <section class="flexbox-container">
<div class="col-12 d-flex align-items-center justify-content-center"> <div class="centered-card">
<div class="col-md-4 col-10 box-shadow-2 p-0"> <div class="card box-shadow-3">
<div class="card border-grey border-lighten-3 px-1 py-1 box-shadow-3 m-0"> <div class="card-body">
<div class="card-body"> <span class="card-title text-center">
<span class="card-title text-center"> <img
<img src="../../../../assets/images/logo/logo-dark-lg.png" class="img-fluid mx-auto d-block pt-2" src="assets/images/logo/logo-dark-lg.png"
width="250" alt="logo"> class="img-fluid mx-auto d-block pt-2"
</span> width="250"
</div> alt="logo"
<div class="card-body text-center"> />
<h3>Coming Soon</h3> </span>
<p>We're sorry for the inconvenience. </div>
<br> Please check back later.</p> <div class="card-body text-center">
<div class="mt-2"><i class="la la-cog spinner font-large-2"></i></div> <h3 style="font-weight: 600; color: #000000">Coming Soon</h3>
</div> <p style="color: #000000">
<hr> We're working hard to bring you this page. <br />
<!-- <p class="socialIcon card-text text-center pt-2 pb-2"> Please check back later.
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-facebook"><span </p>
class="la la-facebook"></span></a> <div class="mt-2">
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-twitter"><span <i class="la la-cog spinner font-large-2"></i>
class="la la-twitter"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-linkedin"><span
class="la la-linkedin font-medium-4"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-github"><span
class="la la-github font-medium-4"></span></a>
</p> -->
</div>
</div> </div>
</div> </div>
</section> <hr />
</div> </div>
</div>
</section>
</div> </div>
</div> </div>
</div>

View File

@ -0,0 +1,44 @@
.bg-maintenance-image {
background-size: cover;
display: flex;
justify-content: center;
align-items: center;
}
.centered-card {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
.box-shadow-2 {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.box-shadow-3 {
box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);
}
.card {
background-color: rgba(255, 255, 255, 0.5);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 20px;
max-width: 400px;
width: 100%;
}
.spinner {
animation: spin 1s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}

View File

@ -1,38 +1,33 @@
<div class="app-content content bg-maintenance-image"> <div class="app-content content bg-maintenance-image">
<div class="content-wrapper"> <div class="content-wrapper">
<div class="content-body"> <div class="content-body">
<section class="flexbox-container"> <section class="flexbox-container">
<div class="col-12 d-flex align-items-center justify-content-center"> <div class="centered-card">
<div class="col-md-4 col-10 box-shadow-2 p-0"> <div class="card box-shadow-3">
<div class="card border-grey border-lighten-3 px-1 py-1 box-shadow-3 m-0"> <div class="card-body">
<div class="card-body"> <span class="card-title text-center">
<span class="card-title text-center"> <img
<img src="../../../../assets/images/logo/logo-dark-lg.png" class="img-fluid mx-auto d-block pt-2" src="assets/images/logo/logo-dark-lg.png"
width="250" alt="logo"> class="img-fluid mx-auto d-block pt-2"
</span> width="250"
</div> alt="logo"
<div class="card-body text-center"> />
<h3>Coming Soon</h3> </span>
<p>We're sorry for the inconvenience. </div>
<br> Please check back later.</p> <div class="card-body text-center">
<div class="mt-2"><i class="la la-cog spinner font-large-2"></i></div> <h3 style="font-weight: 600; color: #000000">Coming Soon</h3>
</div> <p style="color: #000000">
<hr> We're working hard to bring you this page. <br />
<!-- <p class="socialIcon card-text text-center pt-2 pb-2"> Please check back later.
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-facebook"><span </p>
class="la la-facebook"></span></a> <div class="mt-2">
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-twitter"><span <i class="la la-cog spinner font-large-2"></i>
class="la la-twitter"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-linkedin"><span
class="la la-linkedin font-medium-4"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-github"><span
class="la la-github font-medium-4"></span></a>
</p> -->
</div>
</div> </div>
</div> </div>
</section> <hr />
</div> </div>
</div>
</section>
</div> </div>
</div> </div>
</div>

View File

@ -1,190 +1,44 @@
:host ::ng-deep .ngx-datatable.bootstrap .datatable-header .datatable-header-cell .datatable-header-cell-label { .bg-maintenance-image {
font-family: inherit; background-size: cover;
font-size: medium;
font-weight: bold;
color: #6B6F82;
}
:host ::ng-deep .ngx-datatable .datatable-row-center, .ngx-datatable .datatable-row-group, .ngx-datatable .datatable-row-right {
position: relative;
height: 50px !important;
}
:host ::ng-deep .datatable-icon-right:before {
font-family: 'icofont';
font-style: normal;
}
:host ::ng-deep .datatable-icon-skip:before {
font-family: 'icofont';
font-style: normal;
}
:host ::ng-deep .datatable-icon-left:before {
font-family: 'icofont';
font-style: normal;
}
:host ::ng-deep .datatable-icon-left:before {
content: "\2039";
font-size: x-large;
}
:host ::ng-deep .datatable-icon-prev:before {
content: "\00AB";
font-size: x-large;
}
:host ::ng-deep .datatable-icon-right:before {
content: "\203A";
font-size: x-large;
}
:host ::ng-deep .datatable-icon-skip:before {
content: "\00BB";
font-size: x-large;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-left,
.ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-right,
.ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-prev {
font-size: 16px;
line-height: 22px;
padding: 0px 09px;
background-color: #d4d2e7;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-right,
.ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-right {
font-size: 16px;
line-height: 22px;
padding: 0px 09px;
background-color: #d4d2e7;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-skip {
font-size: 16px;
line-height: 22px;
padding: 0px 09px;
background-color: #d4d2e7;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-prev {
font-size: 16px;
line-height: 22px;
padding: 0px 09px;
background-color: #d4d2e7;
}
:host ::ng-deep .datatable-footer .datatable-pager ul li:not(.disabled).active a,
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] ul[_ngcontent-c11] li[_ngcontent-c11]:not(.disabled):hover a[_ngcontent-c11] {
background-color: #d4d2e7;
font-weight: bold;
font-size: larger;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager a {
height: 32px;
min-width: 34px;
line-height: 22px;
padding: 0;
border-radius: 3px;
margin: 0 3px;
text-align: center;
vertical-align: top;
padding-top: 3px;
text-decoration: none;
vertical-align: bottom;
color: #7c8091;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-left,
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-right[_ngcontent-c11],
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-prev[_ngcontent-c11] {
font-size: 14px;
line-height: 9px;
padding: 0px 08px;
background-color: #ffffff;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-left,
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-right[_ngcontent-c11],
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-prev[_ngcontent-c11] {
font-size: 0px;
line-height: 22px;
padding: 0px 09px;
background-color: #ffffff;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-right,
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-right[_ngcontent-c11],
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-prev[_ngcontent-c11] {
font-size: 0px;
line-height: 22px;
padding: 0px 09px;
background-color: #ffffff;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-skip,
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-right[_ngcontent-c11],
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-prev[_ngcontent-c11] {
font-size: 0px;
line-height: 22px;
padding: 0px 09px;
background-color: #ffffff;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager .datatable-icon-prev,
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-right[_ngcontent-c11],
.ngx-datatable.bootstrap[_ngcontent-c11] .datatable-footer[_ngcontent-c11] .datatable-pager[_ngcontent-c11] .datatable-icon-prev[_ngcontent-c11] {
font-size: 0px;
line-height: 22px;
padding: 0px 09px;
background-color: #ffffff;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager ul li:not(.disabled):hover a {
background-color: #545454;
font-weight: bold;
color: white;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer .datatable-pager ul li:not(.disabled).active a,
.ngx-datatable.bootstrap .datatable-footer .datatable-pager ul li:not(.disabled):hover a {
background-color: #545454;
font-weight: bold;
color: white;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-footer {
background: #727e8e;
color: #ededed;
margin-top: -1px;
overflow: inherit;
}
:host ::ng-deep .ngx-datatable.bootstrap .datatable-header {
font-weight: bold;
height: unset !important;
overflow: inherit
}
:host ::ng-deep .ngx-datatable .datatable-footer .datatable-pager {
flex: 0 0 0%;
}
:host ::ng-deep .ngx-datatable .datatable-footer .datatable-pager .pager {
display: flex; display: flex;
} justify-content: center;
align-items: center;
:host ::ng-deep .block-ui-wrapper { }
background: rgba(255, 249, 249, 0.5) !important;
} .centered-card {
:host ::ng-deep .ngx-datatable .datatable-footer .selected-count .datatable-pager { display: flex;
flex: 0 0 0%; justify-content: center;
} align-items: center;
width: 100%;
:host ::ng-deep .ngx-datatable { height: 100%;
display: -webkit-box; }
}
.box-shadow-2 {
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.box-shadow-3 {
box-shadow: 0 3px 20px rgba(0, 0, 0, 0.2);
}
.card {
background-color: rgba(255, 255, 255, 0.5);
border: 1px solid rgba(255, 255, 255, 0.3);
padding: 20px;
max-width: 400px;
width: 100%;
}
.spinner {
animation: spin 1s linear infinite;
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}

View File

@ -2,36 +2,32 @@
<div class="content-wrapper"> <div class="content-wrapper">
<div class="content-body"> <div class="content-body">
<section class="flexbox-container"> <section class="flexbox-container">
<div class="col-12 d-flex align-items-center justify-content-center"> <div class="centered-card">
<div class="col-md-4 col-10 box-shadow-2 p-0"> <div class="card box-shadow-3">
<div class="card border-grey border-lighten-3 px-1 py-1 box-shadow-3 m-0"> <div class="card-body">
<div class="card-body"> <span class="card-title text-center">
<span class="card-title text-center"> <img
<img src="../../../../assets/images/logo/logo-dark-lg.png" class="img-fluid mx-auto d-block pt-2" src="assets/images/logo/logo-dark-lg.png"
width="250" alt="logo"> class="img-fluid mx-auto d-block pt-2"
</span> width="250"
</div> alt="logo"
<div class="card-body text-center"> />
<h3>Coming Soon</h3> </span>
<p>We're sorry for the inconvenience. </div>
<br> Please check back later.</p> <div class="card-body text-center">
<div class="mt-2"><i class="la la-cog spinner font-large-2"></i></div> <h3 style="font-weight: 600; color: #000000">Coming Soon</h3>
</div> <p style="color: #000000">
<hr> We're working hard to bring you this page. <br />
<!-- <p class="socialIcon card-text text-center pt-2 pb-2"> Please check back later.
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-facebook"><span </p>
class="la la-facebook"></span></a> <div class="mt-2">
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-twitter"><span <i class="la la-cog spinner font-large-2"></i>
class="la la-twitter"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-linkedin"><span
class="la la-linkedin font-medium-4"></span></a>
<a [routerLink]="" class="btn btn-social-icon mr-1 mb-1 btn-outline-github"><span
class="la la-github font-medium-4"></span></a>
</p> -->
</div> </div>
</div> </div>
<hr />
</div> </div>
</section> </div>
</section>
</div> </div>
</div> </div>
</div> </div>

View File

@ -14,6 +14,12 @@ export class HttpErrorInterceptorService {
catchError((error: HttpErrorResponse) => { catchError((error: HttpErrorResponse) => {
if (error.status === 403) { if (error.status === 403) {
this.router.navigate(['/error/error403']); this.router.navigate(['/error/error403']);
} else if (error.status === 404) {
this.router.navigate(['/error/error404']);
} else if (error.status === 500) {
this.router.navigate(['/error/error500']);
} else if (error.status === 502) {
this.router.navigate(['/error/error500']);
} }
return throwError(error); return throwError(error);
}) })

View File

@ -9,7 +9,7 @@
// ================================================================================================ // ================================================================================================
.bg-maintenance-image{ .bg-maintenance-image{
background-image: url(/assets/images/backgrounds/bg-2.jpg); background-image: url(/assets/images/backgrounds/98438.jpg);
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
} }