2.7.1. Спливаючі форми

Ви можете створити спливаючу форму, яка відкриватиметься на формі документа, формі завдання чи користувацькому довіднику. Через форму можна отримувати або встановлювати значення атрибутів. На формі спливаючої форми, ви можете розмістити будь-які атрибути, значення яких користувач повинен ввести.

2.7.1.1. Створити спливаючу форму

1. У лівому верхньому куті, виберіть робочий стіл Студія 1.

2. Виберіть групу ярликів Форми та шаблони 2, а потім виберіть Спливаючі форми 3.

3. У панелі інструментів, виберіть + 4.

   

4. Заповніть поля 1, використовуючи підказки в таблиці нижче, а потім у панелі інструментів виберіть піктограму Зберегти 2.

   

Назва поля	Опис
Код*	Унікальний ідентифікатор спливаючої форми • Код повинен бути унікальним. • Код повинен бути коротким (зазвичай до 10 символів). • Використовуйте тільки латинські букви та цифри.
Найменування*	Назва спливаючої форми. Є можливість встановити різні найменування для різних локалізацій.
Опис	Короткий опис спливаючої форми

5. Перейдіть у вкладку Конструктор форм 1.

6. У меню Налаштування 2, заповніть використовуючи підказки у таблиці нижче.

   

Назва поля	Опис
Заголовок	Введіть текст який буде відображатись у заголовку форми. ℹ️ Примітка: Ви можете встановити альтернативні заголовки для різних мов. Для цього у полі Заголовок, виберіть піктограму та заповніть поля для інших мов. А потім виберіть кнопку Застосувати.
Висота	Оберіть одну з наступних одиниць виміру: auto — висота поля буде автоматично визначена відповідно до вмісту px — пікселі vh (viewport height) — висота буде визначена у відсотках від висоти вікна браузера (viewport). Наприклад, "10vh" означає, що висота поля буде 10% від висоти вікна. А потім, у полі Висота, введіть числове значення, яке відповідатиме обраним одиницям вимірювання.
Ширина	Оберіть одну з наступних одиниць виміру: auto — висота поля буде автоматично визначена відповідно до вмісту px — пікселі vw (viewport width) — ширина буде визначена у відсотках від ширини вікна браузера. Наприклад, "10vw" означає, що ширина поля буде 10% від ширини вікна. А потім, у полі Ширина, введіть числове значення, яке відповідатиме обраним одиницям вимірювання.

7. Перетягніть потрібні атрибути з меню атрибутів 1 на форму 2.

   
   Примітка:

   На формі можна використовувати лише користувацькі атрибути таких типів: Дата та/або час, Текст, Число, Гіперпосилання, Посилання, Множинне посилання, Логічний.

8. Налаштуйте кожен доданий на форму атрибут. Для цього клацніть на доданий на форму атрибут, а тоді в меню Налаштування, налаштуйте атрибут, використовуючи наступні підказки, залежно від типу атрибута: Дата та/або час, Текст, Число, Гіперпосилання, Посилання, Множинне посилання, Логічний.

   

9. У панелі інструментів виберіть піктограму Зберегти, а потім перейдіть до заповнення секції Обов'язковість.

   

10. У панелі інструментів виберіть піктограму Зберегти, а потім, за потреби, перейдіть у секцію Скрипт, щоб налаштувати додаткові функції для форми. Для спливаючих форм доступні такі події (event):

    • event.formData.getAttribute() — отримання значення атрибута
    • event.formData.setAttribute() — встановлення значення атрибута
    • formData_attributeChanged_хх(event) { } — реагування на зміну значення атрибута
    • formData_validateAttribute_ххх(event) { } — валідація значення атрибута

    Див. більше у розділі Через скриптовий модуль.

    

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

2.7.1.2. Застосувати спливаючу форму

Після створення спливаючої форми, вам потрібно налаштувати зіставлення атрибутів спливаючої форми з атрибутами документа, завдання чи користувацького довідника. Зіставлення виконується по типу атрибутів, наприклад атрибути типу "Текст", можливо зіставити тільки з атрибутами типу "Текст".

Щоб зіставити атрибути, оберіть один з наступних способів:

• Через атрибут Кнопка на формі — використовується для форми типу документа, завдання чи користувацького довідника, у яку доданий атрибут компонування Кнопка.
• Через додавання дії в типі документа .
• Через додавання дії в формі завдання.
• Через скриптовий модуль.

2.7.1.2.1. Через атрибут "Кнопка" на формі

1. У панелі навігації, виберіть робочий стіл Студія 1.

2. Перейдіть у потрібний тип документа, форму завдання чи форму користувацького довідника.

   2.1. Якщо ви бажаєте додати цей атрибут до типу документа, то перейдіть у ярлик Типи документів 2 > "бажаний тип документа" > вкладка Конструктор 3.

   

   Або

   2.2. Якщо бажаєте додати атрибут до форми завдання, то перейдіть в групу ярликів Форми та шаблони 2 > ярлик Форми завдань 3 > Вкладка Форма 4.

   

   Або

   2.3. Якщо бажаєте додати атрибут до форми користувацького довідника, то перейдіть в групу ярликів Користувацькі довідники 2 > ярлик Користувацькі довідники 3 > Вкладка Форма запису довідника 4.

   

3. Знайдіть на формі атрибут Кнопка, а потім клацніть на нього 1.

4. В меню Налаштування, прогорніть вниз до секції Налаштування спливаючої форми, а потім в полі Спливаюча форма 2, виберіть спливаючу форму яку бажаєте відображати у документі, завданні, чи користувацькому довіднику.

   

5. Виберіть кнопку Додати зіставлення атрибутів.

   

6. У вікні Зіставлення атрибутів, в полі Атрибут спливаючої форми, оберіть з розкривного списку потрібний атрибут.

   

7. У вікні Атрибут поточної форми 1, виберіть зі списку атрибут з поточної форми типу документа, завдання, чи користувацького довідника, з яким пов'яжете попередній атрибут.

8. За допомогою позначок 2, налаштуйте тип зв'язку:

   • Вхідний — атрибути з документа, завдання чи користувацького довідника передаються на спливаючу форму;
   • Вихідний — атрибути зі спливаючої форми передаються до документа, завдання чи користувацького довідника;
   • Вхідний + Вихідний — атрибути з документа/завдання/користувацького довідника передаються на спливаючу форму, також зі спливаючої форми на документ, завдання чи користувацький довідник.
   

9. Виберіть кнопку Зберегти.

2.7.1.2.2. Через додавання дії в типі документа

1. У панелі навігації, виберіть робочий стіл Студія 1.

2. Перейдіть у ярлик Типи документів 2 > "бажаний тип документа" > вкладка Стани 3.

   

3. У меню Стани, клацніть на потрібний стан 1, а тоді в таблиці Дії, виберіть кнопку Додати 2.

   

4. Заповніть поля, використовуючи підказки в таблиці нижче.

Назва поля	Опис
Код дії*	Унікальний ідентифікатор даної дії. Не може повторюватись в межах одного стану.
Найменування*	Назва даної дії. ℹ️ Примітка: ви можете встановити альтернативну назву для різних мов. Для цього у полі Найменування, виберіть піктограму та заповніть поля для інших мов. А потім виберіть кнопку Застосувати.
Тип дії*	Виберіть варіант Зареєструвати документ.
Тип діалогу	Виберіть варіант Спливаюча форма.
Дозволити для ролей	Надайте доступ на виконання даної дії ролям, які активовані у типі документа (див. розділ Ролі).

Примітка:

поля позначені символом "*" є обов'язковими до заповнення.

5. У секції Зіставлення атрибутів, виберіть кнопку Додати зіставлення атрибутів.

   

6. У вікні Зіставлення атрибутів, в полі Атрибут спливаючої форми, оберіть з розкривного списку потрібний атрибут.

   

7. У вікні Атрибут поточної форми 1, виберіть зі списку атрибут з поточної форми типу документа, завдання, чи користувацького довідника, з яким пов'яжете попередній атрибут.

8. За допомогою позначок 2, налаштуйте тип зв'язку:

   • Вхідний параметр — атрибути з документа, завдання чи користувацького довідника передаються на спливаючу форму;
   • Вихідний параметр — атрибути зі спливаючої форми передаються до документа, завдання чи користувацького довідника;
   • Вхідний + Вихідний параметри — атрибути з документа/завдання/користувацького довідника передаються на спливаючу форму, також зі спливаючої форми на документ, завдання чи користувацький довідник.
   

9. Виберіть кнопку Зберегти.

2.7.1.2.3. Через додавання дії в формі завдання

1. У панелі навігації, виберіть робочий стіл Студія 1.

2. Перейдіть в групу ярликів Форми та шаблони 2, а потім виберіть ярлик Форми завдань 3.

3. Перейдіть у вкладку Дії 4.

   

4. У меню Дії, клацніть на потрібну дію 1, а тоді в полі Тип діалогу, виберіть Спливаюча форма 2.

   

5. В полі Спливаюча форма 1, виберіть з розкривного списку потрібну спливаючу форму, а потім виберіть кнопку Додати зіставлення атрибутів 2.

   

6. У вікні Зіставлення атрибутів, в полі Атрибут спливаючої форми, оберіть з розкривного списку потрібний атрибут.

   

7. У вікні Атрибут поточної форми 1, виберіть зі списку атрибут з поточної форми типу документа, завдання, чи користувацького довідника, з яким пов'яжете попередній атрибут.

8. За допомогою позначок 2, налаштуйте тип зв'язку:

   • Вхідний параметр — атрибути з документа, завдання чи користувацького довідника передаються на спливаючу форму;
   • Вихідний параметр — атрибути зі спливаючої форми передаються до документа, завдання чи користувацького довідника;
   • Вхідний + Вихідний параметри — атрибути з документа/завдання/користувацького довідника передаються на спливаючу форму, також зі спливаючої форми на документ, завдання чи користувацький довідник.
   

9. Виберіть кнопку Зберегти.

2.7.1.2.4. Через скриптовий модуль

Спливаючу форму можна викликати по таким подіям:

---

Натисканні кнопки на формі документа/завдання, користувацькому довіднику:

async form_77_click(event) { 
  //77 - ID кнопки

  const popupResult = await event.openPopupForm('f1', { 
    //f1 - код спливаючої форми
    title: 'Форма1', 
    // Заголовок форми
    height: '400px', 
    //висота форми, можна вказати undefined, тоді буде
    //використовуватись налаштування з конструктора форм
    width: '400px', 
    //ширина форми, можна вказати undefined, тоді буде
    //використовуватись налаштування з конструктора форм
    attrValues: {
      attr1: event.document.getAttribute('attr2'), 
      // attr1, який розміщено на формі отримає значення 
      // атрибута attr2 з документа.
    }
  })
  
  if (popupResult) { 
    //при натисканні кнопки "Ок" на формі, значення атрибута
    //attr1 з форми буде встановлено, як значення атрибута attr3 на документі
    const enteredValues = popupResult.attrValues
    event.document.setAttribute('attr3', enteredValues.attr1)
  }
}

---

При виконанні дії в документі:

async action_beforeExecute_d1(event) { 
 //викликаємо форму перед виконанням дії d1
 event.skipStandardConfirmDialog() 
 //відміняємо стандартне вікно підтвердження
 
 const popupResult = await showPopupForm('approveActionPopup', {
   //approveActionPopup - код форми із довідника "Спливаючі форми"
   title: 'Результат согласования', 
   // Заголовок форми
   height: undefined, 
   //висота форми, не задана - буде встановлена з параметрів
   //конструктора форм
   width: undefined, 
   //ширина , не задана - буде встановлена з параметрів
   //конструктора форм
   attrValues: {
     additionalInfo: event.document.getAttribute('additionalInfo')
   }
 })
 
 if (!popupResult) { 
   //при нажатии кнопки "Відмінити" нічого не робимо
   event.cancelAction()
   return
 }
 
 const additionalInfo2 = popupResult.attrValues 
 //при натисканні "Oк" записуємо значення атрибута з форми в документ
 event.document.setAttribute('additionalInfo', additionalInfo2.additionalInfo)
},

---

Перед збереженням документа/завдання:

async beforeSave(event) { 
 // викликаємо форму перед збереженням документа
 // event.skipStandardConfirmDialog() // відміняємо стандартне вікно
 // підтвердження

 const popupResult5 = await showPopupForm('f5', {
   title: 'Проверка дубликатов',
   height: undefined,
   width: undefined,
   attrValues: {
     sd01: event.document.getNativeAttribute('subject'),
     sd06: event.document.getAttribute('sd06'),
   }
 })
 
 if (!popupResult5) {
   event.cancelSave()
   return
 }
 
 const additionalInfo3 = popupResult5.attrValues
 event.document.setNativeAttribute('subject', additionalInfo3.sd01)
 event.document.setAttribute('sd06', additionalInfo3.sd06)
}