v0.5.107: inline-редактирование в таблице, редирект / → /v2/app
This commit is contained in:
+49
-12
@@ -215,26 +215,34 @@
|
||||
<th>Комментарий</th>
|
||||
<th>Добавил</th>
|
||||
<th>Добавлена</th>
|
||||
<th style="text-align:center;">Действия</th>
|
||||
<th style="text-align:center;width:80px;">Действия</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<% entries.forEach(function(e) { %>
|
||||
<tr style="<%= e.deleted_at ? 'opacity:.5;text-decoration:line-through;' : '' %>">
|
||||
<td><code><%= e.value_cidr %></code><% if (e.deleted_at) { %> <span style="font-size:.7rem;color:var(--red);">удалена</span><% } %></td>
|
||||
<td><%= e.comment || '—' %></td>
|
||||
<tr id="row-<%= e.id %>" style="<%= e.deleted_at ? 'opacity:.5;text-decoration:line-through;' : '' %>">
|
||||
<td>
|
||||
<span class="view"><code><%= e.value_cidr %></code><% if (e.deleted_at) { %> <span style="font-size:.7rem;color:var(--red);">удалена</span><% } %></span>
|
||||
<input class="edit" type="text" name="cidr" value="<%= e.value_cidr %>" size="18" style="display:none;padding:.3rem .5rem;border:1px solid var(--blue);border-radius:4px;font-size:.82rem;">
|
||||
</td>
|
||||
<td>
|
||||
<span class="view"><%= e.comment || '—' %></span>
|
||||
<input class="edit" type="text" name="comment" value="<%= e.comment || '' %>" size="20" style="display:none;padding:.3rem .5rem;border:1px solid var(--blue);border-radius:4px;font-size:.82rem;">
|
||||
</td>
|
||||
<td><%= e.created_by %></td>
|
||||
<td><%= new Date(e.created_at).toLocaleString('ru') %></td>
|
||||
<td style="text-align:center;white-space:nowrap;">
|
||||
<% if (!e.deleted_at) { %>
|
||||
<form method="POST" action="/v2/app/edit/<%= e.id %>" style="display:inline;">
|
||||
<input name="cidr" value="<%= e.value_cidr %>" size="18" style="padding:.3rem .5rem;border:1px solid var(--border);border-radius:4px;font-size:.82rem;">
|
||||
<input name="comment" value="<%= e.comment || '' %>" size="18" style="padding:.3rem .5rem;border:1px solid var(--border);border-radius:4px;font-size:.82rem;">
|
||||
<button class="btn btn-sm">изменить</button>
|
||||
</form>
|
||||
<form method="POST" action="/v2/app/delete/<%= e.id %>" style="display:inline;">
|
||||
<button class="btn btn-sm btn-danger" onclick="return confirm('Удалить?')">удалить</button>
|
||||
</form>
|
||||
<span class="view">
|
||||
<button class="btn btn-sm" onclick="editRow(<%= e.id %>)" title="Редактировать">✏️</button>
|
||||
<form method="POST" action="/v2/app/delete/<%= e.id %>" style="display:inline;">
|
||||
<button class="btn btn-sm btn-danger" onclick="return confirm('Удалить?')" title="Удалить">🗑️</button>
|
||||
</form>
|
||||
</span>
|
||||
<span class="edit" style="display:none;">
|
||||
<button class="btn btn-sm btn-primary" onclick="saveRow(<%= e.id %>)" title="Сохранить">✓</button>
|
||||
<button class="btn btn-sm" onclick="cancelEdit(<%= e.id %>)" title="Отмена">✕</button>
|
||||
</span>
|
||||
<% } %>
|
||||
</td>
|
||||
</tr>
|
||||
@@ -247,6 +255,35 @@
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function editRow(id) {
|
||||
var row = document.getElementById('row-' + id);
|
||||
row.querySelectorAll('.view').forEach(function(el) { el.style.display = 'none'; });
|
||||
row.querySelectorAll('.edit').forEach(function(el) { el.style.display = ''; });
|
||||
row.querySelector('input[name="cidr"]').focus();
|
||||
}
|
||||
|
||||
function cancelEdit(id) {
|
||||
var row = document.getElementById('row-' + id);
|
||||
row.querySelectorAll('.view').forEach(function(el) { el.style.display = ''; });
|
||||
row.querySelectorAll('.edit').forEach(function(el) { el.style.display = 'none'; });
|
||||
}
|
||||
|
||||
function saveRow(id) {
|
||||
var row = document.getElementById('row-' + id);
|
||||
var cidr = row.querySelector('input[name="cidr"]').value;
|
||||
var comment = row.querySelector('input[name="comment"]').value;
|
||||
var form = document.createElement('form');
|
||||
form.method = 'POST';
|
||||
form.action = '/v2/app/edit/' + id;
|
||||
form.style.display = 'none';
|
||||
var c = document.createElement('input'); c.name = 'cidr'; c.value = cidr; form.appendChild(c);
|
||||
var m = document.createElement('input'); m.name = 'comment'; m.value = comment; form.appendChild(m);
|
||||
document.body.appendChild(form);
|
||||
form.submit();
|
||||
}
|
||||
</script>
|
||||
|
||||
<footer style="text-align:right;padding:.5rem 1.5rem;font-size:.72rem;color:var(--muted);">v<%= version %></footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user