purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2024-10-30 01:08:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

(@fuse/loading-bar) Separated the service and interceptor from the component, updated its docs

Browse Source
This commit is contained in:
sercan 2021-11-04 12:25:24 +03:00
parent 20901117d1
commit 6b14c1db7f
12 changed files with 56 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/@fuse/components/loading-bar/loading-bar.component.ts
View File

@ -1,8 +1,8 @@
import { Component, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewEncapsulation } from '@angular/core';
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import { FuseLoadingBarService } from '@fuse/components/loading-bar/loading-bar.service';
import { takeUntil } from 'rxjs/operators';
import { Subject } from 'rxjs';
import { FuseLoadingService } from '@fuse/services/loading';
@Component({
selector : 'fuse-loading-bar',
@ -22,7 +22,7 @@ export class FuseLoadingBarComponent implements OnChanges, OnInit, OnDestroy
/**
* Constructor
*/
constructor(private _fuseLoadingBarService: FuseLoadingBarService)
constructor(private _fuseLoadingService: FuseLoadingService)
{
}
@ -41,7 +41,7 @@ export class FuseLoadingBarComponent implements OnChanges, OnInit, OnDestroy
if ( 'autoMode' in changes )
{
// Set the auto mode in the service
this._fuseLoadingBarService.setAutoMode(coerceBooleanProperty(changes.autoMode.currentValue));
this._fuseLoadingService.setAutoMode(coerceBooleanProperty(changes.autoMode.currentValue));
}
}
@ -51,19 +51,19 @@ export class FuseLoadingBarComponent implements OnChanges, OnInit, OnDestroy
ngOnInit(): void
{
// Subscribe to the service
this._fuseLoadingBarService.mode$
this._fuseLoadingService.mode$
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((value) => {
this.mode = value;
});
this._fuseLoadingBarService.progress$
this._fuseLoadingService.progress$
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((value) => {
this.progress = value;
});
this._fuseLoadingBarService.show$
this._fuseLoadingService.show$
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((value) => {
this.show = value;

9
src/@fuse/components/loading-bar/loading-bar.module.ts
View File

@ -1,9 +1,7 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { FuseLoadingBarComponent } from '@fuse/components/loading-bar/loading-bar.component';
import { FuseLoadingBarInterceptor } from '@fuse/components/loading-bar/loading-bar.interceptor';
@NgModule({
declarations: [
@ -15,13 +13,6 @@ import { FuseLoadingBarInterceptor } from '@fuse/components/loading-bar/loading-
],
exports : [
FuseLoadingBarComponent
],
providers : [
{
provide : HTTP_INTERCEPTORS,
useClass: FuseLoadingBarInterceptor,
multi : true
}
]
})
export class FuseLoadingBarModule

1
src/@fuse/components/loading-bar/public-api.ts
View File

@ -1,3 +1,2 @@
export * from '@fuse/components/loading-bar/loading-bar.component';
export * from '@fuse/components/loading-bar/loading-bar.service';
export * from '@fuse/components/loading-bar/loading-bar.module';

2
src/@fuse/fuse.module.ts
View File

@ -2,6 +2,7 @@ import { NgModule, Optional, SkipSelf } from '@angular/core';
import { MATERIAL_SANITY_CHECKS } from '@angular/material/core';
import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
import { FuseConfirmationModule } from '@fuse/services/confirmation';
import { FuseLoadingModule } from '@fuse/services/loading';
import { FuseMediaWatcherModule } from '@fuse/services/media-watcher/media-watcher.module';
import { FuseSplashScreenModule } from '@fuse/services/splash-screen/splash-screen.module';
import { FuseTailwindConfigModule } from '@fuse/services/tailwind/tailwind.module';
@ -10,6 +11,7 @@ import { FuseUtilsModule } from '@fuse/services/utils/utils.module';
@NgModule({
imports : [
FuseConfirmationModule,
FuseLoadingModule,
FuseMediaWatcherModule,
FuseSplashScreenModule,
FuseTailwindConfigModule,

1
src/@fuse/services/loading/index.ts Normal file
View File

@ -0,0 +1 @@
export * from '@fuse/services/loading/public-api';

12
src/@fuse/components/loading-bar/loading-bar.interceptor.ts → src/@fuse/services/loading/loading.interceptor.ts
View File

@ -2,10 +2,10 @@ import { Injectable } from '@angular/core';
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Observable } from 'rxjs';
import { finalize } from 'rxjs/operators';
import { FuseLoadingBarService } from '@fuse/components/loading-bar/loading-bar.service';
import { FuseLoadingService } from '@fuse/services/loading/loading.service';
@Injectable()
export class FuseLoadingBarInterceptor implements HttpInterceptor
export class FuseLoadingInterceptor implements HttpInterceptor
{
handleRequestsAutomatically: boolean;
@ -13,11 +13,11 @@ export class FuseLoadingBarInterceptor implements HttpInterceptor
* Constructor
*/
constructor(
private _fuseLoadingBarService: FuseLoadingBarService
private _fuseLoadingService: FuseLoadingService
)
{
// Subscribe to the auto
this._fuseLoadingBarService.auto$
this._fuseLoadingService.auto$
.subscribe((value) => {
this.handleRequestsAutomatically = value;
});
@ -38,12 +38,12 @@ export class FuseLoadingBarInterceptor implements HttpInterceptor
}
// Set the loading status to true
this._fuseLoadingBarService._setLoadingStatus(true, req.url);
this._fuseLoadingService._setLoadingStatus(true, req.url);
return next.handle(req).pipe(
finalize(() => {
// Set the status to false if there are any errors or the request is completed
this._fuseLoadingBarService._setLoadingStatus(false, req.url);
this._fuseLoadingService._setLoadingStatus(false, req.url);
}));
}
}

16
src/@fuse/services/loading/loading.module.ts Normal file
View File

@ -0,0 +1,16 @@
import { NgModule } from '@angular/core';
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { FuseLoadingInterceptor } from '@fuse/services/loading/loading.interceptor';
@NgModule({
providers: [
{
provide : HTTP_INTERCEPTORS,
useClass: FuseLoadingInterceptor,
multi : true
}
]
})
export class FuseLoadingModule
{
}

2
src/@fuse/components/loading-bar/loading-bar.service.ts → src/@fuse/services/loading/loading.service.ts
View File

@ -5,7 +5,7 @@ import { BehaviorSubject, Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class FuseLoadingBarService
export class FuseLoadingService
{
private _auto$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(true);
private _mode$: BehaviorSubject<'determinate' | 'indeterminate'> = new BehaviorSubject<'determinate' | 'indeterminate'>('indeterminate');

2
src/@fuse/services/loading/public-api.ts Normal file
View File

@ -0,0 +1,2 @@
export * from '@fuse/services/loading/loading.service';
export * from '@fuse/services/loading/loading.module';

22
src/app/modules/admin/ui/fuse-components/components/loading-bar/loading-bar.component.html
View File

@ -94,7 +94,7 @@
<h2>Service</h2>
<p>
<code>FuseLoadingBarService</code> can be injected to control the loading bar from anywhere.
<code>FuseLoadingService</code> can be injected to control the loading bar from anywhere.
</p>
<div class="bg-card rounded shadow mt-4">
<div class="px-6 py-3 font-mono text-secondary border-b">
@ -208,7 +208,7 @@
/**
* Constructor
*/
constructor( private _fuseLoadingBarService: FuseLoadingBarService ) { }
constructor( private _fuseLoadingService: FuseLoadingService ) { }
...
@ -217,7 +217,7 @@
*/
showLoadingBar(): void
{
this._fuseLoadingBarService.show();
this._fuseLoadingService.show();
}
/**
@ -225,7 +225,7 @@
*/
hideLoadingBar(): void
{
this._fuseLoadingBarService.hide();
this._fuseLoadingService.hide();
}
</textarea>
<!-- @formatter:on -->
@ -317,7 +317,7 @@
*/
constructor(
private _httpClient: HttpClient,
private _fuseLoadingBarService: FuseLoadingBarService
private _fuseLoadingService: FuseLoadingService
)
{ }
@ -330,7 +330,7 @@
*/
setAutoMode(change: MatSlideToggleChange): void
{
this._fuseLoadingBarService.setAutoMode(change.checked);
this._fuseLoadingService.setAutoMode(change.checked);
}
/**
@ -440,7 +440,7 @@
/**
* Constructor
*/
constructor( private _fuseLoadingBarService: FuseLoadingBarService ) { }
constructor( private _fuseLoadingService: FuseLoadingService ) { }
...
@ -450,14 +450,14 @@
toggleMode(): void
{
// Show the loading bar
this._fuseLoadingBarService.show();
this._fuseLoadingService.show();
// Turn off the auto mode
this._fuseLoadingBarService.setAutoMode(false);
this._fuseLoadingService.setAutoMode(false);
// Set the mode
this.mode = this.mode === 'indeterminate' ? 'determinate' : 'indeterminate';
this._fuseLoadingBarService.setMode(this.mode);
this._fuseLoadingService.setMode(this.mode);
}
/**
@ -467,7 +467,7 @@
*/
setProgress(change: MatSliderChange): void
{
this._fuseLoadingBarService.setProgress(change.value);
this._fuseLoadingService.setProgress(change.value);
}
</textarea>
<!-- @formatter:on -->

16
src/app/modules/admin/ui/fuse-components/components/loading-bar/loading-bar.component.ts
View File

@ -3,7 +3,7 @@ import { HttpClient } from '@angular/common/http';
import { MatSliderChange } from '@angular/material/slider';
import { MatSlideToggleChange } from '@angular/material/slide-toggle';
import { finalize } from 'rxjs/operators';
import { FuseLoadingBarService } from '@fuse/components/loading-bar';
import { FuseLoadingService } from '@fuse/services/loading';
import { FuseComponentsComponent } from 'app/modules/admin/ui/fuse-components/fuse-components.component';
@Component({
@ -21,7 +21,7 @@ export class LoadingBarComponent
constructor(
private _httpClient: HttpClient,
private _fuseComponentsComponent: FuseComponentsComponent,
private _fuseLoadingBarService: FuseLoadingBarService
private _fuseLoadingService: FuseLoadingService
)
{
}
@ -44,7 +44,7 @@ export class LoadingBarComponent
*/
showLoadingBar(): void
{
this._fuseLoadingBarService.show();
this._fuseLoadingService.show();
}
/**
@ -52,7 +52,7 @@ export class LoadingBarComponent
*/
hideLoadingBar(): void
{
this._fuseLoadingBarService.hide();
this._fuseLoadingService.hide();
}
/**
@ -62,7 +62,7 @@ export class LoadingBarComponent
*/
setAutoMode(change: MatSlideToggleChange): void
{
this._fuseLoadingBarService.setAutoMode(change.checked);
this._fuseLoadingService.setAutoMode(change.checked);
}
/**
@ -87,11 +87,11 @@ export class LoadingBarComponent
toggleMode(): void
{
// Show the loading bar
this._fuseLoadingBarService.show();
this._fuseLoadingService.show();
// Set the mode
this.mode = this.mode === 'indeterminate' ? 'determinate' : 'indeterminate';
this._fuseLoadingBarService.setMode(this.mode);
this._fuseLoadingService.setMode(this.mode);
}
/**
@ -101,6 +101,6 @@ export class LoadingBarComponent
*/
setProgress(change: MatSliderChange): void
{
this._fuseLoadingBarService.setProgress(change.value);
this._fuseLoadingService.setProgress(change.value);
}
}

4
src/app/modules/admin/ui/fuse-components/fuse-components.module.ts
View File

@ -10,11 +10,12 @@ import { MatSliderModule } from '@angular/material/slider';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatTabsModule } from '@angular/material/tabs';
import { MatTreeModule } from '@angular/material/tree';
import { FuseAlertModule } from '@fuse/components/alert';
import { FuseCardModule } from '@fuse/components/card';
import { FuseDateRangeModule } from '@fuse/components/date-range';
import { FuseDrawerModule } from '@fuse/components/drawer';
import { FuseHighlightModule } from '@fuse/components/highlight';
import { FuseAlertModule } from '@fuse/components/alert';
import { FuseLoadingBarModule } from '@fuse/components/loading-bar';
import { FuseMasonryModule } from '@fuse/components/masonry/masonry.module';
import { FuseNavigationModule } from '@fuse/components/navigation';
import { FuseScrollResetModule } from '@fuse/directives/scroll-reset';
@ -79,6 +80,7 @@ import { fuseComponentsRoutes } from 'app/modules/admin/ui/fuse-components/fuse-
FuseDateRangeModule,
FuseDrawerModule,
FuseHighlightModule,
FuseLoadingBarModule,
FuseMasonryModule,
FuseNavigationModule,
FuseScrollResetModule,