ngx-rs-ant 0.6.2 → 0.6.10

package/fesm2020/ngx-rs-ant.mjs

@@ -18,6 +18,7 @@ import * as i5$1 from 'devextreme-angular/core';
 import * as i2$1 from 'ng-devui/button';
 import * as i3$1 from 'ng-devui/form';
 import * as i4$1 from 'ng-devui/text-input';
+import * as i4$2 from 'ng-devui/loading';
 
 class DividerLineComponent {
     get _style() {
@@ -985,24 +986,27 @@ class FormComponent {
         this.layoutDirection = FormLayout.Vertical;
         this.formGroup = new UntypedFormGroup({});
         this.submitCallback = new EventEmitter();
+        this.loading = false;
     }
     ngOnInit() {
         this.service.getFormTemplateConfig(this.tenant, this.className, this.template).subscribe((response) => {
             this.config = response.data.template;
             if (this.copyOid || this.oid) {
+                this.loading = true;
                 const attributes = Object.keys(this.formGroup.controls);
                 this.service.getOne(this.tenant, this.className, this.copyOid || this.oid, attributes).subscribe((response) => {
                     if (this.copyOid) {
                         delete response.data.oid;
                     }
                     this.formGroup.patchValue(response.data);
+                    this.loading = false;
                 });
             }
         });
     }
     submitForm($event) {
         if (!$event.valid) {
-            this.submitCallback.emit();
+            this.submitCallback.emit({ success: false });
             return;
         }
         this.service.createOrUpdate(this.tenant, this.className, {
@@ -1017,10 +1021,10 @@ class FormComponent {
     }
 }
 FormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: FormComponent, deps: [{ token: FormService }], target: i0.ɵɵFactoryTarget.Component });
-FormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: FormComponent, selector: "rs-form", inputs: { tenant: "tenant", className: "className", oid: "oid", copyOid: "copyOid", template: "template" }, outputs: { submitCallback: "submitCallback" }, providers: [FormService], viewQueries: [{ propertyName: "formSubmitter", first: true, predicate: ["formSubmitter"], descendants: true }], ngImport: i0, template: "<form dForm [formGroup]=\"formGroup\" [layout]=\"layoutDirection\" (dSubmit)=\"submitForm($event)\">\n  <ng-container *ngIf=\"config\">\n    <rs-box-container [config]=\"config\" [formGroup]=\"formGroup\"></rs-box-container>\n  </ng-container>\n  <button #formSubmitter dFormSubmit=\"click\"></button>\n</form>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.FormDirective, selector: "[dForm]", inputs: ["layout", "labelSize", "labelAlign", "dFeedbackType", "dHasFeedback"], outputs: ["dSubmit"], exportAs: ["dForm"] }, { kind: "directive", type: i3$1.DFormSubmitDirective, selector: "[dFormSubmit]", inputs: ["dFormSubmit", "dFormSubmitData"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: BoxContainerComponent, selector: "rs-box-container", inputs: ["editMode", "config", "formGroup", "tabViewContainerRef"] }] });
+FormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: FormComponent, selector: "rs-form", inputs: { tenant: "tenant", className: "className", oid: "oid", copyOid: "copyOid", template: "template" }, outputs: { submitCallback: "submitCallback" }, providers: [FormService], viewQueries: [{ propertyName: "formSubmitter", first: true, predicate: ["formSubmitter"], descendants: true }], ngImport: i0, template: "<form dForm [formGroup]=\"formGroup\" [layout]=\"layoutDirection\" (dSubmit)=\"submitForm($event)\"\n      dLoading [loading]=\"loading\">\n  <ng-container *ngIf=\"config\">\n    <rs-box-container [config]=\"config\" [formGroup]=\"formGroup\"></rs-box-container>\n  </ng-container>\n  <button #formSubmitter dFormSubmit=\"click\"></button>\n</form>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.FormDirective, selector: "[dForm]", inputs: ["layout", "labelSize", "labelAlign", "dFeedbackType", "dHasFeedback"], outputs: ["dSubmit"], exportAs: ["dForm"] }, { kind: "directive", type: i3$1.DFormSubmitDirective, selector: "[dFormSubmit]", inputs: ["dFormSubmit", "dFormSubmitData"] }, { kind: "directive", type: i4$2.LoadingDirective, selector: "[dLoading]", inputs: ["backdrop", "message", "positionType", "showLoading", "view", "zIndex", "loading", "loadingStyle", "loadingTemplateRef"], exportAs: ["dLoading"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: BoxContainerComponent, selector: "rs-box-container", inputs: ["editMode", "config", "formGroup", "tabViewContainerRef"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: FormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'rs-form', providers: [FormService], template: "<form dForm [formGroup]=\"formGroup\" [layout]=\"layoutDirection\" (dSubmit)=\"submitForm($event)\">\n  <ng-container *ngIf=\"config\">\n    <rs-box-container [config]=\"config\" [formGroup]=\"formGroup\"></rs-box-container>\n  </ng-container>\n  <button #formSubmitter dFormSubmit=\"click\"></button>\n</form>\n" }]
+            args: [{ selector: 'rs-form', providers: [FormService], template: "<form dForm [formGroup]=\"formGroup\" [layout]=\"layoutDirection\" (dSubmit)=\"submitForm($event)\"\n      dLoading [loading]=\"loading\">\n  <ng-container *ngIf=\"config\">\n    <rs-box-container [config]=\"config\" [formGroup]=\"formGroup\"></rs-box-container>\n  </ng-container>\n  <button #formSubmitter dFormSubmit=\"click\"></button>\n</form>\n" }]
         }], ctorParameters: function () { return [{ type: FormService }]; }, propDecorators: { tenant: [{
                 type: Input
             }], className: [{
@@ -1071,8 +1075,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
         }] });
 
 class ModalComponent {
-    constructor(elementRef) {
+    constructor(elementRef, changeDetectorRef) {
         this.elementRef = elementRef;
+        this.changeDetectorRef = changeDetectorRef;
         this.size = 'default';
         this._width = 480;
         this.movable = false;
@@ -1093,12 +1098,17 @@ class ModalComponent {
                 this._width = 960;
             }
             this.modalElementRef.nativeElement.style.width = this._width + 'px';
-            this.modalElementRef.nativeElement.style.top = '40px';
+            this.modalElementRef.nativeElement.style.top = '24px';
             this.modalElementRef.nativeElement.style.left =
                 (this.elementRef.nativeElement.parentElement.offsetWidth - this.modalElementRef.nativeElement.offsetWidth) / 2 + 'px';
             this.moveHandleEl = this.elementRef.nativeElement.querySelector('.modal-header');
             this.moveHandleEl.style.cursor = 'move';
         }
+        setTimeout(() => {
+            if (this.modalElementRef.nativeElement.offsetHeight > this.elementRef.nativeElement.parentElement.offsetHeight - 48) {
+                this.modalElementRef.nativeElement.style.height = this.elementRef.nativeElement.parentElement.offsetHeight - 48 + 'px';
+            }
+        });
     }
     show() {
         // 若存在多层模态框，仅保留最上层遮罩颜色，下层遮罩设置为透明
@@ -1134,6 +1144,12 @@ class ModalComponent {
             "left": this.elementRef.nativeElement.parentElement.offsetLeft + 'px',
         };
     }
+    resolveModalPosition() {
+        return {
+            "top": '24px',
+            "left": (this.elementRef.nativeElement.parentElement.offsetWidth - this.modalElementRef.nativeElement.offsetWidth) / 2 + 'px',
+        };
+    }
     onMousedown($event) {
         if ($event.button === 2 || !this.checkHandleTarget($event.target, this.moveHandleEl)) {
             return;
@@ -1179,13 +1195,16 @@ class ModalComponent {
         element.style.top = currentTop + 'px';
         element.style.left = currentLeft + 'px';
     }
+    onWindowResize() {
+        this.changeDetectorRef.detectChanges();
+    }
 }
-ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ModalComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: ModalComponent, selector: "rs-modal", inputs: { title: "title", size: "size", contentTemplate: "contentTemplate", contentTemplateContext: "contentTemplateContext" }, host: { listeners: { "document:mouseup": "onMouseup($event)", "document:mousemove": "onMousemove($event)" } }, viewQueries: [{ propertyName: "modalElementRef", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"modal-backdrop\" [ngStyle]=\"resolveModalBackdropPosition()\">\n  <div #modal class=\"modal\">\n    <div class=\"modal-header\" (mousedown)=\"onMousedown($event)\">\n      <div class=\"modal-title\">{{title}}</div>\n      <i class=\"icon-close\" (click)=\"hide()\"></i>\n    </div>\n    <div class=\"modal-content\">\n      <ng-template [ngTemplateOutlet]=\"contentTemplate\"\n                   [ngTemplateOutletContext]=\"{$implicit: contentTemplateContext}\"></ng-template>\n    </div>\n  </div>\n</div>\n", styles: [":host .modal-backdrop{position:absolute;inset:0;z-index:calc(var(--devui-z-index-modal, 1050) - 1)}:host .modal-backdrop .modal{position:absolute;top:0;left:0;z-index:var(--devui-z-index-modal, 1050);background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px);box-shadow:var(--devui-shadow-length-fullscreen-overlay, 0 10px 24px 0) var(--devui-shadow, rgba(37, 43, 58, .24));display:flex;flex-flow:column nowrap}:host .modal-backdrop .modal .modal-header{flex:0 0 36px;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}:host .modal-backdrop .modal .modal-header .modal-title{padding:12px 24px;font-size:var(--devui-font-size-card-title, 14px);font-weight:700}:host .modal-backdrop .modal .modal-header i{position:absolute;top:12px;right:12px;padding:4px;font-size:var(--devui-font-size-card-title, 14px)}:host .modal-backdrop .modal .modal-header i:hover{cursor:pointer;color:var(--devui-danger, #f66f6a);background-color:var(--devui-info-bg, #e9edfa)}:host .modal-backdrop .modal .modal-content{flex:1;padding:24px;display:flex;flex-flow:column nowrap;font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #71757f)}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+ModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ModalComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+ModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: ModalComponent, selector: "rs-modal", inputs: { title: "title", size: "size", contentTemplate: "contentTemplate", contentTemplateContext: "contentTemplateContext", footerTemplate: "footerTemplate", footerTemplateContext: "footerTemplateContext" }, host: { listeners: { "document:mouseup": "onMouseup($event)", "document:mousemove": "onMousemove($event)", "window:resize": "onWindowResize($event)" } }, viewQueries: [{ propertyName: "modalElementRef", first: true, predicate: ["modal"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"modal-backdrop\" [ngStyle]=\"resolveModalBackdropPosition()\">\n  <div #modal class=\"modal\" [ngStyle]=\"resolveModalPosition()\">\n    <div class=\"modal-header\" (mousedown)=\"onMousedown($event)\">\n      <div class=\"modal-title\">{{title}}</div>\n      <i class=\"icon-close\" (click)=\"hide()\"></i>\n    </div>\n    <div class=\"modal-content\">\n      <ng-template [ngTemplateOutlet]=\"contentTemplate\"\n                   [ngTemplateOutletContext]=\"{$implicit: contentTemplateContext}\"></ng-template>\n    </div>\n    <div *ngIf=\"footerTemplate\" class=\"modal-footer\">\n      <ng-template [ngTemplateOutlet]=\"footerTemplate\"\n                   [ngTemplateOutletContext]=\"{$implicit: footerTemplateContext}\"></ng-template>\n    </div>\n  </div>\n</div>\n", styles: [":host .modal-backdrop{position:absolute;inset:0;z-index:calc(var(--devui-z-index-modal, 1050) - 1)}:host .modal-backdrop .modal{position:absolute;top:0;left:0;z-index:var(--devui-z-index-modal, 1050);background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px);box-shadow:var(--devui-shadow-length-fullscreen-overlay, 0 10px 24px 0) var(--devui-shadow, rgba(37, 43, 58, .24));display:flex;flex-flow:column nowrap}:host .modal-backdrop .modal .modal-header{flex:0 0 36px;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}:host .modal-backdrop .modal .modal-header .modal-title{padding:12px 24px;font-size:var(--devui-font-size-card-title, 14px);font-weight:700}:host .modal-backdrop .modal .modal-header i{position:absolute;top:12px;right:12px;padding:4px;font-size:var(--devui-font-size-card-title, 14px)}:host .modal-backdrop .modal .modal-header i:hover{cursor:pointer;color:var(--devui-danger, #f66f6a);background-color:var(--devui-info-bg, #e9edfa)}:host .modal-backdrop .modal .modal-content{flex:1;overflow:auto;padding:24px;display:flex;flex-flow:column nowrap;font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #71757f)}:host .modal-backdrop .modal .modal-footer{flex:none}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: ModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'rs-modal', template: "<div class=\"modal-backdrop\" [ngStyle]=\"resolveModalBackdropPosition()\">\n  <div #modal class=\"modal\">\n    <div class=\"modal-header\" (mousedown)=\"onMousedown($event)\">\n      <div class=\"modal-title\">{{title}}</div>\n      <i class=\"icon-close\" (click)=\"hide()\"></i>\n    </div>\n    <div class=\"modal-content\">\n      <ng-template [ngTemplateOutlet]=\"contentTemplate\"\n                   [ngTemplateOutletContext]=\"{$implicit: contentTemplateContext}\"></ng-template>\n    </div>\n  </div>\n</div>\n", styles: [":host .modal-backdrop{position:absolute;inset:0;z-index:calc(var(--devui-z-index-modal, 1050) - 1)}:host .modal-backdrop .modal{position:absolute;top:0;left:0;z-index:var(--devui-z-index-modal, 1050);background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px);box-shadow:var(--devui-shadow-length-fullscreen-overlay, 0 10px 24px 0) var(--devui-shadow, rgba(37, 43, 58, .24));display:flex;flex-flow:column nowrap}:host .modal-backdrop .modal .modal-header{flex:0 0 36px;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}:host .modal-backdrop .modal .modal-header .modal-title{padding:12px 24px;font-size:var(--devui-font-size-card-title, 14px);font-weight:700}:host .modal-backdrop .modal .modal-header i{position:absolute;top:12px;right:12px;padding:4px;font-size:var(--devui-font-size-card-title, 14px)}:host .modal-backdrop .modal .modal-header i:hover{cursor:pointer;color:var(--devui-danger, #f66f6a);background-color:var(--devui-info-bg, #e9edfa)}:host .modal-backdrop .modal .modal-content{flex:1;padding:24px;display:flex;flex-flow:column nowrap;font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #71757f)}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { title: [{
+            args: [{ selector: 'rs-modal', template: "<div class=\"modal-backdrop\" [ngStyle]=\"resolveModalBackdropPosition()\">\n  <div #modal class=\"modal\" [ngStyle]=\"resolveModalPosition()\">\n    <div class=\"modal-header\" (mousedown)=\"onMousedown($event)\">\n      <div class=\"modal-title\">{{title}}</div>\n      <i class=\"icon-close\" (click)=\"hide()\"></i>\n    </div>\n    <div class=\"modal-content\">\n      <ng-template [ngTemplateOutlet]=\"contentTemplate\"\n                   [ngTemplateOutletContext]=\"{$implicit: contentTemplateContext}\"></ng-template>\n    </div>\n    <div *ngIf=\"footerTemplate\" class=\"modal-footer\">\n      <ng-template [ngTemplateOutlet]=\"footerTemplate\"\n                   [ngTemplateOutletContext]=\"{$implicit: footerTemplateContext}\"></ng-template>\n    </div>\n  </div>\n</div>\n", styles: [":host .modal-backdrop{position:absolute;inset:0;z-index:calc(var(--devui-z-index-modal, 1050) - 1)}:host .modal-backdrop .modal{position:absolute;top:0;left:0;z-index:var(--devui-z-index-modal, 1050);background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px);box-shadow:var(--devui-shadow-length-fullscreen-overlay, 0 10px 24px 0) var(--devui-shadow, rgba(37, 43, 58, .24));display:flex;flex-flow:column nowrap}:host .modal-backdrop .modal .modal-header{flex:0 0 36px;border-bottom:1px solid var(--devui-dividing-line, #f2f2f3)}:host .modal-backdrop .modal .modal-header .modal-title{padding:12px 24px;font-size:var(--devui-font-size-card-title, 14px);font-weight:700}:host .modal-backdrop .modal .modal-header i{position:absolute;top:12px;right:12px;padding:4px;font-size:var(--devui-font-size-card-title, 14px)}:host .modal-backdrop .modal .modal-header i:hover{cursor:pointer;color:var(--devui-danger, #f66f6a);background-color:var(--devui-info-bg, #e9edfa)}:host .modal-backdrop .modal .modal-content{flex:1;overflow:auto;padding:24px;display:flex;flex-flow:column nowrap;font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #71757f)}:host .modal-backdrop .modal .modal-footer{flex:none}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { title: [{
                 type: Input
             }], size: [{
                 type: Input
@@ -1196,12 +1215,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
                 type: Input
             }], contentTemplateContext: [{
                 type: Input
+            }], footerTemplate: [{
+                type: Input
+            }], footerTemplateContext: [{
+                type: Input
             }], onMouseup: [{
                 type: HostListener,
                 args: ['document:mouseup', ['$event']]
             }], onMousemove: [{
                 type: HostListener,
                 args: ['document:mousemove', ['$event']]
+            }], onWindowResize: [{
+                type: HostListener,
+                args: ['window:resize', ['$event']]
             }] } });
 
 class ModalModule {
@@ -1227,15 +1253,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
 class ModalService {
     constructor() {
     }
-    open(viewContainerRef, title, size = 'default', contentTemplate, contentTemplateContext) {
+    open(viewContainerRef, title, size = 'default', contentTemplate, contentTemplateContext, footerTemplate, footerTemplateContext) {
         const modalRef = viewContainerRef.createComponent(ModalComponent);
         modalRef.instance.hide = () => {
             modalRef.hostView.destroy();
         };
         modalRef.instance.title = title;
-        modalRef.instance.contentTemplate = contentTemplate;
         modalRef.instance.size = size;
+        modalRef.instance.contentTemplate = contentTemplate;
         modalRef.instance.contentTemplateContext = contentTemplateContext;
+        modalRef.instance.footerTemplate = footerTemplate;
+        modalRef.instance.footerTemplateContext = footerTemplateContext;
         modalRef.instance.show();
         return modalRef.instance;
     }