Project

General

Profile

1
<div page-content>
2
  <div header>
3
    <community-info tab="projects"></community-info>
4
    <div [class.uk-invisible]="showLoading" class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
5
      <div class="uk-flex-last@m">
6
        <a class="uk-text-uppercase uk-flex uk-flex-middle" (click)="addNew()"
7
           [attr.uk-tooltip]="(toggle? 'cls: uk-invisible; ' : 'cls: uk-active; ') +
8
                'title: <div class=\'uk-padding-small\'><div class=\'uk-margin-bottom uk-text-bold\'> Search and add more Projects</div><div>The research results linked to the projects specified here will be automatically linked to your community dashboard.</div></div>'">
9
          <button class="uk-icon-button large uk-button-secondary">
10
            <icon name="add"></icon>
11
          </button>
12
          <button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary">Add new project</button>
13
        </a>
14
      </div>
15
      <div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search"
16
           [selected]="communitySearchUtils.keyword" (closeEmitter)="onSearchClose()" (resetEmitter)="resetInput()"
17
           [bordered]="true" colorClass="uk-text-secondary" toggleTitle="locate projects"
18
           class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
19
    </div>
20
  </div>
21
  <div inner>
22
    <div *ngIf="showLoading" class="uk-margin-large-top">
23
      <loading></loading>
24
    </div>
25

    
26
    <div *ngIf="!showLoading">
27
      <div>
28
        <div class="uk-grid uk-flex uk-flex-middle uk-margin-medium-bottom" uk-grid>
29
          <div *ngIf="allOptions.length > 0"
30
               class="uk-grid uk-flex-middle uk-flex-left@m uk-flex-center uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1 uk-first-column">
31
            <span class="">Filter by: </span>
32
<!--            uk-width-expand@m uk-width-auto-->
33
            <div class="uk-width-expand uk-padding-remove uk-margin-small-left" dashboard-input
34
                 [formInput]="filterForm.get('funder')"
35
                 placeholder="Search by funders"
36
                 type="chips" [options]="allOptions"   chipLabel="label">
37
            </div>
38
          </div>
39
          <div *ngIf="previewCommunityProjects.length > 0"
40
               class="uk-width-expand@m uk-width-1-1">
41
            <div class="uk-flex-middle uk-flex-right@m uk-flex-center uk-grid">
42
              <span class="">Sort by: </span>
43
              <div  class="uk-width-medium uk-padding-remove uk-margin-small-left"  dashboard-input
44
                    [formInput]="filterForm.get('sort')"
45
                    type="select"
46
                    [options]="sortOptions">
47
              </div>
48
            </div>
49
          </div>
50
        </div>
51
        <no-load-paging *ngIf="previewCommunityProjects.length > 0" [type]="'projects'"
52
                        (pageChange)="updatePage($event)"
53
                        [page]="page" [pageSize]="pageSize"
54
                        [totalResults]="previewCommunityProjects.length">
55
        </no-load-paging>
56
        <div class="uk-margin-medium-top uk-margin-medium-bottom">
57
          <div *ngIf="previewCommunityProjects.length == 0"
58
               class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
59
            <div>No projects for {{name}}</div>
60
          </div>
61
          <div class="uk-card uk-card-default uk-text-small uk-margin-bottom"
62
               *ngFor="let item of previewCommunityProjects.slice((page - 1)*pageSize, page*pageSize)">
63
            <div class="uk-grid uk-grid-divider uk-padding" uk-grid>
64
              <div class="uk-width-expand@m uk-width-1-1">
65
                <div class="uk-padding-small uk-padding-remove-horizontal">
66
                  <h6 *ngIf="item.name || item.acronym || item.openaireId || item.grantId || item.funder"
67
                       class="uk-margin-small-bottom">
68
                    <a *ngIf="item.openaireId || item.grantId || item.funder"
69
                       target="_blank"
70
                       [href]="communityUrl+'/search/project?' + ((item.openaireId) ? 'projectId='+item.openaireId : 'grantId='+item.grantId+'&funder='+item.funder)">
71
                      <span *ngIf="item.name">{{item.name}}</span>
72
                      <span *ngIf="item.name && item.acronym">(</span><span *ngIf="item.acronym">{{item.acronym}}</span><span *ngIf="item.name && item.acronym">)</span>
73
                      <span *ngIf="!item.name && !item.acronym">[no title available]</span>
74
                      <span class="custom-external custom-icon space"></span>
75
                    </a>
76
                    <span *ngIf="!item.openaireId && !item.grantId && !item.funder">
77
                      <span *ngIf="item.name">{{item.name}}</span>
78
                      <span *ngIf="item.name && item.acronym">(</span><span *ngIf="item.acronym">{{item.acronym}}</span><span *ngIf="item.name && item.acronym">)</span>
79
                      <span *ngIf="!item.name && !item.acronym">[no title available]</span>
80
                    </span>
81
                  </h6>
82
                  <div *ngIf="item.grantId" class="uk-margin-small-bottom">
83
                    <span class="title">Grant ID: </span>
84
                    <span>{{item.grantId}}</span>
85
                  </div>
86
                  <div *ngIf="item.funder" class="uk-margin-small-bottom">
87
                    <span class="title">Funder: </span>
88
                    <span>{{item.funder}}</span>
89
                  </div>
90
                </div>
91
              </div>
92
              <div class="uk-width-auto@m uk-width-1-1">
93
                <div class="uk-flex uk-flex-middle uk-flex-center uk-height-1-1">
94
                  <div class="uk-padding-small uk-padding-remove-horizontal">
95

    
96
                  <!--                <div class="uk-padding-small uk-padding-remove-horizontal uk-flex uk-flex-center">-->
97
                    <a (click)="removeProject(item)" class="uk-button action uk-flex uk-flex-middle">
98
                      <icon name="remove_circle_outline" ratio="0.7"></icon>
99
                      <span class="uk-margin-small-left">Remove project</span>
100
                    </a>
101
                  </div>
102
                </div>
103
              </div>
104
            </div>
105
          </div>
106
        </div>
107
        <no-load-paging *ngIf="previewCommunityProjects.length > 0" [type]="'projects'"
108
                        (pageChange)="updatePage($event)"
109
                        [page]="page" [pageSize]="pageSize"
110
                        [totalResults]="previewCommunityProjects.length">
111
        </no-load-paging>
112
      </div>
113
    </div>
114

    
115

    
116
<!--  <div class="uk-child-width-expand@s uk-text-center uk-margin-bottom" uk-grid>-->
117
<!--    <div>-->
118
<!--      <form class=" uk-animation uk-card uk-card-default uk-padding" >-->
119
<!--        <div>-->
120
<!--          <select class="uk-select"  [(ngModel)]="selectedFunder" name="select_funder"  >-->
121
<!--           <option  value="" (click)="goTo(1)">Select funder:</option>-->
122
<!--           <option *ngFor="let  funder of funders"  [value]="funder" (click)="goTo(1)">{{funder}}</option>-->
123
<!--          </select>-->
124
<!--        </div>-->
125
<!--      </form>-->
126
<!--    </div>-->
127
<!--    <div>-->
128
<!--      <form class="uk-text-center uk-animation uk-card uk-card-default uk-padding">-->
129
<!--        <div>-->
130
<!--          <input type="text" class="uk-input  uk-width-1-2" placeholder="Search community projects..." aria-describedby="sizing-addon2"  [(ngModel)]="communitySearchUtils.keyword"  name="keyword" >-->
131
<!--          <button (click)="goTo(1)"  type="submit" class=" uk-button">-->
132
<!--             <span class="uk-icon">-->
133
<!--             <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>-->
134
<!--             </span>Search-->
135
<!--           </button>-->
136
<!--        </div>-->
137
<!--      </form>-->
138
<!--    </div>-->
139
<!--  </div>-->
140

    
141
<!--  <errorMessages [status]="[communitySearchUtils.status]" [type]="'community projects'"></errorMessages>-->
142
<!--  <div *ngIf="communitySearchUtils.status == errorCodes.DONE" class="uk-alert uk-alert-primary">-->
143
<!--    <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>-->
144
<!--  All the research results linked to the projects specified here will be automatically linked to your community dashboard.  -->
145
<!--  </div>-->
146
<!--  <div *ngIf="communitySearchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">-->
147
<!--    <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">-->
148
<!--      <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">-->
149
<!--        {{communitySearchUtils.totalResults | number}} projects, page {{communitySearchUtils.page | number}} of {{(totalPages()) | number}}-->
150
<!--      </span>-->
151
<!--      <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">-->
152
<!--        <paging-no-load [currentPage]="communitySearchUtils.page" [totalResults]="communitySearchUtils.totalResults" [size]="10" (pageChange)="goTo($event.value, false)"></paging-no-load>-->
153
<!--      </span>-->
154
<!--    </div>-->
155
<!--  </div>-->
156

    
157
<!--  <div *ngIf="communitySearchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">-->
158
<!--    <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">-->
159
<!--      <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">-->
160
<!--        {{communitySearchUtils.totalResults | number}} projects, page {{communitySearchUtils.page | number}} of {{(totalPages()) | number}}-->
161
<!--      </span>-->
162
<!--      <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">-->
163
<!--        <paging-no-load [currentPage]="communitySearchUtils.page" [totalResults]="communitySearchUtils.totalResults" [size]="10" (pageChange)="goTo($event.value, false)"></paging-no-load>-->
164
<!--      </span>-->
165
<!--    </div>-->
166
<!--  </div>-->
167

    
168
  <modal-alert #AlertModalDeleteCommunity (alertOutput)="confirmedDeleteProject($event)"></modal-alert>
169
  <!-- <delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeleteProject($event)">
170
      Are you sure you want to remove the selected project from your community?
171
  </delete-confirmation-dialog> -->
172
<!-- </div> -->
173

    
174

    
175
  </div>
176
</div>
(5-5/6)