|
1
|
<div *ngIf="longView == true">
|
|
2
|
<div class=" uk-section uk-margin-small-top tm-middle uk-container" id="tm-main">
|
|
3
|
|
|
4
|
<div class="uk-container uk-margin-bottom">
|
|
5
|
|
|
6
|
<div id="invite" class=" uk-card uk-card-default uk-padding">
|
|
7
|
<div class="uk-text-large uk-text-center uk-width-5-6@l uk-width ">Invite users to subscribe</div>
|
|
8
|
<div class="uk-margin-top">
|
|
9
|
<errorMessages [status]="[status]" [type]="'community'"></errorMessages>
|
|
10
|
</div>
|
|
11
|
<div *ngIf="missingCommunityId" class="uk-alert uk-alert-warning" role="alert">{{missingCommunityId}}</div>
|
|
12
|
<div *ngIf="successfulSentMessage" class="uk-alert uk-alert-success" role="alert">{{successfulSentMessage}}</div>
|
|
13
|
<div *ngIf="inviteErrorMessage" class="uk-alert uk-alert-warning" role="alert">{{inviteErrorMessage}}</div>
|
|
14
|
<div *ngIf="communityId != null && status == errorCodes.DONE">
|
|
15
|
<table class="uk-table uk-align-center">
|
|
16
|
<tbody>
|
|
17
|
<!-- <tr>
|
|
18
|
<td>
|
|
19
|
</td>
|
|
20
|
<td>
|
|
21
|
<li>Invite by email</li>
|
|
22
|
</td>
|
|
23
|
</tr> -->
|
|
24
|
<tr>
|
|
25
|
<td for="from" class="uk-text-bold uk-width-1-4 uk-text-right">From <span class="uk-text-danger uk-text-bold">*</span> :</td>
|
|
26
|
<td class="uk-text-left uk-width-expand">
|
|
27
|
<input placeholder="Type your name" type="text" (click)="resetMessages()"
|
|
28
|
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "body.fromName" id="from" required>
|
|
29
|
<div *ngIf="!body.fromName" class="uk-width-large uk-text-danger uk-text-small">Please add your name.</div>
|
|
30
|
</td>
|
|
31
|
</tr>
|
|
32
|
<tr>
|
|
33
|
<td for="recipients" class="uk-text-bold uk-text-right">To <span class="uk-text-danger uk-text-bold">*</span> :</td>
|
|
34
|
<td class="uk-text-left">
|
|
35
|
<input placeholder="email" type="text" (click)="resetMessages(); areValid=true"
|
|
36
|
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "recipients" id="recipients"
|
|
37
|
required>
|
|
38
|
<div *ngIf="areValid && !showAddRecipientMessage" class="uk-width-medium uk-text-muted uk-text-small">separate multiple emails with a comma</div>
|
|
39
|
<div *ngIf="recipients && !areValid" class="uk-width-large uk-text-danger uk-text-small">Please add valid email/s.</div>
|
|
40
|
<div *ngIf="!recipients && showAddRecipientMessage" class="uk-width-large uk-text-danger uk-text-small">Please add a recipient.</div>
|
|
41
|
</td>
|
|
42
|
</tr>
|
|
43
|
</tbody>
|
|
44
|
</table>
|
|
45
|
<div class="boundary-align uk-panel uk-placeholder">
|
|
46
|
|
|
47
|
<table class="uk-table uk-align-center">
|
|
48
|
<tbody>
|
|
49
|
<!-- <tr>
|
|
50
|
<td class="uk-text-bold uk-width-1-4@xl uk-width-1-4@m uk-width-1-4@s uk-text-right"></td>
|
|
51
|
<td class="uk-text-left">
|
|
52
|
<{{body.salutation}}<br>-->
|
|
53
|
<!-- <span *ngIf="body.fromName == ''" class="uk-text-muted">
|
|
54
|
<i>{{body.fromMessage}}...</i>
|
|
55
|
</span>
|
|
56
|
<span *ngIf="body.fromName !=''">
|
|
57
|
{{body.fromMessage}}
|
|
58
|
<b>{{body.fromName}}</b>
|
|
59
|
</span>
|
|
60
|
</td>
|
|
61
|
</tr> -->
|
|
62
|
<tr>
|
|
63
|
<td for="email.body" class="uk-text-bold uk-text-right">Message:</td>
|
|
64
|
<td *ngIf= "allowEdit()" class="uk-text-left">
|
|
65
|
<ckeditor (click)="resetMessages()"
|
|
66
|
class="form-control" [(ngModel)] = "body.paragraphs" id="message"
|
|
67
|
debounce="400"
|
|
68
|
[config]="{ extraAllowedContent: '* [uk-*](*) ; span', disallowedContent: 'script; *[on*]', removeButtons: 'Save,NewPage,DocProps,Preview,Print',
|
|
69
|
extraPlugins: 'divarea'}">
|
|
70
|
<!-- <id="contentTag"-->
|
|
71
|
<!--(ready)="onReady($event)"-->
|
|
72
|
<!--(focus)="onFocus($event)"-->
|
|
73
|
<!--[config]="{uiColor: '#99000'}"-->
|
|
74
|
<!--(blur)="onBlur($event)"-->
|
|
75
|
<!--(change)="onChange($event)"-->
|
|
76
|
</ckeditor>
|
|
77
|
</td>
|
|
78
|
<td *ngIf= "!allowEdit()" class="uk-text-left">
|
|
79
|
|
|
80
|
<div [innerHtml] = "body.paragraphs"></div>
|
|
81
|
</td>
|
|
82
|
</tr>
|
|
83
|
<tr>
|
|
84
|
<td></td>
|
|
85
|
<td class="uk-text-left">
|
|
86
|
<!-- {{body.closing}}<br> -->
|
|
87
|
{{body.signature}}
|
|
88
|
<span *ngIf="body.fromName == ''" class="uk-text-muted">
|
|
89
|
<i>{{body.fromMessage}}...</i>
|
|
90
|
</span>
|
|
91
|
<span *ngIf="body.fromName !=''">
|
|
92
|
{{body.fromMessage}}
|
|
93
|
<b>{{body.fromName}}</b>
|
|
94
|
</span>
|
|
95
|
<br><a href="https://www.openaire.eu">www.openaire.eu</a>
|
|
96
|
</td>
|
|
97
|
</tr>
|
|
98
|
</tbody>
|
|
99
|
</table>
|
|
100
|
</div>
|
|
101
|
<table class="uk-table uk-align-center">
|
|
102
|
<tbody>
|
|
103
|
<tr>
|
|
104
|
<td class="uk-text-bold uk-width-3-5@xl uk-width-3-5@m uk-width-3-5@s uk-text-right"></td>
|
|
105
|
<td><div class="uk-padding uk-padding-remove-top uk-padding-remove-bottom uk-text-danger uk-text-bold">* Required fields</div>
|
|
106
|
</td>
|
|
107
|
</tr>
|
|
108
|
<tr>
|
|
109
|
<td class="uk-text-right"></td>
|
|
110
|
<td>
|
|
111
|
<div class="uk-grid-margin uk-first-column uk-align-center uk-text-left uk-padding uk-padding-remove-top uk-padding-remove-bottom">
|
|
112
|
<button class="uk-button uk-button-primary" (click)="invite()">Invite</button>
|
|
113
|
</div>
|
|
114
|
</td>
|
|
115
|
</tr>
|
|
116
|
<!-- <tr>
|
|
117
|
<td>
|
|
118
|
</td>
|
|
119
|
<td>
|
|
120
|
<li>Invite by link</li>
|
|
121
|
</td>
|
|
122
|
</tr> -->
|
|
123
|
<!-- <tr>
|
|
124
|
<td for="link" class="uk-text-bold uk-text-right">Link :</td>
|
|
125
|
<td class="uk-text-left">
|
|
126
|
<input placeholder="link" type="text"
|
|
127
|
class="form-control uk-input uk-width-large@l uk-width-medium@s" id="link"></td>
|
|
128
|
</tr>
|
|
129
|
<tr>
|
|
130
|
<td class="uk-text-right"></td>
|
|
131
|
<td>
|
|
132
|
<div class="uk-grid-margin uk-first-column uk-align-center uk-text-left uk-padding uk-padding-remove-top uk-padding-remove-bottom">
|
|
133
|
<button class="uk-button" (click)="resetForm(communityId)">Cancel</button>
|
|
134
|
</div>
|
|
135
|
</td>
|
|
136
|
</tr> -->
|
|
137
|
</tbody>
|
|
138
|
</table>
|
|
139
|
|
|
140
|
<div class="uk-text-left">
|
|
141
|
<span uk-icon="chevron-left"></span><span class="uk-margin-small-left">
|
|
142
|
<a [queryParams]="communityIdParam" routerLinkActive="router-link-active" routerLink="/">Back</a>
|
|
143
|
</span>
|
|
144
|
</div>
|
|
145
|
|
|
146
|
</div>
|
|
147
|
</div>
|
|
148
|
</div>
|
|
149
|
</div>
|
|
150
|
</div>
|
|
151
|
|
|
152
|
<div *ngIf="!longView">
|
|
153
|
<div class="uk-width-large@m uk-width-1-1@s">
|
|
154
|
<div class="uk-card uk-card-default uk-card-body uk-padding-small">
|
|
155
|
<div class="uk-text-center uk-text-large" uk-toggle="target: #toggle-usage; animation: uk-animation-fade" style="cursor: pointer;">
|
|
156
|
<span class="uk-margin-small-right uk-icon" >
|
|
157
|
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="social" ratio="1">
|
|
158
|
<line fill="none" stroke="#000" stroke-width="1.1" x1="13.4" y1="14" x2="6.3" y2="10.7"></line><line fill="none" stroke="#000" stroke-width="1.1" x1="13.5" y1="5.5" x2="6.5" y2="8.8"></line><circle fill="none" stroke="#000" stroke-width="1.1" cx="15.5" cy="4.6" r="2.3"></circle><circle fill="none" stroke="#000" stroke-width="1.1" cx="15.5" cy="14.8" r="2.3"></circle><circle fill="none" stroke="#000" stroke-width="1.1" cx="4.5" cy="9.8" r="2.3"></circle></svg>
|
|
159
|
</span>
|
|
160
|
|
|
161
|
Invite users</div>
|
|
162
|
|
|
163
|
<div class="uk-form uk-margin-small" id="toggle-usage" hidden="hidden">
|
|
164
|
<div *ngIf="recipients && !areValid" class="uk-width-large uk-text-danger uk-text-small uk-margin-top">Please add valid email/s.</div>
|
|
165
|
<div *ngIf="!recipients && showAddRecipientMessage" class="uk-width-large uk-text-danger uk-text-small uk-margin-top">Please add a recipient.</div>
|
|
166
|
<input placeholder="Type e-mails" type="text"
|
|
167
|
class="form-control uk-input uk-form-small uk-form" [(ngModel)] = "recipients" id="recipients"
|
|
168
|
required >
|
|
169
|
<div class="uk-width-medium uk-text-muted uk-text-small">separate with commas</div>
|
|
170
|
<div class="uk-margin-small-top uk-text-center ">
|
|
171
|
<button class=" uk-button uk-button-primary uk-button-small " (click)="invite()">Invite</button>
|
|
172
|
<a class=" uk-button uk-button-default uk-button-small " [queryParams]="communityIdParam" routerLinkActive="router-link-active" routerLink="/invite">
|
|
173
|
<span class="uk-margin-xsmall-left uk-icon" >
|
|
174
|
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="cog" ratio="1"><circle fill="none" stroke="#000" cx="9.997" cy="10" r="3.31"></circle><path fill="none" stroke="#000" d="M18.488,12.285 L16.205,16.237 C15.322,15.496 14.185,15.281 13.303,15.791 C12.428,16.289 12.047,17.373 12.246,18.5 L7.735,18.5 C7.938,17.374 7.553,16.299 6.684,15.791 C5.801,15.27 4.655,15.492 3.773,16.237 L1.5,12.285 C2.573,11.871 3.317,10.999 3.317,9.991 C3.305,8.98 2.573,8.121 1.5,7.716 L3.765,3.784 C4.645,4.516 5.794,4.738 6.687,4.232 C7.555,3.722 7.939,2.637 7.735,1.5 L12.263,1.5 C12.072,2.637 12.441,3.71 13.314,4.22 C14.206,4.73 15.343,4.516 16.225,3.794 L18.487,7.714 C17.404,8.117 16.661,8.988 16.67,10.009 C16.672,11.018 17.415,11.88 18.488,12.285 L18.488,12.285 Z"></path>
|
|
175
|
</svg>
|
|
176
|
</span>
|
|
177
|
Customize
|
|
178
|
</a>
|
|
179
|
</div>
|
|
180
|
</div>
|
|
181
|
|
|
182
|
</div>
|
|
183
|
</div>
|
|
184
|
</div>
|