dnet40/modules/uoa-connect-portal/trunk/src/app/utils/subscribe/invite/invite.component.html @ 53748
| 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 |
<!--table *ngIf="communityId != null && community != null && !showLoading && !errorMessage" class="uk-table uk-align-center"-->
|
| 9 |
<table class="uk-table uk-align-center"> |
| 10 |
<tbody>
|
| 11 |
<!-- <tr>
|
| 12 |
<td>
|
| 13 |
</td>
|
| 14 |
<td>
|
| 15 |
<li>Invite by email</li>
|
| 16 |
</td>
|
| 17 |
</tr> -->
|
| 18 |
<tr>
|
| 19 |
<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> |
| 20 |
<td class="uk-text-left uk-width-expand"> |
| 21 |
<input placeholder="Type your name" type="text" |
| 22 |
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "body.fromName" id="from"> |
| 23 |
</td>
|
| 24 |
</tr>
|
| 25 |
<tr>
|
| 26 |
<td for="email.recipients[0]" class="uk-text-bold uk-text-right">To <span class="uk-text-danger uk-text-bold">*</span> :</td> |
| 27 |
<td class="uk-text-left"> |
| 28 |
<!-- <div *ngIf="email.recipients && email.recipients[0] != ''">
|
| 29 |
<div >
|
| 30 |
</div>
|
| 31 |
<div *ngFor='let emailsss of email.recipients.split(,), let index; trackBy:trackByFn'> -->
|
| 32 |
<!-- <div *ngIf="!email[i].match('^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$')"
|
| 33 |
class="uk-width-large uk-text-danger uk-text-small uk-margin-top"> Please add a valid email. </div> -->
|
| 34 |
<!-- </div>
|
| 35 |
</div> -->
|
| 36 |
<input placeholder="email" type="text" |
| 37 |
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "recipients" id="recipients" |
| 38 |
required> |
| 39 |
<div class="uk-width-medium uk-text-muted uk-text-small style=display:none">separate multiple emails with a comma</div> |
| 40 |
</td>
|
| 41 |
|
| 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 class="uk-text-left"> |
| 65 |
<ckeditor
|
| 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 |
<!-- <textarea type="text"
|
| 78 |
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "email.body" id="message">
|
| 79 |
</textarea> -->
|
| 80 |
</td>
|
| 81 |
</tr>
|
| 82 |
<tr>
|
| 83 |
<td></td>
|
| 84 |
<td class="uk-text-left"> |
| 85 |
{{body.closing}}<br>
|
| 86 |
{{body.signature}}
|
| 87 |
</td>
|
| 88 |
</tr>
|
| 89 |
</tbody>
|
| 90 |
</table>
|
| 91 |
</div>
|
| 92 |
<table class="uk-table uk-align-center"> |
| 93 |
<tbody>
|
| 94 |
<tr>
|
| 95 |
<td class="uk-text-bold uk-width-3-5@xl uk-width-3-5@m uk-width-3-5@s uk-text-right"></td> |
| 96 |
<td><div class="uk-padding uk-padding-remove-top uk-padding-remove-bottom uk-text-danger uk-text-bold">* Required fields</div> |
| 97 |
</td>
|
| 98 |
</tr>
|
| 99 |
<tr>
|
| 100 |
<td class="uk-text-right"></td> |
| 101 |
<td>
|
| 102 |
<div class="uk-grid-margin uk-first-column uk-align-center uk-text-left uk-padding uk-padding-remove-top uk-padding-remove-bottom"> |
| 103 |
<button class="uk-button uk-button-primary" (click)="invite()">Invite</button> |
| 104 |
</div>
|
| 105 |
</td>
|
| 106 |
</tr>
|
| 107 |
<!-- <tr>
|
| 108 |
<td>
|
| 109 |
</td>
|
| 110 |
<td>
|
| 111 |
<li>Invite by link</li>
|
| 112 |
</td>
|
| 113 |
</tr> -->
|
| 114 |
<!-- <tr>
|
| 115 |
<td for="link" class="uk-text-bold uk-text-right">Link :</td>
|
| 116 |
<td class="uk-text-left">
|
| 117 |
<input placeholder="link" type="text"
|
| 118 |
class="form-control uk-input uk-width-large@l uk-width-medium@s" id="link"></td>
|
| 119 |
</tr>
|
| 120 |
<tr>
|
| 121 |
<td class="uk-text-right"></td>
|
| 122 |
<td>
|
| 123 |
<div class="uk-grid-margin uk-first-column uk-align-center uk-text-left uk-padding uk-padding-remove-top uk-padding-remove-bottom">
|
| 124 |
<button class="uk-button" (click)="resetForm(communityId)">Cancel</button>
|
| 125 |
</div>
|
| 126 |
</td>
|
| 127 |
</tr> -->
|
| 128 |
</tbody>
|
| 129 |
</table>
|
| 130 |
|
| 131 |
<div class="uk-text-left"> |
| 132 |
<span uk-icon="chevron-left"></span><span class="uk-margin-small-left"><a href="invite">Back</a></span> |
| 133 |
</div>
|
| 134 |
</div>
|
| 135 |
</div>
|
| 136 |
</div>
|
| 137 |
</div>
|
| 138 |
<div *ngIf="longView == false"> |
| 139 |
<div class="uk-width-large@m uk-width-1-1@s"> |
| 140 |
<div class="uk-card uk-card-default uk-card-body"> |
| 141 |
<div class="uk-text-center uk-text-large"> |
| 142 |
<div> Invite users to subscribe </div> |
| 143 |
<div uk-grid> |
| 144 |
<div class="uk-width-1-6"> |
| 145 |
<span class="uk-margin-small-right" uk-icon="social"></span> |
| 146 |
</div>
|
| 147 |
<div class="uk-width-3-5"> |
| 148 |
<input placeholder="" type="text" |
| 149 |
class="form-control uk-input" [(ngModel)] = "email.recipients[0]" id="recipients" |
| 150 |
required > |
| 151 |
</div>
|
| 152 |
<div class="uk-width-1-6"> |
| 153 |
<button class="uk-button" (click)="invite()">Invite</button> |
| 154 |
</div>
|
| 155 |
</div>
|
| 156 |
<div class="uk-width-medium uk-text-muted uk-text-small style=display:none">separate multiple emails with a comma</div> |
| 157 |
<div class="uk-text-right"> |
| 158 |
<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> |
| 159 |
</div>
|
| 160 |
</div>
|
| 161 |
</div>
|
| 162 |
</div>
|
| 163 |
</div>
|