MaDgIK
/
connect
13
0
Fork 0
Code Issues Pull Requests Projects Releases 12 Wiki Activity

[Trunk|Connect]: Contact-form: show loading on sending email 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-connect-portal/trunk@55376 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou 2019-04-16 11:20:28 +00:00
parent 65c522ee64
commit f413e6f974
2 changed files with 20 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/app/contact/contact.component.html
View File

@ -14,7 +14,9 @@
<div class="uk-margin-small uk-width-1-1 uk-text-danger uk-text-bold uk-margin-remove-bottom">* Required fields</div>
<div class="uk-width-1-2 uk-margin-small-top">
<label class="uk-h5 uk-text-bold">
Name <span class="uk-text-danger uk-text-bold">*</span>
<!--Name <span class="uk-text-danger uk-text-bold">*</span>-->
{{showLoading}}
{{isSubmitted}}
</label>
<div *ngIf="name.invalid && isSubmitted" class=" uk-text-danger uk-text-small style=display:none"> Please add a name. </div>
<input class="uk-input" type="text" placeholder="Your Name" [(ngModel)]="contactForm.name" required #name="ngModel">
@ -73,16 +75,15 @@
<li><h5 class="uk-h5"><span class="uk-text-bold">Monitor and report</span> your community's progress</h5></li>
</ul>
</div>
<modal-alert #AlertModal (alertOutput)="goToHome($event)">
<div class="uk-text-center">
Our team will respond to your submission soon.<br>
Press OK to redirect to OpenAIRE Connect home page.
</div>
</modal-alert>
</div>
</div>
</div>
</div>
</div>
</div>
<modal-alert #AlertModal (alertOutput)="goToHome($event)">
<div class="uk-text-center">
Our team will respond to your submission soon.<br>
Press OK to redirect to OpenAIRE Connect home page.
</div>
</modal-alert>

17
src/app/contact/contact.component.ts
View File

@ -65,7 +65,7 @@ export class ContactComponent implements OnInit {
}
public send() {
this.isSubmitted = true;
this.scroll();
if(!this.name.invalid && !this.surname.invalid && !this.sender.invalid &&
this.contactForm.email.match('^[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$') &&
!this.affiliation.invalid && !this.message.invalid && this.contactForm.recaptcha != '') {
@ -73,32 +73,37 @@ export class ContactComponent implements OnInit {
}
else {
this.errorMessage = 'Please fill in all the required fields!'
this.isSubmitted = true;
}
}
public reset() {
this.contactForm = new ContactForm();
this.recaptcha.reset();
this.isSubmitted = false;
this.errorMessage = '';
this.contactForm.recaptcha = '';
}
private sendMail(admins: any) {
this.showLoading = true;
this._emailService.contact(this.properties.adminToolsAPIURL + '/contact',
Composer.composeEmailForNewCommunity(this.contactForm, admins), this.contactForm.recaptcha).subscribe(
res => {
if(res != null) {
this.modalOpen();
this.reset();
this.modalOpen();
this.showLoading = false;
}
else {
this.handleError('Token has expired. Please complete the reCaptcha challenge again! ', null);
this.recaptcha.reset();
this.handleError('Token has expired. Please complete the reCaptcha challenge again! ', null)
this.showLoading = false;
this.contactForm.recaptcha = '';
}
},
error => {
this.handleError('Email sent failed! Please try again.', error);
this.recaptcha.reset();
this.showLoading = false;
this.contactForm.recaptcha = '';
}
);
}