refactor(tenant-management): tenants

npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html

@@ -90,7 +90,7 @@
   </div>
 </div>
 
-<abp-modal [(visible)]="isModalVisible">
+<abp-modal [(visible)]="isModalVisible" [busy]="modalBusy">
   <ng-template #abpHeader>
     <h3>{{ selectedModalContent.title | abpLocalization }}</h3>
   </ng-template>
@@ -103,13 +103,7 @@
     <button #abpClose type="button" class="btn btn-secondary">
       {{ 'AbpTenantManagement::Cancel' | abpLocalization }}
     </button>
-    <abp-button
-      [requestType]="['POST', 'PUT', 'DELETE']"
-      requestURLContainSearchValue="multi-tenancy"
-      iconClass="fa fa-check"
-      (click)="save()"
-      >{{ 'AbpIdentity::Save' | abpLocalization }}</abp-button
-    >
+    <abp-button iconClass="fa fa-check" (click)="save()">{{ 'AbpIdentity::Save' | abpLocalization }}</abp-button>
   </ng-template>
 </abp-modal>
 

npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.ts

@@ -52,6 +52,8 @@ export class TenantsComponent {
 
   loading: boolean = false;
 
+  modalBusy: boolean = false;
+
   get useSharedDatabase(): boolean {
     return this.defaultConnectionStringForm.get('useSharedDatabase').value;
   }
@@ -144,11 +146,13 @@ export class TenantsComponent {
   }
 
   saveConnectionString() {
+    this.modalBusy = true;
     if (this.useSharedDatabase) {
       this.tenantService
         .deleteDefaultConnectionString(this.selected.id)
         .pipe(take(1))
         .subscribe(() => {
+          this.modalBusy = false;
           this.isModalVisible = false;
         });
     } else {
@@ -156,6 +160,7 @@ export class TenantsComponent {
         .updateDefaultConnectionString({ id: this.selected.id, defaultConnectionString: this.connectionString })
         .pipe(take(1))
         .subscribe(() => {
+          this.modalBusy = false;
           this.isModalVisible = false;
         });
     }
@@ -163,6 +168,7 @@ export class TenantsComponent {
 
   saveTenant() {
     if (!this.tenantForm.valid) return;
+    this.modalBusy = true;
 
     this.store
       .dispatch(
@@ -171,6 +177,7 @@ export class TenantsComponent {
           : new CreateTenant(this.tenantForm.value),
       )
       .subscribe(() => {
+        this.modalBusy = false;
         this.isModalVisible = false;
       });
   }
@@ -183,6 +190,7 @@ export class TenantsComponent {
       .subscribe((status: Toaster.Status) => {
         if (status === Toaster.Status.confirm) {
           this.store.dispatch(new DeleteTenant(id));
+          this.modalBusy = false;
         }
       });
   }