{% extends "base.html.j2" %} {% block main_attribs %} class="service-scheme" data-service="{{ job.service }}"{% endblock main_attribs %} {% block page_content %} <div class="container"> <div class="row"> <div class="col s12" data-job-id="{{ job.hashid }}" data-user-id="{{ job.user.hashid }}" id="job-display"> <div class="row"> <div class="col s8 m9 l10"> <h1 id="title"><i style="font-size: inherit;" class="nopaque-icons service-icons" data-service="{{ job.service }}"></i> <span class="job-title"></span></h1> </div> <div class="col s4 m3 l2 right-align"> <p> </p> <p> </p> <span class="chip job-status job-status-text job-status-color white-text"></span> <div class="active preloader-wrapper small job-status-spinner"> <div class="spinner-layer spinner-blue-only"> <div class="circle-clipper left"> <div class="circle"></div> </div> <div class="gap-patch"> <div class="circle"></div> </div> <div class="circle-clipper right"> <div class="circle"></div> </div> </div> </div> </div> </div> <div class="card service-color-border border-darken" data-service="{{ job.service }}" style="border-top: 10px solid"> <div class="card-content"> <div class="row"> <div class="col s12"> <div class="input-field"> <input class="job-description" disabled id="job-description" type="text"> <label for="job-description">Description</label> </div> </div> <div class="col s12 m6"> <div class="input-field"> <input class="job-creation-date" disabled id="job-creation-date" type="text"> <label for="job-creation-date">Creation date</label> </div> </div> <div class="col s12 m6"> <div class="input-field"> <input class="job-end-date" disabled id="job-end-date" type="text"> <label for="job-end-date">End date</label> </div> </div> <div class="col s12 m4"> <div class="input-field"> <input class="job-service" disabled id="job-service" type="text"> <label for="job-service">Service</label> </div> </div> <div class="col s12 m4"> <div class="input-field"> <input class="job-service-args" disabled id="job-service-args" type="text"> <label for="job-service-args">Service arguments</label> </div> </div> <div class="col s12 m4"> <div class="input-field"> <input class="job-service-version" disabled id="job-service-version" type="text"> <label for="job-service-version">Service version</label> </div> </div> </div> </div> <div class="card-action right-align"> {% if current_user.is_administrator() %} <a class="action-button btn disabled waves-effect waves-light modal-trigger" data-action="get-log-request" id="job-log-button" href="#job-log-modal"><i class="material-icons left">text_snippet</i>Log</a> {% endif %} <a class="btn disabled waves-effect waves-light modal-trigger" href="#restart-job-modal"><i class="material-icons left">repeat</i>Restart</a> <a class="btn red waves-effect waves-light modal-trigger" href="#delete-job-modal"><i class="material-icons left">delete</i>Delete</a> </div> </div> </div> <div class="col s12"> <div class="card"> <div class="card-content"> <div class="row"> <span class="card-title"><i class="left material-icons" style="font-size: inherit;">input</i>Inputs</span> <div class="job-input-list" data-user-id="{{ job.user.hashid }}" data-job-id="{{ job.hashid }}"></div> </div> </div> </div> </div> <div class="col s12"> <div class="card"> <div class="card-content"> <div class="row"> <span class="card-title"><i class="left material-icons" style="font-size: inherit;">done</i>Results</span> <div class="job-result-list" data-user-id="{{ job.user.hashid }}" data-job-id="{{ job.hashid }}"></div> </div> </div> </div> </div> </div> </div> {% endblock page_content %} {% block modals %} {{ super() }} <div class="modal" id="delete-job-modal"> <div class="modal-content"> <h4>Confirm Job deletion</h4> <p>Do you really want to delete the Job <b>{{job.title}}</b>? All files will be permanently deleted!</p> </div> <div class="modal-footer"> <a class="btn modal-close waves-effect waves-light">Cancel</a> <a class="btn modal-close red waves-effect waves-light" id="delete-job-request">Delete</a> </div> </div> <div class="modal" id="job-log-modal"> <div class="modal-content"> <h4>Job logs</h4> <pre><code></code></pre> </div> <div class="modal-footer"> <a class="btn modal-close waves-effect waves-light">Close</a> </div> </div> <div class="modal" id="restart-job-modal"> <div class="modal-content"> <h4>Confirm Job restart</h4> <p>Do you really want to restart the Job <b>{{ job.title }}</b>? All Job Results will be permanently deleted.</p> </div> <div class="modal-footer"> <a class="btn modal-close waves-effect waves-light">Cancel</a> <a class="btn modal-close red waves-effect waves-light" id="restart-job-request">Restart</a> </div> </div> {% endblock modals %} {% block scripts %} {{ super() }} <script> let jobDisplay = new JobDisplay(document.querySelector('#job-display')); let deleteJobRequestElement = document.querySelector('#delete-job-request'); let jobLogButtonElement = document.querySelector('#job-log-button'); let restartJobRequestElement = document.querySelector('#restart-job-request'); deleteJobRequestElement.addEventListener('click', (event) => { Requests.jobs.entity.delete({{ job.hashid|tojson }}); }); jobLogButtonElement.addEventListener('click', (event) => { Requests.jobs.entity.log({{ job.hashid|tojson }}) .then( (response) => { response.json() .then((json) => { let jobLogModalElement = document.querySelector('#job-log-modal'); jobLogModalElement.querySelector('pre code').textContent = json.jobLog; }); }); }); restartJobRequestElement.addEventListener('click', (event) => { Requests.jobs.entity.restart({{ job.hashid|tojson }}); }); </script> {% endblock scripts %}