Skip to Content

Настройка формы фотоидентификации

Version 1.1 by pugachevskaya_elena on 2025/12/09 20:58
Warning
For security reasons, the document is displayed in restricted mode as it is not the current version. There may be differences and errors due to this.

В данном разделе приведены сведения о порядке настройки шаблона формы для вывода данных о владельце и пропуске.

Information

ПОДСКАЗКА

Если вы не хотите разбираться с кодом шаблона формы или вам требуется форма о определенном стиле, с дополнительными графическими элементами, вы всегда можете заказать разработку такой формы у специалистов компании ИТРИУМ.

content.png Содержание:

Общие сведения

Платформа НЕЙРОСС с версии 20.41 позволяет вывести в форме фотоидентификации любые данные в владельце и пропуске, в том числе пользовательские свойства владельца и пропуска. 

s_photoid_extended.png

Information

Инструкция по добавлению пользовательских свойств приведена в разделе [Добавление пользовательских свойств]. Чтобы вывести свойства в форме владельца и пропуска для ввода данных в АРМ Доступ используйте конструктор форм [Настройка форм ввода данных].

Для отображения поля необходимо сформировать его ключ по следующим правилам:

$PASS.$type_$field

где $PASS фиксированная строка, $type = person для владельца и pass для пропуска, а $field формируется по следующим правилам:

  1. Если свойство типовое (ФИО, организация и т. п.) – то просто ключ свойства
  2. Если свойство пользовательское с ключом key – то строка вида property_key


Ключи свойств

Unknown macro: excerpt. Click on this message for details.


Заметки отображения пользовательских свойств

Тип поля

Комментарий

Дата и время

1979-03-31T10:00:00+03:00
Указывается время и часовой пояс

Только дата

1979-03-31

Только время

18:00:00

Переключатель

да/нет
Если не указано, ничего не выводится.

Список

Отображается код, а не значение. Рекомендуется задавать осмысленные коды.


Порядок настройки

Скопируйте приведённый ниже код шаблона формы.

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8" />
       <meta
           name="viewport"
           content="initial-scale = 1.0, maximum-scale=1.0, user-scalable = no, width=device-width"
       />
       <meta name="mobile-web-app-capable" content="yes" />
       <meta name="apple-mobile-web-app-capable" content="yes" />
       <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
       <link rel="stylesheet" type="text/css" href="/dry/css/vendor/font-awesome.css" />
   </head>
   <body>
       <div class="card">
           <div class="card__header">
               <div class="{{ $EVENT.state }}">
                   <span>{{ $EVENT.status }}</span>
               </div>
           </div>
           <div class="card__body">
               <div class="card__body__photo" style="background-image: url('{{ $PASS.photoURL }}')"></div>
               <div class="card__body__data">
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">ФИО:</div>
                       <div class="card__body__data__row__value">{{ $PASS.personName }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Карта:</div>
                       <div class="card__body__data__row__value">{{ $PASS.cardNumber }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Событие:</div>
                       <div class="card__body__data__row__value">{{ $EVENT.status }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Источник события:</div>
                       <div class="card__body__data__row__value">{{ $EVENT.source }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Время события:</div>
                       <div class="card__body__data__row__value">{{ $EVENT.time }}</div>
                   </div>
                   <!-- all person fields -->
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Фамилия:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_surname }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Имя:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_name }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Отчество:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_patronymic }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Организация:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_organization }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Подразделение:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_division }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Должность:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_post }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Табельный номер:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_clock_number }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Номер документа:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_document_number }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Доп. информация:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_properties_extra }}</div>
                   </div>
                   <!-- all pass fields -->
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Состояние:</div>
                       <div class="card__body__data__row__value">{{ $PASS.pass_state }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Тип:</div>
                       <div class="card__body__data__row__value">{{ $PASS.pass_type }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Номер карты:</div>
                       <div class="card__body__data__row__value">{{ $PASS.pass_card }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Код предприятия:</div>
                       <div class="card__body__data__row__value">{{ $PASS.pass_facility }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Дата начала действия:</div>
                       <div class="card__body__data__row__value">{{ $PASS.pass_activation_date }}</div>
                   </div>
                   <div class="card__body__data__row">
                       <div class="card__body__data__row__title">Дата окончания действия:</div>
                       <div class="card__body__data__row__value">{{ $PASS.pass_expiration_date }}</div>
                   </div>
               </div>
           </div>
           <div class="card__footer">{{ #DECISION_BUTTONS }} {{ #CAMERA_ICON }}</div>
       </div>

       <script type="text/javascript">
           function safeClosure() {
               return {
                   execute: function () {
                       // code goes here
                    },
                   cleanup: function () {
                       // required hook for script deactivation!
                    },
                };
            }

           safeClosure().execute();
           window.cleanup = safeClosure().cleanup;
       </script>

       <style>
           html,
           body {
               height: 100%;
            }
           body {
               margin: 0;
               font-family: Arial, Verdana, Helvetica, sans-serif;
            }
           * {
               box-sizing: border-box;
            }
            .card {
               display: flex;
               flex-direction: column;
               width: 100%;
               height: 100%;
               justify-content: space-between;
               overflow: hidden;
            }
            .card__header {
               display: flex;
               flex-direction: row;
               align-items: center;
               justify-content: space-between;
               height: 40px;
            }
            .card__header > div {
               width: 100%;
               height: 100%;
               padding: 0 25px;
               overflow: hidden;
               text-overflow: ellipsis;
            }
            .card__header > .ok {
               background-color: #0a9d13;
            }
            .card__header > .warn {
               background-color: #e8a71b;
            }
            .card__header > .alert {
               background-color: #c73734;
            }
            .card__header > div > span {
               line-height: 40px;
               color: #fff;
               display: block;
               white-space: nowrap;
            }
            .card__body {
               display: flex;
               flex-direction: row;
               height: calc(100% - 80px);
               margin-top: 0;
               margin-bottom: auto;
               padding: 20px;
               overflow: auto;
            }
            .card__body__photo {
               position: relative;
               display: flex;
               flex-direction: column;
               flex-grow: 1;
               flex-shrink: 0;
               max-width: 30%;
               max-height: 70%;
               background-size: contain;
               background-repeat: no-repeat;
               background-position: 50% 50%;
            }
            .card__body__photo > img {
               width: 100%;
               height: 100%;
               margin: auto;
               object-fit: contain;
            }
            .card__body__data {
               display: table;
               padding-left: 4vw;
               width: 60%;
            }
            .card__body__data__row {
               display: table-row;
            }
            .card__body__data__row__title {
               display: table-cell;
               padding-top: 4.5vh;
               padding-right: 1vw;
               font-size: 2vw;
            }
            .card__body__data__row__value {
               display: table-cell;
               font-size: 2.5vw;
            }
            .card__footer {
               position: absolute;
               display: flex;
               flex-direction: row;
               background-color: #d8dde1;
               bottom: 0;
               height: 40px;
               width: 100%;
            }
            .card__footer #hoverable-camera-tooltip {
               flex-shrink: 0;
               color: #8f9aa3;
               margin-right: 0;
               margin-left: auto;
               padding: 12px;
            }
            .card__footer .buttons__wrapper {
               height: 40px;
               flex-grow: 1;
            }
            .card__footer .buttons__wrapper > .button {
               height: 40px;
               line-height: 40px;
               width: 50%;
               padding: 0 20px;
               margin: 0;
               color: #fff;
               border: none;
               outline: none;
               cursor: pointer;
            }
            .button.disabled {
               opacity: 0.7;
               pointer-events: none;
            }
            .card__footer .buttons__wrapper > .button.green {
               background-color: #0a9d13;
            }
            .card__footer .buttons__wrapper > .button.green:hover {
               background-color: #08820f;
            }
            .card__footer .buttons__wrapper > .button.red {
               background-color: #9e0b0f;
            }
            .card__footer .buttons__wrapper > .button.red:hover {
               background-color: #800007;
            }
       </style>
   </body>
</html>


Вставьте в текстовый редактор без форматирования, например, — свободно распространяемый Notepad++.

Отредактируйте код формы из блока:

<div class="card__body">
  ...
</div>


В этом блоке три группы полей. Порядок соответствует таблице выше.

Чтобы удалить поле из шаблона формы, просто удалите соответствующий блок кода.

Вы также можете добавить произвольное количество полей с пользовательскими свойствами владельца и пропуска, например:

<div class="card__body__data__row">
                       <div class="card__body__data__row__title">Группа крови:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_properties_Gruppa_krovi }}</div>
</div>

, поле «Группа крови» с полем типа «список».


<div class="card__body__data__row">
                       <div class="card__body__data__row__title">Согласие на обработку персональных данных:</div>
                       <div class="card__body__data__row__value">{{ $PASS.person_properties_consent_to_personal_data_processing }}</div>
                   </div>

, поле «Согласие на обработку персональных данных» типа «переключатель».


<div class="card__body__data__row">
                       <div class="card__body__data__row__title">Выход строго до:</div>
                       <div class="card__body__data__row__value">{{ $PASS.pass_properties_Vikhod_do }}</div>
                   </div>

, поле «Выход строго до» типа «дата и время», подтипом «только время».

Error

ВАЖНО

Будьте внимательны при вводе уникального ключа свойства. Рекомендуется копировать код во избежание ошибок.


Сохраните подготовленный шаблон формы в формате TEMPLATE, например:

Шаблон_формы.template


Загрузите файл шаблона в соответствующее поле настроек ячейки [Настройка АРМ фотоидентификации]. Каждая ячейка может иметь свой шаблон формы.


Платформа НЕЙРОСС