77 lines
2.9 KiB
HTML
77 lines
2.9 KiB
HTML
{% extends 'base.html' %}
|
||
{% block content %}
|
||
<h1>Публикация HTML-страниц</h1>
|
||
|
||
<form method="post">
|
||
<div class="row">
|
||
<label for="title">Название страницы</label>
|
||
<input type="text" id="title" name="title" placeholder="Например: Презентация" />
|
||
</div>
|
||
<div class="row">
|
||
<label for="html">HTML-код</label>
|
||
<textarea id="html" name="html" placeholder="<h1>Заголовок</h1>\n<p>Мой контент...</p>" required></textarea>
|
||
</div>
|
||
<button class="btn" type="submit">Опубликовать</button>
|
||
<span class="muted">После публикации создаётся ссылка с UUID.</span>
|
||
</form>
|
||
|
||
<div class="row" style="margin-top: 1.25rem;">
|
||
<div class="muted" style="margin-bottom: .5rem;">Моментальный предпросмотр</div>
|
||
<iframe id="preview" style="width:100%; height:320px; border:1px solid rgba(255,255,255,.08); border-radius:12px; background:#fff;"></iframe>
|
||
</div>
|
||
|
||
<h2 style="margin-top:2rem;">Опубликованные страницы</h2>
|
||
{% if pages %}
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>ID</th>
|
||
<th>Название</th>
|
||
<th>UUID</th>
|
||
<th>Ссылка</th>
|
||
<th>Создано</th>
|
||
<th>Действия</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for p in pages %}
|
||
<tr>
|
||
<td>{{ p.id }}</td>
|
||
<td>{{ p.title or "" }}</td>
|
||
<td><code>{{ p.uuid }}</code></td>
|
||
<td><a href="{{ base_url }}/p/{{ p.uuid }}" target="_blank">{{ base_url }}/p/{{ p.uuid }}</a></td>
|
||
<td>{{ p.created_at }}</td>
|
||
<td>
|
||
<form method="post" action="{{ url_for('admin_delete', pid=p.id) }}" onsubmit="return confirm('Удалить страницу #' + {{ p.id }} + '?');">
|
||
<button class="btn secondary" type="submit">Удалить</button>
|
||
</form>
|
||
</td>
|
||
</tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
{% else %}
|
||
<p class="muted">Страниц пока нет.</p>
|
||
{% endif %}
|
||
<script>
|
||
(function(){
|
||
const htmlEl = document.getElementById('html');
|
||
const titleEl = document.getElementById('title');
|
||
const iframe = document.getElementById('preview');
|
||
function render(){
|
||
if(!iframe || !htmlEl) return;
|
||
const doc = iframe.contentDocument || iframe.contentWindow.document;
|
||
const t = (titleEl && titleEl.value) ? `<title>${titleEl.value}</title>` : '';
|
||
doc.open();
|
||
doc.write(`<!doctype html><html lang="ru"><head><meta charset="utf-8">${t}</head><body>${htmlEl.value}</body></html>`);
|
||
doc.close();
|
||
}
|
||
if (htmlEl){
|
||
htmlEl.addEventListener('input', render);
|
||
if (titleEl) titleEl.addEventListener('input', render);
|
||
render();
|
||
}
|
||
})();
|
||
</script>
|
||
{% endblock %}
|