@duoduo-oba/ng-devui
Version:
DevUI components based on Angular
358 lines (349 loc) • 14.6 kB
JavaScript
import { Component, Input, Directive, ComponentFactoryResolver, ElementRef, ViewContainerRef, Injector, HostBinding, NgModule } from '@angular/core';
import { Subscription, Observable, from, forkJoin, throwError } from 'rxjs';
import { catchError } from 'rxjs/operators';
import { CommonModule } from '@angular/common';
/**
* @fileoverview added by tsickle
* Generated from: loading-backdrop.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var LoadingBackdropComponent = /** @class */ (function () {
function LoadingBackdropComponent() {
this.backdrop = true;
}
LoadingBackdropComponent.decorators = [
{ type: Component, args: [{
selector: 'd-loading-backdrop',
template: "<div class='devui-loading-backdrop'\n *ngIf='backdrop'>\n </div>",
styles: [".devui-loading-backdrop{position:absolute;z-index:1000;background-color:#adb0b8;opacity:.3;left:0;top:0;bottom:0;right:0}"]
}] }
];
LoadingBackdropComponent.propDecorators = {
backdrop: [{ type: Input }]
};
return LoadingBackdropComponent;
}());
if (false) {
/** @type {?} */
LoadingBackdropComponent.prototype.backdrop;
}
/**
* @fileoverview added by tsickle
* Generated from: loading.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var LoadingComponent = /** @class */ (function () {
function LoadingComponent() {
}
LoadingComponent.decorators = [
{ type: Component, args: [{
selector: 'd-loading',
template: "<div class=\"devui-loading-wrapper\">\n <ng-container *ngTemplateOutlet=\"loadingTemplateRef ? loadingTemplateRef : default;\">\n </ng-container>\n <ng-template #default>\n <div class=\"devui-spinner-wrapper\"\n [ngClass]=\"{'devui-fix-loading-position': !customPosition,'devui-message-wrapper':!!message}\"\n [style.top]=\"top\"\n [style.left]=\"left\">\n <div class=\"devui-busy-default-sign\">\n <div class=\"devui-busy-default-spinner\">\n <div class=\"devui-loading-bar1\"></div>\n <div class=\"devui-loading-bar2\"></div>\n <div class=\"devui-loading-bar3\"></div>\n <div class=\"devui-loading-bar4\"></div>\n </div>\n <div class=\"devui-busy-default-text\" *ngIf=\"!!message\">{{message}}</div>\n </div>\n </div>\n </ng-template>\n </div>",
styles: [".devui-loading-wrapper{display:-webkit-box;display:flex;-webkit-box-flex:1;flex:1 1 auto}.devui-spinner-wrapper{position:absolute;z-index:1001}.devui-message-wrapper{background:#fff;border-radius:5px}.devui-fix-loading-position{-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.devui-busy-default-sign{position:relative;display:inline-block;z-index:1001;padding:12px 14px;color:#252b3a}.devui-busy-default-text{display:inline-block;margin-left:6px;max-width:400px;font-size:14px;text-align:left}.devui-busy-default-spinner{position:relative;display:inline-block;width:15px;height:15px;-webkit-animation:1s linear infinite devui-busy-spinner-anim;animation:1s linear infinite devui-busy-spinner-anim}.devui-busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:6px;height:6px;border-radius:50%}.devui-busy-default-spinner .devui-loading-bar1{top:0;left:0;background:#5e7ce0}.devui-busy-default-spinner .devui-loading-bar2{top:0;left:9px;background:#859bff}.devui-busy-default-spinner .devui-loading-bar3{top:9px;left:0;background:#859bff}.devui-busy-default-spinner .devui-loading-bar4{top:9px;left:9px;background:#5e7ce0}@-webkit-keyframes devui-busy-spinner-anim{0%{-webkit-transform:rotate(0) scale(1);transform:rotate(0) scale(1)}50%{-webkit-transform:rotate(135deg) scale(1.5);transform:rotate(135deg) scale(1.5)}100%{-webkit-transform:rotate(270deg) scale(1);transform:rotate(270deg) scale(1)}}@keyframes devui-busy-spinner-anim{0%{-webkit-transform:rotate(0) scale(1);transform:rotate(0) scale(1)}50%{-webkit-transform:rotate(135deg) scale(1.5);transform:rotate(135deg) scale(1.5)}100%{-webkit-transform:rotate(270deg) scale(1);transform:rotate(270deg) scale(1)}}"]
}] }
];
LoadingComponent.propDecorators = {
loadingTemplateRef: [{ type: Input }],
message: [{ type: Input }],
top: [{ type: Input }],
left: [{ type: Input }],
customPosition: [{ type: Input }]
};
return LoadingComponent;
}());
if (false) {
/** @type {?} */
LoadingComponent.prototype.loadingTemplateRef;
/** @type {?} */
LoadingComponent.prototype.message;
/** @type {?} */
LoadingComponent.prototype.top;
/** @type {?} */
LoadingComponent.prototype.left;
/** @type {?} */
LoadingComponent.prototype.customPosition;
}
/**
* @fileoverview added by tsickle
* Generated from: loading.directive.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var LoadingDirective = /** @class */ (function () {
function LoadingDirective(componentFactoryResolver, triggerElementRef, viewContainerRef, injector, elementRef) {
this.componentFactoryResolver = componentFactoryResolver;
this.triggerElementRef = triggerElementRef;
this.viewContainerRef = viewContainerRef;
this.injector = injector;
this.elementRef = elementRef;
this.active = true;
}
Object.defineProperty(LoadingDirective.prototype, "showLoading", {
set: /**
* @param {?} _showLoading
* @return {?}
*/
function (_showLoading) {
if (_showLoading === true) {
this.startLoading();
}
else {
this.endLoading();
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(LoadingDirective.prototype, "loading", {
set: /**
* @param {?} loading
* @return {?}
*/
function (loading) {
var _this = this;
if (loading === undefined) {
return;
}
if (loading instanceof Subscription) {
this.startLoading();
loading.add((/**
* @return {?}
*/
function () { return _this.endLoading(); }));
return;
}
/** @type {?} */
var loadingArr = [].concat(loading).map((/**
* @param {?} item
* @return {?}
*/
function (item) {
if (item instanceof Observable) {
return item;
}
return from(item);
}));
if (loadingArr.length > 0) {
this.startLoading();
forkJoin(loadingArr)
.pipe(catchError((/**
* @param {?} error
* @return {?}
*/
function (error) {
return throwError(error);
})))
.subscribe(null, (/**
* @return {?}
*/
function () {
_this.endLoading();
}), (/**
* @return {?}
*/
function () {
_this.endLoading();
}));
}
},
enumerable: true,
configurable: true
});
/**
* @private
* @return {?}
*/
LoadingDirective.prototype.startLoading = /**
* @private
* @return {?}
*/
function () {
if (!this.loadingRef) {
this.position = this.positionType || 'relative';
if (this.backdrop) {
this.createLoadingBackdrop();
}
this.loadingRef = this.viewContainerRef.createComponent(this.componentFactoryResolver.resolveComponentFactory(LoadingComponent), null, this.injector);
this.insert(this.loadingRef.hostView);
Object.assign(this.loadingRef.instance, {
message: this.message,
loadingTemplateRef: this.loadingTemplateRef,
top: this.view ? this.view.top : '50%',
left: this.view ? this.view.left : '50%',
isCustomPosition: !!this.view
});
}
};
/**
* @private
* @return {?}
*/
LoadingDirective.prototype.endLoading = /**
* @private
* @return {?}
*/
function () {
if (this.loadingRef) {
this.loadingRef.destroy();
this.loadingRef = null;
}
if (this.backdropRef) {
this.backdropRef.destroy();
this.backdropRef = null;
}
this.position = '';
};
/**
* @private
* @return {?}
*/
LoadingDirective.prototype.createLoadingBackdrop = /**
* @private
* @return {?}
*/
function () {
this.backdropRef =
!this.backdropRef &&
this.viewContainerRef.createComponent(this.componentFactoryResolver.resolveComponentFactory(LoadingBackdropComponent), null, this.injector);
this.insert(this.backdropRef.hostView);
Object.assign(this.backdropRef.instance, {
triggerElementRef: this.triggerElementRef,
backdrop: this.backdrop
});
};
/**
* @private
* @param {?} viewRef
* @return {?}
*/
LoadingDirective.prototype.insert = /**
* @private
* @param {?} viewRef
* @return {?}
*/
function (viewRef) {
var _this = this;
((/** @type {?} */ (viewRef))).rootNodes.forEach((/**
* @param {?} node
* @return {?}
*/
function (node) { return _this.elementRef.nativeElement.appendChild(node); }));
return viewRef;
};
LoadingDirective.decorators = [
{ type: Directive, args: [{
selector: '[dLoading]',
exportAs: 'dLoading'
},] }
];
/** @nocollapse */
LoadingDirective.ctorParameters = function () { return [
{ type: ComponentFactoryResolver },
{ type: ElementRef },
{ type: ViewContainerRef },
{ type: Injector },
{ type: ElementRef }
]; };
LoadingDirective.propDecorators = {
message: [{ type: Input }],
backdrop: [{ type: Input }],
loadingTemplateRef: [{ type: Input }],
positionType: [{ type: Input }],
view: [{ type: Input }],
position: [{ type: HostBinding, args: ['style.position',] }],
showLoading: [{ type: Input }],
loading: [{ type: Input }]
};
return LoadingDirective;
}());
if (false) {
/** @type {?} */
LoadingDirective.prototype.message;
/** @type {?} */
LoadingDirective.prototype.backdrop;
/** @type {?} */
LoadingDirective.prototype.loadingTemplateRef;
/** @type {?} */
LoadingDirective.prototype.positionType;
/** @type {?} */
LoadingDirective.prototype.view;
/** @type {?} */
LoadingDirective.prototype.position;
/** @type {?} */
LoadingDirective.prototype.backdropRef;
/** @type {?} */
LoadingDirective.prototype.loadingRef;
/** @type {?} */
LoadingDirective.prototype.active;
/**
* @type {?}
* @private
*/
LoadingDirective.prototype.componentFactoryResolver;
/**
* @type {?}
* @private
*/
LoadingDirective.prototype.triggerElementRef;
/**
* @type {?}
* @private
*/
LoadingDirective.prototype.viewContainerRef;
/**
* @type {?}
* @private
*/
LoadingDirective.prototype.injector;
/**
* @type {?}
* @private
*/
LoadingDirective.prototype.elementRef;
}
/**
* @fileoverview added by tsickle
* Generated from: loading.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var LoadingModule = /** @class */ (function () {
function LoadingModule() {
}
LoadingModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule],
exports: [
LoadingDirective,
LoadingBackdropComponent,
LoadingComponent,
],
declarations: [
LoadingDirective,
LoadingBackdropComponent,
LoadingComponent
],
entryComponents: [
LoadingBackdropComponent,
LoadingComponent
],
providers: [],
},] }
];
return LoadingModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: loading.types.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: public-api.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: ng-devui-loading.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { LoadingBackdropComponent, LoadingComponent, LoadingDirective, LoadingModule };
//# sourceMappingURL=ng-devui-loading.js.map