forcloud/app-autotest
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Operations expand inline under service row

Browse Source
This commit is contained in:
naeel
2026-07-23 11:51:52 +04:00
parent 6b098509e9
commit 2723f922d4
1 changed files with 21 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/templates/index.html
+21 -17
View File
@@ -51,54 +51,58 @@
<span class="ops-count" id="ops-{{ s.svcId }}">?</span>
</td>
</tr>
<tr class="ops-detail" id="detail-{{ s.svcId }}" style="display:none;">
<td colspan="3" style="padding:4px 10px;background:var(--brand-grey-light);">
<span style="color:var(--muted);font-size:12px;">Загрузка...</span>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<div class="card" id="ops-panel" style="max-width: 780px; margin: 16px auto; display: none;">
<div class="card-header" id="ops-title">Операции</div>
<div class="card-body" id="ops-body" style="padding: 8px 14px;"></div>
</div>
<script>
const opsCache = {};
document.querySelectorAll('.svc-row').forEach(row => {
row.addEventListener('click', async () => {
const svcId = row.dataset.svcId;
const detail = document.getElementById('detail-' + svcId);
if (detail.style.display === 'table-row') {
detail.style.display = 'none';
row.style.background = '';
return;
}
document.querySelectorAll('.ops-detail').forEach(d => d.style.display = 'none');
document.querySelectorAll('.svc-row').forEach(r => r.style.background = '');
row.style.background = 'var(--brand-grey-light)';
detail.style.display = 'table-row';
if (opsCache[svcId]) {
showOps(svcId, opsCache[svcId]);
fillDetail(svcId, opsCache[svcId]);
return;
}
try {
const r = await fetch('/api/operations/' + svcId);
const d = await r.json();
opsCache[svcId] = d;
showOps(svcId, d);
fillDetail(svcId, d);
} catch(e) {
document.getElementById('ops-body').innerHTML = '<p style=\"color:var(--destructive);\">Ошибка</p>';
detail.cells[0].innerHTML = '<span style=\"color:var(--destructive);font-size:12px;\">Ошибка загрузки</span>';
}
});
});
function showOps(svcId, data) {
const panel = document.getElementById('ops-panel');
const title = document.getElementById('ops-title');
const body = document.getElementById('ops-body');
panel.style.display = 'block';
title.textContent = 'Операции: ' + data.svc + ' (svcId=' + svcId + ')';
function fillDetail(svcId, data) {
const detail = document.getElementById('detail-' + svcId);
if (data.error) {
body.innerHTML = '<p style=\"color:var(--destructive);\">' + data.error + '</p>';
detail.cells[0].innerHTML = '<span style=\"color:var(--destructive);font-size:12px;\">' + data.error + '</span>';
return;
}
const ops = data.operations || [];
document.getElementById('ops-' + svcId).textContent = ops.length;
body.innerHTML = ops.map(o =>
detail.cells[0].innerHTML = ops.map(o =>
'<span class=\"badge\" style=\"margin:2px;\">' + o.operation + '</span>'
).join('') || '<p style=\"color:var(--muted);\">Нет операций</p>';
).join('') || '<span style=\"color:var(--muted);font-size:12px;\">Нет операций</span>';
}
</script>
{% endif %}