@topvisor/ui 1.0.22-test-ci-cd-10 → 1.2.0

package/src/core/utils/date.ts

@@ -0,0 +1,291 @@
+/**
+ * Работа с датами
+ * @packageDocumentation
+ */
+
+import Core from '@/core/core/core';
+import { useI18n } from '@/core/plugins/i18n';
+
+/**
+ * Получить день недели
+ */
+export const getDayOfWeek = (y: number, m: number, d: number): string => {
+	const i18nCalendar = useI18n().Calendar;
+
+	switch ((new Date(y, --m, d)).getDay()) {
+		case 0:
+			return i18nCalendar.Dw_1 + '.';
+		case 1:
+			return i18nCalendar.Dw_2 + '.';
+		case 2:
+			return i18nCalendar.Dw_3 + '.';
+		case 3:
+			return i18nCalendar.Dw_4 + '.';
+		case 4:
+			return i18nCalendar.Dw_5 + '.';
+		case 5:
+			return i18nCalendar.Dw_6 + '.';
+		case 6:
+			return i18nCalendar.Dw_7 + '.';
+		default:
+			return '';
+	}
+};
+
+/**
+ * Преобразовать дату в строку формата Y-m-d H:i:s
+ * @param dateObject - объект Date
+ * @param langFormat - если true, формат даты будет взят из Core.state.dateFormat
+ * @param timeFormat - 0-только дата | 1-дата и часы | 2-дата и часы с минутами | 3-дата и часы с минутами и секундами
+ */
+export const dateToString = (dateObject: Date, langFormat: boolean = true, timeFormat: 0 | 1 | 2 | 3 = 2): string => {
+	let Y = String(dateObject.getFullYear());
+	let d = String(dateObject.getDate()).padStart(2, '0');
+	let m = String(dateObject.getMonth() + 1).padStart(2, '0');
+	let H = String(dateObject.getHours()).padStart(2, '0');
+	let i = String(dateObject.getMinutes()).padStart(2, '0');
+	let s = String(dateObject.getSeconds()).padStart(2, '0');
+
+	let date = Y + '-' + m + '-' + d;
+	if (timeFormat >= 1) date += ' ' + H;
+	if (timeFormat >= 2) date += ':' + i;
+	if (timeFormat === 3) date += ':' + s;
+	if (langFormat) date = dateFormat(date, timeFormat);
+
+	return date;
+};
+
+/**
+ * Получить объект Date из строки
+ * @param date - строка с датой
+ */
+export function stringToDate(date: string): Date {
+	if (date.indexOf('T') === -1) {
+		if (date.length == 10) {
+			date += ' 00:00:00';
+		}
+
+		date = date.replace(' ', 'T') + Core.state.gmt;
+	}
+
+	return new Date(date);
+}
+
+/**
+ * Генерация даты-строки из миллисекунд (UTC), в формате Y-m-d H:i:s
+ * @param timestamp - дата в мс, если не передана, берется дата на момент вызова функции
+ * @param useFormat - если true, формат даты будет взят из Core.state.dateFormat
+ * @param time
+ * - 0: только дата
+ * - 1: дата часы
+ * - 2: дата и часы с минутами
+ * - 3: дата и часы с минутами и секундами
+ * - auto: часы и минуты будут выводиться только, если они не равны нулю
+ */
+export function genDate(timestamp: number | undefined, useFormat: boolean = true, time: 0 | 1 | 2 | 3 | 'auto' = 0): string {
+	if (!timestamp) timestamp = new Date().getTime();
+
+	const dateObject = new Date(timestamp);
+
+	const Y = dateObject.getFullYear();
+	const m = String(dateObject.getMonth() + 1).padStart(2, '0');
+	const d = dateObject.getDate().toString().padStart(2, '0');
+
+	const H = dateObject.getHours().toString().padStart(2, '0');
+	const i = dateObject.getMinutes().toString().padStart(2, '0');
+	const s = dateObject.getSeconds().toString().padStart(2, '0');
+
+	if (time === 'auto') {
+		time = 0;
+		if (dateObject.getHours()) time = 1;
+		if (dateObject.getMinutes()) time = 2;
+		if (dateObject.getSeconds()) time = 3;
+	}
+
+	let date = Y + '-' + m + '-' + d;
+
+	if (time) date += ' ';
+	if (time >= 1) date += H;
+	if (time >= 2) date += ':' + i;
+	if (time >= 3) date += ':' + s;
+
+	if (useFormat) {
+		date = dateFormat(dateObject, time);
+	}
+
+	return date;
+}
+
+/**
+ * Генерация даты-строки (время московское) из миллисекунд (UTC), в формате Y-m-d H:i:s
+ * @param ms - дата в мс, если не передана, берется дата на момент вызова функции
+ * @param langFormat - если true, формат даты будет взят из Core.state.dateFormat
+ */
+export function genDateMoscow(ms: number | undefined, useFormat: boolean = true): string {
+	const time_zone = (new Date().getTimezoneOffset() / 60) * (-1);
+	const dateoffset = time_zone * 60 * 60 * 1000;
+	const moscow_dateoffset = 3 * 60 * 60 * 1000;
+
+	let date: Date;
+	if (ms !== undefined) {
+		date = new Date(ms);
+	} else {
+		date = new Date();
+	}
+
+	date.setTime(date.getTime() - dateoffset + moscow_dateoffset);
+
+	let Y = String(date.getFullYear());
+	let d = String(date.getDate()).padStart(2, '0');
+	let m = String(date.getMonth() + 1).padStart(2, '0');
+	let H = String(date.getHours()).padStart(2, '0');
+	let i = String(date.getMinutes()).padStart(2, '0');
+	let s = String(date.getSeconds()).padStart(2, '0');
+
+	let dateStr = Y + '-' + m + '-' + d + ' ' + H + ':' + i + ':' + s;
+	if (useFormat) {
+		dateStr = dateFormat(dateStr);
+	}
+
+	return dateStr;
+}
+
+/**
+ * Перевод даты в формат пользователя
+ * @param dateMixed - объект даты или строка в формате Y-m-d H:i:s
+ * @param time - 0-только дата | 1-дата и часы | 2-дата и часы с минутами | 3-дата и часы с минутами и секундами
+ * @param dateFormat -
+ * @param emptyValue - значение, которое надо вернуть, если дата не указана
+ */
+export function dateFormat(
+	dateMixed: string | Date,
+	time: 0 | 1 | 2 | 3 = 2,
+	dateFormat?: string,
+	emptyValue?: string,
+): string {
+	if (!emptyValue) emptyValue = useI18n().Common.Not_date;
+
+	if (typeof dateMixed === 'string') {
+		if (!dateMixed || dateMixed.substring(0, 10) === '0000-00-00') {
+			if (emptyValue && emptyValue !== '0000-00-00') {
+				return emptyValue;
+			}
+		}
+	}
+
+	if (!dateMixed) return emptyValue!;
+
+	if (!dateFormat) {
+		dateFormat = Core.state.dateFormat;
+	}
+
+	dateFormat = dateFormat.toLowerCase().replace('m', 'mm').replace('y', 'yy').replace('d', 'dd');
+
+	let date: Date;
+	if (dateMixed instanceof Date) {
+		date = dateMixed;
+	} else {
+		let dateForObj = dateMixed.substring(0, 10);
+		if (dateForObj.length === 7) dateForObj += '-01';
+		dateForObj += ' 00:00';
+		dateForObj = dateForObj.replace(/-/g, '/'); // safari fix
+
+		date = new Date(dateForObj);
+		if (isNaN(Number(date))) return emptyValue!;
+	}
+
+	let result = '';
+
+	if (dateFormat && window['$']) {
+		result = $.datepicker.formatDate(dateFormat, date);
+	}
+
+	if (time && typeof dateMixed === 'string' && dateMixed.length > 10 || time && dateMixed instanceof Date) {
+		let timeStr: string = '';
+		if (dateMixed instanceof Date) {
+			timeStr = new Date().toLocaleTimeString('en-US', {
+				hour12: false,
+				hour: 'numeric',
+				minute: time >= 2 ? 'numeric' : undefined,
+				second: time >= 3 ? 'numeric' : undefined,
+			});
+		} else {
+			switch (time) {
+				// часы
+				case 1:
+					timeStr = dateMixed.substring(11, 13);
+
+					break;
+				// часы и минуты
+				case 2:
+					timeStr = dateMixed.substring(11, 16);
+
+					break;
+				// часы, минуты и секунды
+				case 3:
+					timeStr = dateMixed.substring(11, 19);
+
+					break;
+			}
+		}
+
+		result += ' ' + timeStr;
+	}
+
+	result = result.trim();
+
+	return result;
+}
+
+/**
+ * Перевод даты из формата пользователя в системный формат Y-m-d H:i:s
+ * @param date - строка с датой
+ * @param emptyValue - значение, которое надо вернуть, если дата не указана
+ */
+export function dateUnformat(date: string, emptyValue?: string): string {
+	if (!emptyValue) emptyValue = useI18n().Common.Not_date;
+
+	if (!date) {
+		return emptyValue!;
+	}
+
+	if (date.match(/\d\d\d\d-\d\d-\d\d/)) {
+		return date;
+	}
+
+	const dateFormat = Core.state.dateFormat.toLowerCase();
+
+	const dateChunks = date.split(/\W/);
+	const dateFormatChunks = dateFormat.split(/\W/);
+
+	let d = '';
+	let m = '';
+	let y = '';
+
+	dateFormatChunks.forEach((type, index) => {
+		switch (type) {
+			case 'd':
+				d = dateChunks[index];
+
+				break;
+			case 'm':
+				m = dateChunks[index];
+
+				break;
+			case 'y':
+				y = dateChunks[index];
+
+				break;
+		}
+	});
+
+	let result = y + '-' + m + '-' + d;
+
+	if (!result.match(/\d\d\d\d-\d\d-\d\d/)) {
+		console.info('Неверный формат даты, будет возращена текущая дата, ' + result);
+
+		result = genDate((new Date()).getTime(), false).substring(0, 10);
+	}
+
+	return result;
+}

package/src/core/utils/device.ts

@@ -0,0 +1,139 @@
+/**
+ * Получение информации об устройстве
+ * @packageDocumentation
+ */
+
+/**
+ * Определить, увеличинная ли плотность пикселей у экрана (DPR > 1)
+ */
+export function isRetina(): boolean {
+	return ('devicePixelRatio' in window && window.devicePixelRatio > 1);
+}
+
+/**
+ * Определить, является ли устройство мобильным
+ */
+export function isMobile(): boolean {
+	return !!navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|IEMobile|Opera Mini/i);
+}
+
+/**
+ * Определить, открыт ли сайт в приложении
+ */
+export function isApp(): boolean {
+	return (navigator.userAgent.indexOf('Topvisor_App') != -1);
+}
+
+/**
+ * Определить, является ли OS пользователя macOS
+ */
+export function isMacOS(): boolean {
+	return navigator.userAgent.indexOf('Mac OS X') !== -1;
+}
+
+/**
+ * Определить, является ли текущий браузер пользователя Safari
+ */
+export function isSafari(): boolean {
+	const isChrome = /Chrome|Android/.test(navigator.userAgent);
+
+	let isSafari = /Safari/.test(navigator.userAgent);
+	if (isChrome && isSafari) {
+		isSafari = false;
+	}
+
+	return isSafari;
+}
+
+/**
+ * Вернуть текст для обозначения клавиши Ctrl / Command в зависимости от OS
+ */
+export function getCommandKeyLabel(): 'Ctrl' | '⌘' {
+	if (isMacOS()) {
+		return '⌘';
+	} else {
+		return 'Ctrl';
+	}
+}
+
+/**
+ * Вернуть скролл с учетом устройства
+ */
+export const getScrollTop = (): number | undefined => {
+	return $(document).scrollTop();
+};
+
+/**
+ * Вернуть контейнеры со скроллом (требует jquery)
+ */
+export const get$scroll = (): JQuery<Document> => {
+	return $(document);
+};
+
+/**
+ * Вернуть контейнеры со скроллом (без jquery)
+ */
+export const getElsScroll = (): Document[] => {
+	return [document];
+};
+
+/**
+ * Получить операционную систему пользователя
+ *
+ * Не определяет Windows 11, см. getOSAsync()
+ */
+export const getOS = (): string => {
+	const os: [string, RegExp][] = [
+		['iOS', /(iPhone|iPad)/i],
+		['Android', /(Android)/i],
+		['Windows Phone', /(IEMobile)/i],
+		['Windows 3.11', /Win16/i],
+		['Windows 95', /(Windows 95)|(Win95)|(Windows_95)/i],
+		['Windows 98', /(Windows 98)|(Win98)/i],
+		['Windows 2000', /(Windows NT 5.0)|(Windows 2000)/i],
+		['Windows XP', /(Windows NT 5.1)|(Windows XP)/i],
+		['Windows Server 2003', /(Windows NT 5.2)/i],
+		['Windows Vista', /(Windows NT 6.0)/i],
+		['Windows 7', /(Windows NT 6.1)/i],
+		['Windows 8', /(Windows NT 6.[23])|(Windows 8)/i],
+		['Windows 10', /(Windows NT 10)/i],
+		['Windows NT 4.0', /(Windows NT 4.0)|(WinNT4.0)|(WinNT)|(Windows NT)/i],
+		['Windows ME', /Windows ME/i],
+		['Windows', /Windows/i],
+		['Open BSD', /OpenBSD/i],
+		['Sun OS', /SunOS/i],
+		['Linux', /(Linux)|(X11)/i],
+		['Macintosh', /(Mac_PowerPC)|(Macintosh)|(Mac OS X 10.4)|(Mac OS X 10.5)|(Mac OS X 10.6)/i],
+		['QNX', /QNX/i],
+		['BeOS', /BeOS/i],
+		['OS/2', /OS\/2/i],
+	];
+
+	let res = '';
+	for (let i = 0; i < os.length; i++) {
+		if (os[i][1].test(navigator.userAgent)) {
+			res = os[i][0];
+
+			break;
+		}
+	}
+
+	return res;
+};
+
+/**
+ * Получить операционную систему пользователя, в том числе Windows 11
+ */
+export const getOSAsync = async (): Promise<string> => {
+	let os = getOS();
+
+	if (os === 'Windows 10') {
+		// @ts-ignore - experimental technology
+		const platformVersion = await navigator?.userAgentData?.getHighEntropyValues(['platformVersion']);
+		if (platformVersion && platformVersion.platformVersion >= '13') {
+			os = 'Windows 11';
+		}
+	}
+
+	return os;
+};

package/src/core/utils/dom.ts

@@ -0,0 +1,182 @@
+/**
+ * Работа с Document Object Model (DOM)
+ * @packageDocumentation
+ */
+
+/**
+ * Создать элемент
+ * @param tagName
+ * @param attrs - атрибуты
+ * @param elsChildrens
+ * @returns - созданный элемент
+ */
+export function genEl(tagName: string, attrs?: Record<string, string>, ...elsChildrens: HTMLElement[] | string[]): HTMLElement {
+	const el: any = document.createElement(tagName);
+
+	for (const name in attrs) {
+		if (name.indexOf('on') === 0) {
+			// events
+			el[name] = attrs[name];
+		} else {
+			el.setAttribute(name, attrs[name]);
+		}
+	}
+
+	elsChildrens.forEach((elChildren: HTMLElement | string) => {
+		if (typeof (elChildren) === 'string') {
+			el.insertAdjacentHTML('beforeend', elChildren);
+		} else {
+			el.append(elChildren);
+		}
+	});
+
+	return el;
+}
+
+/**
+ * Проверить видимость элемента
+ * @param el
+ * @returns - вернет true, если элемент считается видимым
+ */
+export function isVisible(el?: HTMLElement): boolean {
+	if (!el) {
+		return false;
+	}
+
+	const boundingClientRect = el.getBoundingClientRect();
+	return !!(boundingClientRect.width || boundingClientRect.height);
+}
+
+/**
+ * Получить координаты элемента относительно документа
+ * @param el
+ * @returns - координаты элемента относительно документа
+ */
+export function offset(el: HTMLElement): { top: number, left: number } {
+	const boundingClientRect = el.getBoundingClientRect();
+
+	return {
+		top: boundingClientRect.top + window.scrollY,
+		left: boundingClientRect.left + window.scrollX,
+	};
+}
+
+/**
+ * Получить значение css свойства элемента
+ * @param el
+ * @param property - имя свойства
+ * @return - значение css стиля
+ */
+export function css(el: HTMLElement, property: string): string {
+	return window.getComputedStyle(el).getPropertyValue(property);
+}
+
+/**
+ * Обернуть элемент и вернуть только что созданный элемент
+ * @param el - элемент, который требуется обернуть
+ * @param tagName - имя тега элемента, в который треубется обернуть элемент
+ */
+export function wrap(el: HTMLElement, tagName: string): HTMLElement {
+	const elWrapper = document.createElement(tagName);
+	el.after(elWrapper);
+
+	elWrapper.append(el);
+
+	return elWrapper;
+}
+
+/**
+ * Найти и вернуть первый видимый элемент
+ * @param el - корневой элемент поиска
+ * @param selectors - см. параметр selectors в Document.querySelectorAll()
+ */
+export function querySelectorVisible(el: HTMLElement, selectors: string): HTMLElement | null {
+	return querySelectorAllArray(el, selectors).find(isVisible) || null;
+}
+
+/**
+ * Найти и вернуть последний видимый элемент
+ * @param el - корневой элемент поиска
+ * @param selectors - см. параметр selectors в Document.querySelectorAll()
+ */
+export function querySelectorVisibleLast(el: HTMLElement, selectors: string): HTMLElement | null {
+	return querySelectorAllArray(el, selectors).findLast(isVisible) || null;
+}
+
+/**
+ * Найти видимые элементы
+ * @param el - корневой элемент поиска
+ * @param selectors - см. параметр selectors в Document.querySelectorAll()
+ */
+export function querySelectorAllVisible(el: HTMLElement | Document, selectors: string): HTMLElement[] {
+	return querySelectorAllArray(el, selectors).filter(isVisible);
+}
+
+/**
+ * Найти элементы и вернуть в виде массива
+ * @param el - корневой элемент поиска
+ * @param selectors - см. параметр selectors в Document.querySelectorAll()
+ */
+export function querySelectorAllArray(el: HTMLElement | Document, selectors: string): HTMLElement[] {
+	if (!el) {
+		return [];
+	}
+
+	return [...el.querySelectorAll(selectors)] as HTMLElement[];
+}
+
+/**
+ * Хранилище данных элемента
+ * @param el
+ * @param contextName - контекст, обычно используется имя компонента
+ * @param contextData - установить объект с данными, предыдущие данные будут заменены, установите null для удаления данных
+ * @returns - вернет объект контекста или undefined, если данные контекста не найдены
+ */
+export function storage(
+	el?: HTMLElement & { topData?: any },
+	contextName: string = 'common',
+	contextData: object | null | undefined = undefined,
+): any | undefined {
+	if (!el) {
+		return;
+	}
+
+	if (!el.topData) {
+		el.topData = {};
+	}
+
+	if (contextData) {
+		el.topData[contextName] = contextData;
+	}
+
+	if (contextData === null) {
+		delete el.topData[contextName];
+	}
+
+	return el.topData[contextName];
+}
+
+/**
+ * Очистить хранилище элемента
+ */
+export function storageClear(el?: HTMLElement & { topData?: any }): void {
+	if (!el) {
+		return;
+	}
+
+	delete el.topData;
+}
+
+export default {
+	genEl,
+	isVisible,
+	offset,
+	css,
+	wrap,
+	querySelectorVisible,
+	querySelectorVisibleLast,
+	querySelectorAllVisible,
+	querySelectorAllArray,
+	storage,
+	storageClear,
+};

package/src/core/utils/image.ts

@@ -0,0 +1,46 @@
+/**
+ * Работа с изображениями
+ * @packageDocumentation
+ */
+
+import punycode from 'punycode';
+
+/**
+ * Скачать изображение, переданное в виде строки
+ * @param imageStr - адресс картинки
+ * @param imageName - имя файла при загрузке, по умолчанию download
+ */
+export const downloadImageFromString = (imageStr: string, imageName: string = 'download'): void => {
+	const a = document.createElement('a');
+	a.download = imageName;
+	a.href = imageStr;
+	a.click();
+};
+
+/**
+ * Сгенерировать html картинку с фавиконкой сайта
+ * @param url - адрес сайта
+ * @param isBig - если true, картинка будет 120px, иначе 32px
+ */
+export const genFaviconImgHtml = (url: string, isBig: boolean): string => {
+	let size = 32;
+	if (isBig) size = 120;
+
+	url = url.replace(/^\w+:\/\/|^www\.|\/.*/g, '');
+	url = punycode.toASCII(url);
+
+	const onloadAttr = `
+		onload="
+			var that = this;
+			$.ajax({
+				type:'get',
+				url:this.src,
+				success:function(res){ if(res.length > 100) that.className='top-favicon'; },
+				error:function(){ }
+			});
+		"
+	`;
+
+	//	return '<img src="https://www.google.com/s2/favicons?domain=' + url + '" class="top-favicon empty"> ' + onloadAttr + '>';
+	return '<img src="https://favicon.yandex.net/favicon/' + url + '?size=' + size + '" class="top-favicon empty" ' + onloadAttr + ' alt="">';
+};

package/src/core/utils/keyboard.ts

@@ -0,0 +1,29 @@
+/**
+ * Утилиты для работы с устройствами ввода
+ * @packageDocumentation
+ */
+
+/**
+ * Перевод строки в другую раскладку
+ */
+export const invertKeyboardLayout = (string: string): string => {
+	const a1 = 'qwertyuiop[]asdfghjkl;\'zxcvbnm,./QWERTYUIOP{}ASDFGHJKL;"ZXCVBNM<>?';
+	const a2 = 'йцукенгшщзхъфывапролджэячсмитьбю.ЙЦУКЕНГШЩЗХЪФЫВАПРОЛДжЭЯЧСМИТЬБЮ,';
+	let indexFinded: number;
+
+	const chars: Array<string> = string.split('');
+	chars.forEach((char: string, index: number) => {
+		indexFinded = a1.indexOf(char);
+		if (indexFinded !== -1) {
+			chars[index] = a2[indexFinded];
+		} else {
+			indexFinded = a2.indexOf(char);
+			if (indexFinded !== -1) {
+				chars[index] = a1[indexFinded];
+			}
+		}
+	});
+	string = chars.join('');
+
+	return string;
+};

package/src/core/utils/lodash.ts

@@ -0,0 +1,18 @@
+/**
+ * Сборка lodash только с необходимыми функциями
+ * @packageDocumentation
+ */
+
+import debounce from 'lodash-es/debounce.js';
+import cloneDeep from 'lodash-es/cloneDeep.js';
+import memoize from 'lodash-es/memoize.js';
+import throttle from 'lodash-es/throttle.js';
+import merge from 'lodash-es/merge.js';
+
+export {
+	debounce,
+	cloneDeep,
+	memoize,
+	throttle,
+	merge,
+};