button more filters

This commit is contained in:
annampak 2017-11-02 09:57:08 +02:00
parent a2224acac5
commit 518e73d1ca
2 changed files with 57 additions and 38 deletions

View File

@ -36,4 +36,14 @@ tr.hover:hover > * {
background-color:#337ab7; background-color:#337ab7;
color:white; color:white;
margin-top:15px; margin-top:15px;
} }
.btnMoreFilters{
background-color:#337ab7;
color:white;
margin-bottom:10px;
}
/* td.rowFilter{
} */

View File

@ -1,7 +1,7 @@
<meta name="google-signin-client_id" content="524432312250-vhgidft856v8qftsc81kls4c74v87d8o.apps.googleusercontent.com"> <meta name="google-signin-client_id" content="524432312250-vhgidft856v8qftsc81kls4c74v87d8o.apps.googleusercontent.com">
<!-- <div [ngClass]="{true:'visible', false:'invisible'}[editorVisible]"> --> <!-- <div [ngClass]="{true:'visible', false:'invisible'}[editorVisible]"> -->
<table class="table table-striped" [mfData]="tableData | dmpTableFilter : filterQuery | dmpVersionFilter : versionFilter" <table class="table table-striped" [mfData]="tableData | dmpTableFilter : filterQuery | dmpVersionFilter : versionFilter"
#mf="mfDataTable" [mfRowsOnPage]="rowsOnPage" [(mfSortBy)]="sortBy" [(mfSortOrder)]="sortOrder"> #mf="mfDataTable" [mfRowsOnPage]="rowsOnPage" [(mfSortBy)]="sortBy" [(mfSortOrder)]="sortOrder">
<thead> <thead>
@ -13,10 +13,19 @@
<input class="form-control" [(ngModel)]="versionFilter" placeholder='Filter' /> <input class="form-control" [(ngModel)]="versionFilter" placeholder='Filter' />
</th> </th>
<th> <th>
<button class="btn btn-default" (click)="getDmps()"> <button class="btn btn-default " (click)="getDmps()">
<span class="glyphicon glyphicon-refresh"></span> <span class="glyphicon glyphicon-refresh"></span>
</button> </button>
</th> </th>
</tr>
<tr>
<th>
<button type="button" class="btn btn-info btncustom" data-toggle="collapse" data-target="#demo">More filters</button>
<div id="demo" class="collapse">
<input class="form-control" [(ngModel)]="filterQuery" placeholder='Filter' />
</div>
</th>
</tr> </tr>
<tr> <tr>
<th [ngClass]="{true:'visible', false:'invisible'}[showIDs]"> <th [ngClass]="{true:'visible', false:'invisible'}[showIDs]">
@ -43,7 +52,7 @@
<th> <th>
<mfDefaultSorter>Actions </mfDefaultSorter> <mfDefaultSorter>Actions </mfDefaultSorter>
</th> </th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@ -63,13 +72,13 @@
<i class="fa fa-clone fa-fw" data-toggle="tooltip" title="create new version" id="changeVersionDMP"></i> <i class="fa fa-clone fa-fw" data-toggle="tooltip" title="create new version" id="changeVersionDMP"></i>
<i class="fa fa-eraser fa-fw" data-toggle="tooltip" title="delete DMP"></i> <i class="fa fa-eraser fa-fw" data-toggle="tooltip" title="delete DMP"></i>
<i class="fa fa-table fa-fw" data-toggle="tooltip" title="show dataset for this DMP" id="showDatasets"></i></a></td> <i class="fa fa-table fa-fw" data-toggle="tooltip" title="show dataset for this DMP" id="showDatasets"></i></a></td>
</tr> </tr>
</tbody> </tbody>
<tfoot> <tfoot>
<tr> <tr>
<td colspan="5"> <td colspan="5">
<button type="button" class="btn btn-info btncustom" (click)="newDmp(item)">New Dmp</button> <button type="button" class="btn btn-info btncustom" (click)="newDmp(item)">New Dmp</button>
<mfBootstrapPaginator [rowsOnPageSet]="[5,20,40]"></mfBootstrapPaginator> <mfBootstrapPaginator [rowsOnPageSet]="[5,20,40]"></mfBootstrapPaginator>
</td> </td>
</tr> </tr>
@ -101,7 +110,7 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="status-name" class="col-form-label">Status:</label> <label for="status-name" class="col-form-label">Status:</label>
<select class="form-control" [id]="statusid" [(ngModel)]="dmp.status" [name]="statusDropDown" #datasetfield > <select class="form-control" [id]="statusid" [(ngModel)]="dmp.status" [name]="statusDropDown" #datasetfield>
<option *ngFor="let opt of statusDropDown.options" [value]="opt.key">{{opt.value}}</option> <option *ngFor="let opt of statusDropDown.options" [value]="opt.key">{{opt.value}}</option>
</select> </select>
</div> </div>
@ -115,7 +124,7 @@
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="abbreviation-text" class="form-control-label">Description:</label> <label for="abbreviation-text" class="form-control-label">Description:</label>
<textarea class="form-control" id="abbreviation-text" [(ngModel)]="dmp.description" name="description" ></textarea> <textarea class="form-control" id="abbreviation-text" [(ngModel)]="dmp.description" name="description"></textarea>
</div> </div>
<!-- <div class="form-group"> <!-- <div class="form-group">
<label for="reference-text" class="form-control-label">Profile Data:</label> <label for="reference-text" class="form-control-label">Profile Data:</label>
@ -143,43 +152,43 @@
<!--Modal for changing version--> <!--Modal for changing version-->
<div class="modal fade" id="newVersionDmpModal" tabindex="-1" role="dialog" aria-labelledby="newVersionDmpModalLabel" aria-hidden="true"> <div class="modal fade" id="newVersionDmpModal" tabindex="-1" role="dialog" aria-labelledby="newVersionDmpModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">DMP</h5> <h5 class="modal-title" id="exampleModalLabel">DMP</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<form #newProjectForm="ngForm" (ngSubmit)="SaveNewDmp()"> <form #newProjectForm="ngForm" (ngSubmit)="SaveNewDmp()">
<div class="form-group" hidden> <div class="form-group" hidden>
<div class="form-group"> <div class="form-group">
<label for="label-name" class="form-control-label">Label:</label> <label for="label-name" class="form-control-label">Label:</label>
<input type="text" class="form-control" id="label-name" [(ngModel)]="dmp.label" name="label"> <input type="text" class="form-control" id="label-name" [(ngModel)]="dmp.label" name="label">
</div> </div>
<label for="recipient-name" class="col-form-label">Project:</label> <label for="recipient-name" class="col-form-label">Project:</label>
<select class="form-control" [id]="projectsDropDownKey" [(ngModel)]="dmp.project" [name]="projectsDropDown" #datasetfield> <select class="form-control" [id]="projectsDropDownKey" [(ngModel)]="dmp.project" [name]="projectsDropDown" #datasetfield>
<option *ngFor="let opt of projectsDropDown.options" [value]="opt.key">{{opt.value}}</option> <option *ngFor="let opt of projectsDropDown.options" [value]="opt.key">{{opt.value}}</option>
</select> </select>
</div> </div>
<div class="form-group" hidden> <div class="form-group" hidden>
<label for="label-name" class="form-control-label">Previous:</label> <label for="label-name" class="form-control-label">Previous:</label>
<input type="text" class="form-control" id="label-previous" [(ngModel)]="dmp.previous" name="previous"> <input type="text" class="form-control" id="label-previous" [(ngModel)]="dmp.previous" name="previous">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="abbreviation-text" class="form-control-label">Version:</label> <label for="abbreviation-text" class="form-control-label">Version:</label>
<input class="form-control" id="abbreviation-text" [(ngModel)]="dmp.version" name="version"> <input class="form-control" id="abbreviation-text" [(ngModel)]="dmp.version" name="version">
</div> </div>
</form> </form>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" (click)="SaveDmp();">Save Dmp</button> <button type="submit" class="btn btn-primary" (click)="SaveDmp();">Save Dmp</button>
</div>
</div> </div>
</div> </div>
</div> </div>
</div>
<!--Modal for DMPs--> <!--Modal for DMPs-->
<!-- <modal *ngIf="item && show" [(show)]="show" [item]="item" [(dataSetVisibe)]="dataSetVisibe"></modal> --> <!-- <modal *ngIf="item && show" [(show)]="show" [item]="item" [(dataSetVisibe)]="dataSetVisibe"></modal> -->