paul
82c7712613
- Created a new job_detail.html template extending base.html - Implemented a macro for rendering nested data structures - Added sections for job identification, schedule & timing, status, configuration, execution history, and results - Included a timeline for execution history with visual indicators for job status - Displayed job metrics including total executions, success rate, and average duration - Handled cases for displaying results or indicating absence of results based on job status
115 lines
4.2 KiB
HTML
115 lines
4.2 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% macro render_nested(value) %}
|
|
{% if value is mapping %}
|
|
{% for k, v in value.items() %}
|
|
<div class="nested-item">
|
|
<span class="nested-key">{{ k }}:</span>
|
|
<span class="nested-value">{{ render_nested(v) }}</span>
|
|
</div>
|
|
{% endfor %}
|
|
{% elif value is iterable and not value is string %}
|
|
{% for item in value %}
|
|
{{ render_nested(item) }}
|
|
{% endfor %}
|
|
{% else %}
|
|
{{ value }}
|
|
{% endif %}
|
|
{% endmacro %}
|
|
|
|
|
|
{% block content %}
|
|
<div class="dashboard-container">
|
|
<h1>{{ title }}</h1>
|
|
|
|
{# ── Filter bar ─────────────────────────────────────────── #}
|
|
<form class="filter-bar" method="get" id="filter-form" onsubmit="
|
|
this.querySelectorAll('input').forEach(function(el){ if(!el.value) el.disabled = true; });
|
|
">
|
|
<div class="filter-group">
|
|
<label for="recon_job_name">Job Name</label>
|
|
<input type="text" id="recon_job_name" name="recon_job_name"
|
|
placeholder="e.g. daily-fx-recon"
|
|
value="{{ recon_job_name or '' }}">
|
|
</div>
|
|
<div class="filter-group">
|
|
<label for="as_at_date">As-at Date</label>
|
|
<input type="date" id="as_at_date" name="as_at_date"
|
|
value="{{ as_at_date or '' }}">
|
|
</div>
|
|
<div class="filter-actions">
|
|
<button type="submit" class="btn btn-primary">Apply</button>
|
|
<a href="?" class="btn btn-secondary">Clear</a>
|
|
</div>
|
|
</form>
|
|
<script>
|
|
(function () {
|
|
var params = new URLSearchParams(window.location.search);
|
|
["recon_job_name", "as_at_date"].forEach(function (key) {
|
|
var val = params.get(key);
|
|
if (val) {
|
|
var el = document.getElementById(key);
|
|
if (el) el.value = val;
|
|
}
|
|
});
|
|
})();
|
|
</script>
|
|
|
|
{% if result_rows | length > 0 %}
|
|
<div class="table-scroll">
|
|
<table class="data-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Job</th>
|
|
{% for key in result_rows[0].data.keys() %}
|
|
<th>{{ key }}</th>
|
|
{% endfor %}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for row in result_rows %}
|
|
<tr>
|
|
<td>
|
|
<a class="job-link" href="/jobs/{{ row.job_id }}">{{ row.name }}<span class="muted"> #{{ row.job_id }}</span></a>
|
|
</td>
|
|
{% for key, value in row.data.items() %}
|
|
<td>
|
|
{% if key == 'Status' %}
|
|
<span class="badge badge-{{ value | lower }}">{{ value }}</span>
|
|
{% elif key == 'Flag' %}
|
|
<span class="badge badge-{{ 'none' if value == 'None' else 'flag' }}">{{ value }}</span>
|
|
{% else %}
|
|
{{ render_nested(value) }}
|
|
{% endif %}
|
|
</td>
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
{# ── Pagination ─────────────────────────────────────────── #}
|
|
{% set filter_qs %}{% if recon_job_name %}&recon_job_name={{ recon_job_name }}{% endif %}{% if as_at_date %}&as_at_date={{ as_at_date }}{% endif %}{% endset %}
|
|
<div class="pagination">
|
|
{% if prev_cursor %}
|
|
<a class="btn btn-secondary"
|
|
href="?cursor={{ prev_cursor }}{{ filter_qs }}">
|
|
← Previous
|
|
</a>
|
|
{% else %}
|
|
<span class="btn btn-secondary btn-disabled">← Previous</span>
|
|
{% endif %}
|
|
|
|
{% if next_cursor %}
|
|
<a class="btn btn-secondary"
|
|
href="?cursor={{ next_cursor }}{{ filter_qs }}">
|
|
Next →
|
|
</a>
|
|
{% else %}
|
|
<span class="btn btn-secondary btn-disabled">Next →</span>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endblock %} |