MaDgIK
/
connect-admin
13
0
Fork 0
Code Issues Pull Requests Projects Releases 8 Wiki Activity

manage communities page added | pages separated by type (added new options in menu on the left) | each page has a link to edit its page contents 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-admin-portal/trunk@50183 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
konstantina.galouni 2017-12-20 14:26:30 +00:00
parent 1b31c5bccd
commit 9ed40c36d1
24 changed files with 882 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
app/app.component.html
View File

@ -35,13 +35,53 @@
</li>
</ul>
</div> -->
<div class="menu-section">
<h3>Manage Communities</h3>
<ul>
<li>
<a routerLink="/communities" routerLinkActive="active">
<i class="fa fa-cog"></i>
<span>Communities</span>
</a>
</li>
</ul>
</div>
<div class="menu-section">
<h3>Manage Entities</h3>
<ul>
<li>
<a routerLink="/selectEntities" routerLinkActive="active">
<a routerLink="/entities" routerLinkActive="active">
<i class="fa fa-cog"></i>
<span>Select entities</span>
<span>Searchable entities</span>
</a>
</li>
</ul>
</div>
<div class="menu-section">
<h3>Manage Pages</h3>
<ul>
<li>
<a routerLink="/pages" routerLinkActive="active" [routerLinkActiveOptions]="{exact:true}">
<i class="fa fa-globe"></i>
<span>Pages</span>
</a>
</li>
<li>
<a routerLink="/pages" routerLinkActive="active" [queryParams]="{type: 'search'}" [routerLinkActiveOptions]="{exact:true}">
<i class="fa fa-globe"></i>
<span>Search Pages</span>
</a>
</li>
<li>
<a routerLink="/pages" routerLinkActive="active" [queryParams]="{type: 'link'}" [routerLinkActiveOptions]="{exact:true}">
<i class="fa fa-globe"></i>
<span>Link Pages</span>
</a>
</li>
<li>
<a routerLink="/pages" routerLinkActive="active" [queryParams]="{type: 'share'}" [routerLinkActiveOptions]="{exact:true}">
<i class="fa fa-globe"></i>
<span>Share Pages</span>
</a>
</li>
</ul>
@ -49,13 +89,6 @@
<div class="menu-section">
<h3>Help Content</h3>
<ul>
<li>
<a routerLink="/pages" routerLinkActive="active">
<i class="fa fa-globe"></i>
<span>Pages</span>
</a>
</li>
<li>
<a routerLink="/pageContents" routerLinkActive="active">
<i class="fa fa-cog"></i>

8
app/app.module.ts
View File

@ -27,7 +27,9 @@ import { NewPageHelpContentComponent } from "./pages/helpcontent/new-page-help-c
import { CKEditorModule } from 'ng2-ckeditor';
import { PageContentFormComponent } from "./pages/helpcontent/page-help-content-form.component";
import { EditPageHelpContentComponent } from "./pages/helpcontent/edit-page-help-content.component";
import { SelectEntitiesComponent } from "./pages/helpcontent/selectEntities.component";
import { CommunitiesComponent } from './pages/community/communities.component';
import { CommunityFormComponent } from './pages/community/community-form.component';
import { EntitiesComponent } from "./pages/helpcontent/entities.component";
import { EntityFormComponent } from "./pages/helpcontent/entity-form.component";
@NgModule({
@ -59,7 +61,9 @@ import { EntityFormComponent } from "./pages/helpcontent/entity-form.component";
NewPageHelpContentComponent,
PageContentFormComponent,
EditPageHelpContentComponent,
SelectEntitiesComponent,
CommunitiesComponent,
CommunityFormComponent,
EntitiesComponent,
EntityFormComponent
],
providers: [

11
app/app.routing.ts
View File

@ -7,7 +7,8 @@ import { Routes, RouterModule } from '@angular/router';
import { DashboardComponent } from "./dashboard.component";
import { TopicsComponent } from "./pages/faq/topics.components";
import { QuestionsComponent } from "./pages/faq/questions.component";
import { SelectEntitiesComponent } from "./pages/helpcontent/selectEntities.component";
import { CommunitiesComponent } from './pages/community/communities.component';
import { EntitiesComponent } from "./pages/helpcontent/entities.component";
import { PagesComponent } from "./pages/helpcontent/pages.component";
import { PageHelpContentsComponent } from "./pages/helpcontent/page-help-contents.component";
import { NewPageHelpContentComponent } from "./pages/helpcontent/new-page-help-content.component";
@ -32,8 +33,12 @@ const appRoutes: Routes = [
component: QuestionsComponent,
},
{
path: 'selectEntities',
component: SelectEntitiesComponent,
path: 'communities',
component: CommunitiesComponent,
},
{
path: 'entities',
component: EntitiesComponent,
},
{
path: 'pages',

4
app/dashboard.component.html
View File

@ -18,12 +18,12 @@
<div class="col-md-4">
<h2>Edit your community Info</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p><a class="btn btn-default" routerLink="/dashboard" role="button">View details »</a></p>
<p><a class="btn btn-default" routerLink="/communities" role="button">View details »</a></p>
</div>
<div class="col-md-4">
<h2>Select searchable entities</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p><a class="btn btn-default" routerLink="/selectEntities" role="button">View details »</a></p>
<p><a class="btn btn-default" routerLink="/entities" role="button">View details »</a></p>
</div>
<div class="col-md-4">
<h2>Edit search page contents</h2>

13
app/domain/community.ts
View File

@ -1,13 +1,14 @@
import {Page} from './page';
import {Entity} from './entity';
export interface Community {
_id: string;
name: string;
entities: string[];
pages: Page[];
entities: string[] | Entity[];
pages: string[] | Page[];
}
// export interface CheckCommunity {
// community : Community;
// checked : boolean;
// }
export interface CheckCommunity {
community : Community;
checked : boolean;
}

3
app/domain/page.ts
View File

@ -4,8 +4,9 @@ export interface Page {
_id: string;
route: string;
name: string;
type: string;
isEnabled :boolean;
entities: Entity[];// | string[];
entities: Entity[] | string[];
}
export interface CheckPage {

93
app/pages/community/communities.component.html Normal file
View File

@ -0,0 +1,93 @@
Communities<div id="communities">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="community-title">Communities</div>
<form target="BSFormPanel_Admin_1" class="search">
<input #inputstring (keyup.enter)="filterBySearch(inputstring.value)" placeholder="Search communities (name)..." type="text"/>
<input class="btn" type="submit">
</form>
<a (click)="showModal()" class="btn btn-success pull-right"><i></i> New Community </a>
</div>
<div class="content-wrapper" id="contentWrapper">
<div>
<div class="contentPanel">
<div class="alert alert-danger" style="display: none;" aria-hidden="true">
<span></span><span></span><span></span></div>
<div class="alert alert-success" style="display: none;" aria-hidden="true">
<span></span><span></span><span></span></div>
<div class="alert" style="display: none;" aria-hidden="true"><span></span><span></span><span></span></div>
<div class="row page-controls">
<div class="col-md-12 filters">
<div class="show-options">
<div class="btn-group"><a href="javascript:;" class="btn dropdown-toggle"
data-toggle="dropdown"><i></i> Bulk Actions <span
class="caret"></span></a>
<ul class="dropdown-menu">
<li><a (click)="confirmDeleteSelectedCommunities()"><i></i> Delete </a></li>
</ul>
</div>
</div>
</div>
</div>
<div>
<div class="gwt-HTML">
<div class="row users-list">
<div class="col-md-12">
<div class="row headers">
<div class="col-sm-1 header select-users"><input id="allCommunityCheckbox" type="checkbox" (change)="toggleCheckBoxes($event)">
</div>
<div class="col-sm-10 header hidden-xs"><label><a href="#">Name</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Actions</a></label></div>
</div>
<template [ngIf]="communitiesCheckboxes && communitiesCheckboxes.length>0">
<div *ngFor="let check of communitiesCheckboxes; let i=index" class="row user">
<div class="col-sm-1 avatar"><input id="{{check.community._id}}" class="checkBox" type="checkbox"
name="communitiescb[]" value="{{check.community._id}}" [(ngModel)]="check.checked">
</div>
<div class="col-sm-10">
<div class="name" href="#">{{check.community.name}}</div>
</div>
<div class="col-sm-1">
<div class="actions" href="#">
<input title="Edit" src="imgs/icn_edit.png" class="edit" type="image" (click)="editCommunity(i)">
<input title="Delete" src="imgs/icn_trash.png" class="delete" type="image" (click)="confirmDeleteCommunity(check.community._id)">
</div>
</div>
</div>
</template>
<div *ngIf="communitiesCheckboxes.length==0" class="col-md-12">
<div class="alert alert-warning">No communities found</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<modal-form #saveModal [saveText]="'Save'" [titleText]="'Add a new Community'" [formGroup]="formGroup" [type]="'community'"
[isModalShown]="isModalShown" (emmitObject)="communitySavedSuccessfully($event)" (emmitError)="handleError($event)"
[selectedCommunityId]="selectedCommunityId">
<community-form [group]="formGroup"></community-form>
</modal-form>
<modal-form #updateModal [saveText]="'Update'" [titleText]="'Update Community'" [formGroup]="formGroup" [type]="'community'"
[isModalShown]="isModalShown" (emmitObject)="communityUpdatedSuccessfully($event)" (emmitError)="handleError($event)"
[selectedCommunityId]="selectedCommunityId">
<community-form [group]="formGroup"></community-form>
</modal-form>
<delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeleteCommunities($event)">
Are you sure you want to delete the selected community(-ies)?
</delete-confirmation-dialog>

160
app/pages/community/communities.component.ts Normal file
View File

@ -0,0 +1,160 @@
/**
* Created by stefania on 7/13/17.
*/
import { Component, ViewChild, OnInit } from '@angular/core';
import { ActivatedRoute } from "@angular/router";
import { HelpContentService } from "../../services/help-content.service";
import { FormGroup } from "@angular/forms";
import { ModalFormComponent } from "../modal-form.component";
import { DeleteConfirmationDialogComponent } from "../delete-confirmation-dialog.component";
import { CommunityFormComponent } from "./community-form.component";
import { CheckCommunity, Community } from "../../domain/community";
@Component({
selector: 'communities',
templateUrl: './communities.component.html',
})
export class CommunitiesComponent implements OnInit {
@ViewChild(ModalFormComponent)
@ViewChild('saveModal')
public modal:ModalFormComponent;
@ViewChild('updateModal')
public updateModal:ModalFormComponent;
@ViewChild('deleteConfirmationModal')
public deleteConfirmationModal : DeleteConfirmationDialogComponent;
@ViewChild(CommunityFormComponent)
public formComponent : CommunityFormComponent;
public communitiesCheckboxes : CheckCommunity[] = [];
public communities : Community[] = [];
public errorMessage: string;
public formGroup : FormGroup;
private searchText : RegExp = new RegExp('');
ngOnInit() {
this.formGroup = this.formComponent.form;
this.route.queryParams.subscribe(params => {
if(params['community']) {
this.getCommunity(params['community']);
} else {
this.getCommunities();
}
});
}
constructor(private route: ActivatedRoute, private _helpContentService: HelpContentService) {}
getCommunity(community_id: string) {
let self = this;
this._helpContentService.getCommunityFull(community_id).subscribe(
community => {
self.communities = [community];
this.communitiesCheckboxes.push(<CheckCommunity>{community : community, checked : false});
},
error => this.handleError('System error retrieving communities', error));
}
getCommunities() {
let self = this;
this._helpContentService.getCommunitiesFull().subscribe(
communities => {
self.communities = communities;
communities.forEach(_ => {
this.communitiesCheckboxes.push(<CheckCommunity>{community : _, checked : false});
});
},
error => this.handleError('System error retrieving communities', error));
}
public showModal():void {
this.modal.showModal();
}
public toggleCheckBoxes(event) {
this.communitiesCheckboxes.forEach(_ => _.checked = event.target.checked);
}
public applyCheck(flag : boolean) {
console.info("applyCheck "+flag);
this.communitiesCheckboxes.forEach(_ => _.checked = flag);
}
public getSelectedCommunities() : string[] {
return this.communitiesCheckboxes.filter(community => community.checked == true).map(checkedCommunity => checkedCommunity.community).map(res => res._id);
}
private deleteCommunitiesFromArray(ids : string[]) : void {
for(let id of ids) {
let i = this.communitiesCheckboxes.findIndex(_ => _.community._id == id);
this.communitiesCheckboxes.splice(i, 1);
}
}
public confirmDeleteCommunity(id : string) {
this.deleteConfirmationModal.ids = [id];
this.deleteConfirmationModal.showModal();
}
public confirmDeleteSelectedCommunities() {
this.deleteConfirmationModal.ids = this.getSelectedCommunities();
this.deleteConfirmationModal.showModal();
}
public confirmedDeleteCommunities(ids : string[]) {
this._helpContentService.deleteCommunities(ids).subscribe(
_ => this.deleteCommunitiesFromArray(ids),
error => this.handleError('System error deleting the selected communities', error)
);
}
public editCommunity(i : number) {
let community : Community = this.communitiesCheckboxes[i].community;
this.formGroup.patchValue(community);
this.updateModal.showModal();
}
public communitySavedSuccessfully(community: Community) {
this.communitiesCheckboxes.push(<CheckCommunity>{community : community, checked : false});
console.info("checkboxes length: "+this.communitiesCheckboxes.length);
this.applyCheck(false);
}
public communityUpdatedSuccessfully(community : Community) {
this.communitiesCheckboxes.find(checkItem => checkItem.community._id==community._id).community = community;
this.applyCheck(false);
}
public filterBySearch(text : string) {
this.searchText = new RegExp(text,'i');
this.applyFilter();
}
public applyFilter() {
this.communitiesCheckboxes = [];
this.communities.filter(item => this.filterCommunities(item)).forEach(
_ => this.communitiesCheckboxes.push(<CheckCommunity>{community: _, checked: false})
);
}
public filterCommunities(community : Community) : boolean {
let textFlag = this.searchText.toString() == '' || (/*community.route + ' ' +*/community.name).match(this.searchText) != null;
return textFlag;
}
handleError(message: string, error) {
if(error == null) {
this.formComponent.reset();
}
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
}

7
app/pages/community/community-form.component.html Normal file
View File

@ -0,0 +1,7 @@
<form [formGroup]="myForm">
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.name.dirty}">
<label for="pageNameTag">Community Name</label>
<input type="text" class="form-control" formControlName="name" id="pageNameTag" placeholder="Community Name">
</div>
<input type="hidden" formControlName="_id">
</form>

41
app/pages/community/community-form.component.ts Normal file
View File

@ -0,0 +1,41 @@
import {Component, OnInit, Input} from '@angular/core';
import {FormGroup, FormArray, FormBuilder, Validators} from "@angular/forms";
import { HelpContentService } from "../../services/help-content.service";
@Component({
selector: 'community-form',
templateUrl: './community-form.component.html',
})
export class CommunityFormComponent implements OnInit{
@Input('group')
myForm: FormGroup;
public errorMessage: string;
constructor(public _fb: FormBuilder, private _helpContentService: HelpContentService){}
ngOnInit(): void {}
public get form() {
return this._fb.group({
_id : '',
name : ['', Validators.required]
});
}
public reset() {
this.myForm.patchValue({
name : '',
_id : ''
});
}
handleError(message: string, error) {
if(error == null) {
this.reset();
}
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
}

12
app/pages/helpcontent/edit-page-help-content.component.ts
View File

@ -20,6 +20,8 @@ export class EditPageHelpContentComponent implements OnInit, OnDestroy{
private communityId: string;
private pageId: string;
private sub: Subscription;
private pageHelpContent: PageHelpContent;
@ -37,6 +39,7 @@ export class EditPageHelpContentComponent implements OnInit, OnDestroy{
//let id = params['id'];
let pageContentId = params['pageContentId'];
this.communityId = params['communityId'];
this.pageId = params['pageId'];
this._helpContentService.getPageHelpContent(pageContentId as string).subscribe(
pageHelpContent => this.updateForm(pageHelpContent),
error => this.handleError('System error retrieving page help content', error));
@ -57,11 +60,16 @@ export class EditPageHelpContentComponent implements OnInit, OnDestroy{
}
private saveCustom() {
if(this.formComponent.myForm.valid) {
let pageHelpContent : PageHelpContent = this.formComponent.myForm.value;
this._helpContentService.savePageHelpContent(pageHelpContent).subscribe(
_ => this.router.navigate(['/pageContents']),
_ => {
if(this.pageId) {
this.router.navigate( ['/pageContents/'], { queryParams: { "community": this.communityId, "page": this.pageId } } );
} else {
this.router.navigate(['/pageContents']);
}
},
err => this.handleError('System error updating page content', err)
);
} else {

112
app/pages/helpcontent/entities.component.html Normal file
View File

@ -0,0 +1,112 @@
<div id="entities">
<div id="content">
<div class="menubar fixed">
<div class="sidebar-toggler visible-xs">
<i class="ion-navicon"></i>
</div>
<div class="entity-title">Entities</div>
<form target="BSFormPanel_Admin_1" class="search">
<input #inputstring (keyup.enter)="filterBySearch(inputstring.value)" placeholder="Search entities (name)..." type="text"/>
<input class="btn" type="submit">
</form>
<a (click)="showModal()" class="btn btn-success pull-right"><i></i> New Entity </a>
</div>
<div class="content-wrapper" id="contentWrapper">
<div>
<div class="contentPanel">
<div class="alert alert-danger" style="display: none;" aria-hidden="true">
<span></span><span></span><span></span></div>
<div class="alert alert-success" style="display: none;" aria-hidden="true">
<span></span><span></span><span></span></div>
<div class="alert" style="display: none;" aria-hidden="true"><span></span><span></span><span></span></div>
<div class="row page-controls">
<div class="col-md-12 filters">
<div class="show-options">
<div class="btn-group"><a href="javascript:;" class="btn dropdown-toggle"
data-toggle="dropdown"><i></i> Bulk Actions <span
class="caret"></span></a>
<ul class="dropdown-menu">
<li><a (click)="confirmDeleteSelectedEntities()"><i></i> Delete </a></li>
</ul>
</div>
</div>
</div>
</div>
<div>
<div class="gwt-HTML">
<div class="row users-list">
<div class="col-md-12">
<div class="filters marginBottom20">
<div class="links form-group form-inline">
<div class="gwt-Label filterLabel">Filter by community:</div>
<select class="input-xxlarge form-control" (change)="filterByCommunity($event)">
<!--option value="">-- none selected --</option-->
<option *ngFor="let community of communities" value="{{community._id}}">{{community.name}}</option>
</select>
</div>
</div>
<div class="row headers">
<div class="col-sm-1 header select-users"><input id="allEntityCheckbox" type="checkbox" (change)="toggleCheckBoxes($event)">
</div>
<div class="col-sm-5 header hidden-xs"><label><a href="#">Name</a></label></div>
<div class="col-sm-5 header hidden-xs"><label><a href="#">State</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Actions</a></label></div>
</div>
<template [ngIf]="entitiesCheckboxes && entitiesCheckboxes.length>0">
<div *ngFor="let check of entitiesCheckboxes; let i=index" class="row user">
<div class="col-sm-1 avatar"><input id="{{check.entity._id}}" class="checkBox" type="checkbox"
name="entitiescb[]" value="{{check.entity._id}}" [(ngModel)]="check.checked">
</div>
<div class="col-sm-5">
<div class="name" href="#">{{check.entity.name}}</div>
</div>
<div class="col-sm-5">
<div *ngIf="check.entity.isEnabled" class="activated" >
<input (click)="toggleEntity(false,[check.entity._id])" class="deactivate" src="imgs/check-icon.png" title="Disable" width="20" type="image" height="20">
</div>
<div *ngIf="!check.entity.isEnabled" class="deactivated" >
<input (click)="toggleEntity(true,[check.entity._id])" class="deactivate" src="imgs/x-icon.png" title="Enable" width="20" type="image" height="20">
</div>
</div>
<div class="col-sm-1">
<div class="actions" href="#">
<input title="Edit" src="imgs/icn_edit.png" class="edit" type="image" (click)="editEntity(i)">
<input title="Delete" src="imgs/icn_trash.png" class="delete" type="image" (click)="confirmDeleteEntity(check.entity._id)">
</div>
</div>
</div>
</template>
<div *ngIf="entitiesCheckboxes.length==0" class="col-md-12">
<div class="alert alert-warning">No entities found</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<modal-form #saveModal [saveText]="'Save'" [titleText]="'Add a new Entity'" [formGroup]="formGroup" [type]="'entity'"
[isModalShown]="isModalShown" (emmitObject)="entitySavedSuccessfully($event)" (emmitError)="handleError($event)"
[selectedCommunityId]="selectedCommunityId">
<entity-form [group]="formGroup"></entity-form>
</modal-form>
<modal-form #updateModal [saveText]="'Update'" [titleText]="'Update Entity'" [formGroup]="formGroup" [type]="'entity'"
[isModalShown]="isModalShown" (emmitObject)="entityUpdatedSuccessfully($event)" (emmitError)="handleError($event)"
[selectedCommunityId]="selectedCommunityId">
<entity-form [group]="formGroup"></entity-form>
</modal-form>
<delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeleteEntities($event)">
Are you sure you want to delete the selected entity(-ies)?
</delete-confirmation-dialog>

180
app/pages/helpcontent/entities.component.ts Normal file
View File

@ -0,0 +1,180 @@
import { Component, ViewChild, OnInit } from '@angular/core';
import { HelpContentService } from "../../services/help-content.service";
import { FormGroup } from "@angular/forms";
import { ModalFormComponent } from "../modal-form.component";
import { DeleteConfirmationDialogComponent } from "../delete-confirmation-dialog.component";
import { EntityFormComponent } from "./entity-form.component";
import { CheckEntity, Entity } from "../../domain/entity";
import { Community } from "../../domain/community";
@Component({
selector: 'entities',
templateUrl: './entities.component.html',
})
export class EntitiesComponent implements OnInit {
// @ViewChild(ModalFormComponent)
@ViewChild('saveModal')
public modal:ModalFormComponent;
@ViewChild('updateModal')
public updateModal:ModalFormComponent;
@ViewChild('deleteConfirmationModal')
public deleteConfirmationModal : DeleteConfirmationDialogComponent;
@ViewChild(EntityFormComponent)
public formComponent : EntityFormComponent;
public entitiesCheckboxes : CheckEntity[] = [];
public entities : Entity[] = [];
public errorMessage: string;
public formGroup : FormGroup;
private searchText : RegExp = new RegExp('');
public communities: Community[] = [];
public selectedCommunityId: string;
ngOnInit() {
this.getCommunities();
this.formGroup = this.formComponent.form;
}
constructor(private _helpContentService: HelpContentService) {}
getCommunities() {
let self = this;
this._helpContentService.getCommunities().subscribe(
communities => {
self.communities = communities;
self.getEntities(self.communities[0]._id);
self.selectedCommunityId = self.communities[0]._id;
},
error => this.handleError('System error retrieving communities', error));
}
getEntities(community_id: string) {
let self = this;
this._helpContentService.getCommunityEntities(community_id).subscribe(
entities => {
self.entities = entities;
self.entitiesCheckboxes = [];
entities.forEach(_ => {
self.entitiesCheckboxes.push(<CheckEntity>{entity : _, checked : false});
});
},
error => this.handleError('System error retrieving entities', error));
}
public showModal():void {
this.modal.showModal();
}
public toggleCheckBoxes(event) {
this.entitiesCheckboxes.forEach(_ => _.checked = event.target.checked);
}
public applyCheck(flag : boolean) {
console.info("applyCheck "+flag);
this.entitiesCheckboxes.forEach(_ => _.checked = flag);
}
public getSelectedEntities() : string[] {
return this.entitiesCheckboxes.filter(entity => entity.checked == true).map(checkedEntity => checkedEntity.entity).map(res => res._id);
}
private deleteEntitiesFromArray(ids : string[]) : void {
for(let id of ids) {
let i = this.entitiesCheckboxes.findIndex(_ => _.entity._id == id);
this.entitiesCheckboxes.splice(i, 1);
}
}
public confirmDeleteEntity(id : string) {
this.deleteConfirmationModal.ids = [id];
this.deleteConfirmationModal.showModal();
}
public confirmDeleteSelectedEntities() {
this.deleteConfirmationModal.ids = this.getSelectedEntities();
this.deleteConfirmationModal.showModal();
}
public confirmedDeleteEntities(ids : string[]) {
this._helpContentService.deleteEntities(ids).subscribe(
_ => this.deleteEntitiesFromArray(ids),
error => this.handleError('System error deleting the selected entities', error)
);
}
public editEntity(i : number) {
let entity : Entity = this.entitiesCheckboxes[i].entity;
this.formGroup.patchValue(entity);
this.updateModal.showModal();
}
public entitySavedSuccessfully(entity: Entity) {
this.entitiesCheckboxes.push(<CheckEntity>{entity : entity, checked : false});
this.applyCheck(false);
}
public entityUpdatedSuccessfully(entity : Entity) {
this.entitiesCheckboxes.find(checkItem => checkItem.entity._id==entity._id).entity = entity;
this.applyCheck(false);
}
public filterBySearch(text : string) {
this.searchText = new RegExp(text,'i');
this.applyFilter();
}
public applyFilter() {
this.entitiesCheckboxes = [];
this.entities.filter(item => this.filterEntities(item)).forEach(
_ => this.entitiesCheckboxes.push(<CheckEntity>{entity: _, checked: false})
);
}
public filterEntities(entity : Entity) : boolean {
let textFlag = this.searchText.toString() == '' || (entity.name).match(this.searchText) != null;
return textFlag;
}
handleError(message: string, error) {
if(error == null) {
this.formComponent.reset();
}
this.errorMessage = message + ' (Server responded: ' + error + ')';
}
public filterByCommunity(event: any) {
this.selectedCommunityId = event.target.value;
this.applyCommunityFilter(this.selectedCommunityId);
}
public applyCommunityFilter(community_id: string) {
this.getEntities(community_id);
}
public toggleEntity(status : boolean, id : string) {
this._helpContentService.toggleEntity(this.selectedCommunityId,id,status).subscribe(
() => {
let i = this.entitiesCheckboxes.findIndex(_ => _.entity._id == id);
this.entitiesCheckboxes[i].entity.isEnabled=status;
this.applyCheck(false);
},
error => this.handleError('System error changing the status of the selected entity(-ies)', error)
);
}
}

11
app/pages/helpcontent/new-page-help-content.component.ts
View File

@ -21,6 +21,8 @@ export class NewPageHelpContentComponent {
private communityId: string;
private pageId: string;
constructor(
private route: ActivatedRoute,
private router: Router,
@ -29,6 +31,7 @@ export class NewPageHelpContentComponent {
ngOnInit() {
this.route.queryParams.subscribe(params => {
this.communityId = params['communityId'];
this.pageId = params['pageId'];
});
}
@ -39,7 +42,13 @@ export class NewPageHelpContentComponent {
if(this.formComponent.myForm.valid) {
let pageHelpContent : PageHelpContent = this.formComponent.myForm.value;
this._helpContentService.savePageHelpContent(pageHelpContent).subscribe(
_ => this.router.navigate(['/pageContents']),
_ => {
if(this.pageId) {
this.router.navigate( ['/pageContents/'], { queryParams: { "community": this.communityId, "page": this.pageId } } );
} else {
this.router.navigate(['/pageContents']);
}
},
err => this.handleError('System error saving page content', err)
);
} else {

10
app/pages/helpcontent/page-form.component.html
View File

@ -1,5 +1,5 @@
<form [formGroup]="myForm">
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.route.dirty}">
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.route.valid && myForm.controls.route.dirty}">
<label for="pageRouteTag">Page Route</label>
<input type="text" class="form-control" formControlName="route" id="pageRouteTag" placeholder="Page Route">
</div>
@ -7,6 +7,14 @@
<label for="pageNameTag">Page Name</label>
<input type="text" class="form-control" formControlName="name" id="pageNameTag" placeholder="Page Name">
</div>
<div *ngIf="!type" class="form-group" [ngClass]="{'has-error':!myForm.controls.type.valid && myForm.controls.type.dirty}">
<label for="typeTag">Select Type</label>
<select formControlName="type" id="typeTag" class="form-control">
<option [value]="'search'">search</option>
<option [value]="'link'">link</option>
<option [value]="'share'">share</option>
</select>
</div>
<!--div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.entities.dirty}"-->

8
app/pages/helpcontent/page-form.component.ts
View File

@ -19,6 +19,8 @@ export class PageFormComponent implements OnInit{
myForm: FormGroup;
@Input('selectedCommunityId')
public selectedCommunityId: string;
@Input('type')
public type: string;
public errorMessage: string;
@ -80,7 +82,8 @@ export class PageFormComponent implements OnInit{
return this._fb.group({
route : ['', Validators.required],
name : ['', Validators.required],
//isEnabled: ['', Validators.required],
isEnabled: '',
type: ['', Validators.required],
entities: this._fb.array([]),
_id : '',
isCollapsed: [true]
@ -91,7 +94,8 @@ export class PageFormComponent implements OnInit{
this.myForm.patchValue({
route : '',
name : '',
//isEnabled: '',
type: '',
isEnabled: '',
//entities: this._fb.array([]),
_id : '',
isCollapsed: [true]

8
app/pages/helpcontent/page-help-contents.component.html
View File

@ -12,7 +12,8 @@
<input class="btn" type="submit">
</form>
<!--[queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization"-->
<a [queryParams]="{communityId: selectedCommunityId}" routerLink="/pageContents/new" class="btn btn-success pull-right"><i></i> New Page Content </a>
<a *ngIf="!selectedPageId" [queryParams]="{communityId: selectedCommunityId}" routerLink="/pageContents/new" class="btn btn-success pull-right"><i></i> New Page Content </a>
<a *ngIf="selectedPageId" [queryParams]="{communityId: selectedCommunityId, pageId: selectedPageId}" routerLink="/pageContents/new" class="btn btn-success pull-right"><i></i> New Page Content </a>
</div>
<div class="content-wrapper" id="contentWrapper">
@ -29,7 +30,7 @@
</div>
</div> -->
<div class="col-md-12 filters marginBottom20">
<div *ngIf="!selectedPageId" class="col-md-12 filters marginBottom20">
<div class="links form-group form-inline">
<div class="gwt-Label filterLabel">Filter by community:</div>
<select class="input-xxlarge form-control" (change)="filterByCommunity($event)">
@ -38,7 +39,7 @@
</select>
</div>
</div>
<div class="col-md-12 filters marginBottom20">
<div *ngIf="!selectedPageId" class="col-md-12 filters marginBottom20">
<div class="links form-group form-inline">
<div class="gwt-Label filterLabel">Filter by page:</div>
<select class="input-xxlarge form-control" (change)="filterByPage($event)">
@ -134,6 +135,7 @@
</div>
</div>
</div>
<a *ngIf="selectedPageId" [queryParams]="{type: pageType}" routerLink="/pages">Go back to {{pageType}} pages</a>
</div>
</div>
</div>

52
app/pages/helpcontent/page-help-contents.component.ts
View File

@ -3,6 +3,7 @@
*/
import { Component, ViewChild, OnInit } from '@angular/core';
import { FormGroup } from "@angular/forms";
import { ActivatedRoute } from "@angular/router";
import { DeleteConfirmationDialogComponent } from "../delete-confirmation-dialog.component";
import { HelpContentService } from "../../services/help-content.service";
import { PageHelpContent, CheckPageHelpContent, PageHelpContentFilterOptions } from "../../domain/page-help-content";
@ -50,12 +51,37 @@ export class PageHelpContentsComponent implements OnInit {
public selectedCommunityId: string;
public selectedPageId: string;
public pageType: string;
ngOnInit() {
this.getCommunities();
this.route.queryParams.subscribe(params => {
this.selectedCommunityId = params['community'];
this.selectedPageId = params['page'];
if(this.selectedCommunityId && this.selectedPageId) {
this.getPageHelpContents(this.selectedCommunityId);
this.getPage(this.selectedPageId);
} else {
this.selectedPageId = "";
this.getCommunities();
}
});
// this.formGroup = this.formComponent.form;
}
constructor(private _helpService: HelpContentService, private router : Router) {}
constructor(private route: ActivatedRoute, private _helpService: HelpContentService, private router : Router) {}
getPage(pageId: string) {
let self = this;
this._helpService.getPage(pageId).subscribe(
page => {
self.pageType = page.type;
}
);
}
getCommunities() {
let self = this;
@ -95,9 +121,21 @@ export class PageHelpContentsComponent implements OnInit {
self.pageHelpContents = pageHelpContents as Array<PageHelpContent>;
self.counter.all = self.pageHelpContents.length;
self.pageHelpContentsCheckboxes = [];
self.pageHelpContents.forEach(_ => {
/*self.pageHelpContents.forEach(_ => {
let page: Page = _.page as Page;
if(!self.selectedPageId || (page._id == self.selectedPageId)) {
self.pageHelpContentsCheckboxes.push(<CheckPageHelpContent>{pageHelpContent : _, checked : false});
});
}
});*/
for (let i = self.pageHelpContents.length - 1; i >= 0; i -= 1) {
let page: Page = self.pageHelpContents[i].page as Page;
if(!self.selectedPageId || (page._id == self.selectedPageId)) {
self.pageHelpContentsCheckboxes.push(<CheckPageHelpContent>{pageHelpContent : self.pageHelpContents[i], checked : false});
} else {
self.pageHelpContents.splice(i, 1);
}
}
self.countPageHelpContents();
},
error => this.handleError('System error retrieving page contents', error));
@ -150,7 +188,11 @@ export class PageHelpContentsComponent implements OnInit {
public editPageHelpContent(_id : string) {
//this.router.navigate(['/pageContents/edit/', _id]);
this.router.navigate( ['/pageContents/edit/'], { queryParams: { "pageContentId": _id, "communityId": this.selectedCommunityId } } );
if(this.selectedPageId) {
this.router.navigate( ['/pageContents/edit/'], { queryParams: { "pageContentId": _id, "communityId": this.selectedCommunityId, "pageId": this.selectedPageId } } );
} else {
this.router.navigate( ['/pageContents/edit/'], { queryParams: { "pageContentId": _id, "communityId": this.selectedCommunityId } } );
}
}
public togglePageHelpContents(status : boolean, ids : string[]) {

20
app/pages/helpcontent/pages.component.html
View File

@ -52,11 +52,13 @@
<div class="row headers">
<div class="col-sm-1 header select-users"><input id="allPageCheckbox" type="checkbox" (change)="toggleCheckBoxes($event)">
</div>
<div class="col-sm-3 header hidden-xs"><label><a href="#">Route</a></label></div>
<div class="col-sm-2 header hidden-xs"><label><a href="#">Route</a></label></div>
<div class="col-sm-2 header hidden-xs"><label><a href="#">Name</a></label></div>
<div class="col-sm-2 header hidden-xs"><label><a href="#">State</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">State</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Type</a></label></div>
<div class="col-sm-3 header hidden-xs"><label><a href="#">Related Entities</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Actions</a></label></div>
<div class="col-sm-1 header hidden-xs"><label><a href="#">Help Contents</a></label></div>
</div>
<template [ngIf]="pagesCheckboxes && pagesCheckboxes.length>0">
@ -64,13 +66,13 @@
<div class="col-sm-1 avatar"><input id="{{check.page._id}}" class="checkBox" type="checkbox"
name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
</div>
<div class="col-sm-3">
<div class="col-sm-2">
<div class="route" href="#">{{check.page.route}}</div>
</div>
<div class="col-sm-2">
<div class="name" href="#">{{check.page.name}}</div>
</div>
<div class="col-sm-2">
<div class="col-sm-1">
<!-- <div class="state" href="#">{{(check.page.isEnabled) ? 'Enabled' : 'Disabled'}}</div> -->
<div *ngIf="check.page.isEnabled" class="activated" >
<input (click)="togglePage(false,[check.page._id])" class="deactivate" src="imgs/check-icon.png" title="Disable" width="20" type="image" height="20">
@ -79,6 +81,9 @@
<input (click)="togglePage(true,[check.page._id])" class="deactivate" src="imgs/x-icon.png" title="Enable" width="20" type="image" height="20">
</div>
</div>
<div class="col-sm-1">
<div class="type" href="#">{{check.page.type}}</div>
</div>
<div class="col-sm-3">
<div class="entities" href="#">
<span *ngFor="let entity of check.page.entities let i=index">{{entity.name}}<span *ngIf="i<(check.page.entities.length-1)">, </span></span>
@ -90,6 +95,9 @@
<input title="Delete" src="imgs/icn_trash.png" class="delete" type="image" (click)="confirmDeletePage(check.page._id)">
</div>
</div>
<div class=col-sm-1>
<a class="helpContents" [queryParams]="{community: selectedCommunityId, page: check.page._id}" routerLink="/pageContents">edit</a>
</div>
</div>
</template>
<div *ngIf="pagesCheckboxes.length==0" class="col-md-12">
@ -107,13 +115,13 @@
<modal-form #saveModal [saveText]="'Save'" [titleText]="'Add a new Page'" [formGroup]="formGroup" [type]="'page'"
[isModalShown]="isModalShown" (emmitObject)="pageSavedSuccessfully($event)" (emmitError)="handleError($event)"
[selectedCommunityId]="selectedCommunityId">
<page-form [group]="formGroup" [selectedCommunityId]="selectedCommunityId"></page-form>
<page-form [group]="formGroup" [selectedCommunityId]="selectedCommunityId" [type]="pagesType"></page-form>
</modal-form>
<modal-form #updateModal [saveText]="'Update'" [titleText]="'Update Page'" [formGroup]="formGroup" [type]="'page'"
[isModalShown]="isModalShown" (emmitObject)="pageUpdatedSuccessfully($event)" (emmitError)="handleError($event)"
[selectedCommunityId]="selectedCommunityId">
<page-form [group]="formGroup" [selectedCommunityId]="selectedCommunityId"></page-form>
<page-form [group]="formGroup" [selectedCommunityId]="selectedCommunityId" [type]="pagesType"></page-form>
</modal-form>
<delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeletePages($event)">

50
app/pages/helpcontent/pages.component.ts
View File

@ -2,6 +2,7 @@
* Created by stefania on 7/13/17.
*/
import { Component, ViewChild, OnInit } from '@angular/core';
import { ActivatedRoute } from "@angular/router";
import { HelpContentService } from "../../services/help-content.service";
import { FormGroup } from "@angular/forms";
import { ModalFormComponent } from "../modal-form.component";
@ -9,6 +10,7 @@ import { DeleteConfirmationDialogComponent } from "../delete-confirmation-dialog
import { PageFormComponent } from "./page-form.component";
import { CheckPage, Page } from "../../domain/page";
import { Community } from "../../domain/community";
import { Entity } from "../../domain/entity";
@Component({
selector: 'pages',
@ -44,26 +46,48 @@ export class PagesComponent implements OnInit {
public selectedCommunityId: string;
ngOnInit() {
this.getCommunities();
public pagesType: string;
ngOnInit() {
this.formGroup = this.formComponent.form;
// this.getCommunities();
this.route.queryParams.subscribe(params => {
this.pagesType = "";
if(params['type']) {
this.pagesType = params['type'];
}
this.getCommunities();
});
}
constructor(private _helpContentService: HelpContentService) {}
constructor(private route: ActivatedRoute, private _helpContentService: HelpContentService) {}
getPages(community_id: string) {
let self = this;
this._helpContentService.getCommunityPages(community_id).subscribe(
pages => {
self.pages = pages;
self.pagesCheckboxes = [];
pages.forEach(_ => {
self.pagesCheckboxes.push(<CheckPage>{page : _, checked : false});
});
},
error => this.handleError('System error retrieving pages', error));
if(this.pagesType) {
this._helpContentService.getCommunityPagesByType(community_id, "?page_type="+this.pagesType).subscribe(
pages => {
self.pagesReturned(pages);
},
error => this.handleError('System error retrieving pages', error));
} else {
this._helpContentService.getCommunityPages(community_id).subscribe(
pages => {
self.pagesReturned(pages);
},
error => this.handleError('System error retrieving pages', error));
}
}
pagesReturned(pages: Page[]) {
this.pages = pages;
this.pagesCheckboxes = [];
pages.forEach(_ => {
this.pagesCheckboxes.push(<CheckPage>{page : _, checked : false});
});
}
getCommunities() {
@ -121,7 +145,7 @@ export class PagesComponent implements OnInit {
public editPage(i : number) {
let page : Page = this.pagesCheckboxes[i].page;
this.formGroup.patchValue(page);
const entityFGs = page.entities.map(entity => this.formComponent._fb.group(entity));
const entityFGs = (page.entities as Entity[]).map(entity => this.formComponent._fb.group(entity));
const entityFormArray = this.formComponent._fb.array(entityFGs);
this.formGroup.setControl('entities', entityFormArray);
console.info(this.formGroup.value);

13
app/pages/modal-form.component.ts
View File

@ -10,6 +10,7 @@ import { Question } from "../domain/question";
import { HelpContentService } from "../services/help-content.service";
import { Page } from "../domain/page";
import { Entity } from "../domain/entity";
import { Community } from "../domain/community";
@Component({
selector: 'modal-form',
@ -76,6 +77,18 @@ export class ModalFormComponent {
data => this.emmitObject.emit(data),
error => this.emmitError.emit(error)
);
} else if (this.type == 'community') {
if(this.saveText == 'Update') {
this._helpService.updateCommunity(<Community> obj).subscribe(
data => this.emmitObject.emit(data),
error => this.emmitError.emit(error)
);
} else if(this.saveText == 'Save') {
this._helpService.saveCommunity(<Community> obj).subscribe(
data => this.emmitObject.emit(data),
error => this.emmitError.emit(error)
);
}
} else if (this.type == 'page') {
if(this.saveText == 'Update') {
this._helpService.updatePage(<Page> obj).subscribe(

54
app/services/help-content.service.ts
View File

@ -32,18 +32,72 @@ export class HelpContentService {
.catch(this.handleError);
}
getPage(pageId:string) {
return this.http.get(this._helpContentUrl + 'page/'+pageId)
.map(res => <Page> res.json())
.catch(this.handleError);
}
getCommunities() {
return this.http.get(this._helpContentUrl + 'community')
.map(res => <Array<Community>> res.json())
.catch(this.handleError);
}
getCommunitiesFull() {
return this.http.get(this._helpContentUrl + 'communityFull')
.map(res => <Array<Community>> res.json())
.catch(this.handleError);
}
getCommunityFull(community_id: string) {
return this.http.get(this._helpContentUrl + 'communityFull/'+community_id)
.map(res => <Community> res.json())
.catch(this.handleError);
}
saveCommunity(community: Community) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
HelpContentService.removeNulls(community);
return this.http.post(this._helpContentUrl + 'community/save', JSON.stringify(community), options)
.map(res => <Community> res.json())
.catch(this.handleError);
}
updateCommunity(community: Community) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
HelpContentService.removeNulls(community);
return this.http.post(this._helpContentUrl + 'community/update', JSON.stringify(community), options)
.map(res => <Community> res.json())
.catch(this.handleError);
}
deleteCommunities(ids : string[]) {
let headers = new Headers({'Content-Type': 'application/json'});
let options = new RequestOptions({headers: headers});
return this.http.post(this._helpContentUrl + 'community/delete',JSON.stringify(ids), options)
.catch(this.handleError);
}
getCommunityPages(community_id: string) {
return this.http.get(this._helpContentUrl + 'community/'+community_id+'/pages')
.map(res => <Array<Page>> res.json())
.catch(this.handleError);
}
getCommunityPagesByType(community_id: string, params: string) {
return this.http.get(this._helpContentUrl + 'community/'+community_id+'/pages'+params)
.map(res => <Array<Page>> res.json())
.catch(this.handleError);
}
getEntities() {
return this.http.get(this._helpContentUrl + 'entity')
.map(res => <Array<Entity>> res.json())

3
index.html
View File

@ -2,7 +2,7 @@
<head>
<base href="/">
<title>OpenMinTeD Admin Tools</title>
<title>OpenAIRE-Connect Admin Tools</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
@ -42,4 +42,3 @@
<script async src="dist/main.bundle.js"></script>
</body>
</html>

20
styles.css
View File

@ -749,7 +749,8 @@ a {
#faqQuestions #content .page-title,
#pages #content .page-title,
#pageContents #content .page-title,
#entities #content .entity-title {
#entities #content .entity-title,
#communities #content .community-title {
border-right: 1px solid #e6e6e6;
bottom: 0;
color: #7e7e7e;
@ -783,7 +784,8 @@ a {
#harvestHistory #content .content-wrapper .contentPanel .alert,
#pages #content .content-wrapper .contentPanel .alert,
#pageContents #content .content-wrapper .contentPanel .alert,
#entities #content .content-wrapper .contentPanel .alert {
#entities #content .content-wrapper .contentPanel .alert,
#communities #content .content-wrapper .contentPanel .alert {
margin-left: -10px;
margin-right: -10px;
}
@ -992,6 +994,14 @@ a {
width: 360px;
}
#communities #content form.search {
float: left;
margin-left: 150px;
position: relative;
top: -2px;
width: 360px;
}
#dataProviders #content form.search {
float: left;
margin-left: 220px;
@ -1008,7 +1018,8 @@ a {
#faqQuestions #content form.search input[type="text"],
#pages #content form.search input[type="text"],
#pageContents #content form.search input[type="text"],
#entities #content form.search input[type="text"]{
#entities #content form.search input[type="text"],
#communities #content form.search input[type="text"] {
border: 0 none;
border-radius: 3px;
padding: 6px 15px 6px 37px;
@ -1029,7 +1040,8 @@ a {
#faqQuestions #content form.search input[type="submit"],
#pages #content form.search input[type="submit"],
#pageContents #content form.search input[type="submit"],
#entities #content form.search input[type="submit"] {
#entities #content form.search input[type="submit"],
#communities #content form.search input[type="submit"] {
position: absolute;
visibility: hidden;
}