mirror of
				https://gitlab.ub.uni-bielefeld.de/sfb1288inf/nopaque.git
				synced 2025-11-04 04:12:45 +00:00 
			
		
		
		
	Update Job Page
This commit is contained in:
		@@ -12,84 +12,8 @@
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<div class="col s12 m8">
 | 
					<div class="col s12 m8">
 | 
				
			||||||
  <div class="card">
 | 
					  <ul class="collapsible expandable" id="job-list">
 | 
				
			||||||
    <div class="card-content">
 | 
					    <li class="active">
 | 
				
			||||||
      <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>
 | 
					 | 
				
			||||||
      <div class="collapsible-header">
 | 
					      <div class="collapsible-header">
 | 
				
			||||||
        <i class="material-icons">input</i>Input files
 | 
					        <i class="material-icons">input</i>Input files
 | 
				
			||||||
      </div>
 | 
					      </div>
 | 
				
			||||||
@@ -116,6 +40,78 @@
 | 
				
			|||||||
        </table>
 | 
					        </table>
 | 
				
			||||||
      </div>
 | 
					      </div>
 | 
				
			||||||
    </li>
 | 
					    </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>
 | 
					  </ul>
 | 
				
			||||||
</div>
 | 
					</div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@@ -211,16 +207,19 @@
 | 
				
			|||||||
      resultsElement = document.getElementById("results");
 | 
					      resultsElement = document.getElementById("results");
 | 
				
			||||||
 | 
					
 | 
				
			||||||
      for (let result of results) {
 | 
					      for (let result of results) {
 | 
				
			||||||
        resultsElement.insertAdjacentHTML("beforeend", `
 | 
					        resultsElement.insertAdjacentHTML(
 | 
				
			||||||
          <tr>
 | 
					          "beforeend",
 | 
				
			||||||
 | 
					          `<tr>
 | 
				
			||||||
            <td>${result.filename}</td>
 | 
					            <td>${result.filename}</td>
 | 
				
			||||||
            <td>
 | 
					            <td>
 | 
				
			||||||
              <a class="btn-small waves-effect waves-light" download href="/jobs/${result.job_id}/results/${result.id}/download">
 | 
					              <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>
 | 
					                <i class="material-icons">file_download</i>
 | 
				
			||||||
              </a>
 | 
					              </a>
 | 
				
			||||||
            </td>
 | 
					            </td>
 | 
				
			||||||
          </tr>`);
 | 
					          </tr>`
 | 
				
			||||||
 | 
					        );
 | 
				
			||||||
      }
 | 
					      }
 | 
				
			||||||
 | 
					      M.Collapsible.getInstance(document.getElementById("job-list")).open(1);
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    setStatus(status) {
 | 
					    setStatus(status) {
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user