Adds: Drafts, Removes: Recent Edited Activity Table from Dashboard

This commit is contained in:
apapachristou 2019-04-26 19:03:38 +03:00
parent 8699b7bbe8
commit 6890cd2799
6 changed files with 151 additions and 120 deletions

View File

@ -62,11 +62,11 @@
<app-recent-visited-activity></app-recent-visited-activity> <app-recent-visited-activity></app-recent-visited-activity>
</div> </div>
</div> </div>
<div class="row"> <!-- <div class="row">
<div class="col-lg-12 col-md-12"> <div class="col-lg-12 col-md-12">
<app-recent-edited-activity></app-recent-edited-activity> <app-recent-edited-activity></app-recent-edited-activity>
</div> </div>
</div> </div> -->
</div> </div>

View File

@ -1,26 +1,54 @@
.grey { .grey {
color: rgb(162, 162, 162); color: rgb(162, 162, 162);
} }
.card-draft { .card-draft {
height: calc(100% - 60px); height: calc(100% - 60px);
} }
.draft-desc { .draft-desc {
padding-top: 15px; position: relative;
padding-bottom: 15px; overflow: hidden;
height: 60px;
font-size: 14px;
padding-top: 15px;
margin-bottom: 30px;
}
.draft-desc:after {
content: "";
text-align: right;
position: absolute;
bottom: 0;
right: 0;
width: 70%;
height: 1.4em;
background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 50%);
}
td:hover .draft-desc:after {
background: rgba(255, 255, 255, 0);
} }
.draft-subtitle { .draft-subtitle {
font-weight: 400; font-weight: 400;
color: rgb(162, 162, 162); color: rgb(162, 162, 162);
} }
.draft-title { .draft-title {
font-weight: 500; font-weight: 500;
color: black; color: black;
} }
.drafts-more-btn { .drafts-more-btn {
text-align: right; text-align: right;
}
.project-pill {
width: 80%;
border: 1px solid rgb(231, 230, 230);
color: rgb(145, 145, 145);
background-color: rgb(242, 242, 242);
border-radius: 10em;
text-align: center;
} }

View File

@ -1,89 +1,38 @@
<div class="card card-draft"> <div class="card card-draft">
<div class="card-header card-header-plain"> <div class="card-header card-header-plain">
<div class="card-desc"> <div class="card-desc">
<h4 class="card-title">DRAFTS</h4> <h4 class="card-title">DRAFTS</h4>
<p class="card-category">Draft Registrations</p> <p class="card-category">Draft Registrations</p>
</div> </div>
<a href="#" class="view-all">VIEW ALL</a> <div class="view-all" [class.clickable]="isAuthenticated()" (click)="navigateToUrl()">{{ 'GENERAL.ACTIONS.VIEW-ALL' | translate}}</div>
</div> </div>
<div class="card-body table-responsive"> <div class="card-body table-responsive">
<table class="table table-hover"> <table class="table table-hover">
<tbody> <tbody *ngIf="datasetDrafts != null">
<tr> <tr *ngFor="let dataset of datasetDrafts" (click)="redirect(dataset.id, datasetDraftsTypeEnum.Dataset)" style="cursor: pointer;">
<td> <td>
<div class="row"> <div class="row">
<div class="col-md-2" style="padding-top: 36px"> <div class="col-md-2" style="padding-top: 36px">
<i class="material-icons-outlined grey">view_agenda</i> <i class="material-icons-outlined grey">library_books</i>
</div> </div>
<div class="col-md-10"> <div class="col-md-10">
<div class="drafts-more-btn"> <div class="drafts-more-btn">
<i class="material-icons more-icon">more_horiz</i> <i class="material-icons more-icon">more_horiz</i>
</div> </div>
<div class="draft-title"> <div class="draft-title">
Dataset: Clarin-D For Dmp: Dmp for Project: Real time Dataset: {{ dataset.label }} For Dmp: {{ dataset.dmp }} For Project: {{ dataset.project }}
application </div>
</div> <div class="draft-subtitle">{{ dataset.created | date: "shortDate"}}</div>
<div class="draft-subtitle">03.08.2019</div> <div class="draft-desc">{{ dataset.description }}</div>
<div class="draft-desc"> <div class="project-pill">{{ dataset.profile }}</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed </div>
do eiusmod tempor incididunt ut labore et dolore magna aliqua. </div>
Ut enim ad minim veniam, quis nostrud exercitation ullamco </td>
laboris nisi ut aliquip ex ea commodo consequat. Duis aute </tr>
irure dolor in reprehenderit in voluptate velit esse cillum </tbody>
dolore eu fugiat nulla pariatur. Excepteur sint occaecat <tbody *ngIf="datasetDrafts == null">
cupidatat non proident, sunt in culpa qui officia deserunt <td></td>
mollit anim id est laborum. </tbody>
</div> </table>
<ul </div>
class="nav md-pills max-width-80 nav-justified pills-rounded pills-outline-default"
>
<li class="nav-item">
<a
class="nav-link active"
data-toggle="tab"
href="#panel81"
role="tab"
>Clarin-D</a
>
</li>
</ul>
</div>
</div>
</td>
</tr>
<tr>
<td>
<div class="row">
<div class="col-md-2" style="padding-top: 36px">
<i class="material-icons-outlined grey">library_books</i>
</div>
<div class="col-md-10">
<div class="drafts-more-btn">
<i class="material-icons more-icon">more_horiz</i>
</div>
<div class="draft-title">Title unavailable</div>
<div class="draft-subtitle">03.08.2019</div>
<div class="draft-desc">
Description unavailable
</div>
<ul
class="nav md-pills max-width-80 nav-justified pills-rounded pills-outline-default"
>
<li class="nav-item">
<a
class="nav-link active"
data-toggle="tab"
href="#panel81"
role="tab"
>Clarin-D</a
>
</li>
</ul>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div> </div>

View File

@ -1,15 +1,64 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit, Input } from '@angular/core';
import { DatasetService } from '../../../core/services/dataset/dataset.service';
import { DataTableRequest } from '../../../core/model/data-table/data-table-request';
import { DatasetCriteria } from '../../../core/query/dataset/dataset-criteria';
import { DatasetListingModel } from '../../../core/model/dataset/dataset-listing';
import { AuthService } from '../../../core/services/auth/auth.service';
import { RecentActivityType } from '../../../core/common/enum/recent-activity-type';
import { Router} from '@angular/router';
@Component({ @Component({
selector: 'app-drafts', selector: 'app-drafts',
templateUrl: './drafts.component.html', templateUrl: './drafts.component.html',
styleUrls: ['./drafts.component.css'] styleUrls: ['./drafts.component.css']
}) })
export class DraftsComponent implements OnInit { export class DraftsComponent implements OnInit {
datasetDrafts: DatasetListingModel[];
datasetDraftsTypeEnum = RecentActivityType;
@Input() routerLink: string;
status: number;
constructor() { } constructor(
private router: Router,
private datasetService: DatasetService,
private authentication: AuthService
) { }
ngOnInit() { ngOnInit() {
} const fields: Array<string> = [];
const dmpDataTableRequest: DataTableRequest<DatasetCriteria> = new DataTableRequest(0, 2, { fields: fields });
dmpDataTableRequest.criteria = new DatasetCriteria();
dmpDataTableRequest.criteria.status = 0;
this.datasetService.getPaged(dmpDataTableRequest).subscribe(response => {
this.datasetDrafts = response.data;
});
}
redirect(id: string, type: RecentActivityType) {
switch (type) {
case RecentActivityType.Project: {
this.router.navigate(["projects/edit/" + id]);
return;
}
case RecentActivityType.Dataset: {
this.router.navigate(["datasets/edit/" + id]);
return;
}
case RecentActivityType.Dmp: {
this.router.navigate(["plans/edit/" + id]);
return;
}
default:
throw new Error("Unsupported Activity Type ");
}
}
public isAuthenticated(): boolean {
return !!this.authentication.current();
}
navigateToUrl() {
if (!this.isAuthenticated()) { return; }
this.router.navigate(['/datasets'], { queryParams: { status: 0 } });
}
} }

View File

@ -34,6 +34,7 @@ export class DatasetListingComponent extends BaseComponent implements OnInit, IB
pageEvent: PageEvent; pageEvent: PageEvent;
titlePrefix: String; titlePrefix: String;
dmpId: string; dmpId: string;
status: Number;
dmpSearchEnabled = true; dmpSearchEnabled = true;
constructor( constructor(
@ -54,6 +55,7 @@ export class DatasetListingComponent extends BaseComponent implements OnInit, IB
.subscribe(async (params: Params) => { .subscribe(async (params: Params) => {
const queryParams = this.route.snapshot.queryParams; const queryParams = this.route.snapshot.queryParams;
this.dmpId = queryParams['dmpId']; this.dmpId = queryParams['dmpId'];
this.status = queryParams['status'];
this.criteria.setRefreshCallback(() => this.refresh()); this.criteria.setRefreshCallback(() => this.refresh());
if (this.dmpId != null) { if (this.dmpId != null) {
this.dmpSearchEnabled = false; this.dmpSearchEnabled = false;
@ -69,6 +71,11 @@ export class DatasetListingComponent extends BaseComponent implements OnInit, IB
this.refresh(); this.refresh();
this.breadCrumbs = Observable.of([]); this.breadCrumbs = Observable.of([]);
} }
if (this.status != null && this.status == 0) {
this.criteria.setCriteria(this.getDraftCriteria());
this.refresh();
}
}); });
} }
@ -88,6 +95,12 @@ export class DatasetListingComponent extends BaseComponent implements OnInit, IB
return defaultCriteria; return defaultCriteria;
} }
getDraftCriteria(): DatasetCriteria {
const draftCriteria = new DatasetCriteria();
draftCriteria.status = 0;
return draftCriteria;
}
makeItPublic(id: String) { makeItPublic(id: String) {
this.datasetService.makeDatasetPublic(id) this.datasetService.makeDatasetPublic(id)
.pipe(takeUntil(this._destroyed)) .pipe(takeUntil(this._destroyed))

View File

@ -214,7 +214,7 @@ h4 {
margin-top: 5px; margin-top: 5px;
} }
.card-title h4 { .card-desc h4 {
text-transform: uppercase; text-transform: uppercase;
} }
@ -259,7 +259,13 @@ h4 {
margin-top: 10px; margin-top: 10px;
margin-right: 10px; margin-right: 10px;
font-weight: 400; font-weight: 400;
cursor: pointer;
text-transform: uppercase; text-transform: uppercase;
color: rgb(106, 164, 217);
}
.view-all:hover {
color: rgb(46, 117, 182);
} }
.card-header-plain h4 { .card-header-plain h4 {
@ -316,20 +322,6 @@ table > thead > tr > th,
z-index: 0; z-index: 0;
} }
.pills-outline-blue .nav-item .nav-link {
border: 1px solid rgb(231, 230, 230);
color: rgb(145, 145, 145);
}
.pills-outline-default .nav-item .nav-link.active {
border: 1px solid rgb(231, 230, 230);
color: rgb(145, 145, 145);
background-color: rgb(242, 242, 242);
}
.pills-outline-default .nav-item .nav-link.active:hover {
border: 1px solid rgb(231, 230, 230);
color: rgb(145, 145, 145);
}
.form-control:focus { .form-control:focus {
color: #495057; color: #495057;
background-color: rgba(0, 0, 0, 0); background-color: rgba(0, 0, 0, 0);