В современной экосистеме 1С Предприятие создание качественных печатных форм стало критически важным навыком для разработчика. Стандартные средства вывода отчетов часто выглядят устаревшими, тогда как пользователи требуют стильные документы, соответствующие фирменному стилю компании. Именно здесь на сцену выходит создание макетов в формате HTML, которые позволяют использовать всю мощь веб-верстки внутри платформы.
Использование HTML-шаблонов дает свободу в дизайне, недоступную при работе со стандартными табличными документами. Вы можете внедрять сложные сетки, CSS-стили и даже базовую интерактивность для последующего экспорта в PDF. Однако этот процесс требует понимания архитектуры платформы и специфики обмена данными между кодом на 1С и браузерным движком.
Данная статья детально разбирает процесс от создания пустого файла до генерации готового документа. Мы рассмотрим нюансы передачи данных, особенности тегирования и методы отладки, которые сэкономят вам часы работы. Если вы готовы перейти от унылых таблиц к профессиональной верстке, давайте начнем погружение в технические детали.
Подготовка среды и выбор инструмента верстки
Прежде чем писать код, необходимо выбрать редактор, в котором будет создаваться макет. Хотя стандартный редактор платформы 1С позволяет править текст шаблонов, он лишен подсветки синтаксиса HTML и предпросмотра. Профессионалы используют внешние редакторы кода, такие как VS Code или Notepad++, для первичной верстки.
Процесс начинается с создания базовой структуры документа. Вам понадобится стандартный набор тегов <html>, <head> и <body>. Внутри заголовка обязательно подключите стили, так как 1С корректно обрабатывает встроенный CSS. Не забудьте установить кодировку UTF-8, чтобы кириллические символы отображались корректно при любом языке интерфейса системы.
Для тестирования макета на ранних этапах удобно использовать обычный браузер. Вы можете сверстать статичную страницу с "рыбным" текстом, полностью имитирующим будущий документ. Это позволяет сосредоточиться на дизайне, не отвлекаясь на логику работы базы данных. Только после утверждения визуальной части макет переносится в конфигурацию.
⚠️ Внимание: Движок отображения HTML внутри клиентского приложения 1С может отличаться от современных браузеров Chrome или Firefox. Избегайте использования экспериментальных CSS-свойств и сложной JavaScript-логики, так как они могут не поддерживаться встроенным браузером.
Используйте инлайн-стили (атрибут style внутри тега) для критически важных элементов оформления. Внешние CSS-файлы могут не подгрузиться корректно при формировании отчета на сервере.
Создание объекта макета в конфигурации 1С
После подготовки HTML-кода его необходимо интегрировать в конфигурацию. В дереве метаданных создайте новый объект типа "Макет". В свойствах макета укажите тип HTML-документ. Это ключевой параметр, который сообщает платформе, как именно интерпретировать содержимое ресурса.
Откройте редактор макета и вставьте подготовленный HTML-код. Теперь самое время заменить статические данные на специальные метки. Платформа 1С использует механизм замены параметров, аналогичный табличным документам. Имена параметров заключаются в специальные скобки, например %ИмяПараметра% или используют синтаксис <?ИмяПараметра?> в зависимости от версии платформы и настроек.
Для сложных структур данных, таких как списки номенклатуры или табличные части документов, используется циклическая замена. Вы создаете блок HTML, который должен повторяться, и оборачиваете его в специальные директивы. Это позволяет генерировать строки таблицы динамически, подставляя значения из каждого элемента коллекции.
- 📁 Создайте папку "Макеты" в структуре метаданных для порядка.
- 🏷️ Используйте понятные имена параметров, например
%НаименованиеТовара%, а не%N1%. - 🔄 Проверяйте поддержку синтаксиса параметров в вашей конкретной версии платформы 1С.
- 💾 Сохраняйте резервные копии макетов во внешних файлах перед компиляцией конфигурации.
Настройка передачи данных из модуля объекта
Сам по себе макет — это лишь шаблон. Чтобы он ожил, необходимо написать код на языке 1С, который сформирует набор данных и передаст их в макет. Обычно это делается в модуле объекта документа или в общем модуле, отвечающем за печать.
Первым шагом является получение объекта макета из метаданных. Для этого используется метод ПолучитьМакет(). Далее создается структура или набор структур, ключи которых должны строго соответствовать именам параметров в HTML-шаблоне. Любое несоответствие приведет к тому, что на месте метки останется пустое место или текст самой метки.
Макет = Документы.РеализацияТоваровУслуг.ПолучитьМакет("ПечатьНакладнойHTML");
Параметры = Новый Структура;
Параметры.Вставить("НомерДок", ДокументОбъект.Номер);
Параметры.Вставить("ДатаДок", Формат(ДокументОбъект.Дата, "ДФ=dd.MM.yyyy"));
Результат = Макет.Получить(Параметры);
Особое внимание стоит уделить форматированию данных перед передачей. Даты, суммы и числа должны быть приведены к строковому виду с нужным количеством знаков после запятой прямо в коде 1С. HTML-макет не должен содержать сложной логики вычислений, его задача — только отображение.
Как передать табличные данные?
Для передачи таблиц создайте массив структур. Каждая структура — это строка таблицы. В макете используйте цикл по массиву для генерации строк
Работа с циклами и табличными частями
Самая сложная часть создания макета — это вывод списков, например, товаров в накладной. В HTML это реализуется через тег <table>. Вам необходимо определить область макета, которая будет повторяться для каждой строки табличной части документа.
В коде 1С вы формируете коллекцию значений или массив структур, содержащий данные для каждой строки. Затем эта коллекция передается в макет как отдельный параметр. Синтаксис вывода зависит от версии платформы, но общий принцип остается неизменным: система проходит по коллекции и дублирует размеченный блок HTML.
| Элемент HTML | Назначение | Пример использования |
|---|---|---|
<table> |
Контейнер для списка | Обрамляет весь список товаров |
<tr> |
Строка таблицы | Повторяется для каждого товара |
<td> |
Ячейка данных | Содержит параметр %Цена% |
tfoot |
Итоговая строка | Вывод общей суммы документа |
Важно следить за тем, чтобы циклы не создавали лишние теги. Часто разработчики забывают закрыть тег строки или ячейки внутри цикла, что приводит к "поехавшей" верстке в итоговом документе. Валидация HTML-кода перед вставкой в 1С помогает избежать таких ошибок.
⚠️ Внимание: При большом количестве строк (более 1000) генерация HTML-макета может существенно замедлить работу клиента. Для объемных документов рассмотрите возможность разбивки на несколько страниц или использование пагинации.
Циклические области в макете должны быть четко ограничены. Лишние пробелы или переносы строк внутри тега цикла могут привести к появлению пустых строк в итоговой таблице.
Стилизация и адаптация под печать
После того как данные начали отображаться, наступает этап полировки внешнего вида. Для печатных форм критически важно использовать медиа-запрос @media print. Он позволяет задать стили, которые применяются только при печати или сохранении в PDF, игнорируя экранное отображение.
В блоке печати необходимо явно указать размеры полей страницы, ориентацию (портретная или ландшафтная) и запретить разрывы страниц в неподходящих местах. Например, вы можете запретить разрывать строку таблицы посередине, чтобы цена и наименование товара всегда были на одном листе.
Используйте относительные единицы измерения, такие как pt (пункты) или mm (миллиметры), вместо пикселей. Это обеспечивает предсказуемый размер элементов на физической бумаге. Также стоит явно задать шрифты, используя стандартные гарнитуры вроде Arial или Times New Roman, которые гарантированно есть в системе.
- 🖨️ Установите
page-break-inside: avoid;для строк таблицы. - 📏 Задайте поля страницы через
@page { margin: 1cm; }. - 🎨 Отключите фоновые цвета, если принтер черно-белый, для экономии тонера.
- 🔍 Проверьте контрастность текста, чтобы тонкие шрифты читались четко.
Экспорт результата в PDF и отправка
Финальным этапом является превращение HTML-строки в файл. Платформа 1С предоставляет встроенные средства для этого. После получения объекта макета с подставленными данными, вы можете сохранить его как HTML-файл или сразу конвертировать в PDF, если на клиенте установлен соответствующий движок.
Часто требуется не просто показать документ пользователю, а сразу отправить его контрагенту. Для этого сформированный файл записывается во временное хранилище или прикрепляется к письму. Метод Записать() позволяет сохранить результат в нужный каталог с указанным расширением файла.
При автоматической рассылке убедитесь, что имя файла формируется уникально, например, включая номер и дату документа. Это предотвратит перезапись файлов при пакетной печати нескольких накладных. Также полезно добавлять префикс "Накладная_" для быстрой идентификации в папке загрузок пользователя.
☑️ Проверка перед запуском в продакшн
⚠️ Внимание: Интерфейс и доступные методы экспорта могут отличаться в зависимости от используемого клиента (Тонкий клиент, Веб-клиент, Толстый клиент). Всегда тестируйте печать в том режиме, в котором работают пользователи.
Часто задаваемые вопросы (FAQ)
Почему кириллица в макете отображается как иероглифы?
Скорее всего, файл макета сохранен в кодировке, отличной от UTF-8. Убедитесь, что в самом начале HTML-кода указан мета-тег <meta charset="UTF-8"> и файл сохранен именно в этой кодировке в редакторе.
Можно ли использовать JavaScript внутри макета 1С?
Использовать JavaScript крайне не рекомендуется. Встроенный браузер 1С может блокировать выполнение скриптов из соображений безопасности, а в веб-клиенте это может вовсе не сработать. Вся логика должна быть на стороне 1С.
Как сделать колонтитулы с номером страницы?
Для нумерации страниц используйте CSS-свойства @page. Например, content: "Страница " counter(page); в секции @bottom-center позволит добавить автоматическую нумерацию при печати в PDF.
Макет не видит параметры, хотя имена совпадают?
Проверьте регистр символов. В некоторых версиях платформы имена параметров чувствительны к регистру. Также убедитесь, что вы не используете лишние пробелы в названии параметра внутри скобок % ... %.