• Главная
• Информация о системе

В основе формата описания лежит шаблонизатор https://mustache.github.io/mustache.5.html. В описание можно добавлять:

• HTML разметку.
• Значение атрибутов объекта слоя.
• Вызов встроенных функций.
• Возможность копирования текстового содержимого HTML элементов в буфер обмена.
• Конвертацию unixtime времени.

За добавление значений атрибутов объекта слоя отвечает шаблонизатор Mustache. Справочную информацию по синтаксису Mustache можно найти здесь

Пример атрибутов объекта слоя:

{
  "color": "Красный",
  "workers": [
      {"name": "Василий", "age": 20},
      {"name": "Пётр", "age": 23},
      {"name": "Мария", "age": 25}
  ],
  "count": 25
}

Пример описания:

Цвет: {{color}}
 
{{#workers}}
  Имя: {{name}}
  Возраст: {{age}}
{{/workers}}
 
{{#count}}
  Количество: {{count}}
{{/count}}
 
{{#flag}}
  Этот текст никогда не будет выведен, так как атрибута flag нет.
{{/flag}}

Итоговое описание объекта:

Цвет: Красный
 
Имя: Василий
Возраст: 20
Имя: Пётр
Возраст: 23
Имя: Мария
Возраст: 25
 
Количество: 25

Для вызова встроенных функций необходимо добавить к HTML элементу атрибут data-createFunctionCall. Значение атрибута - это список имён функций, которые будут вызваны при клике на HTML элемент и/или json объекты в формате:

{
	"name": "Имя функции",
	"agruments": ["первый аргумент", 1, "третий аргумент", false]
}

Доступные функции:

• addToPreparedData - добавить элемент в список «Подготовленные данные».
• loadTrack - функция получения трека, для мобильных объектов имеющих deviceId.
• hideTrack - функция скрытия трека.
• runSearchInRadius - функция показа информации об объекте слоя в SideBar. HTML тег, с вызовом этой функции, автоматически удаляется, если в настройках портала включен SideBar.
• setCategory - функция изменения категории объекта.
• editProperties - редактировать свойства объекта.
• createObject - создать объект в другом наборе данных, аргументы:
  1. Идентификатор набора данных, в котором нужно создать объект.
  2. Идентификатор категории, которую нужно присвоить объекту (необязательный аргумент).
• MrskModule::getSap - функция перехода в SAP (при подключённом плагине SAP-connector), аргументы:
  1. Идентификатор объекта (необязательный аргумент, по умолчанию берется значение уникального поля объекта).
  2. Имя системы (необязательный аргумент).
  3. Команда (необязательный аргумент).
• enableLineRunner - функция открытия инструмента «расстояние на линии» (для объектов типа «Линия»).
• createNewMilestone - функция создания мероприятия (объект с которого производился вызов, будет добавлен в список объектов Мероприятия), аргументы:
  1. Идентификатор шаблона мероприятия.
• PluginBinderModule::showPluginBinder - функция открытия плагина связывания.
• OporyRelationPickerModule::showOporyPicker - функция открытия плагина редактора пролётов.
• sendUrlRequest - функция для отправки объекта по указанному url (параметр url должен содержаться в передаваемом объекте) Пример описания: <code html> <button data-createFunctionCall='[«runSearchInRadius»]'>Больше…</button> <button data-createfunctioncall='[«loadTrack»]' class='mat-raised-button mat-button-base mat-primary'>Показать трэк</button> <button data-createfunctioncall='[«hideTrack»]' class='mat-raised-button mat-button-base mat-primary'>Скрыть Трек</button> <button data-createFunctionCall='[«MrskModule::getSap»]'>Показать трэк и перейти в SAP</button> <button data-createfunctioncall='[{«name»: «setCategory», «arguments»: [«5e4e3bda9ae89212cd1f2782»]}]'>Штатный режим</button> <button data-createfunctioncall='[{«name»: «createObject», «arguments»: [«608788a86db2a069937bf792»]}]'>Создать объект</button> <button data-createfunctioncall='[{«name»: «createObject», «arguments»: [«608788a86db2a069937bf792», «6099d8740398ec5040647613»]}]'>Создать объект с категорией</button> <button data-createFunctionCall='[«enableLineRunner»]'>Расстояние на линии</button> <button data-createFunctionCall='[{«name»: «createNewMilestone», «arguments»: [«619e0ff794779c32113745f9»]}]'>Создать мероприятие</button> <button data-createFunctionCall='[{«name»: «PluginBinderModule::showPluginBinder», «arguments»: [«5e6f9b55525c1b12437eeadb»]}]'>Привязать</button> <button data-createFunctionCall='[{«name»: «OporyRelationPickerModule::showOporyPicker», «arguments»: [«5e6f9b55525c1b12437eeadb»]}]'>Пролёты</button> </code> ==== Функция отправки сообщения с карты==== * sendMessages - функция отправки push сообщения из окна с описанием. Для этой функции помимо кнопки необходимо добавить пустой textarea. Пример описания: <code html> <textarea id=send_deviceid></textarea> <button data-createFunctionCall='[{«name»: «sendMessages», «arguments»: [«deviceid»]}]'>Отправка сообщения</button> </code> ==== Копирование текстового содержимого HTML элемента==== Для копирования текстового содержимого HTML элемента в буфер обмена необходимо добавить к элементу атрибут data-canBeCopied. При клике на данный элемент его текстовое содержимое будет скопировано в буфер обмена. Пример описания: <code html> Копируемое значение атрибута: <b data-canBeCopied>attribute</b> </code> ==== Конвертация unixtime времени ==== Если текстовое содержимое HTML элемента это время в формате unixtime, то его можно преобразовать в удобочитаемый вид. Для этого необходимо добавить к HTML элементу атрибут data-convertUnixTime. Значение атрибута - это формат вывода времени. Форматирование времени осуществляется с помощью библиотеки momentjs описание форматов можно найти здесь. Пример атрибутов объекта: <code json> { «time»: «1325412001» } </code> Пример описания: <code html> Формат №1: <b data-convertUnixTime=«DD-MM-YYYY HH:mm:ss»>time</b> Формат №2: <b data-convertUnixTime=«D-M-YYYY H:m:s»>time</b> Формат №3: <b data-convertUnixTime=«DDD-MMM-YYYY HH:mm:ss»>time</b> Unixtime: <b>time</b> </code> Итоговое описание объекта: <code html> Формат №1: 01-01-2012 18:00:01 Формат №2: 1-1-2012 18:0:1 Формат №3: 1-янв.-2012 18:00:01 Unixtime: 1325412001 </code> ==== Округление чисел ==== Если содержимое HTML элемента это число или строка, содержащая только число, то его можно округлить. Для этого необходимо добавить к HTML элементу атрибут data-roundingNumber. Значение атрибута - это стратегия округления: * math - округление по математическим правилам (по умолчанию). * up - округление вверх. * down - округление вниз. Пример атрибутов объекта: <code json> { «value»: 0.6 } </code> Пример описания: <code html> Формат №1: <b data-roundingNumber>value</b> Формат №2: <b data-roundingNumber=«math»>value</b> Формат №3: <b data-roundingNumber=«up»>value</b> Формат №4: <b data-roundingNumber=«down»>value</b> Значение: <b>value</b> </code> Итоговое описание объекта: <code html> Формат №1: 1 Формат №2: 1 Формат №3: 1 Формат №4: 0 Значение: 0.6 </code> ==== Фильтрация описания по правам доступа ==== Если требуется показывать часть описания только пользователям с определенными правами доступа к набору данных, то необходимо воспользоваться атрибутом data-showOnlyByAccess. Значение атрибута - маска доступа пользователя к набору данных (целое число от 0 до 7). В маске: * Первый бит - чтение. * Второй бит - запись. * Третий бит - изменение категории. Пример описания: <code html> <span data-showOnlyByAccess=«1»>Этот текст увидят пользователи с правами на чтение</span> <span data-showOnlyByAccess=«2»>Этот текст увидят пользователи с правами на запись</span> <span data-showOnlyByAccess=«3»>Этот текст увидят пользователи с правами на чтение и запись</span> <span data-showOnlyByAccess=«4»>Этот текст увидят пользователи с правами на изменение категории</span> </code> ==== Вставка иконки слоя в описание ==== Для того, чтобы вставить в описание иконку слоя необходимо воспользоваться тегом description-layer-icon. По умолчанию иконка будет не больше 24 пикселей по высоте и ширине, если необходимо изменить это ограничение, то задайте встроенные css стиль с опциями height и width у тэга description-layer-icon на требуемые. P.S. Тег layer-icon отображается как inline-block. Пример описания: <code html> <description-layer-icon></description-layer-icon> Стандартная иконка <description-layer-icon style=«width: 12px; height: 12px»></description-layer-icon> Маленькая иконка <description-layer-icon style=«width: 36px; height: 36px»></description-layer-icon> Большая иконка </code> <code html> Имя пользователя: userinfo.name Номер телефона: userinfo.number </code> ==== Вставка координат точечного объекта в описание ==== Для того, чтобы вставить в описание координаты точечного объекта необходимо воспользоваться тегом point-lng-lat. Пример описания: <code html> Координаты объекта: <point-lng-lat></point-lng-lat> </code> ==== Наследование описания (доступно в версии 1.90 и выше) ==== Для того что бы унаследовать описание слоя от вышестоящего элемента дерева (папки/дерева) необходимо: <code> 1. Оставить описание слоя пустым (Слой полностью унаследует описание вышестоящего элемента) 2. Использовать тэг include_name(на место тэга будет вставлен родительский тэг с заданным именем) </code> Примеры наследования: <code html> Описание { «name» : «Дерево 1» «description» : «<div id=\»tree-header\«>tree-header</div> <div id=\»tree-footer\«>tree-footer</div>» } { «name» : «Папка 1 дерева 1», «description» : «include_tree-header <div id=\»dir-header\«>dir-header</div> name = name <div id=\»dir-footer\«>dir-footer</div> include_tree-footer» } { «name» : «Слой 1 папки 1 дерева 1», «description» : «include_dir-footer name = name include_tree-header» } { «name» : «Слой 2 папки 1 дерева 1», «description» : «include_dir-header text include_tree-footer\ninclude_dir-footer» } { «type» : «Папка 2 дерева 1», «description» : «» } { «type» : «Слой 1 папки 2 дерева 1», «description» : «» } Полученное описание для слоев { «name» : «Слой 1 папки 1 дерева 1», «description» : «<div id=\»dir-footer\«>dir-footer</div> name = name <div id=\»tree-header\«>tree-header</div>» } { «name» : «Слой 2 папки 1 дерева 1», «description» : «<div id=\»dir-header\«>dir-header</div> text <div id=\»tree-footer\«>tree-footer</div>\n<div id=\»dir-footer\«>dir-footer</div>» } { «type» : «Слой 1 папки 2 дерева 1», «description» : «<div id=\»tree-header\«>tree-header</div> <div id=\»tree-footer\«>tree-footer</div>» } </code> <code html> Описание { «name» : «Дерево 2», «description» : «<h1 id=h1t> this h1 <h2 id=h2t> this h2 <h3 id=h3t> this h3 </h1></h2></h3> <div id=div1> this div1 <div id=div2> this div2 </div></div>» } { «name» : «Слой 1 дерева 2», «description» : «include_h1t\n\ninclude_h2t\n\ninclude_h3t\n\ninclude_div1\n\ninclude_div2», } Полученное описание для слоя { «type» : «Слой 1 дерева 2», «description» : «<h1 id=\»h1t\«> this h1 <h2 id=\»h2t\«> this h2 <h3 id=\»h3t\«> this h3 </h3></h2></h1>\n\n<h2 id=\»h2t\«> this h2 <h3 id=\»h3t\«> this h3 </h3></h2>\n\n<h3 id=\»h3t\«> this h3 </h3>\n\n<div id=\»div1\«> this div1 <div id=\»div2\«> this div2 </div></div>\n\n<div id=\»div2\«> this div2 </div>» } </code> Пример не правильного наследования: <code html> Описание { «name» : «Дерево 3», «description» : «<div id=\»tree-header\«>tree-header</div>» } { «name» : «Папка 1 дерева 3», «description» : «<div id=\»dir-footer\«>dir-footer</div>» } { «name» : «Слой 1 папки 1 дерева 3», «description» : «include_dir-footer name = name include_tree-header» } Полученное описание { «type» : «layerEntity» «description» : «<div id=\»dir-footer\«>dir-footer</div> name = name » } </code> В данном варианте тэг tree-header не унаследуется так как его нет в папке. ==== Отображение изображения в слое ==== <code html> Изображение в атрибуте img airlay <a target='_blank' href=«url»> <img src=«preview» width=«250» height=«190» > </a> media Медиа и изображение**

airlay <video width=«250» height=«190» autoplay=«autoplay» poster=«url»>

 <source src="{{url}}" type='video/ogg; codecs="theora, vorbis"'>
 <a target='_blank' href="{{media.url}}"> 
    <img src="{{preview}}" width="250" height="190" > 
 </a>

</video> media </code>

{{#document}}
   <a target='_blank' href="{{url}}"> Скачать документ</a>
{{/document}}

{{#imagesLinks}}
   <a target='_blank' href="{{.}}"> 
      <img src="{{.}}" width="250" height="190" > 
   </a>
{{/imagesLinks}}