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

Version 6.1 by admin on 2026/06/17 20:02

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

Information

ПОДСКАЗКА

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

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

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

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

s_photoid_extended.png

Information

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

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

$PASS.$type_$field

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

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

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

Свойство

Ключ

Пример

Стандартные поля формы

ФИО

$PASS.personName

Петров Петр Сергеевич

Карта

Код_предприятия/Номер_карты
$PASS.cardNumber

№175/32784

Событие

$EVENT.status

Доступ разрешен

Источник события

$EVENT.source

Главный вход (турникет) — имя точки доступа

Время события

$EVENT.time

08:56

Свойства владельца пропуска

Фамилия

$PASS.person_surname

Петров

Имя

$PASS.person_name

Петр

Отчество

$PASS.person_patronymic

Сергеевич

Организация

$PASS.person_organization

ООО Промтехмонтаж

Подразделение

$PASS.person_division

Технологической инспекции

Должность

$PASS.person_post

Инспектор

Табельный номер

$PASS.person_clock_number

5465-У

Номер документа

$PASS.person_document_number

4016584681

Доп. информация

$PASS.person_properties_extra

Доступ к работе на электроустановках: до 1000 В

пользовательское свойство с ключом xxxxx 

$PASS.person_properties_xxxx

Свойства пропуска

Состояние пропуска

$PASS.pass_state

Действителен

Тип пропуска

$PASS.pass_type

Постоянный

Номер карты

$PASS.pass_card

32784

Код предприятия

$PASS.pass_facility

175

Действителен с

$PASS.pass_activation_date

2025.12.01 00:00:00

Действителен по

$PASS.pass_expiration_date

2032.12.16 00:00:00

пользовательское свойство с ключом yyyyy

$PASS.pass_properties_yyyyy

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

Тип поля

Комментарий

Дата и время

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

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