1
|
import {Component, Input,Output, ElementRef, EventEmitter, ViewChild} from '@angular/core';
|
2
|
import {Observable} from 'rxjs/Observable';
|
3
|
import {SearchProjectsService} from '../../services/searchProjects.service';
|
4
|
import {ProjectService} from '../../landingPages/project/project.service';
|
5
|
// import {ModalLoading} from '../../utils/modal/loading.component';
|
6
|
import { Subject } from 'rxjs/Subject';
|
7
|
import {ClaimProject} from './claimEntities.class';
|
8
|
declare var UIkit:any;
|
9
|
@Component({
|
10
|
selector: 'claim-projects-search-form',
|
11
|
|
12
|
template: `
|
13
|
<div>
|
14
|
<form class=" uk-animation uk-card uk-card-default uk-padding uk-padding-large uk-padding-remove-left uk-margin-left uk-grid" uk-grid="">
|
15
|
|
16
|
<div class="uk-width-auto@m uk-first-column">
|
17
|
<select class="" [(ngModel)]="selectedFunderId" name="select_funder" >
|
18
|
<option value="0" (click)="funderChanged('0','Select funder:')">Select funder:</option>
|
19
|
<option *ngFor="let funder of funders" [value]="funder.id" (click)="funderChanged(funder.id,funder.name)">{{(funder.name.split("||").length > 0)?(funder.name.split("||")[0]+" ("+funder.name.split("||")[1]+")"):(funder.name)}}</option>
|
20
|
</select>
|
21
|
</div>
|
22
|
<div class="uk-width-expand@m">
|
23
|
|
24
|
<entities-autocomplete entityType="project" [funderId]="selectedFunderId" [allowDuplicates]=true [showSelected]=false [placeHolderMessage] = "'Project name or ID'" title = "Projects" [multipleSelections]=true (addItem) = "select($event)" ></entities-autocomplete>
|
25
|
</div>
|
26
|
|
27
|
</form>
|
28
|
|
29
|
</div>
|
30
|
`
|
31
|
|
32
|
})
|
33
|
export class ClaimProjectsSearchFormComponent {
|
34
|
ngOnInit() {
|
35
|
this.getFunders();
|
36
|
}
|
37
|
// @ViewChild (ModalLoading) loading : ModalLoading ;
|
38
|
|
39
|
// @Input() public inline: boolean = false ; // for claimed started from landing pages
|
40
|
public query = '';
|
41
|
@Input() public selectedProjects=[] ;
|
42
|
public elementRef;
|
43
|
|
44
|
public funders:string[];
|
45
|
public selectedFunderId:string ="0";
|
46
|
selectedFunderName:string ="Select funder:";
|
47
|
@Output() projectSelected = new EventEmitter();
|
48
|
|
49
|
public projects:string[];
|
50
|
public warningMessage = "";
|
51
|
public infoMessage = "";
|
52
|
|
53
|
// public searchTermStream = new Subject<string>();
|
54
|
// filtered: Observable<{}> = this.searchTermStream
|
55
|
// .debounceTime(300).distinctUntilChanged()
|
56
|
// .switchMap((term: string) => this._projectService.searchForProjectsObs(term, this.selectedFunderId));
|
57
|
public tries:number = 0 ;
|
58
|
public keywordlimit = 3;
|
59
|
|
60
|
constructor(private _service: ProjectService, private _projectService: SearchProjectsService, myElement: ElementRef) {
|
61
|
this.elementRef = myElement;
|
62
|
}
|
63
|
|
64
|
|
65
|
// search() {
|
66
|
// console.info("heeere "+this.query );
|
67
|
// this.infoMessage = "";
|
68
|
// // this.filtered = [];
|
69
|
// if(this.query == ""){
|
70
|
// this.tries = 0;
|
71
|
// this.warningMessage = "";
|
72
|
// } else if(this.query && this.query.length < this.keywordlimit){
|
73
|
// this.tries++;
|
74
|
// if(this.tries == this.keywordlimit -1 ){
|
75
|
// this.warningMessage = "Type at least " + this.keywordlimit + " characters";
|
76
|
// this.tries = 0;
|
77
|
// }
|
78
|
// }else{
|
79
|
// console.info("doo the search "+this.query );
|
80
|
//
|
81
|
// this.tries = 0;
|
82
|
// this.warningMessage = "";
|
83
|
// this.searchTermStream.next(this.query);
|
84
|
//
|
85
|
// }
|
86
|
//
|
87
|
// }
|
88
|
select(item){
|
89
|
this.query = "";
|
90
|
// this.searchTermStream.next(this.query); //clear
|
91
|
item = item.value;
|
92
|
var project: ClaimProject = new ClaimProject();
|
93
|
project.funderId = (this.selectedFunderId=="0")?item.funderId:this.selectedFunderId;
|
94
|
project.funderName = (this.selectedFunderId=="0")?item.funderName:this.selectedFunderName;
|
95
|
project.projectId = item.id;
|
96
|
project.projectName = item.projectName;
|
97
|
project.projectAcronym = item.projectAcronym;
|
98
|
project.startDate = item.startDate;
|
99
|
project.endDate = item.endDate;
|
100
|
project.code = item.code;
|
101
|
project.jurisdiction = item.jurisdiction;
|
102
|
project.fundingLevel0 = item.fundingLevel0;
|
103
|
|
104
|
console.log(item);
|
105
|
|
106
|
|
107
|
// this._service.getProjectDates(project.projectId).subscribe(
|
108
|
// data => {
|
109
|
// project.startDate = data.startDate;
|
110
|
// project.endDate = data.endDate;
|
111
|
// },
|
112
|
// err => console.log(err)
|
113
|
// );
|
114
|
var index:number =this.selectedProjects.indexOf(project);
|
115
|
var found:boolean = false;
|
116
|
this.warningMessage = "";
|
117
|
|
118
|
for (var _i = 0; _i < this.selectedProjects.length; _i++) {
|
119
|
let item = this.selectedProjects[_i];
|
120
|
if(item.projectId == project.projectId){
|
121
|
found=true;
|
122
|
this.warningMessage = "Project already in selected list";
|
123
|
}
|
124
|
}
|
125
|
|
126
|
if (!found) {
|
127
|
this.selectedProjects.push(project);
|
128
|
this.projectSelected.emit({
|
129
|
value: true
|
130
|
});
|
131
|
UIkit.notification({
|
132
|
message : 'A new project is selected.',
|
133
|
status : 'primary',
|
134
|
timeout : 1000,
|
135
|
pos : 'top-center'
|
136
|
});
|
137
|
}else{
|
138
|
UIkit.notification({
|
139
|
message : 'The project is already on your list.',
|
140
|
status : 'warning',
|
141
|
timeout : 1000,
|
142
|
pos : 'top-center'
|
143
|
});
|
144
|
}
|
145
|
|
146
|
}
|
147
|
showItem(item):string{
|
148
|
return ((item.field[1]['@value'])?item.field[1]['@value']+" - ":"" ) + item.field[3]['@value'];
|
149
|
}
|
150
|
remove(item){
|
151
|
var index:number =this.selectedProjects.indexOf(item);
|
152
|
if (index > -1) {
|
153
|
this.selectedProjects.splice(index, 1);
|
154
|
}
|
155
|
|
156
|
}
|
157
|
handleClick(event){
|
158
|
var clickedComponent = event.target;
|
159
|
var inside = false;
|
160
|
do {
|
161
|
if (clickedComponent === this.elementRef.nativeElement) {
|
162
|
inside = true;
|
163
|
}
|
164
|
clickedComponent = clickedComponent.parentNode;
|
165
|
} while (clickedComponent);
|
166
|
|
167
|
}
|
168
|
getFunders () {
|
169
|
console.info("Getting Funders....");
|
170
|
this._projectService.getFunders().subscribe(
|
171
|
data => {
|
172
|
this.funders = data[1];
|
173
|
console.log("this.funders");
|
174
|
},
|
175
|
err => console.log(err)
|
176
|
);
|
177
|
}
|
178
|
|
179
|
getProjects () {
|
180
|
if(this.selectedFunderId != '0'){
|
181
|
|
182
|
}
|
183
|
}
|
184
|
funderChanged(funderId:string, funderName:string){
|
185
|
this.selectedFunderId = funderId;
|
186
|
this.selectedFunderName = funderName;
|
187
|
console.info("Selected funder:"+this.selectedFunderId+ ' name:'+funderName );
|
188
|
|
189
|
}
|
190
|
|
191
|
}
|