Сбор информации об изменении состояния и вывод в виде направленного графа с помощью vis.js

29.03.20

–

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

Вводные:

1. Нужно вывести историю изменения заказов клиентов в виде направленного графа с отражением среднего времени пребывания в состоянии и количество переходов через размер вершин и толщину линий.

2. Конфигурация на базе УТ 11

Решение:

Структура данных:

Добавил регистр сведений "ис_СостоянияЗаказовКлиентов", периодический, независимый

Измерения: Заказ

Ресурсы: Состояние, сделал через тип строка, т.к. планирую переделывать для состояний вынесенных в другое поле.

Запись данных в РС

Записываю при изменении РС СостоянияЗаказовКлиентов

Менеджер набора записей

&После("ПриЗаписи")
Процедура ис_ПриЗаписи(Отказ, Замещение)
	
	Для каждого СтрНЗ Из ЭтотОбъект Цикл
		РегистрыСведений.ис_СостоянияЗаказовКлиентов.ЗаписатьИзменениеСостояния(СтрНЗ.Заказ, СтрНЗ.Состояние);	
	КонецЦикла;
		
КонецПроцедуры

Проверка, запись изменений

Процедура ЗаписатьИзменениеСостояния(Знач Заказ, Знач Состояние) Экспорт
	
	Запрос = Новый Запрос;
	Запрос.Текст = "ВЫБРАТЬ
	|	ис_СостоянияЗаказовКлиентовСрезПоследних.Период КАК Период,
	|	ис_СостоянияЗаказовКлиентовСрезПоследних.Заказ КАК Заказ,
	|	ис_СостоянияЗаказовКлиентовСрезПоследних.Состояние КАК Состояние
	|ИЗ
	|	РегистрСведений.ис_СостоянияЗаказовКлиентов.СрезПоследних(,
	|			Заказ = &Заказ) КАК ис_СостоянияЗаказовКлиентовСрезПоследних";
	Запрос.УстановитьПараметр("Заказ", Заказ);
	РезультатЗапроса = Запрос.Выполнить();
	
	Если НЕ РезультатЗапроса.Пустой() Тогда
		Выборка = РезультатЗапроса.Выбрать();
		Выборка.Следующий();
		
		Если Строка(Выборка.Состояние) = Состояние Тогда
			Возврат;
		КонецЕсли;
	КонецЕсли;
	
	МЗ = РегистрыСведений.ис_СостоянияЗаказовКлиентов.СоздатьМенеджерЗаписи();
	МЗ.Заказ = Заказ;
	МЗ.Период = ТекущаяДата();
	МЗ.Состояние = Состояние;
	МЗ.Записать(Истина);
	
КонецПроцедуры

Формирование отчета

В качестве движка отрисовки графа использую vis.js, https://almende.github.io/vis/, документация по части network https://almende.github.io/vis/docs/network/, примеры по части network https://visjs.github.io/vis-network/examples/

Используем макет в котором храним заготовку HTML страницы, используется загрузка js с внешнего ресурса https://unpkg.com

Макет

<!doctype html>
<html>
<head>
  <title>Network</title>
  <script type="text/javascript" src="https://unpkg.com/vis-network/standalone/umd/vis-network.min.js"></script>
  <style type="text/css">
    #mynetwork {
      width: 100%;
      height: 100%;
    }
  </style>
</head>
<body>
<div id="mynetwork"></div>
<script type="text/javascript">
  // create an array with nodes
      
var container = document.getElementById("mynetwork");

var options = {
    nodes: {
      shape: "dot",
      scaling: {
        label: {
          min: 8,
          max: 20
        }
      }
    }
  };

var data = {};  

var network = new vis.Network(container, data, options);

  
function draw(nodes_json, edges_json) {
	var nodes = new vis.DataSet(JSON.parse(nodes_json));

	// create an array with edges
	var edges = new vis.DataSet(JSON.parse(edges_json));

	// create a network
	
	var data = {
	nodes: nodes,
	edges: edges
	};

	network.setData(data);
}
</script>
</body>
</html>

Для работы с HTML документом использую наработки из статьи //infostart.ru/public/398366/

Загрузку макета делаю при создании на сервере, при нажатии кнопки сформировать отправляю запрос на перерисовку.

Основные процедура и функция

&НаКлиенте
Процедура Сформировать(Команда)
	
	СтруктураДанные = СформироватьНаСервере();
	ОкноПервогоБраузера.draw(СтруктураДанные.СтрокаВершины, СтруктураДанные.СтрокаРебра);
	
КонецПроцедуры

&НаСервере
Функция СформироватьНаСервере()
	
	ВыборкаЗаказ = ПолучитьДанные();
		
	КоличествоЗаказов = ВыборкаЗаказ.Количество();
	
	ТЗ_СостоянияВершины = Новый ТаблицаЗначений;
	ТЗ_СостоянияВершины.Колонки.Добавить("Состояние");
	ТЗ_СостоянияВершины.Колонки.Добавить("Время");
	
	ТЗ_СостоянияРебра = Новый ТаблицаЗначений;
	ТЗ_СостоянияРебра.Колонки.Добавить("СостояниеНачальное");
	ТЗ_СостоянияРебра.Колонки.Добавить("Состояние");
	ТЗ_СостоянияРебра.Колонки.Добавить("Количество");
	
	СформироватьВершиныИРебра(ВыборкаЗаказ, ТЗ_СостоянияВершины, ТЗ_СостоянияРебра);
	
	//--
	
	ТЗ_СостоянияВершины.Свернуть("Состояние", "Время");
	Для каждого ТЗ_СВ Из ТЗ_СостоянияВершины Цикл
		 ТЗ_СВ.Время = ТЗ_СВ.Время / КоличествоЗаказов;
	КонецЦикла;
	
	ТЗ_СостоянияВершины.Индексы.Добавить("Состояние");
	
	ТЗ_СостоянияРебра.Свернуть("СостояниеНачальное, Состояние", "Количество");
	
	//--
		
	СтрокаВершины = В_JSON(СформироватьМассивВершин(ТЗ_СостоянияВершины));
	СтрокаРебра = В_JSON(СформироватьмассивРебер(ТЗ_СостоянияВершины, ТЗ_СостоянияРебра));
	
	СтруктураДанные = Новый Структура;
	СтруктураДанные.Вставить("СтрокаВершины", СтрокаВершины);
	СтруктураДанные.Вставить("СтрокаРебра", СтрокаРебра);
		
	Возврат СтруктураДанные;
	
КонецФункции

Получаю изменения за период, из них вычисляю заказы и по ним запрашиваю изменения.

В качестве ключей использую индексы строк, т.к. для vis.js нужны числовые ключи.

Получение и обработка данных

Параметр value влияет на размер ребра/вершины, параметр title отображается при наведении на элемент.

Итог:

Относительно просто можно сформировать граф с визуальными дополнениями по данным системы.

Благодарю за внимание.

Буду рад конструктивной критике.

&НаСервере
Функция ПолучитьДанные()
	
	Запрос = Новый Запрос;
	Запрос.Текст = "ВЫБРАТЬ РАЗЛИЧНЫЕ
	               |	ис_СостоянияЗаказовКлиентов.Заказ КАК Ссылка
	               |ПОМЕСТИТЬ втЗаказы
	               |ИЗ
	               |	РегистрСведений.ис_СостоянияЗаказовКлиентов КАК ис_СостоянияЗаказовКлиентов
	               |ГДЕ
	               |	ис_СостоянияЗаказовКлиентов.Период МЕЖДУ &ДатаНачала И &ДатаОкончания
	               |;
	               |
	               |////////////////////////////////////////////////////////////////////////////////
	               |ВЫБРАТЬ
	               |	ис_СостоянияЗаказовКлиентов.Период КАК Период,
	               |	ис_СостоянияЗаказовКлиентов.Заказ КАК Заказ,
	               |	ис_СостоянияЗаказовКлиентов.Состояние КАК Состояние
	               |ИЗ
	               |	РегистрСведений.ис_СостоянияЗаказовКлиентов КАК ис_СостоянияЗаказовКлиентов
	               |ГДЕ
	               |	ис_СостоянияЗаказовКлиентов.Заказ В
	               |			(ВЫБРАТЬ
	               |				втЗаказы.Ссылка КАК Ссылка
	               |			ИЗ
	               |				втЗаказы КАК втЗаказы)
	               |
	               |УПОРЯДОЧИТЬ ПО
	               |	Период
	               |ИТОГИ ПО
	               |	Заказ";
	Запрос.УстановитьПараметр("ДатаНачала", ПериодЗапроса.ДатаНачала);
	Запрос.УстановитьПараметр("ДатаОкончания", ПериодЗапроса.ДатаОкончания);
	РезультатЗапроса = Запрос.Выполнить();
	
	ВыборкаЗаказ = РезультатЗапроса.Выбрать(ОбходРезультатаЗапроса.ПоГруппировкам, "Заказ");

	Возврат ВыборкаЗаказ;
	
КонецФункции

&НаСервере
Процедура СформироватьВершиныИРебра(ВыборкаЗаказ, ТЗ_СостоянияВершины, ТЗ_СостоянияРебра)
	
	Пока ВыборкаЗаказ.Следующий() Цикл
		
		ТекущееСостояние = Неопределено;
		ТекущийПериод = Дата(1,1,1);
		
		ВыборкаСостояния = ВыборкаЗаказ.Выбрать();
		
		Пока ВыборкаСостояния.Следующий() Цикл
			
			Если ТекущийПериод <> Дата(1,1,1) Тогда
				РазницаПериод = (ВыборкаСостояния.Период - ТекущийПериод) / 60;
			Иначе
				РазницаПериод = 0;
			КонецЕсли;
			
			Если ЗначениеЗаполнено(ТекущееСостояние) 
				И НЕ ТекущееСостояние = ВыборкаСостояния.Состояние
				Тогда
				
				СтрР = ТЗ_СостоянияРебра.Добавить();
				СтрР.СостояниеНачальное = ТекущееСостояние;
				СтрР.Состояние = ВыборкаСостояния.Состояние;
				СтрР.Количество = 1;
				
				СтрВ = ТЗ_СостоянияВершины.Добавить();
				СтрВ.Состояние = ТекущееСостояние;
				СтрВ.Время = РазницаПериод;
				
				//-- Добавляю конечный узел
				СтрВ = ТЗ_СостоянияВершины.Добавить();
				СтрВ.Состояние = ВыборкаСостояния.Состояние;
				
			КонецЕсли;
			
			ТекущееСостояние = ВыборкаСостояния.Состояние;
			ТекущийПериод = ВыборкаСостояния.Период;
		КонецЦикла;
		
	КонецЦикла;
	
КонецПроцедуры

&НаСервере
Функция СформироватьМассивВершин(ТЗ_СостоянияВершины)
	
	МассивВершины = Новый Массив;
	
	Для каждого СтрВ Из ТЗ_СостоянияВершины Цикл
		
		СоответствиеВершины = Новый Соответствие;
		СоответствиеВершины.Вставить("id", ТЗ_СостоянияВершины.Индекс(СтрВ) + 1);  
		СоответствиеВершины.Вставить("label", Строка(СтрВ.Состояние));
		СоответствиеВершины.Вставить("value", СтрВ.Время);
		СоответствиеВершины.Вставить("title", СтрВ.Время);
		
		МассивВершины.Добавить(СоответствиеВершины);
		
	КонецЦикла;
	
	Возврат МассивВершины

	
КонецФункции

&НаСервере
Функция СформироватьмассивРебер(ТЗ_СостоянияВершины, ТЗ_СостоянияРебра)
	
	МассивРебра = Новый Массив;
	
	Для каждого СтрР Из ТЗ_СостоянияРебра Цикл
		
		СоответствиеРебра = Новый Соответствие;
		
		ПараметрыОтбора = Новый Структура;
		ПараметрыОтбора.Вставить("Состояние", СтрР.СостояниеНачальное);
		нСтроки = ТЗ_СостоянияВершины.НайтиСтроки(ПараметрыОтбора);
		
		СоответствиеРебра.Вставить("from", ТЗ_СостоянияВершины.Индекс(нСтроки[0]) + 1);  
		
		ПараметрыОтбора = Новый Структура;
		ПараметрыОтбора.Вставить("Состояние", СтрР.Состояние);
		нСтроки = ТЗ_СостоянияВершины.НайтиСтроки(ПараметрыОтбора);
		
		СоответствиеРебра.Вставить("to", ТЗ_СостоянияВершины.Индекс(нСтроки[0]) + 1);
		
		//--
		
		СоответствияСтрокиПараметры = Новый Соответствие;
		СоответствияСтрокиПараметры.Вставить("enabled", Истина);
		СоответствияСтрокиПараметры.Вставить("type", "arrow");
		
		СоответствияСтроки = Новый Соответствие;
		СоответствияСтроки.Вставить("to", СоответствияСтрокиПараметры);
		
		СоответствиеРебра.Вставить("value", СтрР.Количество); 
		СоответствиеРебра.Вставить("title", СтрР.Количество);
		
		СоответствиеРебра.Вставить("arrows", СоответствияСтроки);
		
		//--
		
		МассивРебра.Добавить(СоответствиеРебра);
		
	КонецЦикла;
	
	Возврат МассивРебра;
		
КонецФункции

–

См. также

Управление дашбордами

Работа с интерфейсом Программист Платформа 1С v8.3 Конфигурации 1cv8 Платные (руб)

Обработка предназначена для создания и управления дашбордами.

2400 руб.

29.06.2020 17179 23 4

Настройки управляемых форм (списков, объектов), заполнение реквизитов по условиям, контроль заполнения, доступ [Расширение]

Работа с интерфейсом Платформа 1С v8.3 Управляемые формы 1С:Управление торговлей 11 Россия Платные (руб)

Настройки упр.форм (списков, объектов), заполнение реквизитов по условиям, контроль заполнения, условное оформление, доступ.

1500 руб.

20.02.2018 19852 23 20

Новогоднее оформление для 1С

Работа с интерфейсом Платформа 1С v8.3 1С:Бухгалтерия 3.0 1С:Управление торговлей 11 1С:Зарплата и Управление Персоналом 3.x 1С:Управление нашей фирмой 3.0 Бесплатно (free)

Добавьте новогоднего настроения! Расширение создает декорацию в виде гирлянды на некоторых формах объектов.

27.12.2023 11654 775 elcoan 46

107

Конструктор HTML, CSS и javascript

Инструментарий разработчика Работа с интерфейсом Программист Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

Подходит для создания web-страниц для замены управляемых форм 1С, красивых отчетов, интерфейса мобильного приложения на платформе 1С и для простых страниц веб-сайтов.

2 стартмани

10.04.2023 10192 157 acces969 31

120

Модель состояния для MVC

Работа с интерфейсом Программист Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

"MVC плохо применима в 1С" - познакомьтесь с моделью состояния и, возможно, ваше мнение поменяется! Представленное решение является эволюционным развитием идеи реализации MVC для 1С. В новой версии добавлены DSL для описания модели состояния, а также параметризация свойств параметров и элементов формы.

1 стартмани

05.07.2022 4199 kalyaka 4

Познавательный PowerShell

Языки и среды Системный администратор Программист Бесплатно (free)

Еще немного PowerShell нам в помощь.

13.05.2022 6763 Infostart 18

114

Табло очереди заказов на экран телевизора

WEB-интеграция Работа с интерфейсом Пользователь Платформа 1С v8.3 1С:Розница 2 Платные (руб)

Связка из веб-приложения и расширения для 1С: Розница 2.3.

3600 руб.

29.04.2022 12561 1 8

Условное оформление элементов форм в пользовательском режиме 1С (управление видимостью и доступностью элементов форм)

Работа с интерфейсом Платформа 1С v8.3 Платные (руб)

Подсистема условного оформления элементов форм (далее подсистема) предназначена для настройки оформления элементов форм (видимость, доступность, цвет фона, цвет текста и прочее) в пользовательском режиме 1С. Также подсистему возможно использовать для ограничения доступа к реквизитам формы для определенных пользователей (или групп пользователей).

6000 руб.

18.01.2022 9107 1 2

Комментарии

Подписаться на ответы Инфостарт бот

Свернуть все

1. for_sale 974 30.03.20 07:26 Сейчас в теме

ОБ изменении

2. malikov_pro 1303 30.03.20 09:11 Сейчас в теме

(1) Поправил, благодарю

Оставьте свое сообщение

E-mail:

Автор:

Александр Маликов (malikov_pro)

Рейтинг: 1303

Для получения уведомлений о новых публикациях автора подключите телеграм бот: Инфостарт бот

Публикация:

№ 1217135

Создание 29.03.20 15:00

Обновление 29.03.20 15:00

Статистика:

Просмотры 2818

Загрузки 0

Рейтинг 13

Комментарии 2

Характеристики:

Код открыт Да

Рубрики Работа с интерфейсом Языки и среды

Кому Программист

Тип файла Нет файла

Платформа Платформа 1С v8.3

Конфигурация Конфигурации 1cv8

Операционная система Не имеет значения

Страна Не имеет значения

Отрасль Не имеет значения

Налоги Не имеет значения

Вид учета Не имеет значения

Доступ к файлу Бесплатно (free)