ahasani/psp_panel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor appConfig component, update layoutService and implement Angular signals

Browse Source
This commit is contained in:
Mehmet Çetin
2023-12-22 10:16:50 +03:00
parent 1787a3d6a5
commit 890d69af02
12 changed files with 107 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/demo/components/auth/login/login.component.html
+1 -1
View File
@@ -1,6 +1,6 @@
<div class="surface-ground flex align-items-center justify-content-center min-h-screen min-w-screen overflow-hidden">
<div class="flex flex-column align-items-center justify-content-center">
<img src="assets/layout/images/{{layoutService.config.colorScheme === 'light' ? 'logo-dark' : 'logo-white'}}.svg" alt="Sakai logo" class="mb-5 w-6rem flex-shrink-0">
<img src="assets/layout/images/{{layoutService.config().colorScheme === 'light' ? 'logo-dark' : 'logo-white'}}.svg" alt="Sakai logo" class="mb-5 w-6rem flex-shrink-0">
<div style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, var(--primary-color) 10%, rgba(33, 150, 243, 0) 30%);">
<div class="w-full surface-card py-8 px-5 sm:px-8" style="border-radius:53px">
<div class="text-center mb-5">
src/app/demo/components/dashboard/dashboard.component.ts
+4 -2
View File
@@ -2,7 +2,7 @@ import { Component, OnInit, OnDestroy } from '@angular/core';
import { MenuItem } from 'primeng/api';
import { Product } from '../../api/product';
import { ProductService } from '../../service/product.service';
import { Subscription } from 'rxjs';
import { Subscription, debounceTime } from 'rxjs';
import { LayoutService } from 'src/app/layout/service/app.layout.service';
@Component({
@@ -21,7 +21,9 @@ export class DashboardComponent implements OnInit, OnDestroy {
subscription!: Subscription;
constructor(private productService: ProductService, public layoutService: LayoutService) {
this.subscription = this.layoutService.configUpdate$.subscribe(() => {
this.subscription = this.layoutService.configUpdate$
.pipe(debounceTime(25))
.subscribe((config) => {
this.initChart();
});
}
src/app/demo/components/documentation/documentation.component.html
+3 -2
View File
@@ -43,7 +43,7 @@ Run 'ng help' for more options.</code></pre>
<pre class="app-code"><code>import &#123; Component, OnInit &#125; from '&#64;angular/core';
import &#123; PrimeNGConfig &#125; from 'primeng/api';
import &#123; LayoutService &#125; from './layout/service/app.layout.service';
import &#123; LayoutService, AppConfig &#125; from './layout/service/app.layout.service';
&#64;Component(&#123;
selector: 'app-root',
@@ -57,7 +57,7 @@ export class AppComponent implements OnInit &#123;
this.primengConfig.ripple = true; //enables core ripple functionality
//optional configuration with the default configuration
this.layoutService.config = &#123;
const config: AppConfig = &#123;
ripple: false, //toggles ripple on and off
inputStyle: 'outlined', //default style for input elements
menuMode: 'static', //layout mode of the menu, valid values are "static" and "overlay"
@@ -65,6 +65,7 @@ export class AppComponent implements OnInit &#123;
theme: 'lara-light-indigo', //default component theme for PrimeNG
scale: 14 //size of the body font size to scale the whole application
&#125;;
this.layoutService.config.set(config);
&#125;
&#125;</code></pre>
src/app/demo/components/landing/landing.component.html
+2 -2
View File
@@ -2,7 +2,7 @@
<div id="home" class="landing-wrapper overflow-hidden">
<div class="py-4 px-4 mx-0 md:mx-6 lg:mx-8 lg:px-8 flex align-items-center justify-content-between relative lg:static mb-3">
<a class="flex align-items-center" href="#">
<img src="assets/layout/images/{{layoutService.config.colorScheme === 'light' ? 'logo-dark' : 'logo-white'}}.svg" alt="Sakai Logo" height="50" class="mr-0 lg:mr-2"><span class="text-900 font-medium text-2xl line-height-3 mr-8">SAKAI</span>
<img src="assets/layout/images/{{layoutService.config().colorScheme === 'light' ? 'logo-dark' : 'logo-white'}}.svg" alt="Sakai Logo" height="50" class="mr-0 lg:mr-2"><span class="text-900 font-medium text-2xl line-height-3 mr-8">SAKAI</span>
</a>
<a pRipple class="cursor-pointer block lg:hidden text-700" pStyleClass="@next" enterClass="hidden" leaveToClass="hidden" [hideOnOutsideClick]="true">
<i class="pi pi-bars text-4xl"></i>
@@ -317,7 +317,7 @@
<div class="grid justify-content-between">
<div class="col-12 md:col-2" style="margin-top:-1.5rem;">
<a (click)="router.navigate(['/pages/landing'], {fragment: 'home'})" class="flex flex-wrap align-items-center justify-content-center md:justify-content-start md:mb-0 mb-3 cursor-pointer">
<img src="assets/layout/images/{{layoutService.config.colorScheme === 'light' ? 'logo-dark' : 'logo-white'}}.svg" alt="footer sections" width="50" height="50" class="mr-2">
<img src="assets/layout/images/{{layoutService.config().colorScheme === 'light' ? 'logo-dark' : 'logo-white'}}.svg" alt="footer sections" width="50" height="50" class="mr-2">
<h4 class="font-medium text-3xl text-900">SAKAI</h4>
</a>
</div>
src/app/demo/components/uikit/charts/chartsdemo.component.ts
+7 -6
View File
@@ -1,5 +1,5 @@
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Subscription } from 'rxjs';
import { Subscription, debounceTime } from 'rxjs';
import { LayoutService } from 'src/app/layout/service/app.layout.service';
@Component({
@@ -28,11 +28,12 @@ export class ChartsDemoComponent implements OnInit, OnDestroy {
radarOptions: any;
subscription: Subscription;
constructor(public layoutService: LayoutService) {
this.subscription = this.layoutService.configUpdate$.subscribe(config => {
this.initCharts();
});
constructor(private layoutService: LayoutService) {
this.subscription = this.layoutService.configUpdate$
.pipe(debounceTime(25))
.subscribe((config) => {
this.initCharts();
});
}
ngOnInit() {