mirror of
https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
synced 2024-11-15 01:05:42 +00:00
Update Job Page
This commit is contained in:
Patrick Jentsch
parent
0d7f7d859c
commit
72984448de
@ -12,84 +12,8 @@
|
||||
|
||||
|
||||
<div class="col s12 m8">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<span class="card-title">Chronometrics</span>
|
||||
<div class="row">
|
||||
<div class="col s12 m6">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.creation_date.strftime('%m/%d/%Y, %H:%M:%S %p') }}" id="creation-date" type="text" class="validate">
|
||||
<label for="creation-date">Creation date</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m6">
|
||||
<div class="input-field">
|
||||
<input disabled value="" id="end-date" type="text" class="validate">
|
||||
<label for="end-date">End date</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span class="card-title">Ressource allocations</span>
|
||||
<div class="row">
|
||||
<div class="col s12 m6">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.mem_mb }}" id="mem-mb" type="text" class="validate">
|
||||
<label for="mem-mb">Memory</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m6">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.n_cores }}" id="n-cores" type="text" class="validate">
|
||||
<label for="n-cores">CPU cores</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span class="card-title">Service informations</span>
|
||||
<div class="row">
|
||||
<div class="col s12 m4">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.service }}" id="service" type="text" class="validate">
|
||||
<label for="service">Service</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.service_args|e }}" id="service-args" type="text" class="validate">
|
||||
<label for="service-args">Service arguments</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.service_version }}" id="service-version" type="text" class="validate">
|
||||
<label for="service-version">Service version</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-action right-align">
|
||||
<a href="#" class="waves-effect waves-light btn"><i class="material-icons left">settings</i>Export Parameters</a>
|
||||
<a data-target="delete-job-modal" class="waves-effect waves-light btn red modal-trigger"><i class="material-icons left">delete</i>Delete Job</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="collapsible popout">
|
||||
<li>
|
||||
<div class="collapsible-header"><i class="material-icons">done</i>Result files</div>
|
||||
<div class="collapsible-body">
|
||||
<table class="highlight responsive-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Bundlename</th>
|
||||
<th>Download</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="results"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<ul class="collapsible expandable" id="job-list">
|
||||
<li class="active">
|
||||
<div class="collapsible-header">
|
||||
<i class="material-icons">input</i>Input files
|
||||
</div>
|
||||
@ -116,6 +40,78 @@
|
||||
</table>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="collapsible-header"><i class="material-icons">done</i>Result files</div>
|
||||
<div class="collapsible-body">
|
||||
<table class="highlight responsive-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Bundlename</th>
|
||||
<th>Download</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="results"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="collapsible-header"><i class="material-icons">settings</i>Settings</div>
|
||||
<div class="collapsible-body">
|
||||
<div class="row">
|
||||
<div class="col s12">Chronometrics</div>
|
||||
<div class="col s12 m6">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.creation_date.strftime('%m/%d/%Y, %H:%M:%S %p') }}" id="creation-date" type="text" class="validate">
|
||||
<label for="creation-date">Creation date</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m6">
|
||||
<div class="input-field">
|
||||
<input disabled value="" id="end-date" type="text" class="validate">
|
||||
<label for="end-date">End date</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col s12">Ressource allocations</div>
|
||||
<div class="col s12 m6">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.mem_mb }}" id="mem-mb" type="text" class="validate">
|
||||
<label for="mem-mb">Memory</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m6">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.n_cores }}" id="n-cores" type="text" class="validate">
|
||||
<label for="n-cores">CPU cores</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col s12">Service informations</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.service }}" id="service" type="text" class="validate">
|
||||
<label for="service">Service</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.service_args|e }}" id="service-args" type="text" class="validate">
|
||||
<label for="service-args">Service arguments</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="input-field">
|
||||
<input disabled value="{{ job.service_version }}" id="service-version" type="text" class="validate">
|
||||
<label for="service-version">Service version</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 right-align">
|
||||
<a href="#" class="waves-effect waves-light btn"><i class="material-icons left">settings</i>Export Parameters</a>
|
||||
<a data-target="delete-job-modal" class="waves-effect waves-light btn red modal-trigger"><i class="material-icons left">delete</i>Delete Job</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@ -124,7 +120,7 @@
|
||||
<div id="delete-job-modal" class="modal">
|
||||
<div class="modal-content">
|
||||
<h4>Confirm deletion</h4>
|
||||
<p>Do you really want to delete the job {{job.title}}? All associated files will be permanently deleted.</p>
|
||||
<p>Do you really want to delete the job {{job.title}}? All associated files will be permanently deleted.</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class="modal-close waves-effect waves-green btn cancel">Cancel</a>
|
||||
@ -211,16 +207,19 @@
|
||||
resultsElement = document.getElementById("results");
|
||||
|
||||
for (let result of results) {
|
||||
resultsElement.insertAdjacentHTML("beforeend", `
|
||||
<tr>
|
||||
resultsElement.insertAdjacentHTML(
|
||||
"beforeend",
|
||||
`<tr>
|
||||
<td>${result.filename}</td>
|
||||
<td>
|
||||
<a class="btn-small waves-effect waves-light" download href="/jobs/${result.job_id}/results/${result.id}/download">
|
||||
<i class="material-icons">file_download</i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>`);
|
||||
</tr>`
|
||||
);
|
||||
}
|
||||
M.Collapsible.getInstance(document.getElementById("job-list")).open(1);
|
||||
}
|
||||
|
||||
setStatus(status) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user