Начало работы с предпросмотром файлов

Просматривать и редактировать файлы на формах и страницах позволяют модули. С их помощью можно интегрировать необходимые пользователям функции в существующие в системе точки расширения.

Рассмотрим, как создать модуль предпросмотра файлов.

Настройка модуля

В разделе Администрирование / Модули создайте пользовательский модуль. Подробнее читайте в официальной справке ELMA365 в статье «Создание модуля».

После этого выполните настройку модуля:

  1. На странице управления модулем перейдите на вкладку Настройки. Создайте свойство типа Категория с именем SupportedFileTypes. Обратите внимание, данное имя свойства обязательно, так как оно проверяется при поиске модулей для точки расширения предпросмотра. В качестве значений введите форматы файлов, которые модуль будет отображать, например, ppt, pptx и odp.

  1. Перейдите на вкладку Виджеты и добавьте виджет, выбрав тип расширения Предпросмотр файлов — Страница предпросмотра. Виджет будет использоваться для просмотра файла.
  2. Задайте условия, при которых виджет будет отображаться. Для этого перейдите на вкладку Скрипты и напишите клиентский скрипт. Используйте в нём системные функции: функцию инициализации, по умолчанию onInit(), и функцию проверки условий для отображения, по умолчанию canRender(). Подробнее читайте в официальной справке ELMA365 в статье «Системные функции виджетов». Например, вы можете задать условие, чтобы виджет не отображался, если формат файла не определён:
async function canRender() {
    // Получаем формат файла с помощью пользовательской функции
    const fileType = getFileType();
    // Если формат файла не определён, шаблон виджета не должен отображаться
    if (!fileType) {
        return true;
    }
    return false;
}
  1. Добавьте в шаблон виджета ссылку на скачивание файла, чтобы пользователь мог загрузить его, если при отображении произойдёт ошибка. Для этого создайте в контексте виджета свойство link, которое будет хранить ссылку на файл и передавать её в шаблон.

Перейдите на вкладку Шаблон и вынесите на форму виджет Код. Добавьте в него HTML-код, который отобразит ссылку для загрузки файла:

    <a href="<%= Context.data.link %>" id="link">Ссылка на загрузку</a>

Здесь к свойству link выполняется обращение через данные контекста Context.data. Отредактируйте скрипт на вкладке Скрипты, чтобы при отображении виджета в него записывалась ссылка на файл:

async function canRender() {
    // Получаем формат файла с помощью пользовательской функции
    const fileType = getFileType();
    // Если формат файла не определён, шаблон виджета не должен отображаться
    if (!fileType) {
        // Пользовательская функция, которая получает ссылку для загрузки файла
        await renderLink();
        return true;
    }
    return false;
}
async function renderLink(): Promise<void> {
    if(!Context.data.file) {
        // Если файла нет, выводится ошибка
        throw new Error('no file');
    }
    // Получение ссылки для загрузки файла с помощью системного метода
    Context.data.link = await Context.data.file.getDownloadUrl();
}
  1. Настройте шаблон виджета и логику его работы. Для этого используйте другие виджеты и скрипты. Сохраните и опубликуйте виджет.
  2. Если в модуле используется интеграция со сторонним сервисом, создайте метод API для обращения к нему.
  3. Перейдите на страницу модуля и включите его.

После этого вы сможете просматривать файлы в форматах, которые указаны в настройках модуля, в интерфейсе ELMA365.

Вы можете найти примеры модулей предпросмотра в официальной справке ELMA365 в статье «Пользовательский модуль для просмотра и редактирования файлов».

Скрипты использования модуля

Стандартный виджет

Настроенный модуль может применяться в рамках стандартного виджета Просмотр файла, который задаёт точку расширения предпросмотра.

При открытии формы или страницы, на которую добавлен виджет, запускается поиск модулей предпросмотра. Используется первый найденный модуль, подходящий для просмотра файлов используемого формата.

В системе может существовать несколько модулей для одного формата файлов. Чтобы применялся пользовательский модуль предпросмотра, отключите неиспользуемые модули в разделе Администрирование / Модули.

Пользовательский виджет

Чтобы на форме или странице использовался только виджет, созданный в рамках пользовательского модуля предпросмотра:

  1. Откройте нужную форму или страницу в дизайнере интерфейсов.
  2. Вынесите пользовательский виджет на поле для моделирования.
  3. Откроется окно настроек виджета. Укажите значения, которые будут передаваться во входные параметры. Свойства, по умолчанию добавленные в контекст виджета предпросмотра, находятся на вкладке Системные. Чтобы модуль работал корректно, введите их значения или свяжите их с переменными из контекста настраиваемой формы или страницы:

  • File — свойство типа Файлы. Документ, который открывается с помощью модуля просмотра и редактирования;
  • ForFile — свойство типа Файлы. Используется при сохранении результата сравнения документа из поля File с другой его версией или другим файлом. Применяется, например, если документ ещё не сохранён в системе или версию нужно добавить к другому файлу. Свойство содержит документ, для которого создаётся версия с результатом сравнения;
  • Action — свойство типа Строка. Режим открытия документа: view — только просмотр, edit — просмотр и редактирование;
  • Extension — свойство типа Строка. Расширение файла из свойства File.
  1. Нажмите Сохранить. Виджет будет добавлен на поле для моделирования.
  2. Сохраните и опубликуйте шаблон.

Теперь на форме или странице, которую вы настроили, для отображения файла будет использоваться пользовательский модуль предпросмотра.