Update

core/bitrix/js/landing/widgetvue/config.php

@@ -8,7 +8,6 @@ return [
 	'css' => 'dist/widgetvue.bundle.css',
 	'js' => 'dist/widgetvue.bundle.js',
 	'rel' => [
-		'landing.backend',
 		'main.core',
 	],
 	'skip_core' => false,

core/bitrix/js/landing/widgetvue/dist/widgetvue.bundle.js

@@ -1,6 +1,6 @@
 /* eslint-disable */
 this.BX = this.BX || {};
-(function (exports,landing_backend,main_core) {
+(function (exports,main_core) {
 	'use strict';
 
 	var _enable = /*#__PURE__*/babelHelpers.classPrivateFieldLooseKey("enable");
@@ -34,6 +34,7 @@ this.BX = this.BX || {};
 	var _useDemoData = /*#__PURE__*/babelHelpers.classPrivateFieldLooseKey("useDemoData");
 	var _blockId = /*#__PURE__*/babelHelpers.classPrivateFieldLooseKey("blockId");
 	var _getFrameContent = /*#__PURE__*/babelHelpers.classPrivateFieldLooseKey("getFrameContent");
+	var _getEngineParams = /*#__PURE__*/babelHelpers.classPrivateFieldLooseKey("getEngineParams");
 	var _getCoreConfigs = /*#__PURE__*/babelHelpers.classPrivateFieldLooseKey("getCoreConfigs");
 	var _getAssetsConfigs = /*#__PURE__*/babelHelpers.classPrivateFieldLooseKey("getAssetsConfigs");
 	var _parseExtensionConfig = /*#__PURE__*/babelHelpers.classPrivateFieldLooseKey("parseExtensionConfig");
@@ -69,6 +70,9 @@ this.BX = this.BX || {};
 	    Object.defineProperty(this, _getCoreConfigs, {
 	      value: _getCoreConfigs2
 	    });
+	    Object.defineProperty(this, _getEngineParams, {
+	      value: _getEngineParams2
+	    });
 	    Object.defineProperty(this, _getFrameContent, {
 	      value: _getFrameContent2
 	    });
@@ -167,67 +171,67 @@ this.BX = this.BX || {};
 	    });
 	  }
 	}
-	function _getFrameContent2() {
+	async function _getFrameContent2() {
 	  let content = '';
+	  const core = await babelHelpers.classPrivateFieldLooseBase(this, _getCoreConfigs)[_getCoreConfigs]();
+	  content += babelHelpers.classPrivateFieldLooseBase(this, _parseExtensionConfig)[_parseExtensionConfig](core.data);
+	  const assets = await babelHelpers.classPrivateFieldLooseBase(this, _getAssetsConfigs)[_getAssetsConfigs]();
+	  content += babelHelpers.classPrivateFieldLooseBase(this, _parseExtensionConfig)[_parseExtensionConfig](assets.data);
+	  content += babelHelpers.classPrivateFieldLooseBase(this, _parseExtensionConfig)[_parseExtensionConfig]({
+	    lang_additional: babelHelpers.classPrivateFieldLooseBase(this, _lang)[_lang]
+	  });
+	  if (babelHelpers.classPrivateFieldLooseBase(this, _style)[_style]) {
+	    content += `<link rel="stylesheet" href="${babelHelpers.classPrivateFieldLooseBase(this, _style)[_style]}">`;
+	  }
+	  const engineParams = await babelHelpers.classPrivateFieldLooseBase(this, _getEngineParams)[_getEngineParams]();
+	  const appInit = `
+			<script>
+				BX.ready(function() {
+					(new BX.Landing.WidgetVue.Engine(
+						${JSON.stringify(engineParams)},
+					)).render();
+				});
+			</script>
+
+			<div id="${babelHelpers.classPrivateFieldLooseBase(this, _uniqueId)[_uniqueId]}">${babelHelpers.classPrivateFieldLooseBase(this, _template)[_template]}</div>
+		`;
+	  content += appInit;
+	  return content;
+	}
+	async function _getEngineParams2() {
 	  const engineParams = {
 	    id: babelHelpers.classPrivateFieldLooseBase(this, _uniqueId)[_uniqueId],
 	    origin: window.location.origin,
 	    fetchable: babelHelpers.classPrivateFieldLooseBase(this, _fetchable)[_fetchable],
 	    clickable: babelHelpers.classPrivateFieldLooseBase(this, _clickable)[_clickable]
 	  };
-	  return babelHelpers.classPrivateFieldLooseBase(this, _getCoreConfigs)[_getCoreConfigs]().then(core => {
-	    content += babelHelpers.classPrivateFieldLooseBase(this, _parseExtensionConfig)[_parseExtensionConfig](core);
-	    content += babelHelpers.classPrivateFieldLooseBase(this, _parseExtensionConfig)[_parseExtensionConfig]({
-	      lang_additional: babelHelpers.classPrivateFieldLooseBase(this, _lang)[_lang]
-	    });
-	    if (babelHelpers.classPrivateFieldLooseBase(this, _style)[_style]) {
-	      content += `<link rel="stylesheet" href="${babelHelpers.classPrivateFieldLooseBase(this, _style)[_style]}">`;
-	    }
-	    return babelHelpers.classPrivateFieldLooseBase(this, _getAssetsConfigs)[_getAssetsConfigs]();
-	  }).then(assets => {
-	    content += babelHelpers.classPrivateFieldLooseBase(this, _parseExtensionConfig)[_parseExtensionConfig](assets);
-	    if (!babelHelpers.classPrivateFieldLooseBase(this, _appAllowedByTariff)[_appAllowedByTariff]) {
-	      throw new Error(main_core.Loc.getMessage('LANDING_WIDGETVUE_ERROR_PAYMENT_MSGVER_1'));
-	    }
+	  if (babelHelpers.classPrivateFieldLooseBase(this, _appAllowedByTariff)[_appAllowedByTariff]) {
 	    if (babelHelpers.classPrivateFieldLooseBase(this, _useDemoData)[_useDemoData]) {
 	      if (!babelHelpers.classPrivateFieldLooseBase(this, _demoData)[_demoData]) {
 	        babelHelpers.classPrivateFieldLooseBase(this, _logger)[_logger].log('Widget haven\'t demo data and can be render correctly');
 	      }
-	      return babelHelpers.classPrivateFieldLooseBase(this, _demoData)[_demoData] || {};
+	      engineParams.data = babelHelpers.classPrivateFieldLooseBase(this, _demoData)[_demoData] || {};
+	    } else {
+	      try {
+	        engineParams.data = await babelHelpers.classPrivateFieldLooseBase(this, _fetchData)[_fetchData]();
+	      } catch (error) {
+	        engineParams.error = error.message || 'error';
+	      }
 	    }
-	    return babelHelpers.classPrivateFieldLooseBase(this, _fetchData)[_fetchData]();
-	  }).then(data => {
-	    engineParams.data = data;
-	  }).catch(error => {
-	    engineParams.error = error.message || 'error';
-	  }).then(() => {
-	    const appInit = `
-					<script>
-						BX.ready(function() {
-							(new BX.Landing.WidgetVue.Engine(
-								${JSON.stringify(engineParams)}
-							)).render();
-						});
-					</script>
-
-					<div id="${babelHelpers.classPrivateFieldLooseBase(this, _uniqueId)[_uniqueId]}">${babelHelpers.classPrivateFieldLooseBase(this, _template)[_template]}</div>
-				`;
-	    content += appInit;
-	    return content;
-	  });
+	  } else {
+	    engineParams.error = main_core.Loc.getMessage('LANDING_WIDGETVUE_ERROR_PAYMENT_MSGVER_1');
+	  }
+	  return engineParams;
 	}
-	function _getCoreConfigs2() {
-	  const extCodes = ['main.core', 'ui.design-tokens'];
-	  const tplCodes = ['bitrix24'];
-	  return landing_backend.Backend.getInstance().action('Block::getAssetsConfig', {
-	    extCodes,
-	    tplCodes
-	  });
+	async function _getCoreConfigs2() {
+	  return main_core.ajax.runAction('landing.vibe.getCoreConfig');
 	}
-	function _getAssetsConfigs2() {
+	async function _getAssetsConfigs2() {
 	  const extCodes = ['landing.widgetvue.engine'];
-	  return landing_backend.Backend.getInstance().action('Block::getAssetsConfig', {
-	    extCodes
+	  return main_core.ajax.runAction('landing.vibe.getAssetsConfig', {
+	    data: {
+	      extCodes
+	    }
 	  });
 	}
 	function _parseExtensionConfig2(ext) {
@@ -252,32 +256,30 @@ this.BX = this.BX || {};
 	  if (babelHelpers.classPrivateFieldLooseBase(this, _useDemoData)[_useDemoData]) {
 	    return Promise.resolve(babelHelpers.classPrivateFieldLooseBase(this, _demoData)[_demoData] || {});
 	  }
-	  return landing_backend.Backend.getInstance().action('RepoWidget::fetchData', {
-	    blockId: babelHelpers.classPrivateFieldLooseBase(this, _blockId)[_blockId],
-	    params
+	  return main_core.ajax.runAction('landing.vibe.fetchData', {
+	    data: {
+	      blockId: babelHelpers.classPrivateFieldLooseBase(this, _blockId)[_blockId],
+	      params
+	    }
 	  }).then(jsonData => {
-	    let data = {};
-	    data = JSON.parse(jsonData);
+	    const data = JSON.parse(jsonData.data || []);
 	    if (data.error) {
 	      throw new Error(data.error);
 	    }
 	    return data;
-	  }).catch(error => {
+	  }).catch(fail => {
 	    const logMessages = [`Fetch data error!\nWidget ID: ${babelHelpers.classPrivateFieldLooseBase(this, _blockId)[_blockId]}`];
 	    if (Object.keys(params) > 0) {
 	      logMessages.push('\nFetch request params:', params);
 	    }
-	    if (main_core.Type.isString(error)) {
-	      logMessages.push(`\nError in JSON data: ${error}`);
-	    } else if (main_core.Type.isObject(error)) {
-	      if (error instanceof Error && error.message) {
-	        logMessages.push(`\nJavaScript error: ${error.message}`);
-	      } else if (error.result && main_core.Type.isArray(error.result) && error.result.length > 0) {
-	        logMessages.push('\nError from backend:');
-	        error.result.forEach(e => {
-	          logMessages.push(e);
-	        });
-	      }
+	    if (main_core.Type.isString(fail)) {
+	      logMessages.push(`\nError in JSON data: ${fail}`);
+	    } else if (main_core.Type.isObject(fail) && 'errors' in fail && main_core.Type.isArray(fail.errors)) {
+	      fail.errors.forEach(error => {
+	        if (error.message !== undefined) {
+	          logMessages.push(`\nJavaScript error: ${error.message}`);
+	        }
+	      });
 	    }
 	    babelHelpers.classPrivateFieldLooseBase(this, _logger)[_logger].log(...logMessages);
 	    throw new Error(main_core.Loc.getMessage('LANDING_WIDGETVUE_ERROR_FETCH'));
@@ -329,5 +331,5 @@ this.BX = this.BX || {};
 
 	exports.WidgetVue = WidgetVue;
 
-}((this.BX.Landing = this.BX.Landing || {}),BX.Landing,BX));
+}((this.BX.Landing = this.BX.Landing || {}),BX));
 //# sourceMappingURL=widgetvue.bundle.js.map

core/bitrix/js/landing/widgetvue/src/widgetvue.js

@@ -1,7 +1,6 @@
 import { WidgetOptions } from './internal/types';
 import { Logger } from './logger';
-import { Backend } from 'landing.backend';
-import { Loc, Text, Type, Dom, Event } from 'main.core';
+import { Dom, Event, Loc, Text, Type, ajax as Ajax } from 'main.core';
 
 import './css/style.css';
 
@@ -96,10 +95,45 @@ export class WidgetVue
 		;
 	}
 
-	#getFrameContent(): Promise<string>
+	async #getFrameContent(): Promise<string>
 	{
 		let content = '';
 
+		const core = await this.#getCoreConfigs();
+		content += this.#parseExtensionConfig(core.data);
+
+		const assets = await this.#getAssetsConfigs();
+		content += this.#parseExtensionConfig(assets.data);
+
+		content += this.#parseExtensionConfig({
+			lang_additional: this.#lang,
+		});
+		if (this.#style)
+		{
+			content += `<link rel="stylesheet" href="${this.#style}">`;
+		}
+
+		const engineParams = await this.#getEngineParams();
+
+		const appInit = `
+			<script>
+				BX.ready(function() {
+					(new BX.Landing.WidgetVue.Engine(
+						${JSON.stringify(engineParams)},
+					)).render();
+				});
+			</script>
+
+			<div id="${this.#uniqueId}">${this.#template}</div>
+		`;
+
+		content += appInit;
+
+		return content;
+	}
+
+	async #getEngineParams(): Promise<Object>
+	{
 		const engineParams = {
 			id: this.#uniqueId,
 			origin: window.location.origin,
@@ -107,103 +141,53 @@ export class WidgetVue
 			clickable: this.#clickable,
 		};
 
-		return this.#getCoreConfigs()
-			.then((core) => {
-				content += this.#parseExtensionConfig(core);
-				content += this.#parseExtensionConfig({
-					lang_additional: this.#lang,
-				});
-
-				if (this.#style)
+		if (this.#appAllowedByTariff)
+		{
+			if (this.#useDemoData)
+			{
+				if (!this.#demoData)
 				{
-					content += `<link rel="stylesheet" href="${this.#style}">`;
+					this.#logger.log('Widget haven\'t demo data and can be render correctly');
 				}
 
-				return this.#getAssetsConfigs();
-			})
-
-			.then((assets) => {
-				content += this.#parseExtensionConfig(assets);
-
-				if (!this.#appAllowedByTariff)
+				engineParams.data = this.#demoData || {};
+			}
+			else
+			{
+				try
 				{
-					throw new Error(Loc.getMessage('LANDING_WIDGETVUE_ERROR_PAYMENT_MSGVER_1'));
+					engineParams.data = await this.#fetchData();
 				}
-
-				if (this.#useDemoData)
+				catch (error)
 				{
-					if (!this.#demoData)
-					{
-						this.#logger.log('Widget haven\'t demo data and can be render correctly');
-					}
-
-					return this.#demoData || {};
+					engineParams.error = error.message || 'error';
 				}
+			}
+		}
+		else
+		{
+			engineParams.error = Loc.getMessage('LANDING_WIDGETVUE_ERROR_PAYMENT_MSGVER_1');
+		}
 
-				return this.#fetchData();
-			})
-
-			.then((data) => {
-				engineParams.data = data;
-			})
-
-			.catch((error) => {
-				engineParams.error = error.message || 'error';
-			})
-
-			.then(() => {
-				const appInit = `
-					<script>
-						BX.ready(function() {
-							(new BX.Landing.WidgetVue.Engine(
-								${JSON.stringify(engineParams)}
-							)).render();
-						});
-					</script>
-
-					<div id="${this.#uniqueId}">${this.#template}</div>
-				`;
-
-				content += appInit;
-
-				return content;
-			})
-		;
+		return engineParams;
 	}
 
-	#getCoreConfigs(): Promise<Object>
+	async #getCoreConfigs(): Promise<Object>
 	{
-		const extCodes = [
-			'main.core',
-			'ui.design-tokens',
-		];
-		const tplCodes = [
-			'bitrix24',
-		];
-
-		return Backend.getInstance()
-			.action(
-				'Block::getAssetsConfig',
-				{
-					extCodes,
-					tplCodes,
-				},
-			)
-		;
+		return Ajax.runAction('landing.vibe.getCoreConfig');
 	}
 
-	#getAssetsConfigs(): Promise<Object>
+	async #getAssetsConfigs(): Promise<Object>
 	{
 		const extCodes = [
 			'landing.widgetvue.engine',
 		];
 
-		return Backend.getInstance()
-			.action(
-				'Block::getAssetsConfig',
-				{ extCodes },
-			)
-		;
+		return Ajax.runAction('landing.vibe.getAssetsConfig', {
+			data: {
+				extCodes,
+			},
+		});
 	}
 
 	#parseExtensionConfig(ext: Object): string
@@ -241,15 +225,14 @@ export class WidgetVue
 			return Promise.resolve(this.#demoData || {});
 		}
 
-		return Backend.getInstance()
-			.action('RepoWidget::fetchData', {
+		return Ajax.runAction('landing.vibe.fetchData', {
+			data: {
 				blockId: this.#blockId,
 				params,
-			})
-
+			},
+		})
 			.then((jsonData) => {
-				let data = {};
-				data = JSON.parse(jsonData);
+				const data = JSON.parse(jsonData.data || []);
 				if (data.error)
 				{
 					throw new Error(data.error);
@@ -258,31 +241,29 @@ export class WidgetVue
 				return data;
 			})
 
-			.catch((error) => {
+			.catch((fail) => {
 				const logMessages = [`Fetch data error!\nWidget ID: ${this.#blockId}`];
 				if (Object.keys(params) > 0)
 				{
 					logMessages.push('\nFetch request params:', params);
 				}
 
-				if (Type.isString(error))
+				if (Type.isString(fail))
 				{
-					logMessages.push(`\nError in JSON data: ${error}`);
+					logMessages.push(`\nError in JSON data: ${fail}`);
 				}
-
-				else if (Type.isObject(error))
+				else if (
+					Type.isObject(fail)
+					&& 'errors' in fail
+					&& Type.isArray(fail.errors)
+				)
 				{
-					if (error instanceof Error && error.message)
-					{
-						logMessages.push(`\nJavaScript error: ${error.message}`);
-					}
-					else if (error.result && Type.isArray(error.result) && error.result.length > 0)
-					{
-						logMessages.push('\nError from backend:');
-						error.result.forEach((e) => {
-							logMessages.push(e);
-						});
-					}
+					fail.errors.forEach(error => {
+						if (error.message !== undefined)
+						{
+							logMessages.push(`\nJavaScript error: ${error.message}`);
+						}
+					});
 				}
 
 				this.#logger.log(...logMessages);
@@ -328,11 +309,11 @@ export class WidgetVue
 			{
 				this.#fetchData(event.data.params)
 					.then((data) => {
-						this.#message('setData', { data }, event.source);
+						this.#message('setData', {data}, event.source);
 					})
 
 					.catch((error) => {
-						this.#message('setError', { error }, event.source);
+						this.#message('setError', {error}, event.source);
 					})
 				;
 			}