openaire-library/connect/userEmailPreferences/mailPrefs.component.html

74 lines
4.5 KiB
HTML

<div id="tm-main" class=" uk-section uk-margin-small-top tm-middle">
<div uk-grid uk-grid>
<div class="tm-main uk-width-1-1@s uk-width-1-1@m uk-width-1-1@l uk-row-first">
<div class="uk-container uk-margin-top">
<div class="uk-article-title custom-article-title">
User Email Preferences for Claims Notifications
</div>
<div *ngIf="userValidMessage.length > 0 " class = "uk-alert uk-alert-danger " >
User session is not valid. Please login again.
</div>
<errorMessages [status]="[status]" [type]="'notification preferences'"></errorMessages>
<ul class="custom-accordion" uk-accordion>
<!-- class="uk-open" -->
<!-- uk-card uk-card-default uk-card-body -->
<li *ngFor="let notification of notifications; let i=index" [class]="i==0 ? 'uk-open' : ''">
<div class="uk-accordion-title">Email preferences for {{preferencesFor}}: <strong>{{notification.openaireName}}</strong></div>
<div class="uk-accordion-content">
<form class="uk-form-horizontal"><!-- [formGroup]="myForm"-->
<!--[ngClass]="{'has-error':!myForm.controls.notify.valid && myForm.controls.notify.dirty}"-->
<div class="uk-margin">
<div class="uk-form-label">Do you want to receive e-mail notifications?</div>
<!-- <div class="uk-form-controls uk-form-controls-text">
<label>Yes <input class="uk-radio" type="radio" name="radio2" [checked]="notification.notify" (click)="changeNotify(notification, true)"></label>
<label>No <input class="uk-radio" type="radio" name="radio2" [checked]="!notification.notify" (click)="changeNotify(notification, false)"></label>
</div> -->
<div class="uk-form-controls uk-form-controls-text" data-uk-button-group>
<button *ngIf="notification.notify" class="uk-button uk-button-primary uk-button-small"
data-uk-button>ON</button>
<button *ngIf="!notification.notify" class="uk-button-default uk-button-small"
(click)="changeNotify(notification, true)" data-uk-button>ON</button>
<button *ngIf="!notification.notify" class="uk-button uk-button-danger uk-button-small"
data-uk-button>OFF</button>
<button *ngIf="notification.notify" class="uk-button-default uk-button-small"
(click)="changeNotify(notification, false)" data-uk-button>OFF</button>
</div>
</div>
<!-- [ngClass]="{'has-error':!myForm.controls.frequency.valid && myForm.controls.frequency.dirty}" -->
<div [class]="notification.notify ? 'uk-margin' : 'uk-margin cursor-not-allowed'">
<div class="uk-form-label" >How often?</div>
<div class="uk-form-controls">
<select [class]="notification.notify ? 'uk-select' : 'uk-select uk-disabled'" id="form-horizontal-select" class="uk-select" [(ngModel)]="notification.frequency" name="select_frequency">
<option [ngValue]="24" >Daily</option>
<option [ngValue]="48" >Every two days</option>
<option [ngValue]="168">Weekly</option>
</select>
</div>
<!-- (click)="notifications[i].frequency = 168" -->
</div>
<div class="uk-float-right">
<button type="submit" class="uk-button uk-button-primary" (click)="saveNotification(notifications, i)">Save Changes</button>
<button type="submit" class="uk-button" (click)="restoreNotification(notifications, i)">Reset</button>
</div>
<!-- <span class="uk-margin">
<button class="uk-width-1-1 uk-button uk-button-primary uk-button-small" type="submit" (click)="saveNotification(notifications, i)">Save</button>
<button class="uk-width-1-1 uk-button uk-button-small" (click)="restoreNotification(notifications, i)">Restore</button>
</span> -->
<!-- {{notification.notify}} -- {{notification.frequency}} -->
</form>
</div>
</li>
</ul>
<!-- {{notifications | json}} -->
</div>
</div>
</div>
</div>