Merge pull request #13362 from abpframework/issue/12579

issue #12579 implemented

npm/ng-packs/apps/dev-app/src/environments/environment.ts

@@ -37,7 +37,7 @@ export const environment = {
     AbpIdentity: {
       rootNamespace: 'Volo.Abp',
     },
-    AbpSettingManagement: {
+    SettingManagement: {
       rootNamespace: 'Volo.Abp.SettingManagement',
     },
   },

npm/ng-packs/packages/setting-management/config/src/components/email-setting-group/email-setting-group.component.html → npm/ng-packs/packages/setting-management/config/src/lib/components/email-setting-group/email-setting-group.component.html

@@ -6,13 +6,13 @@
   <div class="mb-3 form-group">
     <label class="form-label">{{
       'AbpSettingManagement::DefaultFromDisplayName' | abpLocalization
-    }}</label>
+      }}</label>
     <input type="text" class="form-control" formControlName="defaultFromDisplayName" />
   </div>
   <div class="mb-3 form-group">
     <label class="form-label">{{
       'AbpSettingManagement::DefaultFromAddress' | abpLocalization
-    }}</label>
+      }}</label>
     <input type="text" class="form-control" formControlName="defaultFromAddress" />
   </div>
   <div class="mb-3 form-group">
@@ -25,34 +25,23 @@
   </div>
 
   <div class="form-check mb-2">
-    <input
-      type="checkbox"
-      id="smtp-enable-ssl"
-      class="form-check-input"
-      formControlName="smtpEnableSsl"
-    />
+    <input type="checkbox" id="smtp-enable-ssl" class="form-check-input" formControlName="smtpEnableSsl" />
     <label class="form-check-label" for="smtp-enable-ssl">{{
       'AbpSettingManagement::SmtpEnableSsl' | abpLocalization
-    }}</label>
+      }}</label>
   </div>
   <div class="form-check mb-2">
-    <input
-      type="checkbox"
-      id="smtp-use-default-credentials"
-      class="form-check-input"
-      formControlName="smtpUseDefaultCredentials"
-    />
+    <input type="checkbox" id="smtp-use-default-credentials" class="form-check-input"
+      formControlName="smtpUseDefaultCredentials" />
     <label class="form-check-label" for="smtp-use-default-credentials">{{
       'AbpSettingManagement::SmtpUseDefaultCredentials' | abpLocalization
-    }}</label>
+      }}</label>
   </div>
 
-  <div
-    [@collapse]="{
+  <div [@collapse]="{
       value: form.get('smtpUseDefaultCredentials')?.value ? 'collapsed' : 'expanded',
       params: { time: '200ms', easing: 'linear' }
-    }"
-  >
+    }">
     <div class="mb-3 form-group">
       <label class="form-label">{{ 'AbpSettingManagement::SmtpDomain' | abpLocalization }}</label>
       <input type="text" class="form-control" formControlName="smtpDomain" />
@@ -74,4 +63,51 @@
   <button type="submit" class="btn btn-primary">
     {{ 'AbpSettingManagement::Save' | abpLocalization }}
   </button>
+  <button type="button" (click)="openSendEmailModal()" class="btn btn-primary mx-2" *abpPermission="emailingPolicy">
+    <i class="fa f-send"></i>
+    {{ 'AbpSettingManagement::SendTestEmail' | abpLocalization }}
+  </button>
 </form>
+
+<abp-modal [(visible)]="isEmailTestModalOpen" [options]="modalSize">
+  <ng-template #abpHeader>
+    <h3>{{"SendTestEmail" | abpLocalization}}</h3>
+  </ng-template>
+
+  <ng-template #abpBody>
+    <form [formGroup]="emailTestForm" id="emailTestForm" (ngSubmit)="emailTestFormSubmit()">
+
+      <div class="mb-3 form-group">
+        <label class="form-label">{{ 'AbpSettingManagement::SenderEmailAddress' | abpLocalization }}</label>
+        <input class="form-control" formControlName="senderEmailAddress" />
+      </div>
+
+      <div class="mb-3 form-group">
+        <label class="form-label">{{ 'AbpSettingManagement::TargetEmailAddress' | abpLocalization }}</label>
+        <input class="form-control" formControlName="targetEmailAddress" />
+      </div>
+
+
+      <div class="mb-3 form-group">
+        <label class="form-label">{{ 'AbpSettingManagement::Subject' | abpLocalization }}</label>
+        <input class="form-control" formControlName="subject" />
+      </div>
+
+
+      <div class="mb-3 form-group">
+        <label class="form-label">{{ 'AbpSettingManagement::Body' | abpLocalization }}</label>
+        <textarea class="form-control" formControlName="body"></textarea>
+      </div>
+    </form>
+  </ng-template>
+
+
+  <ng-template #abpFooter>
+    <abp-button buttonType="submit" iconClass="fa fa-send" formName="emailTestForm"
+      [disabled]="emailTestForm.invalid && emailTestForm.dirty">
+      <span>{{ 'AbpTenantManagement::Send' | abpLocalization }}</span>
+    </abp-button>
+
+    <button type="button" class="btn btn-secondary" abpClose>Close</button>
+  </ng-template>
+</abp-modal>

npm/ng-packs/packages/setting-management/config/src/components/email-setting-group/email-setting-group.component.ts → npm/ng-packs/packages/setting-management/config/src/lib/components/email-setting-group/email-setting-group.component.ts

@@ -1,7 +1,9 @@
+import { NgbModalOptions } from '@ng-bootstrap/ng-bootstrap';
 import { collapse, ToasterService } from '@abp/ng.theme.shared';
 import { Component, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { finalize } from 'rxjs/operators';
+import { SettingManagementPolicyNames } from '../../enums/policy-names';
 import { EmailSettingsService } from '../../proxy/email-settings.service';
 import { EmailSettingsDto } from '../../proxy/models';
 
@@ -12,8 +14,11 @@ import { EmailSettingsDto } from '../../proxy/models';
 })
 export class EmailSettingGroupComponent implements OnInit {
   form!: FormGroup;
-
+  emailTestForm: FormGroup;
   saving = false;
+  emailingPolicy = SettingManagementPolicyNames.Emailing;
+  isEmailTestModalOpen = false;
+  modalSize:NgbModalOptions= { size:"lg"} 
 
   constructor(
     private emailSettingsService: EmailSettingsService,
@@ -57,4 +62,30 @@ export class EmailSettingGroupComponent implements OnInit {
         this.getData();
       });
   }
+  openSendEmailModal() {
+    this.buildEmailTestForm();
+    this.isEmailTestModalOpen = true;
+  }
+
+  buildEmailTestForm() {
+    this.emailTestForm = this.fb.group({
+      senderEmailAddress: ['', [Validators.required, Validators.email]],
+      targetEmailAddress: ['', [Validators.required, Validators.email]],
+      subject: ['', [Validators.required]],
+      body: [''],
+    });
+  }
+
+  emailTestFormSubmit() {
+
+    if(this.emailTestForm.invalid){
+      return;
+    }
+     this.emailSettingsService.sendTestEmail(this.emailTestForm.value).subscribe(res => {
+      this.toasterService.success('AbpSettingManagement::SuccessfullySent');
+      this.isEmailTestModalOpen = false;
+    })
+      
+  }
+
 }

npm/ng-packs/packages/setting-management/config/src/enums/index.ts → npm/ng-packs/packages/setting-management/config/src/lib/enums/index.ts

@@ -1,2 +1,3 @@
 export * from './route-names';
 export * from './setting-tab-names';
+export * from './policy-names';

npm/ng-packs/packages/setting-management/config/src/lib/enums/policy-names.ts

@@ -0,0 +1,4 @@
+export const enum SettingManagementPolicyNames {
+  Emailing = 'SettingManagement.Emailing',
+ }
+

npm/ng-packs/packages/setting-management/config/src/lib/proxy/email-settings.service.ts

@@ -0,0 +1,35 @@
+import type { EmailSettingsDto, SendTestEmailInput, UpdateEmailSettingsDto } from './models';
+import { RestService } from '@abp/ng.core';
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class EmailSettingsService {
+  apiName = 'SettingManagement';
+
+  get = () =>
+    this.restService.request<any, EmailSettingsDto>({
+      method: 'GET',
+      url: '/api/setting-management/emailing',
+    },
+    { apiName: this.apiName });
+
+  sendTestEmail = (input: SendTestEmailInput) =>
+    this.restService.request<any, void>({
+      method: 'POST',
+      url: '/api/setting-management/emailing/send-test-email',
+      body: input,
+    },
+    { apiName: this.apiName });
+
+  update = (input: UpdateEmailSettingsDto) =>
+    this.restService.request<any, void>({
+      method: 'POST',
+      url: '/api/setting-management/emailing',
+      body: input,
+    },
+    { apiName: this.apiName });
+
+  constructor(private restService: RestService) {}
+}

npm/ng-packs/packages/setting-management/config/src/proxy/models.ts → npm/ng-packs/packages/setting-management/config/src/lib/proxy/models.ts

@@ -1,3 +1,4 @@
+
 export interface EmailSettingsDto {
   smtpHost?: string;
   smtpPort: number;
@@ -10,6 +11,13 @@ export interface EmailSettingsDto {
   defaultFromDisplayName?: string;
 }
 
+export interface SendTestEmailInput {
+  senderEmailAddress: string;
+  targetEmailAddress: string;
+  subject: string;
+  body?: string;
+}
+
 export interface UpdateEmailSettingsDto {
   smtpHost?: string;
   smtpPort: number;

npm/ng-packs/packages/setting-management/config/src/setting-management-config.module.ts → npm/ng-packs/packages/setting-management/config/src/lib/setting-management-config.module.ts

@@ -1,3 +1,4 @@
+import { ThemeSharedModule } from '@abp/ng.theme.shared';
 import { ModuleWithProviders, NgModule } from '@angular/core';
 import { CoreModule } from '@abp/ng.core';
 import { NgxValidateCoreModule } from '@ngx-validate/core';
@@ -8,7 +9,7 @@ import { SETTING_MANAGEMENT_SETTING_TAB_PROVIDERS } from './providers/setting-ta
 import { EmailSettingGroupComponent } from './components/email-setting-group/email-setting-group.component';
 
 @NgModule({
-  imports: [CoreModule, NgxValidateCoreModule],
+  imports: [CoreModule,ThemeSharedModule,NgxValidateCoreModule],
   declarations: [EmailSettingGroupComponent],
   exports: [EmailSettingGroupComponent],
 })

npm/ng-packs/packages/setting-management/config/src/proxy/email-settings.service.ts

@@ -1,31 +0,0 @@
-import type { EmailSettingsDto, UpdateEmailSettingsDto } from './models';
-import { RestService } from '@abp/ng.core';
-import { Injectable } from '@angular/core';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class EmailSettingsService {
-  apiName = 'SettingManagement';
-
-  get = () =>
-    this.restService.request<any, EmailSettingsDto>(
-      {
-        method: 'GET',
-        url: '/api/setting-management/emailing',
-      },
-      { apiName: this.apiName },
-    );
-
-  update = (input: UpdateEmailSettingsDto) =>
-    this.restService.request<any, void>(
-      {
-        method: 'POST',
-        url: '/api/setting-management/emailing',
-        body: input,
-      },
-      { apiName: this.apiName },
-    );
-
-  constructor(private restService: RestService) {}
-}

npm/ng-packs/packages/setting-management/config/src/public-api.ts

@@ -1,6 +1,6 @@
-export * from './components/email-setting-group/email-setting-group.component';
-export * from './enums';
-export * from './providers';
-export * from './proxy';
-export * from './services';
-export * from './setting-management-config.module';
+export * from './lib/components/email-setting-group/email-setting-group.component';
+export * from './lib/enums';
+export * from './lib/providers';
+export * from './lib/proxy';
+export * from './lib/services';
+export * from './lib/setting-management-config.module';