levis/help365
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

push ru help
All checks were successful
Deploy Static Site / deploy (push) Successful in 6m55s
Details

Browse Source
This commit is contained in:
koziavin
2025-05-28 05:24:40 +04:00
parent 0113fb8289
commit 041abbbd24
4459 changed files with 121310 additions and 86248 deletions
Download Patch File Download Diff File Expand all files Collapse all files

246
platform/hierarchy.html
View File

@ -1,19 +1,20 @@
<!DOCTYPE html>
<html lang="en">
<html lang="ru">
<head>
<title>Hierarchy</title>
<title>Иерархия</title>
<meta name="generator" content="Help+Manual" />
<meta name="keywords" content="" />
<meta name="keywords" content="шаге настройки контекста" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="The widget displays linked items of one app in the form of a hierarchical chart. The connection is established in the following way: on the page of one item the related items..." />
<meta name="description" content="Виджет отображает связанные между собой элементы одного приложения в виде иерархической структуры. Связь устанавливается следующим образом: в карточке одного элемента..." />
<meta name="picture" content="" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Full documentation for BRIX365 platform. Low-code developer guide. User guide. Admin guide. Developer guide." />
<meta property="og:url" content="https://brix365.com/en/help" />
<meta property="og:image" content="" />
<meta property="og:title" content="Cправка по Low-code платформе ELMA365" />
<meta property="og:url" content="https://elma365.com/ru/help" />
<meta property="og:image" content="" />
<meta property="og:site_name" content="ELMA365" />
<link rel="icon" href="favicon.png" type="image/png" />
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
@ -23,6 +24,7 @@
<link rel="stylesheet" href="./article.css" />
<link rel="stylesheet" href="./glossary.css" />
<link rel="stylesheet" href="./theme.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="helpman_settings.js"></script>
<script type="text/javascript" src="helpman_topicinit.js"></script>
@ -34,16 +36,16 @@
</head>
<body>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-M6ETBEC1R9"></script><script>window.dataLayer=window.dataLayer || []; function gtag(){dataLayer.push(arguments);}gtag('js', new Date()); gtag('config', 'G-M6ETBEC1R9');</script>
<script>!function(e,t,c,n,r,a,m){e.ym=e.ym||function(){(e.ym.a=e.ym.a||[]).push(arguments)},e.ym.l=1*new Date;for(var s=0;s<document.scripts.length;s++)if(document.scripts[s].src===n)return;a=t.createElement(c),m=t.getElementsByTagName(c)[0],a.async=1,a.src=n,m.parentNode.insertBefore(a,m)}(window,document,"script","https://mc.yandex.ru/metrika/tag.js"),ym(83179930,"init",{clickmap:!0,trackLinks:!0,accurateTrackBounce:!0,webvisor:!0})</script><noscript><div><img alt=""src=https://mc.yandex.ru/watch/83179930 style=position:absolute;left:-9999px></div></noscript>
<header class="header elma-365">
<div class="container">
<a class="header__logo" href="https://brix365.com/en/help">
<img src="./logo-en.svg" alt="header logo">
<a class="header__logo" href="https://elma365.com/ru/help">
<img src="./logo.svg" alt="header logo">
</a>
<!-- <div class="hero__search-form" id="search-panel">
<form class="search-form" onsubmit="ym(83180416,'reachGoal','poisk')">
<form class="search-form" onsubmit="ym(83179930,'reachGoal','poisk')">
<label class="search-form__label">
<span id="reset-search" class="search__icon"></span>
<input class="search-form__input" type="text">
@ -63,7 +65,7 @@
</div>
<div class="header__navi">
<ul class="header__list"><li><span class="solution-select"><span class="solution-select__selected"></span><svg width="7" height="4" viewBox="0 0 7 4" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L3.5 3.5L6 1" stroke="white" stroke-linecap="round" stroke-linejoin="round"/></svg><ul class="solution-select__list"><li><a class="project-link" href="https://brix365.com/en/help/platform/get-trial.html">Platform</a></li><li><a class="project-link" href="https://brix365.com/en/help/ecm/ecm-functions.html">ECM</a></li><li><a class="project-link" href="https://brix365.com/en/help/crm/crm_overview.html">CRM</a></li><li><a class="project-link" href="https://brix365.com/en/help/service/service-functions.html">Service</a></li><li><a class="project-link" href="https://brix365.com/en/help/projects/projects-functions.html">Projects</a></li><li><a class="project-link" href="https://brix365.com/en/help/business_solutions/-elma365-store.html">Business Solutions</a></li></ul></span></li><li><a href="https://api.brix365.com/en/" target="_blank">API</a></li><li><a href="https://tssdk.brix365.com/" target="_blank">SDK</a></li></ul>
<ul class="header__list"><li><span class="solution-select"><span class="solution-select__selected"></span><svg width="7" height="4" viewBox="0 0 7 4" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 1L3.5 3.5L6 1" stroke="white" stroke-linecap="round" stroke-linejoin="round"/></svg><ul class="solution-select__list"><li><a class="project-link" href="https://elma365.com/ru/help/platform/get-trial.html">Платформа</a></li><li><a class="project-link" href="https://elma365.com/ru/help/ecm/ecm-functions.html">ECM</a></li><li><a class="project-link" href="https://elma365.com/ru/help/crm/crm_overview.html">CRM</a></li><li><a class="project-link" href="https://elma365.com/ru/help/service/service-functions.html">Service</a></li><li><a class="project-link" href="https://elma365.com/ru/help/projects/projects-functions.html">Проекты</a></li><li><a class="project-link" href="https://elma365.com/ru/help/business_solutions/-elma365-store.html">Бизнес-решения</a></li></ul></span></li><li><a href="https://api.elma365.com/ru/"target="_blank">API</a></li><li><a href="https://tssdk.elma365.com/"target="_blank">SDK</a></li><li><a href="https://community.elma365.com/" target="_blank">Community</a></li><li><a href="https://elma-academy.com/ru/" target="_blank">Академия</a></li><li><a href="https://elma365.com/ru/" target="_blank">Сайт ELMA365</a></li></ul>
</div>
@ -78,8 +80,8 @@
<aside class="sidebar" id="sidebar">
<div class="sidebar__header">
<a class="header__logo" href="https://brix365.com/en/help">
<img src="./logo-light-en.svg">
<a class="header__logo" href="https://elma365.com/ru/help">
<img src="./logo-light.svg">
</a>
<span class="sidebar__close elma-365-close" id="close"></span>
</div>
@ -92,15 +94,15 @@
<div class="article-inner">
<div class="content">
<header class="article__header">
<div class="article__bread" style="display:flex; gap:10px;">
<div class="article__bread" style="display:flex; gap:10px;">
<span id="subcategory" class="search-res__item-category search-res__item-category_subcategory subcategory article__badge"></span>
<div class="topic__breadcrumbs">
<p>Low-code designer &gt; <a href="interface_settings.html">Set up interfaces</a> &gt; Widget types &gt; CRM widgets / Hierarchy</p>
<p>Low-code дизайнер &gt; <a href="interface_settings.html">Создание интерфейсов</a> &gt; Типы виджетов &gt; Виджеты для «ELMA365 CRM» / Иерархия</p>
</div>
</div>
<div class="topic__title"><h1 class="p_Heading1"><span class="f_Heading1">Hierarchy</span></h1>
<div class="topic__title"><h1 class="p_Heading1"><span class="f_Heading1">Иерархия</span></h1>
</div>
</header>
@ -109,78 +111,83 @@
<a href="#h1-article" class="scroll-top"></a>
</div>
<!-- Placeholder for topic body. -->
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">The widget displays linked items of one app in the form of a hierarchical chart. The connection is established in the following way: on the page of one item the related items from the same app are selected.</p>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">For example, for the <span style="color: #0000ff;"><a href="360012584980.html" class="topiclink">Company</a></span> app, you can create a chart of the company's hierarchy by specifying the parent company and its subsidiaries in the page.</p>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">The hierarchy can be displayed as a tree or a table on the item page. In this case, in the widget settings you can select the fields that will be shown for hierarchy items in the table and tree.</p>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">It is recommended to display the hierarchy in a separate tab of the form. You can place the widget both on the form of the app for which the hierarchy is customized and on the page of another app. Depending on this, the widget settings differ.</p>
<h2 class="p_Heading2"><a id="context-settings" class="hmanchor"></a><span class="f_Heading2">Customize the hierarchy in the app</span></h2>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">To display the structure, the app context is first customized. To do this, a field of the <span style="font-weight: bold;">App</span> type is added to it for binding. It will refer to itself. In this field on the form of the item the user will be able to specify another item from the same app.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">Then the <span style="font-weight: bold;">Hierarchy</span> widget is added to the app form and customized.</p>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">Let’s consider two ways of customizing the hierarchy using examples. In the <span style="font-weight: bold;">Contracts</span> app, different tabs will display:</p>
<ol style="list-style-type:decimal">
<li value="1" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">The structure of all contracts and additional agreements. The items are stored in the app for which the hierarchy is being customized.</li><li value="2" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">The hierarchy of contractors from these contracts. The items are stored in another app, <span style="font-weight: bold;">Company</span>.</li></ol>
<h3 class="p_Heading3"><a id="create-field" class="hmanchor"></a><span class="f_Heading3">Customize the context for the hierarchy from scratch</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">To display the structure of contracts, a field must be added to the <span style="font-weight: bold;">Contracts</span> app to link its items to each other:</p>
<ol style="list-style-type:upper-roman">
<li value="1" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Click the gear icon next to the <span style="font-weight: bold;">Companies</span> app name and select <span style="font-weight: bold;">Form Settings</span>.</li><li value="2" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Create a property of <span style="font-weight: bold;">App</span> type, enable the <span style="font-weight: bold;">One</span> option, and select the app whose form you are customizing. Save the property.</li></ol>
<p class="p_Normal" style="text-indent: 1px; margin: 0 0 0 36px;"><img alt="hier01" width="530" height="467" style="margin:0;width:530px;height:467px;border:none" src="hier01.png"/></p>
<ol style="list-style-type:upper-roman">
<li value="3" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Enable <span style="color: #0000ff;"><a href="360028941032.html" class="topiclink">advanced mode</a> </span>for form settings, add the created property to all forms in the app, and save the settings.</li></ol>
<h3 class="p_Heading3"><a id="companies-fields" class="hmanchor"></a><span class="f_Heading3">Customize the context for the hierarchy in the Company app</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">In our example, the contractor in the contract is pulled from the <a href="360012584980.html" class="topiclink">Company</a> app. It is part of BRIX CRM. The following fields are created in it by default for linking items and customizing the hierarchy:</p>
<ul style="list-style-type:disc">
<li style="text-align: justify; line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Parent Company</span>. A field with the <span style="font-weight: bold;">One</span> option enabled, to specify the main office of the organization.</li><li style="text-align: justify; line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Subsidiaries</span>. A field with the <span style="font-weight: bold;">Many</span> option enabled to select all branches of the company.</li></ul>
<p style="line-height: 1.28; margin: 0 0 11px 0;">To allow users to link companies to each other, display these properties on the app forms: &nbsp;</p>
<ol style="list-style-type:upper-roman">
<li value="1" style="line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Click the gear icon next to the <span style="font-weight: bold;">Contracts</span> app name and select <span style="font-weight: bold;">Form Settings</span>.</li><li value="2" style="line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Since <span style="color: #0000ff;"><a href="360028941032.html" class="topiclink">Advanced Mode</a></span> of the form settings is enabled for the app, add the <span style="font-weight: bold;">Parent Company</span> and <span style="font-weight: bold;">Subsidiaries</span> properties to the <span style="font-weight: bold;">Create</span>, <span style="font-weight: bold;">View</span>, and <span style="font-weight: bold;">Edit</span> tabs.</li><li value="3" style="line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Disable the <span style="font-weight: bold;">Read only</span> option for the properties so that on the forms users can not only create new companies, but also select them from existing records.</li><li value="4" style="line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Save the settings.</li></ol>
<h2 class="p_Heading2"><a id="widget-settings" class="hmanchor"></a><span class="f_Heading2">Customize the Hierarchy widget</span></h2>
<p style="line-height: 1.28; margin: 0 0 11px 0;">The next step is to customize the app form where you want to display the structure.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Виджет отображает связанные между собой элементы одного приложения в виде иерархической структуры. Связь устанавливается следующим образом: в карточке одного элемента выбираются относящиеся к нему записи из этого же приложения.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Например, для приложения <a href="360012584980.html" class="topiclink">Компании</a> таким образом можно создать структуру организации, указав в карточке материнскую компанию и её дочерние филиалы. </p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">начало&nbsp;внимание</span></p>
<p class="p_Normal">It is recommended to place the <span style="font-weight: bold;">Hierarchy</span> widget in a separate tab of the form.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-size: 15px; font-family: Inter;">Виджет доступен при активации одного из </span><span style="font-size: 15px; font-family: Inter; color: #0000ff;"><a href="licenses-crm.html" class="topiclink">платных решений CRM</a></span><span style="font-size: 15px; font-family: Inter;">, в которые входит отображение иерархической структуры контрагентов. Использовать его смогут только пользователи с лицензией решения</span><span style="font-size: 15px; font-family: Inter; color: #394149;">.</span></p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">конец&nbsp;внимание</span></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">In our example, the hierarchies of contracts and contractors are being customized, so two tabs are created on the <span style="font-weight: bold;">Contracts</span> app form. A widget is added to each of them and customized differently:</p>
<ol style="list-style-type:upper-roman">
<li value="1" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Go to the <a href="interface_designer.html" class="topiclink">interface designer</a> of the app view form.</li><li value="2" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Add the <a href="tabs.html" class="topiclink">Tabs</a> widget to the modeling field and set a name for it.<br />
For our example, the following tabs are created in the contract page: <span style="font-weight: bold;">Contract Hierarchy</span> and <span style="font-weight: bold;">Company Hierarchy</span>.</li><li value="3" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Go to the created tab, click <span style="font-weight: bold;">+ Widget</span> and select the <span style="font-weight: bold;">Hierarchy</span> widget.</li></ol>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Further settings of the widget will differ depending on which app structure you want to display on the customized form. Two hierarchy options are available: <span style="font-weight: bold;">By item</span> and <span style="font-weight: bold;">By item property</span>.</p>
<h3 class="p_Heading3"><a id="app-hierarchy" class="hmanchor"></a><span class="f_Heading3">Hierarchy by item</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Hierarchy by item is selected if you want to display the structure of the app whose form is currently being customized.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">In our example, in the <span style="font-weight: bold;">Contracts</span> app, the structure of the contract and its additional agreements will be displayed on the <span style="font-weight: bold;">Contract Hierarchy</span> tab. You need to specify the parameters in the settings of the widget placed on this tab:</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hierarchy-brix-01" width="988" height="651" style="margin:0;width:988px;height:651px;border:none" src="hierarchy-brix-01.png"/></p>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Build hierarchy</span>. The <span style="font-weight: bold;">By item </span>option is selected.</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Field for linking</span><span style="font-weight: bold; color: #ff0000;">*</span>. Select the <span style="font-weight: bold;">App</span> type property, where users specify the linked item from the same app. For contracts this is the <span style="font-weight: bold;">Main Contract</span> field created earlier at the step of <a href="hierarchy.html#create-field" class="topiclink">context customization</a>.</li></ul>
<p class="p_Normal">After that, configure the <a href="hierarchy.html#view-hierarchy" class="topiclink">hierarchy display settings</a> in the widget.</p>
<h3 class="p_Heading3"><a id="app-field-hierarchy" class="hmanchor"></a><span class="f_Heading3">Hierarchy by item property </span></h3>
<p style="line-height: 1.20; margin: 0 0 11px 0;">Hierarchy by item<span style="font-weight: bold;"> </span>property is selected if you want to display the structure of another app related to it on the form of one app.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">In our example, in the contract page, in the <span style="font-weight: bold;">Contractor</span> field contains an item from the <span style="font-weight: bold;">Company</span> app. Since the contract and the company are linked, you can display the structure of the company selected in the field on the <span style="font-weight: bold;">Contracts</span> app form.</p>
<p style="line-height: 1.20; margin: 0 0 11px 0;">In the settings of the widget located on the <span style="font-weight: bold;">Company Hierarchy</span> tab, the parameters are specified:</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hierarchy-brix-02" width="990" height="613" style="margin:0;width:990px;height:613px;border:none" src="hierarchy-brix-02.png"/></p>
<ul style="list-style-type:disc">
<li style="text-align: justify; line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Build hierarchy</span>. Select the <span style="font-weight: bold;">By item</span> <span style="font-weight: bold;">property</span> option.</li><li style="text-align: justify; line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Item</span> <span style="font-weight: bold;">property</span><span style="font-weight: bold; color: #ff0000;">*</span>. From the context of the current app select the field of the <span style="font-weight: bold;">App</span> type that refers to the linked item. In the <span style="font-weight: bold;">Contracts</span> app, this is the <span style="font-weight: bold;">Contractor</span> field that references the company. The hierarchy of the linked company-contractor will be displayed on the contract form.</li><li style="text-align: justify; line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Field for linking</span><span style="font-weight: bold; color: #ff0000;">*</span>. From the context of the app linked to the current one and selected in the previous field, a property of App type with the One option enabled is selected. For our example from the <span style="font-weight: bold;">Companies</span> app the default created <span style="font-weight: bold;">Parent company</span> field is specified.</li></ul>
<h3 class="p_Heading3"><span class="f_Heading3">Customize the display of items in the hierarchy</span></h3>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">The next step for both ways of hierarchy building is to set the appearance of items<span style="font-weight: bold;"> </span>from the structure on the form:</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В карточке элемента иерархию можно отображать в виде дерева или таблицы. При этом в настройках виджета выбираются поля, которые будут показываться для записей иерархии в таблице и дереве. </p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Иерархию рекомендуется отображать на форме в отдельной вкладке. Размещать виджет можно как на форме приложения, для которого настраивается иерархия, так и в карточке другого приложения. В зависимости от этого отличаются настройки виджета.</p>
<h2 class="p_Heading2"><a id="context-settings" class="hmanchor"></a><span class="f_Heading2">Настройка иерархии в приложении</span></h2>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Для отображения структуры сначала настраивается контекст приложения. Для этого в него добавляется поле для связи типа <span style="font-weight: bold;">Приложение</span>.<span style="font-weight: bold;"> </span>Оно будет ссылаться само на себя. В этом поле на форме одного элемента пользователь сможет указать другой элемент из этого же приложения.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Затем на форму приложения добавляется и настраивается виджет <span style="font-weight: bold;">Иерархия</span>. </p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Рассмотрим два способа настройки иерархии на примерах. В приложении <span style="font-weight: bold;">Договоры </span>на разных вкладках будет отображаться:</p>
<ol style="list-style-type:decimal">
<li value="1" style="text-align: justify; line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Specify which app properties will be displayed in <span style="color: #0000ff;"><a href="hierarchy.html#tree" class="topiclink">tree</a></span> and <span style="color: #0000ff;"><a href="hierarchy.html#table" class="topiclink">table</a></span> views. To do that, drag the fields from the <span style="font-weight: bold;">Context</span> column.</li><li value="2" style="text-align: justify; line-height: 1.20; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Select the properties to he shown in collapsed tree pages. To do that, enable the <span style="font-weight: bold;">Short</span> <span style="font-weight: bold;">list</span> option for the added fields.</li></ol>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">To delete a property added from the context, click on the trash bin icon next to it.</p>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">To finalize the widget settings, save the specified parameters.</p>
<p style="text-align: justify; line-height: 1.20; margin: 0 0 11px 0;">To make the form available to users, click <span style="font-weight: bold;">Save</span> and <span style="font-weight: bold;">Publish</span> on the top panel of the interface designer<span style="font-family: 'Times New Roman',Times,Georgia,serif;">.</span></p>
<h2 class="p_Heading2"><a id="view-hierarchy" class="hmanchor"></a><span class="f_Heading2">Display hierarchy on the form </span></h2>
<p style="line-height: 1.28; margin: 0 0 11px 0;">A widget can display up to 100 linked items. On the form, the hierarchy can be viewed as a tree and a table. The icons <img alt="clip0192" width="57" height="33" style="margin:0;width:57px;height:33px;border:none" src="clip0192.png"/><span class="f_ImageCaption"> </span>are used to switch the way data is displayed in the widget.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Hierarchy items are highlighted in different colors. Blue color is used for the head item. The record whose card is open or linked to the current item is highlighted in green. The other components of the structure are indicated in gray.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">You can interact with the fields in the pages of the hierarchy items. For example, click on a field of the <span style="font-weight: bold;">Email</span> type to go to writing a letter or click on a link in a field of the <span style="font-style: italic;">App</span> type to open the page of the specified record.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">When building a <a href="360012584980.html" class="topiclink">company</a> hierarchy, the <a href="360012584960.html" class="topiclink">contact's</a> name, title, phone number, and work email are automatically displayed in the selected field. If several contacts are specified, all related records are displayed.</p>
<h3 class="p_Heading3"><a id="tree" class="hmanchor"></a><span class="f_Heading3">Tree</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">When displayed as a tree, the widget shows blocks of related items with a short list of fields. &nbsp;</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hier04" width="1127" height="685" style="margin:0;width:1127px;height:685px;border:none" src="hier04.png"/></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">To view the page and the full list of fields specified in the widget settings, click on the arrow icon in the block.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hier05" width="154" height="151" style="margin:0;width:154px;height:151px;border:none" src="hier05.png"/></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">In items with dependent records, the icon <img alt="clip0191" width="21" height="21" style="margin:0;width:21px;height:21px;border:none" src="clip0191.png"/> is displayed. Click it to expand or collapse the corresponding tree branch.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">The tree control panel is located in the lower right corner of the widget. You can use it to scale the tree, minimize and maximize its structure.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">You can move around the tree on the form by dragging and dropping cards of items using the drag-and-drop method. In this way you can view records if the tree displays a large hierarchy.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><span style="font-size: 13px; color: #000000;">&nbsp;</span></p>
<h3 class="p_Heading3"><a id="table" class="hmanchor"></a><span class="f_Heading3">Table</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">The hierarchy table consists of a complete list of fields selected in the widget settings. You can collapse and expand the displayed structure. To do this, click the button in the first column of the table.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hier06" width="1124" height="668" style="margin:0;width:1124px;height:668px;border:none" src="hier06.png"/></p>
<li value="1" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Структура всех договоров и дополнительных соглашений. Элементы хранятся в приложении, для которого настраивается иерархия.</li><li value="2" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Иерархия контрагентов из этих договоров. Элементы хранятся в другом приложении — <span style="font-weight: bold;">Компании</span>.</li></ol>
<h3 class="p_Heading3"><a id="create-field" class="hmanchor"></a><span class="f_Heading3">Настройка контекста для иерархии с нуля</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Чтобы отобразить структуру договоров, в приложение <span style="font-weight: bold;">Договоры</span> необходимо добавить поле для связи его элементов между собой:</p>
<ol style="list-style-type:upper-roman">
<li value="1" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Нажмите на значок шестерёнки рядом с названием приложения <span style="font-weight: bold;">Договоры</span> и выберите пункт <span style="font-weight: bold;">Настройка формы</span>. </li><li value="2" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Создайте свойство типа <span style="font-weight: bold;">Приложение</span>, включите опцию<span style="font-weight: bold;"> Один </span>и выберите приложение, форму которого настраиваете. Сохраните свойство.</li></ol>
<p class="p_Normal" style="text-indent: 1px; margin: 0 0 0 36px;"><img alt="hierarchy-1" width="568" height="597" style="margin:0;width:568px;height:597px;border:none" src="hierarchy-1.png"/></p>
<ol style="list-style-type:upper-roman">
<li value="3" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Включите <a href="360028941032.html" class="topiclink">расширенный режим настройки форм</a>, добавьте созданное свойство на все формы приложения и сохраните настройки.</li></ol>
<h3 class="p_Heading3"><a id="companies-fields" class="hmanchor"></a><span class="f_Heading3">Настройка контекста для иерархии в приложении «Компании»</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В нашем примере контрагент в договоре подтягивается из приложения <a href="360012584980.html" class="topiclink">Компании</a>. Оно входит в решение <a href="crm-functions.html" class="topiclink">ELMA365 CRM</a>. В нём по умолчанию созданы следующие поля для связи элементов и настройки иерархии:</p>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Материнская компания</span> — поле с включённой опцией <span style="font-weight: bold;">Один</span>, для указания главного офиса организации;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Дочерние компании</span> — поле с включённой опцией <span style="font-weight: bold;">Несколько</span>, для выбора всех филиалов компании.</li></ul>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Чтобы пользователи могли связывать компании друг с другом, вынесите эти свойства на формы приложения: &nbsp;</p>
<ol style="list-style-type:upper-roman">
<li value="1" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Нажмите на значок шестерёнки рядом с названием приложения <span style="font-weight: bold;">Договоры</span> и выберите пункт <span style="font-weight: bold;">Настройка формы</span>.</li><li value="2" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Поскольку для приложения включён <a href="360028941032.html" class="topiclink">расширенный режим настройки форм</a>, добавьте свойства <span style="font-weight: bold;">Материнская компания</span> и<span style="font-weight: bold;"> Дочерние компании </span>на вкладки<span style="font-weight: bold;"> Создание</span>, <span style="font-weight: bold;">Просмотр</span>, <span style="font-weight: bold;">Редактирование</span>.</li><li value="3" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Отключите для свойств опцию <span style="font-weight: bold;">Только для чтения</span>, чтобы на формах пользователи смогли не только создавать новые компании, но и выбирать их из существующих записей.</li><li value="4" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Сохраните настройки. </li></ol>
<h2 class="p_Heading2"><a id="widget-settings" class="hmanchor"></a><span class="f_Heading2">Настройки виджета «Иерархия»</span></h2>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Следующим шагом настраивается форма приложения, на которой необходимо отобразить структуру.</p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">начало&nbsp;внимание</span></p>
<p class="p_Normal">Виджет <span style="font-weight: bold;">Иерархия</span> рекомендуется размещать на форме в отдельной вкладке. </p>
<p class="p_CodeExample" style="page-break-inside: avoid;"><span class="f_CodeExample">конец&nbsp;внимание</span></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В нашем примере настраиваются иерархии договоров и контрагентов, поэтому на форме приложения <span style="font-weight: bold;">Договоры</span> создаются две вкладки. На каждую из них добавляется виджет и настраивается по-разному: </p>
<ol style="list-style-type:upper-roman">
<li value="1" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Перейдите в <a href="interface_designer.html" class="topiclink">дизайнер интерфейсов</a> формы просмотра приложения.</li><li value="2" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Добавьте виджет <a href="tabs.html" class="topiclink">Вкладки</a> на поле для моделирования и задайте название для него. </li></ol>
<p style="line-height: 1.28; margin: 0 0 11px 36px;">Для нашего примера в карточке договора создаются вкладки: <span style="font-weight: bold;">Иерархия договоров</span> и <span style="font-weight: bold;">Иерархия компаний</span>.<span style="font-weight: bold;"> </span></p>
<ol style="list-style-type:upper-roman">
<li value="3" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Перейдите на созданную вкладку, нажмите <span style="font-weight: bold;">+ Виджет</span> и выберите виджет <span style="font-weight: bold;">Иерархия</span>.</li></ol>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Дальнейшие настройки виджета будут отличаться в зависимости от того, структуру какого приложения нужно отобразить на настраиваемой форме. Доступно две опции построения иерархии: <a href="hierarchy.html#app-hierarchy" class="topiclink">По элементу</a> и <a href="hierarchy.html#app-field-hierarchy" class="topiclink">По свойству элемента</a>.</p>
<h3 class="p_Heading3"><a id="app-hierarchy" class="hmanchor"></a><span class="f_Heading3">Иерархия по элементу</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Построение иерархии по элементу выбирается, если вы хотите отобразить структуру того приложения, форма которого настраивается в данный момент. </p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В нашем примере в приложении <span style="font-weight: bold;">Договоры</span> структура договора и его дополнительных соглашений будет отображаться на вкладке <span style="font-weight: bold;">Иерархия договоров</span>. В настройках виджета, размещённого на этой вкладке, указываются параметры:</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hierarchy-2" width="987" height="635" style="margin:0;width:987px;height:635px;border:none" src="hierarchy-2.png"/> </p>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Построение иерархии</span> — выбирается опция <span style="font-weight: bold;">По элементу</span>; </li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Поле для связи</span><span style="font-weight: bold; color: #ff0000;">*</span> — выбирается свойство типа <span style="font-weight: bold;">Приложение</span>, в котором пользователи указывают связанный элемент из этого же приложения. Для договоров это поле <span style="font-weight: bold;">Основной договор</span>, созданное ранее на <a href="hierarchy.html#create-field" class="topiclink">шаге настройки контекста</a>.</li></ul>
<p style="line-height: 1.28; margin: 0 0 11px 0;">После этого задайте <a href="hierarchy.html#settings-view-hierarchy" class="topiclink">настройки отображения иерархической структуры</a> в виджете.</p>
<h3 class="p_Heading3"><a id="app-field-hierarchy" class="hmanchor"></a><span class="f_Heading3">Иерархия по свойству элемента </span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Построение иерархии по свойству элемента выбирается, если на форме одного приложения нужно отобразить структуру другого приложения, связанного с ним.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В нашем примере в карточке договора в поле <span style="font-weight: bold;">Контрагент</span> указывается элемент из приложения <span style="font-weight: bold;">Компании</span>. Поскольку договор и компания связываются между собой, на форме приложения <span style="font-weight: bold;">Договоры</span> можно отобразить структуру выбранной в поле компании.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В настройках виджета, размещённого на вкладке <span style="font-weight: bold;">Иерархия компаний</span>, указываются параметры:</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hierarchy-3" width="907" height="601" style="margin:0;width:907px;height:601px;border:none" src="hierarchy-3.png"/> </p>
<ul style="list-style-type:disc">
<li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Построение иерархии</span> — выбирается опция <span style="font-weight: bold;">По свойству элемента</span>; &nbsp;</li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Свойство элемента</span><span style="font-weight: bold; color: #ff0000;">*</span> — из контекста текущего приложения выбирается поле типа <span style="font-weight: bold;">Приложение</span>, которое ссылается на связанный элемент. В приложении <span style="font-weight: bold;">Договоры</span> — это поле <span style="font-weight: bold;">Контрагент</span>, которое ссылается на компанию. Иерархия связанной компании-контрагента отобразится на форме договора; </li><li style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;"><span style="font-weight: bold;">Поле для связи</span><span style="font-weight: bold; color: #ff0000;">*</span> — из контекста приложения, связанного с текущим и выбранного в предыдущем поле, выбирается свойство типа <span style="font-weight: bold;">Приложение</span> с включённой опцией <span style="font-weight: bold;">Один</span>. Для нашего примера — из приложения <span style="font-weight: bold;">Компании</span> указывается созданное по умолчанию поле <span style="font-weight: bold;">Материнская компания</span>.</li></ul>
<p style="line-height: 1.28; margin: 0 0 11px 0;">После этого задайте <a href="hierarchy.html#settings-view-hierarchy" class="topiclink">настройки отображения иерархической структуры</a> в виджете. </p>
<h3 class="p_Heading3"><a id="settings-view-hierarchy" class="hmanchor"></a><span class="f_Heading3">Настройка отображения элементов в иерархии</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Следующим шагом в настройках виджета для обоих способов построения иерархии задаётся внешний вид элементов из структуры на форме:</p>
<ol style="list-style-type:decimal">
<li value="1" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Укажите, какие свойства приложения будут отображаться в виде <a href="hierarchy.html#tree" class="topiclink">дерева</a> и <a href="hierarchy.html#table" class="topiclink">таблицы</a>. Для этого перетащите нужные поля из столбца <span style="font-weight: bold;">Контекст</span>.</li><li value="2" style="line-height: 1.28; margin-top: 0; margin-right: 0; margin-bottom: 11px;">Выберите, какие свойства будут показываться в <a href="hierarchy.html#collapsible-list" class="topiclink">свёрнутых карточках дерева</a>. Для этого напротив добавленных полей включите опцию <span style="font-weight: bold;">Краткий список</span>.</li></ol>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Чтобы удалить добавленное из контекста свойство, напротив его названия нажмите значок корзины.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">После завершения настроек виджета сохраните указанные параметры. </p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Чтобы форма стала доступна пользователям, нажмите <span style="font-weight: bold;">Сохранить</span> и <span style="font-weight: bold;">Опубликовать</span> на верхней панели дизайнера интерфейсов.</p>
<h2 class="p_Heading2"><a id="view-hierarchy" class="hmanchor"></a><span class="f_Heading2">Отображение иерархии на форме </span></h2>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В виджете может отображаться до 100 связанных между собой элементов. На форме иерархию можно просматривать в виде дерева и таблицы. Для переключения способов отображения данных в виджете используются значки <img alt="hierarchy-4-icons" width="60" height="35" style="margin:0;width:60px;height:35px;border:none" src="hierarchy-4-icons.png"/>.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Элементы иерархии подсвечиваются разными цветами. Для головного элемента используется синий цвет. Запись, карточка которой открыта или связана с текущим элементом, выделяется зелёным. Остальные компоненты структуры обозначены серым. </p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">С полями в карточках элементов иерархии можно взаимодействовать. Например, нажать на поле типа <span style="font-weight: bold;">Электронная почта</span> для перехода к написанию письма или на ссылку в поле типа <span style="font-weight: bold;">Приложение</span>, чтобы открыть карточку указанной записи. </p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">При построении иерархии <a href="360012584980.html" class="topiclink">компаний</a> в вынесенном поле <a href="360012584960.html" class="topiclink">контакта</a> автоматически показывается его имя, должность, телефон и рабочая почта. Если контактов указано несколько, отображаются все связанные записи.</p>
<h3 class="p_Heading3"><a id="tree" class="hmanchor"></a><span class="f_Heading3">Дерево</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><a id="collapsible-list" class="hmanchor"></a>При отображении в виде дерева в виджете показываются блоки связанных элементов с кратким списком полей. &nbsp;</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hierarchy-5" width="1398" height="752" style="margin:0;width:1398px;height:752px;border:none" src="hierarchy-5.png"/></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Чтобы посмотреть карточку и полный список полей, указанный в настройках виджета, нажмите на значок стрелки в блоке.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hierarchy-6" width="246" height="564" style="margin:0;width:246px;height:564px;border:none" src="hierarchy-6.png"/></p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В элементах с зависимыми записями отображается значок <img alt="hierarchy-7-icon" width="21" height="21" style="margin:0;width:21px;height:21px;border:none" src="hierarchy-7-icon.png"/>. Нажмите на него, чтобы развернуть или свернуть соответствующую ветку дерева. </p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">В правом нижнем углу виджета располагается панель управления деревом. С её помощью можно изменять масштаб дерева, сворачивать и разворачивать всю его структуру.</p>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Перемещаться по дереву на форме можно с помощью перетаскивания карточек элементов методом Drag-and-Drop. Таким образом вы сможете просматривать записи, если в дереве отображается объёмная иерархия. </p>
<h3 class="p_Heading3"><a id="table" class="hmanchor"></a><span class="f_Heading3">Таблица</span></h3>
<p style="line-height: 1.28; margin: 0 0 11px 0;">Таблица иерархии состоит из полного списка полей, выбранных в настройках виджета. Вы можете сворачивать и разворачивать отображаемую структуру. Для этого нажмите на кнопку в первом столбце таблицы. </p>
<p style="line-height: 1.28; margin: 0 0 11px 0;"><img alt="hierarchy-8" width="1168" height="562" style="margin:0;width:1168px;height:562px;border:none" src="hierarchy-8.png"/></p>
<div class="bottom-nav">
@ -197,7 +204,7 @@ For our example, the following tabs are created in the contract page: <span styl
</div>
<!-- добавляет на страницу строку блок Была ли статья полезной? -->
<div class="feedback" id="feedback"><div class="feedback-help"><span><b>Was this helpful?</b></span><form action="" method="POST" class="feedback-form" id="feedback-form"><div class="feedback__popup feedback__popup-response" id="feedback__popup_thx" style="display: none;">Thanks for your feedback!</div><div class="feedback__popup" id="feedback__popup_why" style="display: none;"><div class="feedback__popup-header">Please specify why:</div><input type="radio" name="category" id="bad_recommendation" value="bad_recommendation"><label for="bad_recommendation">Recommendations did not help me</label><input type="radio" name="category" id="difficult_text" value="difficult_text"><label for="difficult_text">Article is hard to understand</label><input type="radio" name="category" id="no_answer" value="no_answer"><label for="no_answer">Didn`t answer my question</label><input type="radio" name="category" id="bad_header" value="bad_header"><label for="bad_header">Content does not match the topic</label><input type="radio" name="category" id="other_reason" value="other_reason"><label for="other_reason">Other</label></div><div class="feedback__popup" id="feedback__popup-other" style="display: none;"><div class="feedback__popup-header">How we can improve it?</div><textarea class="feedback__textarea" name="other" id=""></textarea><input type="submit" class="feedback__other-btn" value="Submit"></div><div class="feedback-form__btn-group"><input type="radio" name="useful" id="feedback__useful_yes" value="true"><label for="feedback__useful_yes"><img src="like.svg" class="small-img" alt="like"><spanclass="feedback-form__btn-group_yes-btn">Yes</spanclass="feedback-form__btn-group_yes-btn"></label><input type="radio" name="useful" id="feedback__useful_no" value="false"><label for="feedback__useful_no"><img src="dislike.svg" class="small-img" alt="dislike"><spanclass="feedback-form__btn-group_no-btn">No</spanclass="feedback-form__btn-group_no-btn"></label></div><select name="category"><option disabled="">Please specify why</option><option value="bad_recommendation" selected="">Recommendations did not help me</option><option value="difficult_text">Article is hard to understand</option><option value="no_answer">Didn`t answer my question</option><option value="bad_header">Content does not match the topic</option><option value="other_reason">Other</option></select><input type="submit"></form></div><div class="found_typo"><p style="margin: 0px; margin-top: 16px !important;"><span><b>Found a typo?</b></span> Select it and press <i>Ctrl+Enter</i> to send us feedback</p></div></div>
<div class="feedback-wrap"><div class="feedback" id="feedback"><span><b>Была ли статья полезной?</b></span><form action="" method="POST" class="feedback-form" id="feedback-form"><div class="feedback__popup feedback__popup-response" id="feedback__popup_thx">Спасибо за ваш отзыв!</div><div id="feedback-success-popup"><div class="wrap"><button type="button" class="feedback-popup-close">×</button><svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_212_2187)"><path d="M22 0.6875C10.2294 0.6875 0.6875 10.2294 0.6875 22C0.6875 33.7706 10.2294 43.3125 22 43.3125C33.7706 43.3125 43.3125 33.7706 43.3125 22C43.3125 10.2294 33.7706 0.6875 22 0.6875ZM22 40.5625C11.8023 40.5625 3.4375 32.3078 3.4375 22C3.4375 11.8024 11.6922 3.4375 22 3.4375C32.1977 3.4375 40.5625 11.6922 40.5625 22C40.5625 32.1976 32.3078 40.5625 22 40.5625ZM34.1713 16.933L18.6613 32.3186C18.257 32.7197 17.604 32.7171 17.203 32.3128L9.82283 24.873C9.42176 24.4686 9.42434 23.8157 9.82867 23.4146L10.5609 22.6884C10.9652 22.2873 11.6181 22.2899 12.0192 22.6942L17.9468 28.6697L31.9926 14.7366C32.3969 14.3356 33.0498 14.3382 33.4509 14.7425L34.1772 15.4747C34.5783 15.879 34.5757 16.532 34.1713 16.933Z" fill="#27AE60"></path></g><defs><clipPath id="clip0_212_2187"><rect width="44" height="44" fill="white"></rect></clipPath></defs></svg><p>Ваш отзыв успешно отправлен!</p><span>Спасибо за обратную связь.</span></div></div><div class="feedback__popup" id="feedback__popup_why"><button type="button" class="feedback-popup-close">×</button><div class="feedback__popup-header">Уточните, почему:</div><input type="radio" name="category" id="bad_recommendation" value="bad_recommendation"><label for="bad_recommendation">Рекомендации не помогли</label><input type="radio" name="category" id="difficult_text" value="difficult_text"><label for="difficult_text">Текст трудно понять</label><input type="radio" name="category" id="no_answer" value="no_answer"><label for="no_answer">Нет ответа на мой вопрос</label><input type="radio" name="category" id="bad_header" value="bad_header"><label for="bad_header">Содержание статьи не соответствует заголовку</label><input type="radio" name="category" id="other_reason" value="other_reason"><label for="other_reason">Другая причина</label></div><div class="feedback__popup" id="feedback__popup-other"><button type="button" class="feedback-popup-close">×</button> <div class="feedback__popup-header">Расскажите, что вам не понравилось в статье:</div><textarea class="feedback__textarea" name="other" id=""></textarea><input type="submit" class="feedback__other-btn" value="Отправить"></div><div class="feedback-form__btn-group"><input type="radio" name="useful" id="feedback__useful_yes" value="true"><label for="feedback__useful_yes"><img src="like.svg"/><span class="feedback-form__btn-group_yes-btn">Да</span></label><input type="radio" name="useful" id="feedback__useful_no" value="false"><label for="feedback__useful_no"><img src="dislike.svg"/><span class="feedback-form__btn-group_no-btn">Нет</span></label></div><select name="category"><option disabled>Выберите вариант</option><option value="bad_recommendation" selected>Рекомендации не помогли</option><option value="difficult_text">Текст трудно понять</option><option value="no_answer">Нет ответа на мой вопрос</option><option value="bad_header">Содержание статьи не соответствует заголовку</option><option value="other_reason">Другая причина</option></select><input type="submit"></form></div></div>
</section>
</div>
@ -205,7 +212,7 @@ For our example, the following tabs are created in the contract page: <span styl
<input type="checkbox" />
<div class="article__arrow"></div>
<div class="table-of-contents elma365-right" id="toc2Content">
<h3 class="h3-toc">In this topic</h3>
<h3 class="h3-toc">В этой статье</h3>
<nav id="toc2"></nav>
</div>
</aside>
@ -216,30 +223,63 @@ For our example, the following tabs are created in the contract page: <span styl
<div class="footer-container">
<div class="footer-mobile">
<ul class="footer-mobile__list"><li><a href="https://brix365.com/en/" target="_blank">BRIX</a></li><li><a href="https://tssdk.brix365.com/en/latest/" target="_blank">SDK</a></li><li><a href="https://api.brix365.com/en/" target="_blank">API</a></li></ul><ul class="footer-mobile__list"><li><a href="https://brix365.com/en/help/platform/get-trial.html">Platform</a></li><li><a href="https://brix365.com/en/help/ecm/ecm-functions.html">ECM</a></li><li><a href="https://brix365.com/en/help/service/service-functions.html">Service</a></li><li><a href="https://brix365.com/en/help/projects/projects-functions.html">Projects</a></li></ul>
<ul class="footer-mobile__list"><li><a href="https://api.elma365.com/ru/" target="_blank">API</a></li><li><a href="https://tssdk.elma365.com/" target="_blank">TS SDK</a></li><li><a href="https://community.elma365.com/" target="_blank">Community</a></li><li><a href="https://elma-academy.com/ru/elma365" target="_blank">Академия</a></li></ul><ul class="footer-mobile__list"><li><a href="https://elma365.com/ru/help/platform/get-trial.html">Платформа</a></li><li><a href="https://elma365.com/ru/help/ecm/ecm-functions.html">ECM</a></li><li><a href="https://elma365.com/ru/help/service/service-functions.html">Service</a></li><li><a href="https://elma365.com/ru/help/projects/projects-functions.html">Проекты</a></li></ul>
</div>
<div class="footer-wrap">
<div><span class="mobile-question-popup">Send feedback</span><form method="POST" action class="question__popup question-xs" id="question__popup"><div class="question-wrap"><span class="close"></span><span class="title">Ask a question</span><label for="help_question" style="display: none;"></label><textarea name="help_question" id="help_question"></textarea><input type="submit" value="Send"></div></form><div class="hidden fade-in question-success-xs">Sent</div></div>
<div class="footer-flex-b">
<span class="footer-copy">&copy; 2025 BRIX</span>
<ul class="footer-list">
<li class="footer-item">
<a href="#" class="arrow-top" style="display: block;"></a>
</li>
</ul>
<div class="container">
<div class="footer-wrap">
<div><span class="mobile-question-popup">Отправить фидбэк</span><form method="POST" action class="question__popup question-xs" id="question__popup"><div class="question-wrap"><span class="close"></span><span class="title">Задать вопрос</span><label for="help_question" style="display: none;"></label><textarea name="help_question" id="help_question"></textarea><input type="submit" value="Отправить"></div></form><div class="hidden fade-in question-success-xs">Ваш фидбэк отправлен.</div></div>
<div class="footer-flex-b">
<div class="footer-top">
<span class="footer-copy">&copy; 2025
ELMA365
</span>
<a href="https://navigator.sk.ru/orn/1122971" target="_blank">
<img src="sk-resident.svg" alt="sk icon" class="footer-img" width="117" height="34">
</a>
</div>
<div class="footer-line">
<div class="footer-line-copy">
<span class="footer-copy">&copy; 2025
ELMA365
</span>
</div>
<ul class="footer-list">
<li class="footer-item"><a href="https://elma365.com/ru/" target="_blank" class="footer-link" style="color: #0D4A75;"><img src="browse.svg" alt="browse icon" class="footer-img">elma365.com</a></li><li class="footer-item"><a href="https://www.youtube.com/user/ELMABPM" target="_blank" class="footer-link"><img src="yt.svg" alt="youtube icon" class="footer-img"></a></li><li class="footer-item"><a href="https://vk.com/elma_bpm" target="_blank" class="footer-link"><img src="vk.svg" alt="vk icon" class="footer-img"></a></li><li class="footer-item"><a href="https://t.me/elmaday" target="_blank" class="footer-link"><img src="tg.svg" alt="telegram icon" class="footer-img"></a></li><li class="footer-item"><a href="https://dzen.ru/elma" target="_blank" class="footer-link"><img src="dzen.svg" alt="dzen icon" class="footer-img"></a></li>
<li class="footer-item">
<a href="https://navigator.sk.ru/orn/1122971" target="_blank">
<img src="sk-resident.svg" alt="sk icon" class="footer-img" width="117" height="34">
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<a href="#" class="arrow-top"></a>
</div>
</footer>
<!-- <script type="text/javascript" src="jquery1.min.js"></script>-->
<iframe name="hmnavigation" style="display:none!important"></iframe>
<script src="./jquery-ui.js"></script>
<!--<script src="./jquery-ui.js"></script> -->
<script src="./jquery-ui.min.js"></script>
<!--script src="//cdn.jsdelivr.net/npm/featherlight@1.7.14/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script-->
<script src="./jquery.tocify.min.js"></script>
<script src="./TypoReporter.min.js"></script>