ui: remove per-row Лог/⟳/✕ buttons from camera table, fix row height to 22px
The camera table actions column (log/restart/delete buttons) is removed: the table drops to 8 columns across thead, filled rows, empty slots and the bulk-edit rows. The now-orphaned log subrow and openLogs tracking are gone. Camera rows get a hard fixed height of 22px via a new table.cams.cams-fixed rule (zero vertical padding, 22px line-height) so rows never inflate. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -45,9 +45,9 @@
|
||||
<button id="bulk-cancel" hidden>Отмена</button>
|
||||
</div>
|
||||
</div>
|
||||
<table class="cams">
|
||||
<table class="cams cams-fixed">
|
||||
<thead>
|
||||
<tr><th style="width:48px">ID</th><th>Камера</th><th>IP</th><th>Потоки</th><th style="width:56px">Вкл</th><th style="width:64px">Запись</th><th style="width:150px">Хранилище</th><th data-bulk-label="Логин / пароль">Статус</th><th></th></tr>
|
||||
<tr><th style="width:48px">ID</th><th>Камера</th><th>IP</th><th>Потоки</th><th style="width:56px">Вкл</th><th style="width:64px">Запись</th><th style="width:150px">Хранилище</th><th data-bulk-label="Логин / пароль">Статус</th></tr>
|
||||
</thead>
|
||||
<tbody id="cam-rows"></tbody>
|
||||
</table>
|
||||
|
||||
+4
-19
@@ -1257,8 +1257,7 @@ const CamSettings = {
|
||||
`<td class="cell-dual">` +
|
||||
`<input class="cell-in" type="text" data-f="user" value="${user}" title="Логин">` +
|
||||
`<input class="cell-in" type="password" data-f="password" value="${password}" title="Пароль" placeholder="пароль">` +
|
||||
`</td>` +
|
||||
`<td></td>`
|
||||
`</td>`
|
||||
);
|
||||
},
|
||||
|
||||
@@ -1329,7 +1328,7 @@ const CamSettings = {
|
||||
const v = (x) => this.esc(x);
|
||||
const isEdit = !!cam;
|
||||
return (
|
||||
`<td colspan="9" class="cam-edit">` +
|
||||
`<td colspan="8" class="cam-edit">` +
|
||||
`<div class="cam-edit-grid">` +
|
||||
`<label>ID<input type="text" id="e-id" value="${cam ? v(cam.id) : ""}" ${isEdit ? "disabled" : ""} placeholder="cam${slotNo}"></label>` +
|
||||
`<label>Имя<input type="text" id="e-name" value="${cam ? v(cam.name) : ""}" placeholder="Камера ${slotNo}"></label>` +
|
||||
@@ -1414,9 +1413,6 @@ const CamSettings = {
|
||||
this.byId = {};
|
||||
cams.forEach((c) => { this.byId[c.id] = c; });
|
||||
const tb = document.getElementById("cam-rows");
|
||||
const openLogs = new Set(
|
||||
[...document.querySelectorAll(".logbox")].filter((b) => !b.hidden).map((b) => b.id)
|
||||
);
|
||||
tb.innerHTML = "";
|
||||
if (this.bulk) {
|
||||
// массовое редактирование: ВСЕ 64 слота сразу редактируемые (пустые — для добавления)
|
||||
@@ -1448,26 +1444,15 @@ const CamSettings = {
|
||||
`<td><input type="checkbox" class="en-toggle" data-id="${c.id}" title="Камера включена (выкл — не работает совсем)" ${c.enabled ? "checked" : ""}></td>` +
|
||||
`<td><input type="checkbox" class="rec-toggle" data-id="${c.id}" title="Запись на диск (выкл — только просмотр)" ${c.record ? "checked" : ""} ${c.enabled ? "" : "disabled"}></td>` +
|
||||
`<td><select class="stor-sel" data-id="${c.id}" title="В какое хранилище писать">${this.storageOptions(c.storage_id)}</select></td>` +
|
||||
`<td>${statusCell}</td>` +
|
||||
`<td class="actions">` +
|
||||
`<button data-act="log" data-id="${c.id}">Лог</button> ` +
|
||||
`<button data-act="restart" data-id="${c.id}">⟳</button> ` +
|
||||
`<button data-act="delete" data-id="${c.id}">✕</button>` +
|
||||
`</td>`;
|
||||
`<td>${statusCell}</td>`;
|
||||
tb.appendChild(tr);
|
||||
const logTr = document.createElement("tr");
|
||||
logTr.className = "logrow";
|
||||
const hid = openLogs.has("log-" + c.id) ? "" : "hidden";
|
||||
logTr.innerHTML = `<td colspan="9" style="padding:0"><div class="logbox" id="log-${c.id}" ${hid}></div></td>`;
|
||||
tb.appendChild(logTr);
|
||||
} else {
|
||||
tr.className = "slot-empty";
|
||||
tr.dataset.slot = i + 1;
|
||||
tr.innerHTML =
|
||||
`<td class="muted">${i + 1}</td>` +
|
||||
`<td class="muted">—</td><td class="muted">—</td><td class="muted">—</td><td class="muted">—</td><td class="muted">—</td><td class="muted">—</td>` +
|
||||
`<td class="muted">пусто</td>` +
|
||||
`<td></td>`;
|
||||
`<td class="muted">пусто</td>`;
|
||||
tb.appendChild(tr);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -425,8 +425,10 @@ table.cams th, table.cams td {
|
||||
table.cams th { color: var(--text-dim); font-weight: 500; font-size: 11px; padding: 4px 10px; }
|
||||
table.cams td.actions { white-space: nowrap; text-align: right; }
|
||||
table.cams tr.slot-empty td { opacity: .5; }
|
||||
/* строка-контейнер лога не должна занимать высоту, пока лог скрыт */
|
||||
table.cams tr.logrow > td { padding: 0; border: none; }
|
||||
/* камеры: жёстко фиксированная высота строки 22px (плотная таблица) */
|
||||
table.cams.cams-fixed td, table.cams.cams-fixed th {
|
||||
height: 22px; padding-top: 0; padding-bottom: 0; line-height: 22px;
|
||||
}
|
||||
|
||||
/* ── Инлайн-редактор строки (вместо всплывающего окна) ── */
|
||||
.cam-edit { background: var(--panel-2); padding: 12px 12px 14px; }
|
||||
|
||||
Reference in New Issue
Block a user