Newer
Older
<ion-header [translucent]="true">
<ion-toolbar color="primary">
<ion-buttons slot="start">
<ion-menu-button menu="left-menu"></ion-menu-button>
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<ion-back-button></ion-back-button>
</ion-buttons>
<ion-title>{{title}}</ion-title>
</ion-toolbar>
</ion-header>
<form *ngIf="!loading" style="display: contents;" id="sendmailForm" (ngSubmit)="onSubmit()" #sendmailForm="ngForm">
<ion-content>
<ion-item>
<ion-label color="secondary" position="floating">{{'lang.configurationType' | translate}} *</ion-label>
<ion-select name="smtpType" [(ngModel)]="sendmail.type" interface="popover" required>
<ion-select-option *ngFor="let type of smtpTypeList" [value]="type.id">{{type.label | translate}}
</ion-select-option>
</ion-select>
</ion-item>
<ion-grid>
<ion-row>
<ion-col size="2">
<ion-item>
<ion-label color="secondary" position="floating">{{'lang.smtpAuth' | translate}} *
</ion-label>
<ion-select name="SMTPSecure" [disabled]="['smtp', 'mail'].indexOf(sendmail.type) == -1"
[(ngModel)]="sendmail.secure" [value]="sendmail.secure" interface="popover" required>
<ion-select-option *ngFor="let security of smtpSecList" [value]="security.id">
{{security.label | translate}}
</ion-select-option>
</ion-select>
</ion-item>
</ion-col>
<ion-col size="8">
<ion-item>
<ion-label color="secondary" position="floating">{{'lang.host' | translate}} *</ion-label>
<ion-input name="host" [disabled]="['smtp', 'mail'].indexOf(sendmail.type) == -1"
[(ngModel)]="sendmail.host" required>
</ion-input>
</ion-item>
</ion-col>
<ion-col size="2">
<ion-item>
<ion-label color="secondary" position="floating">{{'lang.port' | translate}} *</ion-label>
<ion-input type="number" name="port" [disabled]="['smtp', 'mail'].indexOf(sendmail.type) == -1"
[(ngModel)]="sendmail.port" required>
</ion-input>
</ion-item>
</ion-col>
</ion-row>
</ion-grid>
<ion-item>
<ion-toggle name="SMTPAuth" [(ngModel)]="sendmail.auth" [checked]="sendmail.auth"
[disabled]="['smtp', 'mail'].indexOf(sendmail.type) == -1" (ngModelChange)="cleanAuthInfo()">
</ion-toggle>
<ion-label>{{'lang.enableAuth' | translate}}</ion-label>
</ion-item>
<ion-item>
<ion-label color="secondary" position="floating">{{'lang.id' | translate}} *</ion-label>
<ion-input name="user" [(ngModel)]="sendmail.user"
[disabled]="!sendmail.auth || ['smtp', 'mail'].indexOf(sendmail.type) == -1" required>
</ion-input>
</ion-item>
<ion-item style="align-items: center;">
<ion-button slot="end" fill="clear" color="primary" (click)="hidePassword = !hidePassword">
<ion-icon color="primary" [name]="hidePassword ? 'eye-outline' : 'eye-off-outline'">
</ion-icon>
</ion-button>
<ion-label color="secondary" position="floating">{{passwordLanguage}}
{{!sendmail.passwordAlreadyExists ? '*' : ''}}</ion-label>
<ion-input name="password" [type]="hidePassword ? 'password' : 'text'" [(ngModel)]="sendmail.password"
[disabled]="!sendmail.auth || ['smtp', 'mail'].indexOf(sendmail.type) == -1"
[required]="!sendmail.passwordAlreadyExists">
</ion-input>
</ion-item>
<ion-item>
<ion-label color="secondary" position="floating">{{'lang.mailFrom' | translate}}</ion-label>
<ion-input name="mailFrom" [(ngModel)]="sendmail.from"
[disabled]="['smtp', 'mail'].indexOf(sendmail.type) == -1"
pattern="(^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$)">
</ion-input>
</ion-item>
<ion-item text-center lines="none" style="position: sticky;bottom:0px;z-index:1;">
<div style="display: flex;align-items: center;justify-content: center;width: 100%;background: white;">
<ion-button type="button" shape="round" size="large" fill="outline" color="medium"
(click)="checkConnection()">
<ion-label style="font-size: 13px;">{{'lang.connectionTest' | translate}}</ion-label>
</ion-button>
<ion-button type="submit" shape="round" size="large" fill="outline" color="primary"
[disabled]="!sendmailForm.form.valid || !canValidate()">
<ion-label style="font-size: 13px;">{{'lang.validate' | translate}}</ion-label>
</ion-button>
</ion-item>
</ion-content>
</form>