openaire-library/dashboard/helpTexts/page-help-content-form.comp...

304 lines
12 KiB
TypeScript

import {Component, Input, OnInit} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import {Page} from '../../utils/entities/adminTool/page';
import {HelpContentService} from '../../services/help-content.service';
import {EnvProperties} from '../../utils/properties/env-properties';
import {Session} from '../../login/utils/helper.class';
import {LoginErrorCodes} from '../../login/utils/guardHelper.class';
import {properties} from '../../../../environments/environment';
import {from, Observable, Subscriber, Subscription} from 'rxjs';
import {HelperFunctions} from '../../utils/HelperFunctions.class';
import {PageHelpContent} from '../../utils/entities/adminTool/page-help-content';
@Component({
selector: 'page-content-form',
templateUrl: './page-help-content-form.component.html',
})
export class PageContentFormComponent implements OnInit{
myForm: FormGroup;
communityPid: string;
pageId: string;
pageContentId: string;
page: Page;
placementsOptions = [];
orderOptions = [];
private availablePages : Page[] = [];
//private errorMessage: string;
private ckeditorContent : string;
public properties:EnvProperties = null;
public showLoading: boolean = true;
public errorMessage: string = '';
@Input() updateErrorMessage: string = '';
private subs: Subscription[] = [];
private pageHelpContent: PageHelpContent;
constructor(private route: ActivatedRoute, private _router: Router, private _fb: FormBuilder, private _helpContentService: HelpContentService){}
ngOnInit() {
this.properties = properties;
this.subs.push(this.route.params.subscribe(params => {
this.communityPid = params['community'];
this.subs.push(this.route.queryParams.subscribe(params => {
HelperFunctions.scroll();
this.pageId = params['pageId'];
this.myForm = this.form;
this.pageContentId = params['pageContentId'];
if (!this.pageId) {
this._router.navigate(['../'], {relativeTo: this.route});
}
/* this.getPage(this.pageId);
if (this.pageContentId) {
this.getPageHelpContent(this.pageContentId);
}else{
this.myForm = this.form;
}*/
this.getInfo(this.pageId);
if (!Session.isLoggedIn()) {
this._router.navigate(['/user-info'], {
queryParams: {
"errorCode": LoginErrorCodes.NOT_VALID,
"redirectUrl": this._router.url
}
});
}
}));
}));
}
ngOnDestroy() {
this.subs.forEach(value => {
if (value instanceof Subscriber) {
value.unsubscribe();
}
});
}
getInfo(pageId: string){
this.showLoading = true;
let obs = Observable.zip(this._helpContentService.getPageByPortal(pageId,this.properties.adminToolsAPIURL, this.communityPid), this._helpContentService.getCommunityPageHelpContents(this.communityPid, this.properties.adminToolsAPIURL, pageId));
this.subs.push(obs.subscribe(
results => {
this.page = results[0];
if(this.properties.adminToolsPortalType != this.page.portalType) {
this._router.navigate(['../'], {relativeTo: this.route});
}
let countPageContents = results[1]?results[1].length:0;
console.log(results[1]);
for (let content of (results[1] as Array<PageHelpContent>)) {
// if(content.page['_id'] == pageId){
// countPageContents++;
if(this.pageContentId && this.pageContentId == content._id) {
this.pageHelpContent = content;
// this.pageHelpContent.page = pageId;
// this.pageHelpContent.portal = this.communityPid;
}
// }
}
this.setOptions(this.page, countPageContents + (this.pageHelpContent?0:1));
if(!this.pageContentId) {
this.myForm = this.form;
this.initFormWithSelectOptions();
}else{
this.updateForm(this.pageHelpContent);
}
this.showLoading = false;
},
error => this.handleError('System error retrieving page with id: '+pageId, error)
));
}
/*private getPage(pageId: string) {
this.subs.push(this._helpContentService.getPageByPortal(pageId,this.properties.adminToolsAPIURL, this.communityPid).subscribe(
page => {
if(this.properties.adminToolsPortalType != page.portalType) {
this._router.navigate(['../'], {relativeTo: this.route});
} else {
this.page = page;
this.getPageContents(pageId);
}
},
error => this.handleError('System error retrieving page with id: '+pageId, error)
));
}
private getPageContents(pageId: string) {
this.subs.push(this._helpContentService.getCommunityPageHelpContents(this.communityPid, this.properties.adminToolsAPIURL).subscribe(
pageHelpContents => {
let countPageContents = 1;
for (let content of (pageHelpContents as Array<PageHelpContent>)) {
if(content.page['_id'] == pageId){
countPageContents++;
}
}
this.setOptions(this.page, countPageContents);
if(!this.pageContentId) {
this.showLoading = false;
this.initFormWithSelectOptions();
}
},
error => this.handleError('System error retrieving page contents with id: ', error)
));
}
private getPageHelpContent(pageContentId: string) {
if(!Session.isLoggedIn()){
this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl": this._router.url} });
} else {
this.showLoading = true;
this.errorMessage = "";
this.updateErrorMessage = "";
this.subs.push(this._helpContentService.getPageHelpContent(pageContentId as string, this.properties.adminToolsAPIURL, this.communityPid).subscribe(
pageHelpContent => {
this.updateForm(pageHelpContent);
this.showLoading = false;
},
error => this.handleError('System error retrieving page help content', error)));
}
}*/
private updateForm(pageHelpContent : PageHelpContent) {
this.pageHelpContent = pageHelpContent;
this.myForm = this.form;
if(this.pageHelpContent) {
this.myForm.patchValue((pageHelpContent));
}else{
this.initFormWithSelectOptions();
}
if(this.orderOptions.length ==1){
this.myForm.get('order').disable()
}
if(this.placementsOptions.length ==1){
this.myForm.get('placement').disable()
}
this.myForm.markAsPristine();
}
initFormWithSelectOptions(){
if (this.placementsOptions.length == 1) {
this.myForm.get("placement").setValue(this.placementsOptions[0].value);
}
this.myForm.get("order").setValue(this.orderOptions[this.orderOptions.length - 1].value);
if(this.orderOptions.length ==1){
this.myForm.get('order').disable()
}
if(this.placementsOptions.length ==1){
this.myForm.get('placement').disable()
}
}
public setOptions(page: Page, countContents:number) {
this.placementsOptions = [];
if(page.top){
this.placementsOptions.push({label: "top", value: "top"});
}
if(page.bottom){
this.placementsOptions.push({label: "bottom", value: "bottom"});
}
if(page.left){
this.placementsOptions.push({label: "left", value: "left"});
}
this.orderOptions = [];
for(let i=1; i<countContents+1; i++){
this.orderOptions.push({label: ""+i, value: i});
}
}
public get form() {
return this._fb.group({
page : [this.pageId, Validators.required],
portal : this.communityPid,
placement : ['', Validators.required],
content : ['', Validators.required],
order : [1, Validators.required],
isActive : true,
//isPriorTo : false,
_id : '',
});
}
public reset() {
this.myForm.patchValue({
page : '',
portal : this.communityPid,
placement : '',
content : [''],
order : 1,
isActive : true,
//isPriorTo : false,
_id : ''
});
this.myForm.markAsPristine();
}
handleError(message: string, error) {
this.errorMessage = message;
console.error('Server responded: ' + error);
this.showLoading = false;
}
public saveCustom() {
if(!Session.isLoggedIn()){
this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl": this._router.url} });
} else {
//this.errorMessage = null;
if(this.myForm.valid) {
this.showLoading = true;
this.updateErrorMessage = "";
this.myForm.get('order').enable();
this.myForm.get('placement').enable();
let pageHelpContent : PageHelpContent = this.myForm.value;
this.subs.push(this._helpContentService.savePageHelpContent(pageHelpContent, this.properties.adminToolsAPIURL, this.communityPid).subscribe(
_ => {
this._router.navigate( ['../'], { queryParams: { "pageId": this.pageId }, relativeTo: this.route } );
this.showLoading = false;
},
err => this.handleUpdateError('System error saving page content', err)
));
} else {
this.showLoading = false;
this.errorMessage = "Please fill all required fields";
}
}
}
public cancelCustom() {
this._router.navigate( ['../'], { queryParams: { "pageId": this.pageId }, relativeTo: this.route } );
}
public resetCustom() {
this.showLoading = true;
this.updateForm(this.pageHelpContent);
this.showLoading = false;
}
handleUpdateError(message: string, error) {
this.updateErrorMessage = message;
console.error('Server responded: ' + error);
this.showLoading = false;
}
changeStatus(){
this.myForm.get('isActive').setValue(!this.myForm.get('isActive').value);
if(this.pageHelpContent && this.myForm.get('isActive').value != this.pageHelpContent.isActive || !this.pageHelpContent && !this.myForm.get('isActive').value ){
this.myForm.get('isActive').markAsDirty();
}else{
this.myForm.get('isActive').markAsPristine()
}
}
contentChanged(){
if(this.pageHelpContent && this.myForm.get('content').value != this.pageHelpContent.content || !this.pageHelpContent && this.myForm.get('content').value != '' ){
this.myForm.get('content').markAsDirty();
}else{
this.myForm.get('content').markAsPristine()
}
}
}