dnet40/modules/uoa-connect-portal/trunk/src/app/utils/subscribe/invite/invite.component.html @ 53703
| 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 |
|
| 29 |
<!-- <div *ngIf="!email.recipients[1].match('^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$')"
|
| 30 |
class="uk-width-large uk-text-danger uk-text-small uk-margin-top"> Please add a valid email. </div> -->
|
| 31 |
<input placeholder="email" type="text" |
| 32 |
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "email.recipients[0]" id="recipients" |
| 33 |
required > |
| 34 |
{{email.recipients}}
|
| 35 |
<div class="uk-width-medium uk-text-muted uk-text-small style=display:none">separate multiple emails with a comma</div> |
| 36 |
</td>
|
| 37 |
|
| 38 |
</tr>
|
| 39 |
</tbody>
|
| 40 |
</table>
|
| 41 |
<div class="boundary-align uk-panel uk-placeholder"> |
| 42 |
|
| 43 |
<table class="uk-table uk-align-center"> |
| 44 |
<tbody>
|
| 45 |
<tr>
|
| 46 |
<td class="uk-text-bold uk-width-1-4@xl uk-width-1-4@m uk-width-1-4@s uk-text-right"></td> |
| 47 |
<td class="uk-text-left"> |
| 48 |
{{body.salutation}}<br>
|
| 49 |
<span *ngIf="body.fromName == ''" class="uk-text-muted"> |
| 50 |
<i>{{body.fromMessage}}...</i> |
| 51 |
</span>
|
| 52 |
<span *ngIf="body.fromName !=''"> |
| 53 |
{{body.fromMessage}}
|
| 54 |
<b>{{body.fromName}}</b> |
| 55 |
</span>
|
| 56 |
</td>
|
| 57 |
</tr>
|
| 58 |
<tr>
|
| 59 |
<td for="email.body" class="uk-text-bold uk-text-right">Message:</td> |
| 60 |
<td class="uk-text-left"> |
| 61 |
<ckeditor
|
| 62 |
class="form-control" [(ngModel)] = "body.paragraphs" id="message" |
| 63 |
debounce="400" |
| 64 |
[config]="{ extraAllowedContent: '* [uk-*](*) ; span', disallowedContent: 'script; *[on*]', removeButtons: 'Save,NewPage,DocProps,Preview,Print', |
| 65 |
extraPlugins: 'divarea'}"> |
| 66 |
<!-- <id="contentTag"-->
|
| 67 |
<!--(ready)="onReady($event)"-->
|
| 68 |
<!--(focus)="onFocus($event)"-->
|
| 69 |
<!--[config]="{uiColor: '#99000'}"-->
|
| 70 |
<!--(blur)="onBlur($event)"-->
|
| 71 |
<!--(change)="onChange($event)"-->
|
| 72 |
</ckeditor>
|
| 73 |
<!-- <textarea type="text"
|
| 74 |
class="form-control uk-input uk-width-large@l uk-width-medium@s" [(ngModel)] = "email.body" id="message">
|
| 75 |
</textarea> -->
|
| 76 |
</td>
|
| 77 |
</tr>
|
| 78 |
<tr>
|
| 79 |
<td></td>
|
| 80 |
<td class="uk-text-left"> |
| 81 |
{{body.closing}}<br>
|
| 82 |
{{body.signature}}
|
| 83 |
</td>
|
| 84 |
</tr>
|
| 85 |
</tbody>
|
| 86 |
</table>
|
| 87 |
</div>
|
| 88 |
<table class="uk-table uk-align-center"> |
| 89 |
<tbody>
|
| 90 |
<tr>
|
| 91 |
<td class="uk-text-bold uk-width-3-5@xl uk-width-3-5@m uk-width-3-5@s uk-text-right"></td> |
| 92 |
<td><div class="uk-padding uk-padding-remove-top uk-padding-remove-bottom uk-text-danger uk-text-bold">* Required fields</div> |
| 93 |
</td>
|
| 94 |
</tr>
|
| 95 |
<tr>
|
| 96 |
<td class="uk-text-right"></td> |
| 97 |
<td>
|
| 98 |
<div class="uk-grid-margin uk-first-column uk-align-center uk-text-left uk-padding uk-padding-remove-top uk-padding-remove-bottom"> |
| 99 |
<button class="uk-button uk-button-primary" (click)="invite()">Invite</button> |
| 100 |
</div>
|
| 101 |
</td>
|
| 102 |
</tr>
|
| 103 |
<!-- <tr>
|
| 104 |
<td>
|
| 105 |
</td>
|
| 106 |
<td>
|
| 107 |
<li>Invite by link</li>
|
| 108 |
</td>
|
| 109 |
</tr> -->
|
| 110 |
<!-- <tr>
|
| 111 |
<td for="link" class="uk-text-bold uk-text-right">Link :</td>
|
| 112 |
<td class="uk-text-left">
|
| 113 |
<input placeholder="link" type="text"
|
| 114 |
class="form-control uk-input uk-width-large@l uk-width-medium@s" id="link"></td>
|
| 115 |
</tr>
|
| 116 |
<tr>
|
| 117 |
<td class="uk-text-right"></td>
|
| 118 |
<td>
|
| 119 |
<div class="uk-grid-margin uk-first-column uk-align-center uk-text-left uk-padding uk-padding-remove-top uk-padding-remove-bottom">
|
| 120 |
<button class="uk-button" (click)="resetForm(communityId)">Cancel</button>
|
| 121 |
</div>
|
| 122 |
</td>
|
| 123 |
</tr> -->
|
| 124 |
</tbody>
|
| 125 |
</table>
|
| 126 |
|
| 127 |
<div class="uk-text-left"> |
| 128 |
<span uk-icon="chevron-left"></span><span class="uk-margin-small-left"><a href="invite">Back</a></span> |
| 129 |
</div>
|
| 130 |
</div>
|
| 131 |
</div>
|
| 132 |
</div>
|
| 133 |
</div>
|
| 134 |
<div *ngIf="longView =='false'"> |
| 135 |
<div class="uk-width-large@m uk-width-1-1@s"> |
| 136 |
<div class="uk-card uk-card-default uk-card-body"> |
| 137 |
<div class="uk-text-center uk-text-large"> |
| 138 |
<div> Invite users to subscribe </div> |
| 139 |
<div uk-grid> |
| 140 |
<div class="uk-width-1-6"> |
| 141 |
<span class="uk-margin-small-right" uk-icon="social"></span> |
| 142 |
</div>
|
| 143 |
<div class="uk-width-3-5"> |
| 144 |
<input placeholder="" type="text" |
| 145 |
class="form-control uk-input" [(ngModel)] = "email.recipients[0]" id="recipients" |
| 146 |
required > |
| 147 |
</div>
|
| 148 |
<div class="uk-width-1-6"> |
| 149 |
<button class="uk-button" (click)="invite()">Invite</button> |
| 150 |
</div>
|
| 151 |
</div>
|
| 152 |
<div class="uk-width-medium uk-text-muted uk-text-small style=display:none">separate multiple emails with a comma</div> |
| 153 |
<div class="uk-text-right"> |
| 154 |
<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> |
| 155 |
</div>
|
| 156 |
</div>
|
| 157 |
</div>
|
| 158 |
</div>
|
| 159 |
</div>
|