1. Description

The page is intended for creating Flow. Displays information about all Flow in the domain.

Flow can be used for any service scenario. Service scenarios: Inbound calls, IVR, Outbound job task queue, etc.

It consists of the following elements:

1. Creation tool (Fig.1(1));
2. Filtration Filter block (Fig.1(2));
3. Search field (Fig.1(3));
4. Upload tool (Fig.1(4));
5. Refresh button (Fig.1(5));
6. Registry (Fig.1(6));
7. Pagination (Fig.1(7)).

Image RemovedImage Added

Fig. 1. Flow page

1.1. Creation tool

Use the Add button to create a new Flow (Fig.1(1)).  The Create new flow modal window (Fig.2) opens after clicking the button. The following option options for creating Flow are available:

1. Diagram;
2. Code.

And types of schemes:

• Voice;
• Chat;
• Forms;
• Service.

Image RemovedImage Added

Fig. 2. Create new flow modal window

1.1.1. Diagram 

Create a new Flow using the Webitel Flow Diagram tool.

Select Diagram in the Create new flow modal window, choose flow type, and click the Create button.

The Webitel Flow Diagram opens after clicking the button.

1.1.2. Code

Create a new Flow using JSON schema in the code editor. Select Code in the Create new flow modal window and click the Create button. The choice of flow type is informational.

The General tab opens after clicking the button.

1.2.

Filter block

It is designed to filter the data displayed in the registry.

It consists of:

1. Filter elements (Fig.3(1));
2. Reset filters button (Fig.3(2));
3. Expand filters button (Fig.3(3)).

Image RemovedImage Added

Fig. 3. Filtration Filter block

1.2.1. Filter elements

It is possible to filter by tags - the Tags field and types - checkboxes.

1.2.2. Reset filters button

1.2.3. Expand filters button

1.3. Search field

The search is performed on the Name column.

1.4. Upload tool

It is used to upload flow Flow schema from a JSON file. Clicking the button (Fig.1(4)) opens a file selection window. Select the desired file on your device and click the Open button (depending on the OS, the file selection window may differ). The Import JSON modal window opens (Fig.4).

Image RemovedImage Added

Fig. 4. File selection window

The Import JSON  modal window opens (Fig.5).

1.

4.1. Import JSON  modal window 

The modal window consists of the following elements:

1. Create new? checkbox;
2. Name field;
3. Add button;
4. Close button.

Image RemovedImage Added

Fig. 5. Import JSON  modal window 

1.

4.1.1. Create new? checkbox

Предназначен для возможности обновления схемы без замены файла через удаление.

Image Removed - при нажатии кнопки "Добавить" создается новая схема (имя должно быть уникальным);

Image Removed - при нажатии кнопки "Добавить" схема, которая уже существует с таким же именем в реестре записей будет обновлена и заменена на ту, которую импортируют.

1.3.1.2. Поле "Имя"

Предназначено для введения имени схемы.

1.3.1.3. Кнопка "Добавить"

После нажатия кнопки "Добавить" схема добавляется в реестр записей с редактором "Код".

1.3.1.4. Кнопка "Закрыть"

После нажатия кнопки "Закрыть" модальное окно закрывается, схема не загружаетсяIt is designed to update the Flow schemе without replacing the file by deleting it.

Image Added - when you click the Add button, a new Flow schemе is created (the name must be unique);

Image Added - when you click the Add button, a Flow scheme with the same name in the registry will be updated - replaced with the one imported.

1.4.1.2. Name field

Here, enter the Flow scheme name if you want to change it.

1.4.1.3. Add button

The Flow scheme is added to the register after clicking the Add button. The editor is Code.

1.4.1.4. Close button

After clicking the Close button, the modal window is closed, and the Flow scheme is not loaded.

1.5. Refresh button

1.6. Registry

Реестр представляет собой список записей существующих объектов этого раздела, каждая из которых состоит из набора полей:

1. Чекбокс;
2. Колонка "Имя";
3. Колонка "Редактор";
4. Инструмент для скачивания (Рис. 4 (1));
5. Инструмент удаления (Рис. 4 (2));
6. Инструмент редактирования (Рис. 4 (3)).

Image Removed

Рис. 4. Реестр записей на странице "Схема"

1.5.1. Чекбокс

Используется для выбора нескольких записей. После выбора одной, или нескольких, записей появляется дополнительная кнопка удаления (Рис.5 (1)). При наведении курсора на этот инструмент появляется информация о количестве выбранных для удаления записей (Рис.5 (2)).

Image Removed

Рис. 5. Удаление нескольких записей

1.5.2. Колонка "Имя"

Здесь отображается имена схемы.

1.5.3. Колонка "Редактор"

Отображает, какой редактор был использован при создании схемы: Код или Диаграмма (Рис. 6).

Image Removed

Рис. 6. Редактор в реестре записей на странице "Схема"

1.5.4. Инструмент для скачивания

При нажатии на кнопку Image Removed скачивается json-файл с информацией о схеме.

1.5.5. Инструмент удаления

Используется для удаления объекта с подтверждением через модальное окно (Рис.7). При наведении на кнопку удаления (Image Removed) отображается информация с названием инструмента - Image Removed. После нажатия кнопки удаления появляется модальное окно с подтверждением. Нажатие кнопки "Удалить" - Image Removed удаляет объект. Нажатие кнопки "Отменить" закрывает модальное окно, объект не удаляется. 

Image Removed

Рис. 7. Модальное окно подтверждения удаления на странице "Схема"

1.5.6. Инструмент редактирования

Открывается нажатием на кнопку редактирования (Image Removed), при наведение курсором на которую отображается информация с названием инструмента - Image Removed. После нажатия на эту кнопку:

• Для схем с редактором "Код" открывается деталь "Общее", в которой можно изменить код схемы;
• Для схем с редактором "Диаграмма" открывается графический конструктор.

1.6. Пагинация 

The registry is a list of entries of existing objects in this partition, each of which consists of a set of fields:

1. Checkbox;
2. Name;
3. Editor;
4. Type;
5. Tags;
6. Created;
7. Modified;
8. Download button;
9. Editing tool;
10. Removal tool.

1.6.1. Checkbox

Fig. 6. Confirm deletion modal window

1.6.2. Name

The name of the Flow is displayed here.

1.6.3. Editor

This column displays which editor was used to create: Code or Diagram.

1.6.4. Type

This column displays the type chosen when the Flow scheme was created: Voice, Chat, Forms, or Service.

1.6.5. Tags

This column displays the tags selected for the Flow schema.

1.6.6. Created

This column displays the date the Flow scheme was created.

1.6.7. Modified

This column displays the date the Flow scheme was modified.

1.6.8. Download button

A JSON file with the Flow scheme is downloaded when the Image Added button is clicked.

1.6.9. Editing tool

After clicking the edit button (Image Added):

• For Flow schemes with the Code editor, the  General tab opens, in which you can edit the code of the Flow scheme; 
• For diagrams with the Diagram editor, the Webitel Flow Diagram opens, in which you can edit the Flow scheme; 

1.6.10. Removal tool

Fig. 7. Confirm deletion modal window

1.7. Pagination

2. Opportunities

2.1. Create a new

Flow scheme by

Code

2.2. Create a new

Цель

Создать новую схему посредством графического редактора

1.  Доступ к приложению Admin;
2.  Доступ к разделу "Схемы звонка" в приложении Admin;
3.  Разрешение на создание в разделе "Схемы звонка".

Сценарий:

1. Нажать кнопку "Добавить". Открывается модальное окно "Создать новую схему".
2. Выбрать тип редактора "Диаграмма". Кнопка "Создать" становится активной.
3. Нажать на кнопку "Создать". Открывается графический редактор.
4. Создать схему. Кнопка "Сохранить" становится активной.
5. Нажать на кнопку "Сохранить".
6. Нажать кнопку "Закрыть".

2.3. Удаление схемы 

Цель

Удалить схему

1.  Доступ к приложению Admin;
2.  Доступ к разделу "Схемы звонка" в приложении Admin;
3.  Разрешение на просмотр и удаление в разделе "Схемы звонка";
4. Наличие, как минимум, одной схемы.

Сценарий:

2.4. Удаление нескольких схем 

Цель

Удалить несколько схем

1.  Доступ к приложению Admin;
2.  Доступ к разделу "Схемы звонка" в приложении Admin;
3.  Разрешение на просмотр и удаление в разделе "Схемы звонка";
4. Наличие, как минимум, одной схемы.

Сценарий:

2.5. Редактирование схемы 

Цель

Редактировать схему

1.  Доступ к приложению Admin;
2.  Доступ к разделу "Схемы звонка" в приложении Admin;
3.  Разрешение на просмотр и редактирование в разделе "Схемы звонка";
4. Наличие, как минимум, одной схемы.

Сценарий:

3. Дополнительные материалы

3.1. Обучающее видео

3.1.1. Как настраивать маршрутизацию исходящих вызовов

Как настраивать маршрутизацию исходящих вызовов на примере схемы звонков между пользователями:

Flow scheme by Diagram

2.3. Delete a Flow

2.4. Delete several Flows

2.5. Edit a Flow (Code)

2.6. Edit a Flow (Diagram)