86 lines
4.8 KiB
HTML
86 lines
4.8 KiB
HTML
<div *ngIf="showForm && !sent">
|
|
<div class="uk-padding-small">
|
|
<div class="uk-container">
|
|
<button class="uk-button uk-button-link uk-flex uk-flex-middle" (click)="openBackModal()">
|
|
<icon name="west" [flex]="true"></icon>
|
|
<span class="uk-margin-small-left">Back</span>
|
|
</button>
|
|
<h3>Give us feedback in...</h3>
|
|
<landing-header *ngIf="resultLandingInfo" [properties]="properties" [title]="title"
|
|
[subTitle]="resultLandingInfo.subtitle" [underCuration]="resultLandingInfo.underCurationMessage"
|
|
[entityType]="entityType" [types]="resultLandingInfo.types"
|
|
[year]="resultLandingInfo.date" [embargoEndDate]="resultLandingInfo.embargoEndDate">
|
|
</landing-header>
|
|
<landing-header *ngIf="organizationInfo" [properties]="properties" [title]="title"
|
|
[subTitle]="(organizationInfo.name && organizationInfo.title.name !== organizationInfo.name)?organizationInfo.name:null"
|
|
[entityType]="entityType">
|
|
</landing-header>
|
|
<landing-header *ngIf="projectInfo && title" [properties]="properties" [title]="title"
|
|
[subTitle]="projectInfo.acronym ? projectInfo.title : ''"
|
|
[entityType]="entityType" [startDate]="projectInfo.startDate" [endDate]="projectInfo.endDate"
|
|
[status]="projectInfo.status">
|
|
</landing-header>
|
|
<landing-header *ngIf="dataProviderInfo" [properties]="properties" [title]="title"
|
|
[subTitle]="(dataProviderInfo.officialName
|
|
&& dataProviderInfo.title.name !== dataProviderInfo.officialName)?dataProviderInfo.officialName:null"
|
|
[entityType]="entityType"
|
|
[types]="dataProviderInfo.type ? [dataProviderInfo.type] : null">
|
|
</landing-header>
|
|
</div>
|
|
</div>
|
|
<div *ngIf="form" [formGroup]="form" class="uk-container uk-padding-small">
|
|
<div class="uk-grid uk-child-width-1-1" uk-grid>
|
|
<div *ngIf="error" class="uk-alert uk-alert-danger uk-text-center ng-star-inserted" role="alert">Email sent failed! Please try again.</div>
|
|
<div formArrayName="issues">
|
|
<div *ngFor="let control of issues.controls; let i = index" [formGroupName]="i" class="uk-margin-medium-bottom">
|
|
<div class="uk-flex uk-flex-between">
|
|
<h6 class="uk-margin-remove">Comment #{{i + 1}}</h6>
|
|
<button class="uk-button uk-button-link uk-flex uk-flex-middle" (click)="removeIssue(i)">
|
|
<icon name="delete" [flex]="true"></icon>
|
|
<span class="uk-margin-small-left">Remove</span>
|
|
</button>
|
|
</div>
|
|
<div class="uk-margin-top">
|
|
<div input class="uk-width-medium" [formInput]="control.get('field')" placeholder="Select a field" [options]="fields" type="select"></div>
|
|
<div input class="uk-width-1-1 uk-margin-top" [formInput]="control.get('report')" placeholder="Write your comment here" type="textarea"></div>
|
|
</div>
|
|
</div>
|
|
<button class="uk-button uk-button-link uk-flex uk-flex-middle uk-margin-top uk-margin-bottom" (click)="addIssue()">
|
|
<icon name="add" [flex]="true"></icon>
|
|
<span class="uk-margin-small-left">Add Comment</span>
|
|
</button>
|
|
</div>
|
|
<div>
|
|
<div class="uk-grid uk-flex-top" uk-grid>
|
|
<div input class="uk-width-expand@m uk-width-1-1" [formInput]="form.get('email')" placeholder="E-mail">
|
|
<span note>Please leave us your E-mail to notify you about the reporting status.</span>
|
|
</div>
|
|
<div class="uk-width-auto">
|
|
<re-captcha (resolved)="handleRecaptcha($event)" [siteKey]="properties.reCaptchaSiteKey">
|
|
</re-captcha>
|
|
</div>
|
|
<div class="uk-width-1-1 uk-flex uk-flex-center uk-flex-right@m">
|
|
<button [class.uk-disabled]="form.invalid || sending" [class.uk-button-primary]="form.valid"
|
|
(click)="sendReport()" class="uk-button">Send feedback
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div *ngIf="showForm && sent" class="uk-position-relative" style="height: 100vh">
|
|
<div class="uk-position-center">
|
|
<div class="uk-card uk-card-default uk-card-body uk-text-center">
|
|
<h3>Thank you for your feedback</h3>
|
|
<p>Your feedback is successfully received and it will soon be reviewed by our graph experts!</p>
|
|
<icon customClass="uk-text-background" name="check" [ratio]="4"></icon>
|
|
</div>
|
|
<div class="uk-text-center uk-margin-medium-top">
|
|
<button (click)="changeShowForm(false)" class="uk-button uk-button-primary">Go back to {{entityType}}'s page</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<modal-alert #backModal (alertOutput)="changeShowForm(false)" [overflowBody]="false"></modal-alert>
|