КОНСТРУКТОР
Страницы (внешние и внутренние)
Страница — это произвольный экран, который вы собираете сами из HTML, CSS и JavaScript. Страницы бывают двух видов:
| Вид | Что это | Пример |
|---|---|---|
| Внешняя страница | Открывается по своему адресу (URL), как обычный сайт | Лендинг, форма обратной связи, публичный калькулятор |
| Внутренний объект | Живёт внутри системы: своя вкладка и запись в панели «Избранное» | Панель кладовщика, генератор склада |
Страницы создаются в Конструкторе: раздел Страницы → Добавить.
# Свойства страницы
Справа в редакторе открывается панель «Свойства страницы» (значок шестерёнки в шапке).
| Поле | Что означает |
|---|---|
| Имя страницы | Название, которое видит пользователь |
| Внутренний объект | Галочка. Включает режим «внутренней» страницы |
| Иконка | Появляется только при включённой галочке «Внутренний объект». Подсказка: «Отображается в табе и панели «Избранное» |
| URL страницы | Показывается только для внешней страницы. Например /my-custom-page |
| Требуется авторизация | Только для внешней страницы. Если выключено — страница доступна без входа |
| Публичные данные (ID через запятую) | Только если авторизация выключена: список объектов, которые смогут читать посетители без входа (только чтение, с ограничением частоты). Пример: cat_123, doc_456 |
| Внешние CSS | По одной ссылке в строке. Например https://.../style.css |
| Внешние JS | По одной ссылке в строке |
| Подключённые компоненты | Галочки компонентов. Подсказка: «Код компонентов выполняется перед модулем страницы» |
Внутренний объект и внешняя страница — взаимоисключающие режимы. У внутреннего объекта вместо URL и настроек доступа появляется выбор иконки.
# Редактор
Верхние вкладки редактора:
| Вкладка | Что редактируется |
|---|---|
| HTML | Разметка содержимого страницы |
| CSS | Стили только этой страницы |
| JS | Код страницы. Можно вести несколько «файлов» (кнопка Новый файл); при рендеринге они склеиваются в один модуль |
| Просмотр | Предпросмотр страницы |
Кнопка Удалить (справа вверху, красная) удаляет страницу, диалог спросит:
Удалить страницу? Это действие необратимо. Вы уверены, что хотите удалить страницу «<имя>»? Всё содержимое будет утеряно.
Кнопки — Отмена и Удалить.
# Как открывается страница
| Как | Что происходит |
|---|---|
| По URL | Пользователь переходит на адрес — система ищет страницу с таким url и показывает её |
| Из модуля объекта | await formApi.showPage('Имя страницы') открывает страницу в модальном окне |
| Как внутренний объект | Открывается вкладкой внутри системы, как обычный объект |
Открытие из модуля с настройками окна:
await formApi.showPage('Генератор склада', {
title: 'Создание склада',
width: '900px',
height: '700px',
resizable: true
});# JavaScript на странице
В коде страницы доступен formApi — тот же набор функций, что и в модулях объектов.
| Метод | Что делает |
|---|---|
showAlert(текст, настройки) | Показать сообщение |
showConfirm(текст) | Спросить подтверждение, вернуть «да/нет» |
showPage(имя, настройки, параметры) | Открыть другую страницу |
getContext() | Получить контекст: текущий пользователь |
read(ссылка) | Прочитать запись |
readList(тип, имя, отбор) | Прочитать список |
create(тип, имя, данные) | Создать запись |
update(ссылка, данные) | Изменить запись |
delete(ссылка) | Удалить запись |
post(имя, id) / unpost(имя, id) | Провести / отменить проведение |
Почта(кому, html, тема) | Отправить письмо |
ai(запрос) | Спросить ИИ-ассистента |
Недоступны (страница не привязана к объекту): getValue, setValue, setFieldState, preloader, getTabularSection.
Пример:
async function initDashboard() {
const ctx = formApi.getContext();
const заказы = await formApi.readList('Документ', 'Заказы', { Статус: 'Новый' });
const container = document.getElementById('orders-container');
if (!container) return;
container.innerHTML = заказы.map(o => `<div>№${o.Номер} — ${o.Сумма}</div>`).join('');
}
document.addEventListener('DOMContentLoaded', () => {
document.getElementById('load-orders')?.addEventListener('click', initDashboard);
initDashboard();
});# Безопасность: что вырезается
Публичная страница собирается на сервере, и её HTML проходит через очистку по белому списку. Если что-то не разрешено — оно молча удаляется.
| Разрешено | Запрещено (вырезается) |
|---|---|
Обычные теги: div, p, h1…h6, table, a, img, списки и др. | <script> внутри HTML |
Элементы форм: form, label, input, select, button, textarea и др. | Обработчики onclick, onchange, onsubmit и подобные |
Атрибуты: id, class, name, type, value, placeholder, disabled, href, src, data-*, aria-* и др. | Атрибут style и тег <style> внутри HTML |
Опасные протоколы javascript:, data:text/html в ссылках |
Практические следствия:
- Обработчики навешивайте в JavaScript-коде страницы:
document.getElementById('save').addEventListener('click', …). Записьonclick="..."прямо в HTML на публичной странице не сработает. - CSS держите во вкладке CSS, а не тегом
<style>в HTML. - Предпросмотр в редакторе не очищает HTML, поэтому он может отличаться от реальной публичной страницы. Проверяйте настоящий URL, а не только предпросмотр.
# Порядок загрузки
При открытии страницы система подключает по порядку:
- глобальные стили;
formApi;- содержимое страницы (HTML);
- внешние скрипты (ваши ссылки);
- модуль страницы (ваш JavaScript) — он выполняется последним, поэтому элементы HTML уже находятся на странице.
