connect/src/app/utils/subscribe/invite/invite.component.html

167 lines
11 KiB
HTML

<div *ngIf="longView == true">
<div class=" uk-section uk-margin-small-top tm-middle uk-container" id="tm-main">
<div class="uk-container uk-margin-bottom">
<div id="invite" class=" uk-card uk-card-default uk-padding">
<div class="uk-text-large uk-text-center uk-width-5-6@l uk-width ">Invite users to subscribe</div>
<!--table *ngIf="communityId != null && community != null && !showLoading && !errorMessage" class="uk-table uk-align-center"-->
<table class="uk-table uk-align-center">
<tbody>
<!-- <tr>
<td>
</td>
<td>
<li>Invite by email</li>
</td>
</tr> -->
<tr>
<td for="from" class="uk-text-bold uk-width-1-3@xl uk-width-1-3@m uk-width-1-3@s uk-text-right">From:</td>
<td class="uk-text-left uk-width-expand">
<input placeholder="Type your name" type="text"
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "body.fromName" id="from">
</td>
</tr>
<tr>
<td for="email.recipients[0]" class="uk-text-bold uk-text-right">To <span class="uk-text-danger uk-text-bold">*</span> :</td>
<td class="uk-text-left">
<!-- <div *ngIf="!email.recipients[1].match('^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$')"
class="uk-width-large uk-text-danger uk-text-small uk-margin-top"> Please add a valid email. </div> -->
<input placeholder="email" type="text"
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "email.recipients[0]" id="recipients"
required >
{{email.recipients}}
<div class="uk-width-medium uk-text-muted uk-text-small style=display:none">separate multiple emails with a comma</div>
</td>
</tr>
</tbody>
</table>
<div class="boundary-align uk-panel uk-placeholder">
<table class="uk-table uk-align-center">
<tbody>
<tr>
<td class="uk-text-bold uk-width-1-4@xl uk-width-1-4@m uk-width-1-4@s uk-text-right"></td>
<td class="uk-text-left">
{{body.salutation}}<br>
<span *ngIf="body.fromName == ''" class="uk-text-muted">
<i>{{body.fromMessage}}...</i>
</span>
<span *ngIf="body.fromName !=''">
{{body.fromMessage}}
<b>{{body.fromName}}</b>
</span>
</td>
</tr>
<tr>
<td for="email.body" class="uk-text-bold uk-text-right">Message:</td>
<td class="uk-text-left">
<!-- <ckeditor
debounce="400"
[config]="{ extraAllowedContent: '* [uk-*](*) ; span', disallowedContent: 'script; *[on*]', removeButtons: 'Save,NewPage,DocProps,Preview,Print',
extraPlugins: 'divarea'}">
<id="contentTag"-->
<!--(ready)="onReady($event)"-->
<!--(focus)="onFocus($event)"-->
<!--[config]="{uiColor: '#99000'}"-->
<!--(blur)="onBlur($event)"-->
<!--(change)="onChange($event)"-->
<!--/ckeditor> -->
<!-- <textarea type="text"
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "email.body" id="message">
</textarea> -->
</td>
</tr>
<tr>
<td></td>
<td class="uk-text-left">
{{body.closing}}<br>
{{body.signature}}
</td>
</tr>
<!-- <tr>
<td for="email.subject" class="uk-text-bold uk-text-right">Subject :</td>
<td class="uk-text-left">
<textarea type="text"
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "email.subject" id="subject">
</textarea>
</td>
</tr> -->
</tbody>
</table>
</div>
<table class="uk-table uk-align-center">
<tbody>
<tr>
<td class="uk-text-bold uk-width-3-5@xl uk-width-3-5@m uk-width-3-5@s uk-text-right"></td>
<td><div class="uk-padding uk-padding-remove-top uk-padding-remove-bottom uk-text-danger uk-text-bold">* Required fields</div>
</td>
</tr>
<tr>
<td class="uk-text-right"></td>
<td>
<div class="uk-grid-margin uk-first-column uk-align-center uk-text-left uk-padding uk-padding-remove-top uk-padding-remove-bottom">
<button class="uk-button uk-button-primary" (click)="invite()">Invite</button>
</div>
</td>
</tr>
<!-- <tr>
<td>
</td>
<td>
<li>Invite by link</li>
</td>
</tr> -->
<!-- <tr>
<td for="link" class="uk-text-bold uk-text-right">Link :</td>
<td class="uk-text-left">
<input placeholder="link" type="text"
class="form-control uk-input uk-width-large@l uk-width-medium@s" id="link"></td>
</tr>
<tr>
<td class="uk-text-right"></td>
<td>
<div class="uk-grid-margin uk-first-column uk-align-center uk-text-left uk-padding uk-padding-remove-top uk-padding-remove-bottom">
<button class="uk-button" (click)="resetForm(communityId)">Cancel</button>
</div>
</td>
</tr> -->
</tbody>
</table>
<div class="uk-text-left">
<span uk-icon="chevron-left"></span><span class="uk-margin-small-left"><a href="invite">Back</a></span>
</div>
</div>
</div>
</div>
</div>
<!-- <div *ngIf="longView =='false'">
<div class="uk-width-large@m uk-width-1-1@s">
<div class="uk-card uk-card-default uk-card-body">
<div class="uk-text-center uk-text-large">
<div> Invite users to subscribe </div>
<div uk-grid>
<div class="uk-width-1-6">
<span class="uk-margin-small-right" uk-icon="social"></span>
</div>
<div class="uk-width-3-5">
<input placeholder="" type="text"
class="form-control uk-input" [(ngModel)] = "email.recipients[0]" id="recipients"
required >
</div>
<div class="uk-width-1-6">
<button class="uk-button" (click)="invite()">Invite</button>
</div>
</div>
<div class="uk-width-medium uk-text-muted uk-text-small style=display:none">separate multiple emails with a comma</div>
<div class="uk-text-right">
<span class="uk-margin-small-left" uk-icon="cog"></span><span class="uk-margin-small-left uk-text-small"><a href="invite">customise it</a></span>
</div>
</div>
</div>
</div>
</div> -->