argos/dmp-frontend/src/app/datasets/dataset.html

91 lines
5.7 KiB
HTML

<div style="margin: auto; max-width: 1000px; margin-top:50px">
<data-table id="films-grid" headerTitle="Datasets" [items]="datasets" [itemCount]="datasetCount" (reload)="reloadDatasets($event)"
[limit]="8" [sortBy]="'rating'" [sortAsc]="false" [substituteRows]="false"
[translations]="translations" >
<data-table-column [property]="'name'" [header]="'Label'" [sortable]="true">
</data-table-column>
<data-table-column [property]="'dmp'" [header]="'DMP'" [sortable]="true">
</data-table-column>
<data-table-column [property]="'profile'" [header]="'Profile'" [sortable]="true">
</data-table-column>
<data-table-column [property]="'uriDataset'" [header]="'Uri'" [sortable]="true">
</data-table-column>
<!-- <data-table-column [property]="'definition'" [header]="'Definition'" [sortable]="true">
</data-table-column> -->
<data-table-column header="Actions">
<template #dataTableHeader let-item="item">
<i>Actions</i>
</template>
<template #dataTableCell let-item="item">
<a class="editGridColumn" (click) = "editRow(item)"><i class="fa fa-pencil fa-fw"></i></a> <!--data-toggle="modal" data-target="#exampleModalDmps" -->
</template>
</data-table-column>
<data-table-column header="Edit">
<template #dataTableHeader let-item="item">
<i>Edit</i>
</template>
<template #dataTableCell let-item="item">
<a class="editGridColumn" (click) = "selectDataset(item)"><i class="fa fa-pencil fa-fw"></i></a> <!--data-toggle="modal" data-target="#exampleModalDmps" -->
</template>
</data-table-column>
</data-table>
<div style="margin-top: 10px">
<button type="button" class="btn btn-info" (click) = "newDataset(item)" >New Dataset</button> <!-- data-toggle="modal" data-target="#newDatasetModal" -->
<!-- <b>Selected:</b>
<span *ngIf="projectsTable.selectedRow == null"><i>No item selected</i></span>
<span [textContent]="projectsTable.selectedRow && projectsTable.selectedRow.item.name"></span> -->
</div>
</div>
<div class="modal fade" id="newDatasetModal" tabindex="-1" role="dialog" aria-labelledby="newDatasetModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Create New DMP</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form #newProjectForm="ngForm" (ngSubmit)="SaveNewDmp()">
<div class="form-group">
<label for="recipient-name" class="col-form-label">Dataset Profile:</label>
<select class="form-control" [id]="datasetProfileDropDownKey" [(ngModel)]="dataset.profile" [name]="datasetProfileDropDown" #datasetfield>
<option *ngFor="let opt of datasetProfileDropDown.options" [value]="opt.key">{{opt.value}}</option>
</select>
</div>
<div class="form-group">
<label for="label-name" class="form-control-label">Label:</label>
<input type="text" class="form-control" id="label-name" [(ngModel)]= "dataset.label" name = "label">
</div>
<div class="form-group">
<label for="abbreviation-text" class="form-control-label">DMP:</label>
<input class="form-control" id="abbreviation-text" [(ngModel)]= "dataset.dmp" name = "dmp">
</div>
<div class="form-group">
<label for="uri-text" class="form-control-label">Uri:</label>
<input class="form-control" id="uri-text" [(ngModel)]= "dataset.uri" name = "uri">
</div>
<div class="form-group">
<label for="start-date" class="form-control-label">Properties:</label>
<input class="form-control" id="startDate-date" [(ngModel)]= "dataset.properties" name = "properties">
</div>
<!-- <div class="form-group">
<label for="end-date" class="form-control-label">End Date:</label>
<input class="form-control" id="endDate-date" [(ngModel)]= "dataset.endDate" name = "endDate">
</div> -->
<div class="form-group">
<label for="code-name" class="form-control-label">Code:</label>
<input type="text" class="form-control" id="code-name" disabled>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" (click)="SaveNewDataset();">Save Dmp</button>
</div>
</div>
</div>
</div>