Added main UI functional

ui-ngx/src/app/modules/home/components/home-components.module.ts

@@ -117,6 +117,7 @@ import { DefaultTenantProfileConfigurationComponent } from '@home/components/pro
 import { TenantProfileConfigurationComponent } from '@home/components/profile/tenant/tenant-profile-configuration.component';
 import { SmsProviderConfigurationComponent } from '@home/components/sms/sms-provider-configuration.component';
 import { AwsSnsProviderConfigurationComponent } from '@home/components/sms/aws-sns-provider-configuration.component';
+import { SmppSmsProviderConfigurationComponent } from '@home/components/sms/smpp-sms-provider-configuration.component';
 import { TwilioSmsProviderConfigurationComponent } from '@home/components/sms/twilio-sms-provider-configuration.component';
 import { Lwm2mProfileComponentsModule } from '@home/components/profile/device/lwm2m/lwm2m-profile-components.module';
 import { DashboardPageComponent } from '@home/components/dashboard-page/dashboard-page.component';
@@ -245,6 +246,7 @@ import { DeviceProfileCommonModule } from '@home/components/profile/device/commo
       EditAlarmDetailsDialogComponent,
       SmsProviderConfigurationComponent,
       AwsSnsProviderConfigurationComponent,
+      SmppSmsProviderConfigurationComponent,
       TwilioSmsProviderConfigurationComponent,
       DashboardToolbarComponent,
       DashboardPageComponent,
@@ -356,6 +358,7 @@ import { DeviceProfileCommonModule } from '@home/components/profile/device/commo
     AlarmScheduleComponent,
     SmsProviderConfigurationComponent,
     AwsSnsProviderConfigurationComponent,
+    SmppSmsProviderConfigurationComponent,
     TwilioSmsProviderConfigurationComponent,
     DashboardToolbarComponent,
     DashboardPageComponent,

ui-ngx/src/app/modules/home/components/sms/smpp-sms-provider-configuration.component.html

@@ -0,0 +1,101 @@
+<form [formGroup]="smppSmsProviderConfigurationFormGroup" style="padding-bottom: 16px;">
+    <mat-form-field class="mat-block">
+      <mat-label>SMPP version</mat-label>
+      <input required matInput formControlName="protocolVersion">
+      <mat-error *ngIf="smppSmsProviderConfigurationFormGroup.get('protocolVersion').hasError('required')">
+        SMPP version is required
+      </mat-error>
+    </mat-form-field>
+    <mat-form-field fxFlex class="mat-block">
+      <mat-label>SMPP host</mat-label>
+      <input required matInput formControlName="host">
+      <mat-error *ngIf="smppSmsProviderConfigurationFormGroup.get('host').hasError('required')">
+        SMPP host is required
+      </mat-error>
+    </mat-form-field>
+    <mat-form-field fxFlex class="mat-block" style="margin-right: 8px;">
+      <mat-label>SMPP port</mat-label>
+      <input required matInput type="number" formControlName="port">
+      <mat-error *ngIf="smppSmsProviderConfigurationFormGroup.get('port').hasError('required')">
+        SMPP port is required
+      </mat-error>
+    </mat-form-field>
+    <mat-form-field fxFlex class="mat-block">
+      <mat-label>System ID</mat-label>
+      <input required matInput formControlName="systemId">
+      <mat-error *ngIf="smppSmsProviderConfigurationFormGroup.get('systemId').hasError('required')">
+        System ID is required
+      </mat-error>
+    </mat-form-field>
+    <mat-form-field class="mat-block">
+      <mat-label>Password</mat-label>
+      <input required matInput formControlName="password">
+      <mat-error *ngIf="smppSmsProviderConfigurationFormGroup.get('password').hasError('required')">
+        Password is required
+      </mat-error>
+    </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>System type</mat-label>
+    <input matInput formControlName="systemType">
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>Bind type</mat-label>
+    <mat-select formControlName="bindType">
+      <mat-option *ngFor="let bindType of bindTypes" [value]="bindType.value">
+        {{bindType.name}}
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>Service type</mat-label>
+    <input matInput formControlName="serviceType">
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>Source address</mat-label>
+    <input matInput formControlName="sourceAddress">
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>Source TON</mat-label>
+    <mat-select formControlName="sourceTon">
+      <mat-option *ngFor="let sourceTon of sourcesTon" [value]="sourceTon.value">
+        {{sourceTon.name}}
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>Source NPI</mat-label>
+    <mat-select formControlName="sourceNpi">
+      <mat-option *ngFor="let sourceNpi of sourcesNpi" [value]="sourceNpi.value">
+        {{sourceNpi.name}}
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label translate>Destination TON (Type of Number)</mat-label>
+    <mat-select formControlName="destinationTon">
+      <mat-option *ngFor="let destinationTon of destinationsTon" [value]="destinationTon.value">
+        {{destinationTon.name}}
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>Destination NPI (Numbering Plan Identification)</mat-label>
+    <mat-select formControlName="destinationNpi">
+      <mat-option *ngFor="let destinationNpi of destinationsNpi" [value]="destinationNpi.value">
+        {{destinationNpi.name}}
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>Address range</mat-label>
+    <input matInput formControlName="addressRange">
+  </mat-form-field>
+  <mat-form-field class="mat-block">
+    <mat-label>Coding Scheme</mat-label>
+    <mat-select formControlName="codingScheme">
+      <mat-option *ngFor="let codingScheme of codingSchemes" [value]="codingScheme.value">
+        {{codingScheme.name}}
+      </mat-option>
+    </mat-select>
+  </mat-form-field>
+</form>

ui-ngx/src/app/modules/home/components/sms/smpp-sms-provider-configuration.component.ts

@@ -0,0 +1,163 @@
+import { Component, forwardRef, Input, OnInit } from '@angular/core';
+import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
+import {
+  AwsSnsSmsProviderConfiguration, SmppSmsProviderConfiguration,
+  SmsProviderConfiguration,
+  SmsProviderType
+} from '@shared/models/settings.models';
+import { isDefinedAndNotNull } from '@core/utils';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+
+@Component({
+  selector: 'tb-smpp-sms-provider-configuration',
+  templateUrl: './smpp-sms-provider-configuration.component.html',
+  styleUrls: [],
+  providers: [{
+    provide: NG_VALUE_ACCESSOR,
+    useExisting: forwardRef(() => SmppSmsProviderConfigurationComponent),
+    multi: true
+  }]
+})
+export class SmppSmsProviderConfigurationComponent  implements ControlValueAccessor, OnInit{
+  constructor(private fb: FormBuilder) {
+  }
+  private requiredValue: boolean;
+
+  get required(): boolean {
+    return this.requiredValue;
+  }
+
+  @Input()
+  set required(value: boolean) {
+    this.requiredValue = coerceBooleanProperty(value);
+  }
+  @Input()
+  disabled: boolean;
+
+  smppSmsProviderConfigurationFormGroup: FormGroup;
+  bindTypes = [
+    {value: 'TX', name: 'Transmitter'},
+    {value: 'RX', name: 'Receiver'},
+    {value: 'TRX', name: 'Transciever'},
+  ]
+
+  sourcesTon = [
+    {value: 0, name: 'Unknown'},
+    {value: 1, name: 'International'},
+    {value: 2, name: 'National'},
+    {value: 3, name: 'Network Specific'},
+    {value: 4, name: 'Subscriber Number'},
+    {value: 5, name: 'Alphanumeric'},
+    {value: 6, name: 'Abbreviated'}
+  ]
+
+  sourcesNpi = [
+    {value: 0, name: 'Unknown'},
+    {value: 1, name: 'ISDN/telephone numbering plan (E163/E164)'},
+    {value: 3, name: 'Data numbering plan (X.121)'},
+    {value: 4, name: 'Telex numbering plan (F.69)'},
+    {value: 5, name: 'Land Mobile (E.212)'},
+    {value: 8, name: 'National numbering plan'},
+    {value: 9, name: 'Private numbering plan'},
+    {value: 10, name: 'ERMES numbering plan (ETSI DE/PS 3 01-3)'},
+    {value: 13, name: 'Internet (IP)'},
+    {value: 18, name: 'WAP Client Id (to be defined by WAP Forum)'},
+  ]
+
+  destinationsTon = [
+    {value: 0, name: 'Unknown'},
+    {value: 1, name: 'International'},
+    {value: 2, name: 'National'},
+    {value: 3, name: 'Network Specific'},
+    {value: 4, name: 'Subscriber Number'},
+    {value: 5, name: 'Alphanumeric'},
+    {value: 6, name: 'Abbreviated'},
+  ]
+
+  destinationsNpi = [
+    {value: 0, name: 'Unknown'},
+    {value: 1, name: 'ISDN/telephone numbering plan (E163/E164)'},
+    {value: 3, name: 'Data numbering plan (X.121)'},
+    {value: 4, name: 'Telex numbering plan (F.69)'},
+    {value: 6, name: 'Land Mobile (E.212)'},
+    {value: 8, name: 'National numbering plan'},
+    {value: 9, name: 'Private numbering plan'},
+    {value: 10, name: 'ERMES numbering plan (ETSI DE/PS 3 01-3)'},
+    {value: 13, name: 'Internet (IP)'},
+    {value: 18, name: 'WAP Client Id (to be defined by WAP Forum)'},
+  ]
+
+  codingSchemes = [
+    {value: 0, name: 'SMSC Default Alphabet (ASCII for short and long code and to GSM for toll-free)'},
+    {value: 1, name: 'IA5 (ASCII for short and long code, Latin 9 for toll-free (ISO-8859-9))'},
+    {value: 2, name: 'Octet Unspecified (8-bit binary)'},
+    {value: 3, name: 'Latin 1 (ISO-8859-1)'},
+    {value: 4, name: 'Octet Unspecified (8-bit binary)'},
+    {value: 5, name: 'JIS (X 0208-1990)'},
+    {value: 6, name: 'Cyrillic (ISO-8859-5)'},
+    {value: 7, name: 'Latin/Hebrew (ISO-8859-8)'},
+    {value: 8, name: 'UCS2/UTF-16 (ISO/IEC-10646)'},
+    {value: 9, name: 'Pictogram Encoding'},
+    {value: 10, name: 'Music Codes (ISO-2022-JP)'},
+    {value: 13, name: 'Extended Kanji JIS (X 0212-1990)'},
+    {value: 14, name: 'Korean Graphic Character Set (KS C 5601/KS X 1001)'},
+  ]
+
+  private propagateChange = (v: any) => { };
+
+  ngOnInit(): void {
+    this.smppSmsProviderConfigurationFormGroup = this.fb.group({
+      protocolVersion: [null, [Validators.required]],
+      host: [null, [Validators.required]],
+      port: [null, [Validators.required]],
+      systemId: [null, [Validators.required]],
+      password: [null, [Validators.required]],
+      systemType: [null],
+      bindType: [null, []],
+      serviceType: [null, []],
+      sourceAddress: [null, []],
+      sourceTon: [null, []],
+      sourceNpi: [null, []],
+      destinationTon: [null, []],
+      destinationNpi: [null, []],
+      addressRange: [null, []],
+      codingScheme: [null, []],
+    });
+
+    this.smppSmsProviderConfigurationFormGroup.valueChanges.subscribe(() => {
+      this.updateValue();
+    });
+  }
+
+  registerOnChange(fn: any): void {
+    this.propagateChange = fn;
+  }
+
+  registerOnTouched(fn: any): void {
+  }
+
+  setDisabledState(isDisabled: boolean): void {
+    this.disabled = isDisabled;
+    if (this.disabled) {
+      this.smppSmsProviderConfigurationFormGroup.disable({emitEvent: false});
+    } else {
+      this.smppSmsProviderConfigurationFormGroup.enable({emitEvent: false});
+    }
+  }
+
+  writeValue(value: AwsSnsSmsProviderConfiguration | null): void {
+    if (isDefinedAndNotNull(value)) {
+      this.smppSmsProviderConfigurationFormGroup.patchValue(value, {emitEvent: false});
+    }
+  }
+
+  private updateValue() {
+    let configuration: SmppSmsProviderConfiguration = null;
+    if (this.smppSmsProviderConfigurationFormGroup.valid) {
+      configuration = this.smppSmsProviderConfigurationFormGroup.value;
+      (configuration as SmsProviderConfiguration).type = SmsProviderType.SMPP;
+    }
+    this.propagateChange(configuration);
+  }
+
+}

ui-ngx/src/app/modules/home/components/sms/sms-provider-configuration.component.html

@@ -40,5 +40,11 @@
         formControlName="configuration">
       </tb-twilio-sms-provider-configuration>
     </ng-template>
+    <ng-template [ngSwitchCase]="smsProviderType.SMPP">
+      <tb-smpp-sms-provider-configuration
+        [required]="required"
+        formControlName="configuration">
+      </tb-smpp-sms-provider-configuration>
+    </ng-template>
   </div>
 </div>

ui-ngx/src/app/shared/models/settings.models.ts

@@ -14,8 +14,9 @@
 /// limitations under the License.
 ///
 
-import { ValidatorFn } from '@angular/forms';
+import { ValidatorFn, Validators } from '@angular/forms';
-import { isNotEmptyStr } from '@core/utils';
+import { isNotEmptyStr, isNumber } from '@core/utils';
+import { number, string } from 'prop-types';
 
 export const smtpPortPattern: RegExp = /^([0-9]{1,4}|[1-5][0-9]{4}|6[0-4][0-9]{3}|65[0-4][0-9]{2}|655[0-2][0-9]|6553[0-5])$/;
 
@@ -71,13 +72,15 @@ export const phoneNumberPatternTwilio = /^\+[1-9]\d{1,14}$|^(MG|PN).*$/;
 
 export enum SmsProviderType {
   AWS_SNS = 'AWS_SNS',
-  TWILIO = 'TWILIO'
+  TWILIO = 'TWILIO',
+  SMPP = 'SMPP'
 }
 
 export const smsProviderTypeTranslationMap = new Map<SmsProviderType, string>(
   [
     [SmsProviderType.AWS_SNS, 'admin.sms-provider-type-aws-sns'],
-    [SmsProviderType.TWILIO, 'admin.sms-provider-type-twilio']
+    [SmsProviderType.TWILIO, 'admin.sms-provider-type-twilio'],
+    [SmsProviderType.SMPP, 'admin.sms-provider-type-smpp']
   ]
 );
 
@@ -93,7 +96,26 @@ export interface TwilioSmsProviderConfiguration {
   numberFrom?: string;
 }
 
-export type SmsProviderConfigurations = AwsSnsSmsProviderConfiguration & TwilioSmsProviderConfiguration;
+export interface SmppSmsProviderConfiguration {
+  protocolVersion?: string,
+  host?: string,
+  port?: number,
+  systemId?: string,
+  password?: string,
+  systemType?: string,
+  bindType?: string,
+  serviceType?: string,
+  sourceAddress?: string,
+  sourceTon?: number,
+  sourceNpi?: number,
+  destinationTon?: number,
+  destinationNpi?: number,
+  addressRange?: string,
+  codingScheme?: number
+}
+
+
+export type SmsProviderConfigurations = SmppSmsProviderConfiguration & AwsSnsSmsProviderConfiguration & TwilioSmsProviderConfiguration;
 
 export interface SmsProviderConfiguration extends SmsProviderConfigurations {
   type: SmsProviderType;
@@ -117,6 +139,11 @@ export function smsProviderConfigurationValidator(required: boolean): ValidatorF
             valid = isNotEmptyStr(twilioConfiguration.numberFrom) && isNotEmptyStr(twilioConfiguration.accountSid)
               && isNotEmptyStr(twilioConfiguration.accountToken);
             break;
+          case SmsProviderType.SMPP:
+            const smppConfiguration: SmppSmsProviderConfiguration = configuration;
+            valid = isNotEmptyStr(smppConfiguration.protocolVersion) && isNotEmptyStr(smppConfiguration.host)
+              && isNumber(smppConfiguration.port) && isNotEmptyStr(smppConfiguration.systemId) && isNotEmptyStr(smppConfiguration.password);
+            break;
         }
       }
       if (!valid) {
@@ -155,6 +182,26 @@ export function createSmsProviderConfiguration(type: SmsProviderType): SmsProvid
         };
         smsProviderConfiguration = {...twilioSmsProviderConfiguration, type: SmsProviderType.TWILIO};
         break;
+      case SmsProviderType.SMPP:
+        const smppSmsProviderConfiguration: SmppSmsProviderConfiguration = {
+          protocolVersion: '',
+          host: '',
+          port: null,
+          systemId: '',
+          password: '',
+          systemType: '',
+          bindType: 'TX',
+          serviceType: '',
+          sourceAddress: '',
+          sourceTon: 5,
+          sourceNpi: 0,
+          destinationTon: 5,
+          destinationNpi: 0,
+          addressRange: '',
+          codingScheme: 0
+        };
+        smsProviderConfiguration = {...smppSmsProviderConfiguration, type: SmsProviderType.SMPP};
+        break;
     }
   }
   return smsProviderConfiguration;

ui-ngx/src/assets/locale/locale.constant-en_US.json

@@ -112,6 +112,7 @@
         "sms-provider-type-required": "SMS provider type is required.",
         "sms-provider-type-aws-sns": "Amazon SNS",
         "sms-provider-type-twilio": "Twilio",
+        "sms-provider-type-smpp": "SMPP",
         "aws-access-key-id": "AWS Access Key ID",
         "aws-access-key-id-required": "AWS Access Key ID is required",
         "aws-secret-access-key": "AWS Secret Access Key",