Отображение маски загрузки

Коллеги, всем доброго времени суток, нужна помощь.

Необходимо добавить маску загрузки на страницу редактирования.

Пробовал разными способами.

this.showBodyMask();

также пробовал в зависимости карточки добавлять MaskHelper, и далее в коде вызывать MaskHelper.ShowBodyMask() - не срабатывает

 

так же пробовал следующим образом  - var maskId = this.Terrasoft.controls.Mask.show(this);

 так же не работает.

 страница наследуется от Базовая схема карточки ( NUI ).

Ниже приведен код карточки:

define("AbReportSettingsPageV2", ["AbReportSettingsPageV2Resources", "BaseFiltersGenerateModule", "ServiceHelper"], 
	function(Resources, BaseFiltersGenerateModule, ServiceHelper) {
	return {
		entitySchemaName: "AbCustomReport",
		details: /**SCHEMA_DETAILS*/{}/**SCHEMA_DETAILS*/,
		modules: /**SCHEMA_MODULES*/{}/**SCHEMA_MODULES*/,
		dataModels: /**SCHEMA_DATA_MODELS*/{}/**SCHEMA_DATA_MODELS*/,
		attributes: {
			"AbDateFrom":{
				"dataValueType": Terrasoft.DataValueType.DATE,
				"type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
				"isRequired": true
			},
			"AbDateBy":{
				"dataValueType": Terrasoft.DataValueType.DATE,
				"type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
				"isRequired": true
			},
			"AbCustomReport": {
				"dataValueType": Terrasoft.DataValueType.LOOKUP,
				"type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
				"isLookup": true,
				"referenceSchemaName":"AbCustomReport",
				"isRequired": true
			},
			"City": {
				"dataValueType": Terrasoft.DataValueType.LOOKUP,
				"type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
				"isLookup": true,
				"referenceSchemaName":"City",
			},
			"Country": {
				"dataValueType": Terrasoft.DataValueType.LOOKUP,
				"type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
				"isLookup": true,
				"referenceSchemaName":"Country",
			},
			"Service": {
				"dataValueType": Terrasoft.DataValueType.LOOKUP,
				"type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
				"isLookup": true,
				"referenceSchemaName":"Product",
			}
		},
		diff: /**SCHEMA_DIFF*/[
			{
				"operation": "merge",
				"name": "SaveButton",
				"values": {
					"caption": "$Resources.Strings.AbLoadReportCaption",
					"visible": true
				}
			},
			{
				"operation": "merge",
				"name": "BackButton",
				"values": {
					"visible": true
				}
			},
			{
				"operation": "remove",
				"name": "actions"
			},
			{
				"operation": "remove",
				"name": "Tabs"
			},
			{
				"operation": "remove",
				"name": "PrintButton"
			},
			{
				"operation": "remove",
				"name": "OptionsButtonButton"
			},
			{
				"operation": "insert",
				"name": "AbReportSettingsContainer",
				"parentName": "CardContentContainer",
				"propertyName": "items",
				"values": {
					"itemType": Terrasoft.ViewItemType.CONTAINER,
					"items": [],
					"markerValue": "AbReportSettingsContainer"
				}
			},
			{
				"operation": "insert",
				"name": "AbReportSettingsGridLayoutContainer",
				"parentName": "AbReportSettingsContainer",
				"propertyName": "items",
				"values": {
					"itemType": Terrasoft.ViewItemType.GRID_LAYOUT,
					"items": []
				}
			},
			{
				"operation": "insert",
				"name": "AbDateFrom",
				"values": {
					"layout": {
						"colSpan": 8,
						"rowSpan": 1,
						"column": 0,
						"row": 0,
						"layoutName": "AbReportSettingsGridLayoutContainer"
					},
					"caption": "$Resources.Strings.AbDateFromCaption",
					"bindTo": "AbDateFrom",
					"enabled": true
				},
				"parentName": "AbReportSettingsGridLayoutContainer",
				"propertyName": "items",
				"index": 0
			},
			{
				"operation": "insert",
				"name": "AbDateBy",
				"values": {
					"layout": {
						"colSpan": 8,
						"rowSpan": 1,
						"column": 0,
						"row": 2,
						"layoutName": "AbReportSettingsGridLayoutContainer"
					},
					"caption": "$Resources.Strings.AbDateByCaption",
					"bindTo": "AbDateBy",
					"enabled": true
				},
				"parentName": "AbReportSettingsGridLayoutContainer",
				"propertyName": "items",
				"index": 1
			},
			{
				"operation": "insert",
				"name": "AbCustomReport",
				"values": {
					"layout": {
						"colSpan": 8,
						"rowSpan": 1,
						"column": 0,
						"row": 4,
						"layoutName": "AbReportSettingsGridLayoutContainer"
					},
					"caption": "$Resources.Strings.AbReportCaption",
					"bindTo": "AbCustomReport",
					"enabled": true,
					"contentType": 3
				},
				"parentName": "AbReportSettingsGridLayoutContainer",
				"propertyName": "items",
				"index": 2
			},
			{
				"operation": "insert",
				"name": "City",
				"values": {
					"layout": {
						"colSpan": 8,
						"rowSpan": 1,
						"column": 8,
						"row": 0,
						"layoutName": "AbReportSettingsGridLayoutContainer"
					},
					"caption": "$Resources.Strings.AbCityCaption",
					"bindTo": "City",
					"enabled": true,
					"contentType": 5
				},
				"parentName": "AbReportSettingsGridLayoutContainer",
				"propertyName": "items",
				"index": 3
			},
			{
				"operation": "insert",
				"name": "Country",
				"values": {
					"layout": {
						"colSpan": 8,
						"rowSpan": 1,
						"column": 8,
						"row": 2,
						"layoutName": "AbReportSettingsGridLayoutContainer"
					},
					"caption": "$Resources.Strings.AbCountryCaption",
					"bindTo": "Country",
					"enabled": true,
					"contentType": 5
				},
				"parentName": "AbReportSettingsGridLayoutContainer",
				"propertyName": "items",
				"index": 4
			},
			{
				"operation": "insert",
				"name": "Service",
				"values": {
					"layout": {
						"colSpan": 8,
						"rowSpan": 1,
						"column": 8,
						"row": 4,
						"layoutName": "AbReportSettingsGridLayoutContainer"
					},
					"caption": "$Resources.Strings.AbServiceCaption",
					"bindTo": "Service",
					"enabled": false,
					"contentType": 5
				},
				"parentName": "AbReportSettingsGridLayoutContainer",
				"propertyName": "items",
				"index": 5
			}
		]/**SCHEMA_DIFF*/,
		methods: {
			onEntityInitialized: function () {
				this.callParent(arguments);
				this.set("Name", this.getHeader());
				this.getCurrentContactCountry();
 
			},
			save: function() {
				this.runReportForming();
			},
			getCurrentContactCountry: function () {
				var currentContactId = Terrasoft.SysValue.CURRENT_USER_CONTACT.value;
				var esq = this.Ext.create("Terrasoft.EntitySchemaQuery", {
					rootSchemaName: "Contact"
				});
				esq.addColumn("Country", "CountryId");
				esq.getEntity(currentContactId, function(result) {
					if (!result.success) {
						this.showInformationDialog(Resources.localizableStrings.AbCurrentUserCountryError);
						return;
					}
					var country = result.entity.get("CountryId");
					if(country!== null || country!== undefined) {
						this.set("Country", country);
					}
				},this)
			},
			runReportForming: function () {
				var startDate = this.get("AbDateFrom");
				var stopDate = this.get("AbDateBy");
				var report = this.get("AbCustomReport");
				var country = this.get("Country");
				var city = this.get("City");
				var service = this.get("Service");
				if(startDate === null || startDate === undefined) {
					this.showInformationDialog(Resources.localizableStrings.AbFillDateStartCaption);
					return;
				}
				if(stopDate === null || stopDate === undefined) {
					this.showInformationDialog(Resources.localizableStrings.AbFillDateStartCaption);
					return;
				}
				if(startDate > stopDate){
					this.showInformationDialog(Resources.localizableStrings.AbIntervalDateWarningCaption);
					return;
				}
				if(report === null || report === undefined) {
					this.showInformationDialog(Resources.localizableStrings.AbFillReportCaption);
					return;
				}
				if(report.value == "c77af1b5-7118-40c7-8636-870edb85d45f" && (city === null || city === undefined)) {
					this.showInformationDialog(Resources.localizableStrings.AbFiillCityWarningCaption);
					return;
				}
				var reportId = report.value;
				countryId = (country === null || country === undefined) ? null : country.value;
				cityId = (city === null || city === undefined) ? null : city.value;
				serviceId = (service === null || service === undefined) ? null : service.value;
 
				var dateStart = Ext.Date.format(startDate, 'Y-m-d');
				var dateStop = Ext.Date.format(stopDate, 'Y-m-d');
				var dataSend = {
					startDate: dateStart,
					stopDate: dateStop,
					reportId: reportId,
					countryId: countryId,
					cityId: cityId,
					serviceId: serviceId
				};
				this.getReportServices(dataSend);
			},
			getReportServices: function(dataSend) {
				var reportId = dataSend.reportId;
				var esq = this.Ext.create("Terrasoft.EntitySchemaQuery", {
					rootSchemaName: "AbCustomReport"
				});
				esq.addColumn("Name", "ReportName");
				esq.addColumn("AbSourceCodeServiceName", "SourceCodeServiceName");
				esq.getEntity(reportId, function(result) {
					if (!result.success) {
						this.showInformationDialog("Ошибка запроса данных");
						return;
					}
					var reportName =  result.entity.get("ReportName");
					var sourceCodeName =  result.entity.get("SourceCodeServiceName");
					this.downloadReport(sourceCodeName, reportName, dataSend);
				}, this);
			},
			downloadReport: function(sourceCodeName, reportName, dataSend) {
				debugger;
				this.showBodyMask();
				Terrasoft.AjaxProvider.request({
					url: "../rest/" + sourceCodeName + "/GetReportUrl",
					headers: {
						"Accept": "application/json",
						"Content-Type": "application/json"
					},
					method: "POST",
					jsonData: dataSend,
					callback: function (request, success, response) {
						var responseObject = {};
						if (success) {
							responseObject = Terrasoft.decode(response.responseText);
							var key = "/" + responseObject.GetReportUrlResult;
							var reportCaption = reportName + ".xlsx";
							var report = document.createElement("a");
							report.href = "../rest/" + sourceCodeName + "/GenerateSalaryReport" + key;
							report.download = reportCaption;
							document.body.appendChild(report);
							report.click();
							document.body.removeChild(report);
						}
						this.hideBodyMask();
					}, scope: this
				});
			},
			getHeader: function() {
				return Resources.localizableStrings.AbPageSettingsCaption;
			}
		},
		rules: {},
		businessRules: /**SCHEMA_BUSINESS_RULES*/{}/**SCHEMA_BUSINESS_RULES*/
	};
});

 

Нравится

11 комментариев

Добрый день.

Для вызова маски из this необходимо проверить, не потерялся ли контекст где-то по стэку вызова.  При правильном this метод showBodyMask(); должен работать.

Для вызова из MaskHelper необходимо модуль подключить в define.

define("AbReportSettingsPageV2", ["AbReportSettingsPageV2Resources", "BaseFiltersGenerateModule", "ServiceHelper", "MaskHelper"], 
	function(Resources, BaseFiltersGenerateModule, ServiceHelper, MaskHelper) 

В консоли ошибки есть?

Пащенко Александр Сергеевич,

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

Нигрескул Алексей,

попробуйте так:

 

var maskId = Terrasoft.MaskHelper.showBodyMask();

Terrasoft.MaskHelper.hideBodyMask(maskId);

 

Нигрескул Алексей,

Страница настроек случайно не в SystemDesigner вставлена?

Варфоломеев Данила,

Да, туда.

Есть какие то особенности в данной реализации?

Нигрескул Алексей,

Ну как сказать. Я уперся в те же самые проблемы, перепробовал все способы, маска так и не заработала. Убил часа 3, потом просто плюнул на это дело. Только в дизайнере такой бред происходит.

Принял, благодарю. А ТП ничего не говорит по данному поводу?

Cм. пример использования showBodyMask и hideBodyMask. 

Зверев Александр,

Все перепробовал - не работает.

Может, на самом деле маска показывается, но сразу скрывается другим процессом.

Показать все комментарии