[Library | Feedback]: Add recaptcha to feedback form.
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@58345 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
parent
9be356020b
commit
5aeef7a068
|
@ -57,17 +57,23 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-bottom uk-margin-medium-top" uk-grid>
|
||||
<div class="uk-width-expand">
|
||||
<div class="uk-width-2-3@m uk-width-1-2@s">
|
||||
<div class="uk-text-small">Please leave us your E-mail to notify you about the reporting status.</div>
|
||||
<input class="uk-input default-border uk-width-1-1" placeholder="E-mail" formControlName="email" [class.uk-form-danger]="form.get('email').invalid">
|
||||
</div>
|
||||
<div class="uk-width-1-4@m uk-width-1-3@s">
|
||||
<div *ngIf="form" class="uk-width-expand">
|
||||
<re-captcha (resolved)="handleRecaptcha($event)" [(siteKey)]="properties.reCaptchaSiteKey">
|
||||
</re-captcha>
|
||||
</div>
|
||||
<div class="uk-margin-top uk-width-1-1">
|
||||
<div class="uk-width-1-4@m uk-width-1-3@s uk-float-right">
|
||||
<button [class.uk-disabled]="form.invalid || sending" [class.portal-button]="form.valid"
|
||||
(click)="sendReport()" class="uk-button uk-width-1-1">Send report
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="sent" class="uk-position-relative">
|
||||
<div class="uk-position-top-center">
|
||||
|
|
|
@ -76,7 +76,8 @@ export class FeedbackComponent implements OnInit, OnChanges {
|
|||
name: this.fb.control(this.title),
|
||||
url: this.fb.control(this.url),
|
||||
email: this.fb.control('', Validators.email),
|
||||
issues: this.fb.array([], Validators.required)
|
||||
issues: this.fb.array([], Validators.required),
|
||||
recaptcha: this.fb.control('', Validators.required),
|
||||
});
|
||||
this.addIssue();
|
||||
}
|
||||
|
@ -110,9 +111,14 @@ export class FeedbackComponent implements OnInit, OnChanges {
|
|||
this.backModal.open();
|
||||
}
|
||||
|
||||
public handleRecaptcha(captchaResponse: string) {
|
||||
this.form.get('recaptcha').setValue(captchaResponse);
|
||||
}
|
||||
|
||||
public sendReport() {
|
||||
this.sending = true;
|
||||
this.emailService.contact(this.properties.adminToolsAPIURL + '/contact', Composer.composeEmailForFeedback(this.form.value, this.recipients)).subscribe(sent => {
|
||||
this.emailService.contact(this.properties.adminToolsAPIURL + '/contact',
|
||||
Composer.composeEmailForFeedback(this.form.value, this.recipients), this.form.get('recaptcha').value).subscribe(sent => {
|
||||
this.error = !sent;
|
||||
if(sent) {
|
||||
if(this.form.get('email').value !== '') {
|
||||
|
|
|
@ -6,9 +6,10 @@ import {ReactiveFormsModule} from "@angular/forms";
|
|||
import {MatSelectModule} from "@angular/material/select";
|
||||
import {AlertModalModule} from "../../utils/modal/alertModal.module";
|
||||
import {EmailService} from "../../utils/email/email.service";
|
||||
import {RecaptchaModule} from "ng-recaptcha";
|
||||
|
||||
@NgModule({
|
||||
imports: [CommonModule, LandingHeaderModule, ReactiveFormsModule, MatSelectModule, AlertModalModule],
|
||||
imports: [CommonModule, LandingHeaderModule, ReactiveFormsModule, MatSelectModule, AlertModalModule, RecaptchaModule.forRoot()],
|
||||
declarations: [FeedbackComponent],
|
||||
providers: [EmailService],
|
||||
exports: [FeedbackComponent]
|
||||
|
|
Loading…
Reference in New Issue