@abp/ng.cms-kit 10.2.0-rc.1 → 10.2.0-rc.3

package/fesm2022/abp-ng.cms-kit-admin.mjs

@@ -14,7 +14,7 @@ import { PageModule, PageComponent } from '@abp/ng.components/page';
 import { ToasterService, ConfirmationService, Confirmation, DateTimeAdapter, FormInputComponent, ButtonComponent, ModalComponent, ModalCloseDirective } from '@abp/ng.theme.shared';
 import { PageAdminService, PageStatus, BlogPostAdminService, CommentAdminService, commentApproveStateOptions, CommentApproveState, TagAdminService, BlogAdminService, BlogFeatureAdminService, BlogPostStatus, MediaDescriptorAdminService, EntityTagAdminService, MenuItemAdminService, GlobalResourceAdminService, pageStatusOptions } from '@abp/ng.cms-kit/proxy';
 import { Router, ActivatedRoute } from '@angular/router';
-import { tap, switchMap, debounceTime, distinctUntilChanged, finalize, map } from 'rxjs/operators';
+import { tap, finalize, switchMap, debounceTime, distinctUntilChanged, map } from 'rxjs/operators';
 import * as i2$1 from '@ngx-validate/core';
 import { NgxValidateCoreModule } from '@ngx-validate/core';
 import { prepareSlugFromControl, CodeMirrorEditorComponent, ToastuiEditorComponent, dasharize } from '@abp/ng.cms-kit';
@@ -778,6 +778,7 @@ class BlogModalComponent {
         this.destroyRef = inject(DestroyRef);
         this.selected = input(...(ngDevMode ? [undefined, { debugName: "selected" }] : []));
         this.visibleChange = output();
+        this.modalBusy = false;
     }
     ngOnInit() {
         this.buildForm();
@@ -791,6 +792,10 @@ class BlogModalComponent {
         this.visibleChange.emit({ visible, refresh });
     }
     save() {
+        if (this.modalBusy) {
+            return;
+        }
+        this.modalBusy = true;
         if (!this.form.valid) {
             return;
         }
@@ -803,13 +808,13 @@ class BlogModalComponent {
                 ...this.form.value,
             });
         }
-        observable$.subscribe(() => {
+        observable$.pipe(finalize(() => (this.modalBusy = false))).subscribe(() => {
             this.onVisibleChange(false, true);
             this.toasterService.success('AbpUi::SavedSuccessfully');
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: BlogModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: BlogModalComponent, isStandalone: true, selector: "abp-blog-modal", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visibleChange: "visibleChange" }, ngImport: i0, template: "<abp-modal [visible]=\"true\" (visibleChange)=\"onVisibleChange($event)\">\r\n  <ng-template #abpHeader>\r\n    <h3>\r\n      {{ (selected()?.id ? 'AbpUi::Edit' : 'AbpUi::New') | abpLocalization }}\r\n    </h3>\r\n  </ng-template>\r\n\r\n  <ng-template #abpBody>\r\n    @if (form) {\r\n      <form [formGroup]=\"form\" (ngSubmit)=\"save()\" validateOnSubmit>\r\n        <abp-extensible-form [selectedRecord]=\"selected()\" />\r\n      </form>\r\n    } @else {\r\n      <div class=\"text-center\">\r\n        <i class=\"fa fa-pulse fa-spinner\" aria-hidden=\"true\"></i>\r\n      </div>\r\n    }\r\n  </ng-template>\r\n\r\n  <ng-template #abpFooter>\r\n    <button type=\"button\" class=\"btn btn-outline-primary\" abpClose>\r\n      {{ 'AbpUi::Cancel' | abpLocalization }}\r\n    </button>\r\n    <abp-button iconClass=\"fa fa-check\" [disabled]=\"form?.invalid\" (click)=\"save()\">\r\n      {{ 'AbpUi::Save' | abpLocalization }}\r\n    </abp-button>\r\n  </ng-template>\r\n</abp-modal>\r\n", dependencies: [{ kind: "component", type: ExtensibleFormComponent, selector: "abp-extensible-form", inputs: ["selectedRecord"], exportAs: ["abpExtensibleForm"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: NgxValidateCoreModule }, { kind: "directive", type: i2$1.ValidationGroupDirective, selector: "[formGroup],[formGroupName]", exportAs: ["validationGroup"] }, { kind: "component", type: ModalComponent, selector: "abp-modal", inputs: ["visible", "busy", "options", "suppressUnsavedChangesWarning"], outputs: ["visibleChange", "init", "appear", "disappear"] }, { kind: "directive", type: ModalCloseDirective, selector: "[abpClose]" }, { kind: "component", type: ButtonComponent, selector: "abp-button", inputs: ["buttonId", "buttonClass", "buttonType", "formName", "iconClass", "loading", "disabled", "attributes"], outputs: ["click", "focus", "blur", "abpClick", "abpFocus", "abpBlur"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.9", type: BlogModalComponent, isStandalone: true, selector: "abp-blog-modal", inputs: { selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visibleChange: "visibleChange" }, ngImport: i0, template: "<abp-modal [visible]=\"true\" (visibleChange)=\"onVisibleChange($event)\" [busy]=\"modalBusy\">\r\n  <ng-template #abpHeader>\r\n    <h3>\r\n      {{ (selected()?.id ? 'AbpUi::Edit' : 'AbpUi::New') | abpLocalization }}\r\n    </h3>\r\n  </ng-template>\r\n\r\n  <ng-template #abpBody>\r\n    @if (form) {\r\n      <form [formGroup]=\"form\" (ngSubmit)=\"save()\" validateOnSubmit>\r\n        <abp-extensible-form [selectedRecord]=\"selected()\" />\r\n      </form>\r\n    } @else {\r\n      <div class=\"text-center\">\r\n        <i class=\"fa fa-pulse fa-spinner\" aria-hidden=\"true\"></i>\r\n      </div>\r\n    }\r\n  </ng-template>\r\n\r\n  <ng-template #abpFooter>\r\n    <button type=\"button\" class=\"btn btn-outline-primary\" abpClose>\r\n      {{ 'AbpUi::Cancel' | abpLocalization }}\r\n    </button>\r\n    <abp-button iconClass=\"fa fa-check\" [disabled]=\"form?.invalid\" (click)=\"save()\">\r\n      {{ 'AbpUi::Save' | abpLocalization }}\r\n    </abp-button>\r\n  </ng-template>\r\n</abp-modal>\r\n", dependencies: [{ kind: "component", type: ExtensibleFormComponent, selector: "abp-extensible-form", inputs: ["selectedRecord"], exportAs: ["abpExtensibleForm"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: NgxValidateCoreModule }, { kind: "directive", type: i2$1.ValidationGroupDirective, selector: "[formGroup],[formGroupName]", exportAs: ["validationGroup"] }, { kind: "component", type: ModalComponent, selector: "abp-modal", inputs: ["visible", "busy", "options", "suppressUnsavedChangesWarning"], outputs: ["visibleChange", "init", "appear", "disappear"] }, { kind: "directive", type: ModalCloseDirective, selector: "[abpClose]" }, { kind: "component", type: ButtonComponent, selector: "abp-button", inputs: ["buttonId", "buttonClass", "buttonType", "formName", "iconClass", "loading", "disabled", "attributes"], outputs: ["click", "focus", "blur", "abpClick", "abpFocus", "abpBlur"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImport: i0, type: BlogModalComponent, decorators: [{
             type: Component,
@@ -822,7 +827,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.9", ngImpor
                         ModalComponent,
                         ModalCloseDirective,
                         ButtonComponent,
-                    ], template: "<abp-modal [visible]=\"true\" (visibleChange)=\"onVisibleChange($event)\">\r\n  <ng-template #abpHeader>\r\n    <h3>\r\n      {{ (selected()?.id ? 'AbpUi::Edit' : 'AbpUi::New') | abpLocalization }}\r\n    </h3>\r\n  </ng-template>\r\n\r\n  <ng-template #abpBody>\r\n    @if (form) {\r\n      <form [formGroup]=\"form\" (ngSubmit)=\"save()\" validateOnSubmit>\r\n        <abp-extensible-form [selectedRecord]=\"selected()\" />\r\n      </form>\r\n    } @else {\r\n      <div class=\"text-center\">\r\n        <i class=\"fa fa-pulse fa-spinner\" aria-hidden=\"true\"></i>\r\n      </div>\r\n    }\r\n  </ng-template>\r\n\r\n  <ng-template #abpFooter>\r\n    <button type=\"button\" class=\"btn btn-outline-primary\" abpClose>\r\n      {{ 'AbpUi::Cancel' | abpLocalization }}\r\n    </button>\r\n    <abp-button iconClass=\"fa fa-check\" [disabled]=\"form?.invalid\" (click)=\"save()\">\r\n      {{ 'AbpUi::Save' | abpLocalization }}\r\n    </abp-button>\r\n  </ng-template>\r\n</abp-modal>\r\n" }]
+                    ], template: "<abp-modal [visible]=\"true\" (visibleChange)=\"onVisibleChange($event)\" [busy]=\"modalBusy\">\r\n  <ng-template #abpHeader>\r\n    <h3>\r\n      {{ (selected()?.id ? 'AbpUi::Edit' : 'AbpUi::New') | abpLocalization }}\r\n    </h3>\r\n  </ng-template>\r\n\r\n  <ng-template #abpBody>\r\n    @if (form) {\r\n      <form [formGroup]=\"form\" (ngSubmit)=\"save()\" validateOnSubmit>\r\n        <abp-extensible-form [selectedRecord]=\"selected()\" />\r\n      </form>\r\n    } @else {\r\n      <div class=\"text-center\">\r\n        <i class=\"fa fa-pulse fa-spinner\" aria-hidden=\"true\"></i>\r\n      </div>\r\n    }\r\n  </ng-template>\r\n\r\n  <ng-template #abpFooter>\r\n    <button type=\"button\" class=\"btn btn-outline-primary\" abpClose>\r\n      {{ 'AbpUi::Cancel' | abpLocalization }}\r\n    </button>\r\n    <abp-button iconClass=\"fa fa-check\" [disabled]=\"form?.invalid\" (click)=\"save()\">\r\n      {{ 'AbpUi::Save' | abpLocalization }}\r\n    </abp-button>\r\n  </ng-template>\r\n</abp-modal>\r\n" }]
         }], propDecorators: { selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], visibleChange: [{ type: i0.Output, args: ["visibleChange"] }] } });
 
 class BlogFeaturesModalComponent {