Добрый день!
Есть небольшая задача:
1) по нажатию кнопки открывается всплывающее окно с возможностью оставить комментарии в ленту
2) после нажатия ОК - окно закрывается и комментарий добавляется в ленту этого объекта
Пока просто даже не представляю с какой стороны подойти к выполнению этого кейса. Кнопку реализовал и она работает, надо именно процесс отображения окна и сохранение комментария прописать.
По примеру, понимаю что можно сделать обычное модальное окно, но используя обычный пример выдается ошибка: ModalBox.show is not a function
Единственное где используется:
var renderTo = ModalBox.show(config, function()
{sandbox.unloadModule(moduleId, renderTo); });Или пример корявый или где-то что-то надо еще делать. Сам пример: https://community.terrasoft.ru/articles/prosteisee-modalnoe-okno-modalb…
Нравится
10 комментариев
Лучший ответ
8 октября 2018 16:56
2) Как то так значение полей подберите сами
var insert = Ext.create("Terrasoft.InsertQuery", {
rootSchemaName: "SocialMessage"
});
insert.setParameterValue("Message", data.message, Terrasoft.DataValueType.TEXT);
if (data.entityId) {
insert.setParameterValue("EntitySchemaUId", data.entitySchemaId, Terrasoft.DataValueType.GUID);
insert.setParameterValue("EntityId", data.entityId, Terrasoft.DataValueType.GUID);
}
insert.execute(function(result) {
if (result.success) {
//чтото делаем если успешно добавлена запись
});
}
5 октября 2018 09:29
Могу предложить по сути то же, что и в той теме, но чуть более расписанное, для понимания:
Модальное окно состоит из 3 частей.
Часть 1.
Указываем define
define("DocumentPageV2", ["ServiceHelper", "ModalBox", "ModalBoxSchemaModule"],
function(ServiceHelper, ModalBox, resources) {
Вызов данного окна в нужной нам части:
Вызываем например по кнопке.
{
"operation": "insert",
"name": "createActivity",
"values": {
"itemType": 5,
"visible": true,
"caption": "Создать активности",
"click": {
"bindTo": "createActivity"
},
"layout": {
"column": 2,
"row": 1,
"colSpan": 1
}
},
"parentName": "ActionDashboardContainer",
"propertyName": "items",
"index": 0
},
Затем в самом методе вызываем окно, так же можно повесить дополнительный функционал:
onMyClick: function() {
this.openTransactionPage();
},
добавляем методы:
openTransactionPage: function() {
this.sandbox.loadModule("ModalBoxSchemaModule", {
id: this.getTransactionPageId()
});
},
getTransactionPageId: function() {
return this.sandbox.id + "_OpModalPageDateTO";
}
subscribeSandboxEvents: function() {
debugger;
this.callParent(arguments);
this.sandbox.subscribe("DataFromModal", function(arg) {
console.log("msg from modal: " + arg.test);
}, this, [this.sandbox.id + "_" + "OpModalBoxSchemaModule"]);
this.sandbox.subscribe("ButtonClose", function() {
var moduleName = "OpModalBoxSchemaModule";
var moduleId = this.sandbox.id + "_" + moduleName;
var config = {
heightPixels: 420,
widthPixels: 750
};
var renderTo = ModalBox.show(config, function() {
sandbox.unloadModule(moduleId, renderTo);
});
this.sandbox.unloadModule(moduleId, renderTo);
this.sandbox.unsubscribePtp("ButtonClose");
ModalBox.close(true);
}, this, [this.getTransactionPageId()]);
this.sandbox.subscribe("GetModuleInfo", function() {
return {
schemaName: "OpModalPageDateTO"
};
}, this, [this.getTransactionPageId()]);
},
onEntityInitialized: function() {
this.callParent(arguments);
},
Часть 2.
Создаем новый модуль. Наследуемся от "Базовый модуль схемы ( NUI )"
define("OpModalBoxSchemaModule", ["ModalBox", "BaseSchemaModuleV2"],
function(ModalBox) {
Ext.define("Terrasoft.configuration.OpModalBoxSchemaModule", {
extend: "Terrasoft.BaseSchemaModule",
alternateClassName: "Terrasoft.OpModalBoxSchemaModule",
messages: {
"ButtonClose": {
"mode": this.Terrasoft.MessageMode.PTP,
"direction": this.Terrasoft.MessageDirectionType.SUBSCRIBE
}
},
CloseModalBox: function() {
this.callParent(arguments);
},
subscribeSandboxEvents: function() {
this.callParent(arguments);
this.sandbox.subscribe("ButtonClose", function() {
this.sandbox.unloadModule("ModalBoxSchemaModule");
}, this, [this.getTransactionPageId()]);
},
init: function() {
this.callParent(arguments);
},
/**
* @inheritDoc Terrasoft.BaseSchemaModule#generateViewContainerId
* @overridden
*/
generateViewContainerId: false,
/**
* @inheritDoc Terrasoft.BaseSchemaModule#initSchemaName
* @overridden
*/
initSchemaName: function() {
this.subscribeSandboxEvents();
this.schemaName = "OpDateTO";
},
/**
* @inheritDoc Terrasoft.BaseSchemaModule#initHistoryState
* @overridden
*/
initHistoryState: Terrasoft.emptyFn
});
return Terrasoft.OpModalBoxSchemaModule;
});
Часть 3. Создаем карточку модального окна, которое мы увидим, при вызове.
В качестве родителя для модуля указываем "Базовая схема модального окна ( NUI )"
Так же, необходимо создавать свои контейнеры, чтобы в них размещать необходимые нам поля.
define("OpModalPageDateTO", ["ServiceHelper", "ModalBox"], function(ServiceHelper, ModalBox) {
return {
entitySchemaName: "OpDateTO",
details: /**SCHEMA_DETAILS*/{}/**SCHEMA_DETAILS*/,
diff: /**SCHEMA_DIFF*/[
{
"operation": "insert",
"index": 0,
"name": "CardContentWrapper",
"values": {
"itemType": Terrasoft.ViewItemType.CONTAINER,
"wrapClass": ["modal-box-card-content-wrap"],
"items": []
}
},
{
"operation": "insert",
"parentName": "CardContentWrapper",
"propertyName": "items",
"name": "CardContentContainer",
"values": {
"itemType": Terrasoft.ViewItemType.CONTAINER,
"wrapClass": ["modal-box-card-content-container"],
"items": []
}
},
{
"operation": "insert",
"name": "MyContainer",
"propertyName": "items",
"parentName": "CardContentWrapper",
"values": {
"itemType": Terrasoft.ViewItemType.CONTAINER,
"items": []
}
},
{
"operation": "insert",
"name": "HeaderContainer",
"index": 1,
"values": {
"itemType": Terrasoft.ViewItemType.CONTAINER,
"wrapClass": ["header", "modal-box-page-header-container"],
"items": []
}
},
{
"operation": "insert",
"parentName": "HeaderContainer",
"propertyName": "items",
"name": "CloseButtonContainer",
"values": {
"itemType": Terrasoft.ViewItemType.CONTAINER,
"wrapClass": ["close-btn-container"],
"items": []
}
},
{
"operation": "insert",
"parentName": "HeaderContainer",
"propertyName": "items",
"name": "HeaderCaptionContainer",
"values": {
"itemType": Terrasoft.ViewItemType.CONTAINER,
"wrapClass": ["header-name-container"],
"items": []
}
},
{
"operation": "insert",
"parentName": "HeaderCaptionContainer",
"propertyName": "items",
"name": "HeaderCaption",
"values": {
"itemType": Terrasoft.ViewItemType.LABEL,
"caption": "Выберите месяц и год"
}
},
{
"operation": "insert",
"parentName": "MyContainer",
"propertyName": "items",
"name": "MyGridContainer",
"values": {
"itemType": Terrasoft.ViewItemType.GRID_LAYOUT,
"items": []
}
},
{
"operation": "insert",
"parentName": "MyGridContainer",
"name": "OkCloseButton",
"propertyName": "items",
"values": {
"itemType": Terrasoft.ViewItemType.BUTTON,
"style": Terrasoft.controls.ButtonEnums.style.GREEN,
"click": {bindTo: "esqGetNumberMonth"},
"markerValue": "OkCloseButton",
"caption": "Принять",
"layout": { "column": 1, "row": 4, "colSpan": 7 }
}
},
{
"operation": "insert",
"parentName": "MyGridContainer",
"name": "CloseButton",
"propertyName": "items",
"values": {
"itemType": Terrasoft.ViewItemType.BUTTON,
"style": Terrasoft.controls.ButtonEnums.style.BLUE,
"click": {bindTo: "CloseModalPage"},
"markerValue": "CloseButton",
"caption": "Закрыть",
"layout": { "column": 2, "row": 4, "colSpan": 14 }
}
},
{
"operation": "insert",
"name": "OpDate",
"values": {
"layout": {
"colSpan": 14,
"rowSpan": 1,
"column": 1,
"row": 1,
"layoutName": "Header"
},
bindTo: "OpDate",
href: "",
"contentType": Terrasoft.ContentType.ENUM
},
"parentName": "MyGridContainer",
"propertyName": "items",
"index": 11
}
]/**SCHEMA_DIFF*/,
messages: {
"ButtonClose": {
mode: Terrasoft.MessageMode.PTP,
direction: Terrasoft.MessageDirectionType.PUBLISH
},
"DataFromModal": {
mode: Terrasoft.MessageMode.PTP,
direction: Terrasoft.MessageDirectionType.PUBLISH
}
},
methods: {
init: function(callback, scope) {
this.callParent([function() {
Ext.callback(callback, scope);
this.updateSize(400, 300);
}, this]);
},
onCloseButtonClick: function() {
this.sandbox.publish("DataFromModal", null, [this.sandbox.id]);
ModalBox.close();
},
CloseModalPage: function() {
this.sandbox.publish("ButtonClose", null, [this.sandbox.id]);
}
}
};
});
5 октября 2018 13:13
Литвинко Павел,
В Вашем коде у меня была ошибка с ButtonClose. Писал что не подписана карточка на это.
А с кодом по примеру еще пошаманил, но все равно равно ошибки:
ModalBox.show is not a function
и "console" is not defined (а это и в Вашем коде была ошибка такая)
5 октября 2018 14:55
Быстров Сергей,
Ну по первым двум, нужно смотреть, что не так, а console, если ругается на console.log, то можете смело удалить эту строку
5 октября 2018 19:18
Если вам только запросить у пользователя комментарий то зачем рисовать модальные окна? Имхо проще использовать стандартные диалоги и только если их функционал не устраивает рисовать свои:
Terrasoft.showInputBox("Введите свой бесценный комент", function() {}, ["ok"], null, {
name : {
dataValueType: Terrasoft.DataValueType.TEXT,
value: "",
customConfig: {
className: "Terrasoft.MemoEdit",
height: "215px"
}
}
},
{
defaultButton: 0
});
5 октября 2018 19:31
Вот боле полный пример с получением введенного текста
_requestActionComment: function(caption, buttonCaption, maxCommentSize, callback, scope) {
var controls = {
comment: {
dataValueType: Terrasoft.DataValueType.TEXT,
caption: resources.localizableStrings.Comments,
customConfig: {
className: "Terrasoft.MemoEdit",
height: "77px",
maxlength: maxCommentSize
}
}
};
var config = {
defaultButton: 0,
style: {
borderStyle: "ts-messagebox-border-style-blue visa-action",
buttonStyle: "blue"
}
};
var yesButton = {
className: "Terrasoft.Button",
caption: buttonCaption,
returnCode: "yes"
};
Terrasoft.utils.inputBox(caption, function(result, arg) {
if (result === yesButton.returnCode) {
var comment = arg.comment.value;
if (comment && maxCommentSize && comment.length > maxCommentSize) {
comment = comment.substring(0, maxCommentSize);
}
callback.call(scope, comment);
}
}, [yesButton, "cancel"], this, controls, config
);
},
8 октября 2018 11:19
Григорий Чех,
Действительно, это решает мою задачу, но остался вопрос - как создать новый комментарий по введенному тексту?
Немного не понял с callback. Почему нельзя простым this.set?
8 октября 2018 16:40
1) Можно this.set просто пример более глубокий можно передавать callback
8 октября 2018 16:56
2) Как то так значение полей подберите сами
var insert = Ext.create("Terrasoft.InsertQuery", {
rootSchemaName: "SocialMessage"
});
insert.setParameterValue("Message", data.message, Terrasoft.DataValueType.TEXT);
if (data.entityId) {
insert.setParameterValue("EntitySchemaUId", data.entitySchemaId, Terrasoft.DataValueType.GUID);
insert.setParameterValue("EntityId", data.entityId, Terrasoft.DataValueType.GUID);
}
insert.execute(function(result) {
if (result.success) {
//чтото делаем если успешно добавлена запись
});
}
9 октября 2018 11:46
Григорий Чех,
Большое спасибо за помощь. Получилось реализовать все что задумано
9 октября 2018 11:50
coment: function(caption, buttonCaption, maxCommentSize, callback, scope) {
var controls = {
comment: {
dataValueType: Terrasoft.DataValueType.TEXT,
caption: resources.localizableStrings.Comments,
customConfig: {
className: "Terrasoft.MemoEdit",
height: "77px",
maxlength: maxCommentSize
}
}
};
var config = {
defaultButton: 0,
style: {
borderStyle: "ts-messagebox-border-style-blue visa-action",
buttonStyle: "blue"
}
};
Terrasoft.utils.inputBox(caption, function(result, arg) {
if (result === "ok") {
var comment = arg.comment.value;
if (comment != null) {
comment = "<p>" + comment + "</p>";
var insert = Ext.create("Terrasoft.InsertQuery", {
rootSchemaName: "SocialMessage"
});
insert.setParameterValue("Message", comment, Terrasoft.DataValueType.TEXT);
insert.setParameterValue("EntitySchemaUId", "117d32f9-8275-4534-8411-1c66115ce9cd",
Terrasoft.DataValueType.GUID);
insert.setParameterValue("EntityId", this.caseRecordId, Terrasoft.DataValueType.GUID);
window.console.log(insert);
insert.execute(function(result) {
if (result.success) {
window.console.log("dobavili");
}
});
}
}
}, ["ok", "cancel"], this, controls, config);
}
Показать все комментарии
Войдите или зарегистрируйтесь, что бы комментировать