update status on listening pending events

This commit is contained in:
rmanach 2023-09-26 12:15:59 +02:00
parent 7d768127a6
commit d24e42ec8e
4 changed files with 31 additions and 3 deletions

View File

@ -30,6 +30,22 @@ var start = function (url) {
status.innerHTML = message.status;
var button = tr.querySelector("th[name='deploy']");
if (message.status == "RUNNING") {
var innerBtn = document.createElement("button");
innerBtn.setAttribute("disabled", "");
innerBtn.setAttribute("type", "button");
innerBtn.className = "btn btn-primary btn-sm"
innerSpan = document.createElement("span");
innerSpan.setAttribute("role", "status");
innerSpan.innerHTML = "Deploying...";
innerBtn.appendChild(innerSpan);
button.innerHTML = "";
button.appendChild(innerBtn);
}
if (message.status == "SUCCESS") {
button.innerHTML = "";
}

View File

@ -23,8 +23,14 @@ var start = function (url) {
console.log("status: " + message.status);
console.log("progress: " + message.progress);
var status = document.getElementById("status");
status.setAttribute("value", message.status)
var progress = document.getElementById("deployment-progress");
progress.style["width"] = message.progress+"%";
// no progress in `PENDING` state
if (progress !== undefined) {
progress.style["width"] = message.progress+"%";
}
if (message.status == "SUCCESS") {
setTimeout(() => window.location.reload(), 1000);

View File

@ -51,6 +51,12 @@
<span role="status">Deploying...</span>
</button>
</th>
{% elif deployment.status == "PENDING" %}
<th name="deploy">
<button class="btn btn-primary btn-sm" type="button" disabled>
<span role="status">Pending...</span>
</button>
</th>
{% else %}
<th></th>
{% endif %}

View File

@ -37,7 +37,7 @@
<input type="text" readonly class="form-control-plaintext" id="status" value="{{ deployment.status }}">
<label for="status">Status</label>
</div>
{% if deployment.status == "RUNNING" %}
{% if deployment.status == "RUNNING" or deployment.status == "PENDING" %}
<div class="form-floating mb-3">
<div class="progress" role="progressbar" aria-label="deployment-progress" aria-valuenow="{{ deployment.progress }}" aria-valuemin="0" aria-valuemax="100">
<div id="deployment-progress" class="progress-bar progress-bar-striped progress-bar-animated" style="width: {{ deployment.progress }}%"></div>
@ -88,7 +88,7 @@
{% endblock %}
{% block script %}
{% if deployment.status == "RUNNING" %}
{% if deployment.status == "RUNNING" or deployment.status == "PENDING" %}
<script src="{% static 'deployment/js/event_source_details.js' %}" />
</script>
{% endif %}